/* ==========================================================================
   COCO — tokens de diseño
   --------------------------------------------------------------------------
   Referencia: eniiprivatelab.com, medido el 2026-10-19 (estilos computados).
     - Display: Fahkwang 400, interletrado negativo (≈ −0.04em), interlineado 1.08.
     - Texto: Montserrat 400, 16–17 px, interlineado 1.55.
     - Antetítulos y botones: mayúsculas pequeñas con interletrado amplio
       (ENII usa DIN Next, de pago; aquí Montserrat 500 para quedar en 2 familias).
     - Fondo crema, tinta casi negra cálida, acento bronce. Radio 3 px, bordes
       de 1 px, sin sombras.
   Movimiento: solo transform y opacity.
   ========================================================================== */

:root {
    /* Superficies */
    --coco-bg: #fbf9f5;
    --coco-surface: #f6f2ec;
    --coco-card: #ffffff;
    --coco-dark: #161412;

    /* Líneas */
    --coco-line: #d8d0c4;
    --coco-line-soft: #e3dcd2;
    --coco-line-strong: #a08a70;

    /* Texto */
    --coco-ink: #1e1c19;
    --coco-text: #5e574f;
    --coco-muted: #a9a298;
    --coco-accent: #8c6b47;
    --coco-sand: #cdb894;
    --coco-on-dark: #f6f2ec;
    --coco-on-dark-muted: rgba(246, 242, 236, 0.66);
    --coco-on-dark-line: rgba(246, 242, 236, 0.16);

    /* Tipografía */
    --coco-font-display: "Fahkwang", Georgia, "Times New Roman", serif;
    --coco-font-body: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;

    --coco-text-eyebrow: 0.6875rem;
    --coco-text-btn: 0.6875rem;
    --coco-text-sm: 0.8125rem;
    --coco-text-base: clamp(0.9375rem, 0.9rem + 0.18vw, 1.0625rem);
    --coco-text-h3: clamp(1.1875rem, 1.1rem + 0.35vw, 1.4375rem);
    --coco-text-h2: clamp(1.75rem, 1.2rem + 2.2vw, 3.25rem);
    --coco-text-h1: clamp(2.375rem, 1.4rem + 3.6vw, 4.5rem);
    --coco-text-stat: clamp(1.625rem, 1.25rem + 1.4vw, 2.625rem);

    --coco-track-display: -0.04em;
    --coco-track-caps: 0.16em;
    --coco-track-btn: 0.12em;

    /* Espacio */
    --coco-max: 1320px;
    --coco-gutter: clamp(16px, 4vw, 64px);
    --coco-section: clamp(4.5rem, 2.5rem + 7vw, 9.5rem);
    --coco-stack: clamp(1.25rem, 1rem + 1vw, 2rem);
    --coco-nav-h: 84px;

    /* Forma */
    --coco-radius: 3px;

    /* Movimiento */
    --coco-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --coco-dur-fast: 200ms;
    --coco-dur-reveal: 900ms;
}

@media (max-width: 899px) {
    :root {
        --coco-nav-h: 68px;
    }
}