:root {
    --color-deep: #0a1f3d;
    --color-navy: #14315c;
    --color-mid: #1e4d8c;
    --color-soft: #5b8dc9;
    --color-mist: #cfdcec;
    --color-pale: #eaf1f8;
    --color-cream: #f7f9fc;
    --color-white: #ffffff;
    --color-ink: #0a1424;

    /* Acento tecnológico */
    --color-tech: #38bdf8;
    --color-tech-soft: #7dd3fc;
    --color-tech-deep: #0ea5e9;

    --font-display: "Space Grotesk", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
    --font-mono: "JetBrains Mono", "SFMono-Regular", "Consolas", "Liberation Mono", monospace;

    --easing-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
}

* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    background: var(--color-deep);
    color: var(--color-cream);
    font-family: var(--font-display);
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    min-height: 100dvh;
    overflow-x: hidden;
}