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

   superior-painting-and-finishes-laramie-wy — editorial-modern, "Clay & Chalk"
   (Tile B, C2-DECISION.md 96/100, margin 9). Every value below is copied from
   runs/superior-painting-and-finishes-laramie-wy/brief.md §2. Nothing here was
   improvised. Where the brief is silent (radius, shadow, border, space,
   layout, leading/tracking), the skeleton's house defaults stand unchanged —
   brief §2.5 states this explicitly for leading/tracking and the same
   reasoning applies to the rest: no override is argued, so none is taken.
   ========================================================================== */

:root {

  /* --- Colour --------------------------------------------------------------
     Brief §2.1/§2.2. Derivation: dossier brand_color VOID (no truck/signage/
     logo colour found; dossier §4.5) → local character (Laramie's warm
     sandstone/clay-toned rock formations) → family norms + the vertical's
     §6.1 semantic anchor (playbooks/painters.md: colour itself, unoccupied in
     this market). The tile-stage accent #B85C38 is deliberately deepened to
     #A34F2E — routes around the vertical's saturated-orange lean AND clears
     full AA body-text contrast (5.25:1) where the brighter value cleared only
     the large-text floor. Contrast table: brief §2.3. */

  --scheme: light;

  --color-bg: #FAF6F0;                /* page ground — chalk */
  --color-surface: #F0E6DA;           /* cards, Finish Index rows, form fields */
  --color-ink: #2E2620;               /* body + heading text on bg/surface */
  --color-ink-muted: #7A6D5E;         /* bg-only — 4.08:1 on surface fails AA body, brief §2.3 */
  --color-accent: #A34F2E;            /* clay-terracotta — the one colour that means "act" */
  --color-accent-ink: #FFF9F2;        /* 5.41:1 on accent */

  --color-border: #E3D6C4;            /* decorative hairlines only — no contrast floor */
  --color-border-strong: #7A6D5E;     /* = ink-muted, reused — control boundaries, >=3:1 both grounds */

  --color-focus: #2E2620;             /* = ink — no dark band on this site, one token covers the page */

  /* No dark band anywhere on this site (playbooks/painters.md §6.1: 11/11
     determinable grounds are light, 0 dark — no open dark-hero move recorded
     for this vertical, unlike electrical's). --color-focus-on-band unused. */
  /* --color-focus-on-band: …; */

  --color-selection-bg: #2E2620;
  --color-selection-ink: #FAF6F0;

  /* --- Typography ------------------------------------------------------------
     Brief §2.4. Display + body both run Archivo (the brief's structural
     correction from the tile's three-family stage — Work Sans dropped to
     honour design-rules §5's two-family cap). Source Serif 4 Italic is
     emphasis-only — the one accent word inside the hero H1, nowhere else.
     Both self-hosted static woff2, SIL OFL (assets/fonts/OFL-Archivo.txt,
     OFL-SourceSerif4.txt). Metrics-matched fallbacks measured with
     scripts/font-metrics.mjs against Arimo (Archivo's open metric analogue)
     and Gelasio Italic (Source Serif 4 Italic's) — never guessed. Fallback
     family named ahead of the system fallback in each stack. */

  --font-display: 'Archivo', 'Archivo Fallback', Arial, sans-serif;
  --font-body: 'Archivo', 'Archivo Fallback', Arial, sans-serif;
  --font-emphasis: 'Source Serif 4', 'Source Serif 4 Fallback', Georgia, serif; /* italic style only */

  --font-weight-body: 400;
  --font-weight-body-strong: 500;
  --font-weight-display: 800;

  /* --- Type scale ------------------------------------------------------------
     Brief §2.5's fluid scale, computed at floor/ceiling and at 375px/1440px —
     see the brief's own table. --text-body/-small/-eyebrow are fixed and
     state the same number at both ends deliberately. */

  --text-hero: clamp(2.5rem, 6.5vw, 4.2rem);        /* 40px @375 → 67.2px @1440 — H1 */
  --text-h2: clamp(1.6rem, 4vw, 2.25rem);            /* 25.6px → 36px */
  --text-h3: clamp(1.25rem, 2.5vw, 1.5rem);          /* 20px → 24px */
  --text-lead: clamp(1.0625rem, 2vw, 1.1875rem);     /* 17px → 19px — hero lead */
  --text-index-num: clamp(1.75rem, 5vw, 2.5rem);     /* 28px → 40px — Finish Index numerals */
  --text-body: 1rem;                                  /* 16px, fixed */
  --text-small: 0.875rem;                             /* 14px, fixed */
  --text-eyebrow: 0.8125rem;                          /* 13px, fixed */

  --leading-tight: 1.05;
  --leading-snug: 1.25;
  --leading-body: 1.6;

  --tracking-tight: -0.02em;          /* uppercase H1 */
  --tracking-normal: 0em;
  --tracking-wide: 0.08em;            /* eyebrow — authored lower-case, uppercased via text-transform */

  /* --- Space -------------------------------------------------------------
     House scale, unchanged — brief introduces no new step. */

  --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 §3.1: --section-gap = --space-xl = 4rem/64px, fixed at every
     breakpoint — the page's one largest vertical gap (design-rules §7.1). */
  --section-gap: var(--space-xl);

  /* --- Layout ------------------------------------------------------------
     House defaults, unchanged — brief §3.3's first-screen arithmetic is
     computed against these exact values (24px = --space-md, 16px =
     --space-sm, 8px = --space-2xs, 44px CTA = --layout-tap-min). */

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

  /* Brief-specific layout tokens. */

  /* Finish Index numeral column — brief §2.5's repeated-ornament rule: 64px
     at >=48rem, stated minimum 48px (below which the two-column grid itself
     collapses — see site.css). 64px = --space-xl exactly; named separately
     because it is a column width, not a section gap. */
  --layout-index-num: var(--space-xl);

  /* The living-hero field's fixed height (brief §3.3's target table: 320px
     local, 100% of it above the 667px fold at 375). 320px = --space-xl * 5 —
     derived from the scale, never a bare literal. */
  --layout-field-height: calc(var(--space-xl) * 5);

  /* The cut-in edge's split (brief §3.2): the right --field-split-clay of
     `.field`'s width is flooded with --color-accent; the remainder is
     --color-bg. Structural, not photographic — see site.css. */
  --field-split-clay: 54%;

  /* Finish Index rows 01/02's supporting-image cap (brief §4 slots 3/4) — a
     delivery-mechanical width so a lazy-loaded texture thumbnail never
     dominates a row on a wide desktop measure. */
  --layout-row-media: 22rem;

  /* --- Radius / shadow / border -----------------------------------------
     House defaults, unchanged — no radius/shadow override is argued in the
     brief, and the winning tile's own rendering (tiles/tile-b.html) already
     reads correctly against these: quiet 2px on controls and rows, no
     shadow anywhere (editorial-modern is flat, ink-on-paper — a drop shadow
     on every card is a design-rules §4 banned default this family does not
     reach for). */

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

  --shadow-none: none;
  --shadow-sm: 0 1px 2px rgb(46 38 32 / 0.06);
  --shadow-md: 0 6px 24px rgb(46 38 32 / 0.09);
  --shadow-lg: 0 24px 60px rgb(46 38 32 / 0.14);

  --border-hairline: 1px;
  --border-thick: 3px;                /* also the cut-in edge's own line width, brief §2.5 */
  --border-style: solid;

  /* --- Motion ------------------------------------------------------------
     House reveal trio, unchanged — brief §5: standard section reveals for
     the Finish Index rows, Reviews cards and the form's field stack. */

  --duration-fast: 140ms;
  --duration-base: 320ms;
  --duration-slow: 640ms;

  --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 §5 — the one signature move only, deliberately outside the house
     --duration-* trio: these are one-shot/independent-loop devices, not
     reveals. Frozen (not merely slowed) under prefers-reduced-motion, per
     the brief's explicit reduced-motion statement — see site.css. */
  --duration-hero-draw: 1800ms;       /* the cut-in line draws once */
  --delay-hero-glint: 1800ms;         /* the specular highlight starts once the line finishes */
  --duration-hero-glint: 1200ms;      /* … and travels/settles over this long */
  --duration-hero-sat-1: 6600ms;      /* three swatch-chip satellites, independent, non-synced */
  --duration-hero-sat-2: 7400ms;
  --duration-hero-sat-3: 8100ms;

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

/* --------------------------------------------------------------------------
   @font-face — self-hosted woff2, latin subset (house declared safe range,
   house-tech-spec §8), font-display: swap. SIL Open Font License 1.1 for
   both families (assets/fonts/OFL-Archivo.txt, OFL-SourceSerif4.txt).

   COVERAGE GAP, recorded per house-tech-spec §8. Checked against the two
   shipped source faces with fontTools: Archivo is missing U+2012 (figure
   dash); Source Serif 4 Italic is missing U+2011 (non-breaking hyphen). Each
   face is missing a codepoint the OTHER face on this site carries — the
   "mid-sentence split" case §8 calls a FIX, not the "both faces lack the same
   four" case the house range already expects. Resolved by equalising: both
   codepoints are DROPPED from every face's subset and from the unicode-range
   declared below, on the whatcom-gutter-co-lynden-wa precedent for exactly
   this situation. Neither character appears anywhere in this site's copy
   (copy.md bans the em dash outright and uses none of the narrow dashes), so
   nothing on the page is affected. Delivered range: the house declared safe
   range minus U+2011 and U+2012.

   Measured 2026-09-18: 4 static files, 49.0 KB total post-subset (10.7 +
   10.7 + 10.5 + 17.4 KB), largest face 17.4 KB — both well inside the
   house-tech-spec §7 budgets (<=100 KB total / <=60 KB single face).
   -------------------------------------------------------------------------- */

/* ---- Archivo — fallback faces. Each `local()` list is ordered for the
   platform that actually carries it: Liberation Sans ships on Linux/Android
   (fontconfig) and is a byte-for-byte metric clone of Arial, so it is the
   PRIMARY local match, with Arimo and Arial as further alternatives on
   platforms that carry those instead. size-adjust/ascent/descent are
   measured against Liberation Sans directly with scripts/font-metrics.mjs —
   never guessed, and it happens to share Arimo's average advance width at
   400/800 (both being Arial metric-compatible), so only weight 500 (which
   Liberation Sans ships as one weight, Regular) differs from an
   Arimo-500-specific measurement. ---- */

@font-face {
  font-family: 'Archivo Fallback';
  src: local('Liberation Sans'), local('Arimo'), local('Arial');
  font-weight: 400;
  font-style: normal;
  size-adjust: 98.05%;
  ascent-override: 89.55%;
  descent-override: 21.42%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Archivo Fallback';
  src: local('Liberation Sans'), local('Arimo'), local('Arial');
  font-weight: 500;
  font-style: normal;
  size-adjust: 99.81%;
  ascent-override: 87.96%;
  descent-override: 21.04%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Archivo Fallback';
  src: local('Liberation Sans Bold'), local('Arimo Bold'), local('Arial Bold'), local('Liberation Sans'), local('Arial');
  font-weight: 800;
  font-style: normal;
  size-adjust: 102.38%;
  ascent-override: 85.76%;
  descent-override: 20.51%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Archivo';
  src: url('../assets/fonts/archivo-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, U+2013-2015, U+2018-201A, U+201C-201E,
    U+2026, U+2032-2033;
}

@font-face {
  font-family: 'Archivo';
  src: url('../assets/fonts/archivo-500-latin.woff2') format('woff2');
  font-weight: 500;
  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, U+2013-2015, U+2018-201A, U+201C-201E,
    U+2026, U+2032-2033;
}

@font-face {
  font-family: 'Archivo';
  src: url('../assets/fonts/archivo-800-latin.woff2') format('woff2');
  font-weight: 800;
  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, U+2013-2015, U+2018-201A, U+201C-201E,
    U+2026, U+2032-2033;
}

/* ---- Source Serif 4 Italic — fallback face (measured against Gelasio
   Italic, an open metric analogue of Georgia Italic) ---- */

@font-face {
  font-family: 'Source Serif 4 Fallback';
  src: local('Georgia Italic'), local('Georgia');
  font-weight: 400;
  font-style: italic;
  size-adjust: 97.03%;
  ascent-override: 106.77%;
  descent-override: 34.53%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Source Serif 4';
  src: url('../assets/fonts/sourceserif4-400italic-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  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, U+2013-2015, U+2018-201A, U+201C-201E,
    U+2026, U+2032-2033;
}