/* ==========================================================================
   tokens.css — the design brief, compiled.

   business_id: 4th-generations-doors-24-hour-door-repair-huntington-wv
   Source: runs/4th-generations-doors-24-hour-door-repair-huntington-wv/brief.md
   — every value below is transcribed from the approved brief §3 (colour,
   typography, type scale), §4/§5 (layout, section rhythm), §6.3/§8 (motion).
   Nothing here is improvised.
   ========================================================================== */

:root {

  /* --- Colour --------------------------------------------------------------
     Brief §3.1: recomputed contrast, not carried forward from the tile.
     One deliberate mode: dark (brief §2 — dark iron/charcoal ground, argued
     from the playbook's single in-market precedent, not the family's more
     common light-poster look). */

  --scheme: dark;

  --color-bg: #1c1917;                /* iron/charcoal ground — band A */
  --color-surface: #2a2622;           /* panel ground — band B (alternating) */
  --color-ink: #f2ede4;               /* parchment — primary text on bg/surface */
  --color-ink-muted: #b8afa2;         /* secondary text */
  --color-accent: #e8622a;            /* forge ember — the one colour that means "act" */
  --color-accent-ink: #17130f;        /* near-black — text that sits ON accent, never any other role */

  /* House-required structural colours */
  --color-border: #423c35;            /* decorative hairlines only — no contrast floor (brief §3.1) */

  /* A control's own boundary, WCAG 1.4.11: >= 3:1 against bg AND surface.
     Brief §3.1 reuses --color-ink-muted, already 8.07:1 / 6.93:1 against the
     two grounds in use (§3.2), well clear of the 3:1 floor. */
  --color-border-strong: #b8afa2;

  --color-focus: #f2ede4;             /* :focus-visible ring — 15.00:1 / 12.87:1 (brief §3.2) */

  /* --color-focus-on-band is deliberately NOT declared (brief §3.1): this
     site has no light ground at all, both bands are dark, and --color-focus
     already clears WCAG 1.4.11 against both grounds in use. An unused token
     is noise. */

  --color-selection-bg: #e8622a;
  --color-selection-ink: #17130f;

  /* No further brief-specific colour roles: the ember rim-light in the
     generated imagery is the SAME hex as --color-accent (brief §4.5's
     palette-echo instruction) rather than a second borrowed hue. */


  /* --- Typography ----------------------------------------------------------
     Brief §3.3: Chivo (display, weights used 700 + 900) + Barlow (body,
     weights used 400 + 600). Both OFL 1.1, self-hosted, subset to the house
     declared safe range (house-tech-spec §8). Barlow ships no variable font
     on Google Fonts (checked at build time), so it ships as two static
     files rather than one; same two weights render either way, 3 faces total,
     under the §5 four-file cap. Flagged to the AD — see README. */

  --font-display: 'Chivo', 'Chivo Fallback', 'Arial Narrow', Arial, sans-serif;
  --font-body: 'Barlow', 'Barlow Fallback', 'Helvetica Neue', Arial, sans-serif;

  --font-weight-body: 400;
  --font-weight-body-strong: 600;
  --font-weight-display: 900;      /* hero H1, section H2s, ledger numerals (brief §3.3) */
  --font-weight-cta: 700;          /* CTA button label only (brief §3.3) */

  /* --- Type scale — brief §3.4, verbatim clamp() values ------------------- */

  --text-hero: clamp(2.75rem, 2rem + 4vw, 5.5rem);       /* 44px -> 88px; 47.0/62.7/73.0/88.0 @375/768/1024/1440 */
  --text-h2: clamp(1.75rem, 1.35rem + 2vw, 2.75rem);     /* 28px -> 44px; 29.1/37.0/42.1/44.0 */
  --text-h3: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);    /* 18px -> 22px; 18.25/20.6/22.0/22.0 */
  --text-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);  /* 17px -> 20px; 17.1/18.3/19.1/20.0 */
  --text-body: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);   /* 16px -> 18px; 16.0/16.7/17.3/18.0 */
  --text-small: clamp(0.8125rem, 0.8rem + 0.1vw, 0.875rem); /* 13px -> 14px; 13.2/13.6/13.8/14.0 */
  --text-eyebrow: 0.8125rem;       /* 13px fixed, not fluid (brief §3.4, matches skeleton convention) */

  /* Line-heights. Brief §4.3's own arithmetic fixes the display line-height
     at 1.04 (H1 2-line budget: 47.0px * 1.04 * 2 = ~98px) and the eyebrow at
     ~1.2; base.css applies --leading-tight to every h1-h4 uniformly, so one
     token governs the whole display register. --leading-lead (1.5) is the
     value brief §4.3's own hero-subhead row computes with; it is a brief
     addition, not a house-required name. */
  --leading-tight: 1.04;
  --leading-snug: 1.2;
  --leading-lead: 1.5;
  --leading-body: 1.6;

  --tracking-tight: -0.02em;
  --tracking-normal: 0em;
  --tracking-wide: 0.08em;

  /* --- Space ---------------------------------------------------------------
     House scale, unchanged — brief §4.3's own arithmetic is built entirely
     from these exact steps (space-2xs=8, space-xs=12, space-sm=16,
     space-md=24), so no brief-specific spacing token is needed. */

  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* brief §5.2: --section-gap = --space-2xl = 96px, fixed at every
     breakpoint. Call sites: .section's padding-block, and the hero's
     padding-block-end. */
  --section-gap: var(--space-2xl);

  /* --- Layout ------------------------------------------------------------- */

  --layout-container: 72rem;
  --layout-measure: 62ch;
  --layout-gutter: clamp(1.25rem, 5vw, 3rem);
  --layout-tap-min: 44px;

  /* Brief §4.4: the living-hero field is a FIXED height, not fluid — the
     same 180px at every breakpoint. */
  --hero-field-height: 180px;

  /* Brief §3.4: the service ledger's numeral column floor. */
  --ledger-numeral-min: 48px;
  --ledger-numeral-max: 64px;

  /* --- Radius / shadow / border ---------------------------------------------
     Not stated in this brief. Applied per the family's own established
     register on grant-creek-lawns-missoula-mt (also bold-industrial,
     band-rhythm): flat, one non-zero radius step for controls only, no
     shadow anywhere. Flagged to the AD as an unstated value — see README. */

  --radius-none: 0;
  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 2px;
  --radius-pill: 2px;

  --shadow-none: none;
  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;

  /* Brief §3.4: the H2 underline is "border-bottom: 3px solid
     var(--color-accent)" — an absolute px value, matching the house
     --border-thick default exactly. */
  --border-hairline: 1px;
  --border-thick: 3px;
  --border-style: solid;

  /* --- Motion --------------------------------------------------------------
     Brief §8: reveals at --duration-base (320ms), --ease-out,
     --reveal-stagger (90ms). base.css's reveal transition is wired to
     --duration-slow, not --duration-base (house pattern, precedented on
     grant-creek-lawns-missoula-mt) — --duration-slow is set to the same
     320ms so the brief's stated reveal timing is what actually renders. */

  --duration-fast: 140ms;
  --duration-base: 320ms;
  --duration-slow: 320ms;      /* alias consumed by base.css's reveal transition */

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --reveal-shift: 1.25rem;
  --reveal-stagger: 90ms;

  /* Brief §6.3/§8 — "the coil takes the load", the one living-hero signature
     move. Two independently-timed, non-synchronised loops. */
  --duration-glint: 6.4s;
  --ease-glint: cubic-bezier(.3, 0, .2, 1);
  --duration-roller: 9.2s;
  --ease-roller: linear;
  --glint-travel: 7.5rem;      /* distance the highlight climbs before settling at the top wrap */

  /* --- Z layers ------------------------------------------------------------ */
  --z-base: 0;
  --z-header: 100;
  --z-nav-panel: 200;
  --z-skip-link: 300;
}

/* --------------------------------------------------------------------------
   @font-face — three files (Chivo variable, Barlow 400, Barlow 600), self-
   hosted woff2, OFL 1.1, subset to the house declared safe range (spec §8):
     U+0020-007E, U+00A0, U+00A9, U+00AE, U+2122, U+00B0, U+00B7, U+00BF,
     U+00C0-00FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033
   -------------------------------------------------------------------------- */

@font-face {
  font-family: 'Chivo';
  src: url('/assets/fonts/chivo-variable-latin.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range:
    U+0020-007E, U+00A0, U+00A9, U+00AE, U+2122, U+00B0, U+00B7, U+00BF,
    U+00C0-00FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

@font-face {
  font-family: 'Barlow';
  src: url('/assets/fonts/barlow-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range:
    U+0020-007E, U+00A0, U+00A9, U+00AE, U+2122, U+00B0, U+00B7, U+00BF,
    U+00C0-00FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

@font-face {
  font-family: 'Barlow';
  src: url('/assets/fonts/barlow-600-latin.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range:
    U+0020-007E, U+00A0, U+00A9, U+00AE, U+2122, U+00B0, U+00B7, U+00BF,
    U+00C0-00FF, U+2010-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

/* --- Metrics-matched fallbacks (house-tech-spec §8, brief §3.3) ------------
   Donors: Liberation Sans Narrow Bold (Chivo, measured directly on the build
   host); Liberation Sans / Liberation Sans Bold (Barlow 400/600, the nearest
   proxy for Helvetica Neue's near-identical metrics). Overrides computed by
   scripts/font-metrics.mjs (the fontaine algorithm). One Chivo Fallback
   measurement covers both weights this brief uses. See README.md. */

@font-face {
  font-family: 'Chivo Fallback';
  src: local('Liberation Sans Narrow Bold'), local('Arial Narrow Bold'), local('Arial Narrow'), local('Arial Bold'), local('Arial');
  font-weight: 700 900;
  font-style: normal;
  size-adjust: 121.69%;
  ascent-override: 77.24%;
  descent-override: 20.54%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Barlow Fallback';
  src: local('Liberation Sans'), local('Helvetica Neue'), local('Arial');
  font-weight: 400;
  font-style: normal;
  size-adjust: 96.96%;
  ascent-override: 103.14%;
  descent-override: 20.63%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Barlow Fallback';
  src: local('Liberation Sans Bold'), local('Helvetica Neue Bold'), local('Arial Bold'), local('Arial');
  font-weight: 600;
  font-style: normal;
  size-adjust: 91.42%;
  ascent-override: 109.38%;
  descent-override: 21.88%;
  line-gap-override: 0%;
}