/* ==========================================================================
   VELNOIR — Design tokens (Phase 7, D121/D122/D123)

   THE single source of visual truth (Design Law 2). Two tiers:
     1. PRIMITIVES — raw values. Only this file may carry a raw color or an
        off-scale size; the token scan enforces it.
     2. SEMANTIC   — what every other stylesheet consumes. Components never
        reference a primitive directly.

   Dark-only by brand. No pure #000 anywhere (the palette floor is warm
   near-black — the do-not list). WCAG contrast for the documented
   ink/surface pairs is ASSERTED by tests/cases/TokenDisciplineTest.php.

   Breakpoint constants (media preludes cannot read custom properties):
     36rem = 576px  ·  56.25rem = 900px  ·  75rem = 1200px

   Font URLs are deliberately UNVERSIONED (no ?v=): the layout's preload
   URLs must byte-match the URLs below or the preload is wasted. A typeface
   swap changes the family filenames, which busts caches by name.
   ========================================================================== */

/* --- The two voices (D122): Cormorant (display serif) + Manrope (sans).
       OFL, self-hosted, subset latin + latin-ext (Hungarian ő/ű). -------- */

@font-face {
    font-family: 'Cormorant';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/cormorant-500-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Cormorant';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/cormorant-500-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Cormorant';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/cormorant-600-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Cormorant';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/cormorant-600-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Cormorant';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/cormorant-italic-500-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Cormorant';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/cormorant-italic-500-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/manrope-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/manrope-400-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/manrope-500-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/manrope-500-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/manrope-700-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Manrope';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/manrope-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Metric-compatible local fallbacks: font arrival must shift nothing
   (Design Law 3 — CLS engineered to zero). The override numbers are tuned
   against Georgia/Arial metrics; the swap-CLS check in
   docs/QA_VISUAL_PHASE7.md verifies them on device. */

@font-face {
    font-family: 'Cormorant-fallback';
    src: local('Georgia');
    size-adjust: 94%;
    ascent-override: 98%;
    descent-override: 26%;
    line-gap-override: 0%;
}

@font-face {
    font-family: 'Manrope-fallback';
    src: local('Arial');
    size-adjust: 100.5%;
    ascent-override: 107%;
    descent-override: 30%;
    line-gap-override: 0%;
}

:root {
    /* ===================== 1. PRIMITIVES ===================== */

    /* Surfaces — the matte-black world of HOTEL NOIR, warmed. */
    --noir-950: #0F0D0A;
    --noir-900: #161310;
    --noir-850: #1C1814;
    --noir-800: #241F19;
    --line-warm: #2A241D;

    /* Ink — bone white and warm stone (MIDNIGHT TOKYO's bone, SLOW
       SUNDAY's taupe). */
    --bone-100: #F1EBE1;
    --stone-400: #B9AF9F;
    --stone-600: #8A8071;

    /* The one metallic — champagne gold, used with extreme restraint. */
    --gold-300: #D6B67A;
    --gold-400: #C6A15B;
    --espresso-900: #14110C;

    /* Per-scent accent hues, from the fragrances' physical worlds. */
    --hn-500: #B7935B;   /* HOTEL NOIR — antique gold */
    --ss-300: #D4B891;   /* SLOW SUNDAY — warm champagne */
    --mt-400: #9AA3B0;   /* MIDNIGHT TOKYO — cool bone mist */

    /* States — quiet, never alarm-colored. */
    --terracotta-400: #CE7361;
    --sage-400: #9FAF8E;

    /* Veils and edge light (elevation is light, not shadow). */
    --scrim: rgba(15, 13, 10, 0.72);
    --scrim-soft: rgba(15, 13, 10, 0.45);
    --edge-light: rgba(241, 235, 225, 0.07);
    --gold-glow: rgba(198, 161, 91, 0.14);

    /* Fluid modular type scale (minor-third base, 390px -> 1440px). */
    --text--1: clamp(0.8125rem, 0.79rem + 0.10vw, 0.875rem);
    --text-0: clamp(1rem, 0.977rem + 0.10vw, 1.0625rem);
    --text-1: clamp(1.1875rem, 1.141rem + 0.19vw, 1.3125rem);
    --text-2: clamp(1.4375rem, 1.368rem + 0.29vw, 1.625rem);
    --text-3: clamp(1.75rem, 1.611rem + 0.57vw, 2.125rem);
    --text-4: clamp(2.125rem, 1.893rem + 0.95vw, 2.75rem);
    --text-5: clamp(2.625rem, 2.254rem + 1.52vw, 3.625rem);
    --text-6: clamp(3.25rem, 2.693rem + 2.29vw, 4.75rem);

    --leading-tight: 1.08;
    --leading-snug: 1.3;
    --leading-body: 1.65;
    --tracking-wide: 0.22em;
    --tracking-soft: 0.06em;
    --tracking-tight: -0.01em;

    /* Geometric spacing scale (4px grid). */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;
    --space-11: 10rem;

    /* Containers and rhythm. */
    --container-max: 72rem;
    --container-text: 44rem;
    --container-pad: clamp(1.25rem, 4vw, 2.5rem);

    /* Edges. */
    --radius-1: 2px;
    --radius-2: 8px;
    --radius-pill: 999px;
    --hairline: 1px;
    --control-min: 2.75rem;

    /* Motion grammar (D123): few, slow, confident. */
    --dur-1: 140ms;   /* micro: hover, focus */
    --dur-2: 280ms;   /* small state changes */
    --dur-3: 520ms;   /* the reveal vocabulary */
    --dur-4: 900ms;   /* the named moments only */
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
    --reveal-rise: 14px;

    /* ===================== 2. SEMANTIC ===================== */

    --surface: var(--noir-950);
    --surface-raised: var(--noir-900);
    --surface-high: var(--noir-850);
    --surface-hover: var(--noir-800);

    --ink: var(--bone-100);
    --ink-2: var(--stone-400);
    --ink-3: var(--stone-600);

    --accent: var(--gold-400);
    --accent-soft: var(--gold-300);
    --accent-ink: var(--espresso-900);

    --line: var(--line-warm);
    --focus: var(--gold-400);
    --tap-min: var(--control-min);
    --experience-entry-min: 62vh;
    --experience-state-min: 58vh;
    --experience-register-min: 68vh;
    --experience-entry-min-wide: 72vh;

    --state-error: var(--terracotta-400);
    --state-ok: var(--sage-400);

    --scent-hn-accent: var(--hn-500);
    --scent-ss-accent: var(--ss-300);
    --scent-mt-accent: var(--mt-400);

    --font-display: 'Cormorant', 'Cormorant-fallback', Georgia, serif;
    --font-sans: 'Manrope', 'Manrope-fallback', Arial, sans-serif;
}