/* ==========================================================================
   tokens.css — the design brief, compiled. Tyler Roofing Company, Tyler TX —
   brief.md v1 (C3 approved 2026-09-15). Family: warm-craft. Archetype:
   band-rhythm ("the dawn ridge holds"). Dominant hue: sign-tan #B6906B
   (sampled from the business's own roadside sign, brief §2). Display:
   Fraunces + Fraunces Italic. Body: Hanken Grotesk + Hanken Grotesk Italic.
   THIS FILE IS THE ONLY PLACE RAW VALUES LIVE (house-tech-spec §3).
   ========================================================================== */

:root {

  /* --- Colour (brief §2). Derivation: design-rules §6 order — their
     real-world colour (the sign-tan, one V-tier sighting, dossier §4.5) →
     local character (East Texas brick/lumber, read into the charcoal-brown
     ink) → family norms (warm-craft's cream/ink/rust register, ref-010).
     One deliberate mode: light. */

  --scheme: light;

  --color-bg:         #F7F1E7;   /* warm cream ground */
  --color-surface:    #EFE4D2;   /* tan surface — alternate band ground */
  --color-ink:        #2B2420;   /* charcoal-brown ink */
  --color-ink-muted:  #5B4F42;   /* muted ink, secondary text */
  --color-accent:     #B6906B;   /* sign-tan — FILLS/GRAPHICS ONLY, never text (2.60:1, brief §2) */
  --color-accent-ink: #2B2420;   /* dark ink set ON the accent fill (5.23:1) */

  /* House-required structural colours (consumed by base.css). No new hex:
     both alias an already brief-measured pair rather than inventing a value
     (brief §2's contrast table covers both). */
  --color-border:        var(--color-surface);   /* DECORATIVE hairlines only — the brief's own bg/surface
                                                      contrast rule (brief §4: "a hairline --color-surface/
                                                      --color-bg-contrast rule"). No contrast floor. */
  --color-border-strong: var(--color-ink-muted);  /* control boundary, WCAG 1.4.11: 7.08:1 on bg, 6.32:1 on
                                                      surface (brief §2 table) — already AA on both grounds. */
  --color-focus:          var(--color-ink);        /* :focus-visible ring — 13.59:1 bg, 12.14:1 surface */
  --color-selection-bg:   var(--color-accent);
  --color-selection-ink:  var(--color-accent-ink);

  /* No --color-focus-on-band: the section plan (brief §4) carries no dark
     band — every band sits on --color-bg or --color-surface, both already
     validated for --color-focus above. Left undeclared rather than unused
     (tokens.css house convention, see base default file). */

  /* Hero atmosphere — the radial/linear gradient sky, brief §2 "Hero gradient
     text" paragraph, byte-identical to the brief's stated stops. */
  --color-atmo-1: #FBF4E7;   /* center-top stop, lightest */
  --color-atmo-2: var(--color-surface);   /* #EFE4D2 — 55% stop, the brief's own token */
  --color-atmo-3: #E3D3B4;   /* 100% outer-edge stop */


  /* --- Typography (brief §3). Two families, four woff2 — the §5 ceiling.
     Variable instances (wght axis only — house-tech-spec §8's wght/opsz trap
     is unreachable by construction: font-variation-settings ships nowhere on
     this site, weight is set with font-weight everywhere). */

  --font-display:        'Fraunces', 'Fraunces Fallback', Georgia, 'Iowan Old Style', serif;
  --font-display-italic: 'Fraunces Italic', 'Fraunces Italic Fallback', Georgia, serif;
  --font-body:            'Hanken Grotesk', 'Hanken Grotesk Fallback', 'Helvetica Neue', Arial, sans-serif;
  --font-body-italic:     'Hanken Grotesk Italic', 'Hanken Grotesk Italic Fallback', 'Helvetica Neue', Arial, sans-serif;

  --font-weight-display:     700;   /* h1, h2, h3, wordmark's heavier sibling */
  --font-weight-brand:       600;   /* header/footer wordmark (brief §5 arithmetic assumes Fraunces 600) */
  --font-weight-emphasis:    600;   /* Fraunces Italic — the H1 accent word, the review pull-quote */
  --font-weight-body:        400;
  --font-weight-body-strong: 600;   /* nav links, buttons, labels, row names */
  --font-weight-body-italic: 500;   /* Hanken Grotesk Italic — one review attribution, sparing inline emphasis */
  --font-weight-badge:       700;   /* process-step digit badges (brief §4: "Hanken Grotesk 700") */

  /* Fluid scale — brief §3 table, every clamp() copied byte-identical.
     Floor at 375px, ceiling at 1440px, both computed in the brief. */

  --text-hero:    clamp(2.75rem, 2.05rem + 3.5vw, 4.75rem);   /* 45.92 @375 → 76.0 @1440 (clamped ≥1234px) */
  --text-h2:      clamp(1.6rem, 1.35rem + 1.2vw, 2.35rem);    /* 26.10 @375 → 37.6 @1440 (clamped ≥1333px) */
  --text-h3:      clamp(1.15rem, 1.05rem + 0.5vw, 1.35rem);   /* 18.67 @375 → 21.6 @1440 (clamped ≥960px) */
  --text-eyebrow: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);    /* 11.63 @375 → 12.8 @1440 (clamped ≥960px) */
  --text-lead:    clamp(1rem, 0.94rem + 0.4vw, 1.15rem);      /* 16.54 @375 → 18.4 @1440 (clamped ≥840px) */
  --text-body:    clamp(0.95rem, 0.92rem + 0.15vw, 1.05rem);  /* 15.29 @375 → 16.8 @1440 (clamped ≥1387px) */
  --text-small:   clamp(0.78rem, 0.76rem + 0.1vw, 0.86rem);   /* 12.53 @375 → 13.6 @1440 (unclamped, ceiling ≥1600px) */

  --leading-tight: 1.08;   /* h1 (brief §5's own hero line-box multiplier) */
  --leading-snug:  1.25;   /* h2/h3, buttons, wordmark, expiry bar */
  --leading-body:  1.6;

  --tracking-tight: -0.01em;   /* h1/h2/h3 */
  --tracking-normal: 0em;
  --tracking-wide:  0.08em;    /* eyebrows */

  /* --- Space — house scale, unmodified. --------------------------------- */

  --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;

  /* Inter-section rhythm — brief §4's one token. 96px, fixed at every width
     (not fluid — --space-* tokens are fixed per the house scale). */
  --section-gap: var(--space-2xl);

  /* --- Layout -------------------------------------------------------------
     --layout-container: 1100px is the brief's own §5 desktop arithmetic
     figure (the 1440px H1-one-line claim is computed against it). */

  --layout-container: 68.75rem;        /* 1100px */
  --layout-measure: 62ch;
  --layout-gutter: clamp(1.25rem, 5vw, 3rem);
  --layout-tap-min: 44px;              /* WCAG touch target floor; also the expiry bar's height */

  --layout-header-height: 62px;        /* brief §5, 375px target: space-sm×2 + ~28px content + 1px border */
  --layout-header-height-desktop: 76px; /* brief §5, 1440px target: space-md×2 + ~28px content */
  --layout-hero-field-height: 150px;    /* brief §5's repeated-ornament minimum — fixed at every width */

  /* Header's sticky top-offset. Brief §4 step 1: the expiry bar is NOT
     sticky (house default), so the header is not sticky either — zero here,
     matching the "no sticky-stack term" ruling (brief §5). */
  --header-sticky-offset: 0px;

  /* --- Radius / shadow / border -------------------------------------------
     Warm-craft's honest, hand-built register (ref-010's letterpress-card
     treatment): flat trust-cards (no radius, no shadow — never "uniform
     radius on everything", design-rules §4), small radius reserved for
     interactive controls only. */

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

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

  --border-hairline: 1px;
  --border-thick: 3px;
  --border-style: solid;

  /* The signature — "the dawn ridge holds" (brief §9). A 4px accent band:
     the hero's own ridge line, flattened and reused as the head-rule of
     every band below it, and the trust-card's own top accent border (brief
     §5 repeated-ornament minimum — both name 4px explicitly). Fixed, not
     fluid, at every breakpoint; never shrinks. */
  --cut-w: 4px;

  /* --- Motion (brief §9). base.css collapses every duration under
     prefers-reduced-motion: reduce — no exceptions (spec §8). */

  --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;

  /* Two independently-timed glint satellites + one dawn-haze wisp, sharing
     no common factor (brief §9's signature move, exact figures). */
  --loop-glint-1: 6.2s;
  --loop-glint-2: 8.1s;
  --delay-glint-2: 0.9s;
  --loop-haze: 9.4s;

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

/* --------------------------------------------------------------------------
   @font-face — self-hosted woff2, SIL OFL 1.1 (brief §3). Variable instances
   (wght axis, partial-instanced 400–700 / 400–500), subset to the house
   declared safe range (house-tech-spec §8), byte-identical unicode-range on
   every face. Coverage-gap + fallback measurements: README.md § Fonts.
   -------------------------------------------------------------------------- */

@font-face {
  font-family: 'Fraunces';
  src: url('../assets/fonts/fraunces-latin-wght400-700.woff2') format('woff2');
  font-weight: 400 700;
  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: 'Fraunces Italic';
  src: url('../assets/fonts/fraunces-latin-wght400-700-italic.woff2') format('woff2');
  font-weight: 400 700;
  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-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

@font-face {
  font-family: 'Hanken Grotesk';
  src: url('../assets/fonts/hanken-grotesk-latin-wght400-700.woff2') format('woff2');
  font-weight: 400 700;
  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: 'Hanken Grotesk Italic';
  src: url('../assets/fonts/hanken-grotesk-latin-wght400-500-italic.woff2') format('woff2');
  font-weight: 400 500;
  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-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

/* Metrics-matched fallbacks (house-tech-spec §7/§8) — MEASURED, not
   eyeballed, via scripts/font-metrics.mjs (the fontaine algorithm) against
   the shipped, subset woff2 files. Donor faces per the brief: Georgia is not
   redistributable in this build container, so its free metric-compatible
   clone Gelasio (Google Fonts, OFL) stands in; Arial/Helvetica Neue is
   Liberation Sans (already on this system). Full derivation: README.md. */

@font-face {
  font-family: 'Fraunces Fallback';
  src: local('Georgia');
  size-adjust: 112.3%;
  ascent-override: 87.09%;
  descent-override: 22.71%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Fraunces Italic Fallback';
  src: local('Georgia Italic'), local('Georgia');
  font-style: italic;
  size-adjust: 107.66%;
  ascent-override: 90.84%;
  descent-override: 23.69%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Hanken Grotesk Fallback';
  src: local('Helvetica Neue'), local('Arial');
  size-adjust: 101.56%;
  ascent-override: 98.47%;
  descent-override: 29.84%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Hanken Grotesk Italic Fallback';
  src: local('Helvetica Neue Italic'), local('Arial Italic'), local('Arial');
  font-style: italic;
  size-adjust: 102.61%;
  ascent-override: 97.46%;
  descent-override: 29.53%;
  line-gap-override: 0%;
}