/* Fabsys Group · tokens de diseño ("Sala de control").
   Marca: azul profundo del logo como base neutra, naranja como único acento. */

@font-face {
    font-family: "Geist";
    src: url("/fonts/geist-latin-wght.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Geist Mono";
    src: url("/fonts/geist-mono-latin-wght.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Neutros de tinta (tintados con el azul de marca, sin negro puro) */
    --ink-950: #060f1a;
    --ink-900: #0b2239;
    --ink-800: #12304f;
    --ink-700: #1f3a57;
    --ink-600: #3a5573;

    /* Superficies claras */
    --paper: #fbfcfd;
    --surface: #f2f5f9;
    --surface-2: #e8eef5;
    --line: #d7e0ea;
    --line-strong: #b9c7d7;

    /* Texto */
    --text: #0f1b2d;
    --text-soft: #46586d;
    --text-on-dark: #f2f6fb;
    --text-soft-on-dark: #aebed1;

    /* Marca y acento (un solo acento: naranja) */
    --brand: #0b5cab;
    --brand-strong: #084a8c;
    --brand-on-dark: #7db8f5;
    --accent: #f07c12;
    --accent-strong: #ff9331;
    --accent-ink: #a84d00;
    --on-accent: #060f1a;

    /* Semánticos */
    --ok: #17673a;
    --ok-bg: #e7f5ec;
    --ok-on-dark: #6fd39a;
    --danger: #b3261e;
    --danger-bg: #fdecea;
    --danger-on-dark: #ff8d84;
    --marker-bg: #fff3bf;

    /* Tipografía */
    --font-display: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-body: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-mono: "Geist Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

    --fs-xs: clamp(0.78rem, 0.76rem + 0.1vw, 0.84rem);
    --fs-sm: clamp(0.88rem, 0.86rem + 0.1vw, 0.94rem);
    --fs-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
    --fs-lead: clamp(1.1rem, 1.02rem + 0.4vw, 1.3rem);
    --fs-h4: clamp(1.1rem, 1.05rem + 0.25vw, 1.25rem);
    --fs-h3: clamp(1.25rem, 1.12rem + 0.6vw, 1.6rem);
    --fs-h2: clamp(1.75rem, 1.3rem + 2vw, 2.9rem);
    --fs-h1: clamp(2.25rem, 1.35rem + 3.9vw, 4.5rem);

    --tracking-display: -0.03em;
    --tracking-heading: -0.02em;
    --measure: 66ch;

    /* Espaciado (escala base 4) */
    --s-1: 0.25rem;
    --s-2: 0.5rem;
    --s-3: 0.75rem;
    --s-4: 1rem;
    --s-5: 1.5rem;
    --s-6: 2rem;
    --s-7: 3rem;
    --s-8: 4.5rem;
    --s-9: clamp(4rem, 3rem + 5vw, 8rem);
    --gutter: clamp(1rem, 0.5rem + 2.5vw, 2rem);
    --container: 74rem;

    /* Radios: controles 10px, contenedores 16px */
    --r-control: 10px;
    --r-box: 16px;

    /* Elevación (sombras tintadas con la tinta de marca) */
    --shadow-1: 0 1px 2px rgb(11 34 57 / 0.06), 0 6px 18px rgb(11 34 57 / 0.06);
    --shadow-2: 0 2px 4px rgb(11 34 57 / 0.06), 0 18px 40px rgb(11 34 57 / 0.14);
    --shadow-header: 0 1px 0 rgb(255 255 255 / 0.06), 0 12px 32px rgb(6 15 26 / 0.35);

    /* Movimiento */
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --dur-fast: 140ms;
    --dur-base: 240ms;
    --dur-slow: 560ms;

    /* Capas */
    --z-base: 1;
    --z-progress: 70;
    --z-header: 80;
    --z-backdrop: 78;
    --z-offcanvas: 100;
    --z-toast: 110;
    --z-skip: 120;

    --header-h: 4.25rem;
    --focus: var(--brand);
}

/* Contextos oscuros: el foco y los enlaces cambian de par de color */
.on-dark, .section--dark, .section--deep, .page-head, .cta-band, .site-header, .site-footer, .hero {
    --focus: var(--accent-strong);
}
.on-dark { color: var(--text-on-dark); }