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

   Leo's Towing & Recovery (Louisville, KY). Every value below is taken
   directly from the approved brief (runs/leos-towing-louisville-ky/brief.md
   §2), not improvised. Palette: bourbon-copper / kraft-cream, one deliberate
   light mode, no dark band. Archetype: band-rhythm. Signature: "the hours
   sign" (§6).
   ========================================================================== */

:root {

  /* --- Colour --------------------------------------------------------------
     Derivation (brief §2.1): Step 1 (brand_color) — absent from front matter,
     a recorded gap (dossier §4.5), no echo/departure argument owed. Step 2 —
     Louisville's own sign-painter/bourbon-warehouse register, used once,
     lightly, as ambient tone only. Step 3 — retro-local family norms, built
     from voice and honest disclosure rather than a founding-year tenure hook
     (C2-DECISION carried-forward item 1). Two-depth accent system carried
     forward from the tile UNCHANGED (brief §0 item 4). */

  --scheme: light;

  --color-bg: #F6ECD9;                /* page ground — kraft-cream */
  --color-surface: #EFE0C4;           /* raised/alternate bands */
  --color-ink: #2B1B12;               /* primary text — near-black umber */
  --color-ink-muted: #6B5138;         /* secondary text — lead lines, facts, footer */

  /* Two-depth bourbon-copper system (brief §2.1, hard rule): --color-accent
     is the BRIGHT role — large numerals, thin rule-work, icon fills, dashed
     dividers ONLY, never text at any size on any ground. --color-accent-text
     is the deepened, TEXT-BEARING role — every word on the hero atmosphere,
     eyebrow/kicker, driver-card names, button-label pairing partner. */
  --color-accent: #A8511F;            /* bourbon-copper (bright) — non-text roles only */
  --color-accent-text: #7A3B16;       /* deepened bourbon-copper — every text role */
  --color-accent-ink: #FBF3E6;        /* cream text ON --color-accent fills */

  /* House-required structural colours (consumed by base.css). --color-line is
     the brief's own name for the decorative-hairline role (brief §2.1); it is
     aliased onto the required --color-border token so base.css/site.css keep
     working unmodified (house-tech-spec §3: token names are fixed). No
     contrast floor — a divider is not a control. */
  --color-line: #DDC79A;
  --color-border: var(--color-line);

  /* A CONTROL'S OWN BOUNDARY, WCAG 1.4.11: >= 3:1 against bg AND surface.
     Brief §2.1: = --color-ink-muted, 6.27:1 on bg / 5.64:1 on surface. */
  --color-border-strong: #6B5138;

  --color-focus: #7A3B16;             /* :focus-visible ring — 7.27:1 bg / 6.55:1 surface, both AAA */
  /* No dark band on this site (brief §2.1: "Tile B stays light-mode
     throughout... --color-focus-on-band is therefore not declared."). */
  /* --color-focus-on-band: …; */

  --color-selection-bg: #7A3B16;
  --color-selection-ink: #FBF3E6;

  /* --- Typography ------------------------------------------------------------
     Display: Yeseva One (400, its only weight — watch-listed face, justified
     over Ultra/Abril Fatface in the brief §2.2: the one pool option that
     reads painted, not printed). Body: Karla (400/700/400 italic). Both OFL,
     self-hosted, ≤4 static woff2 files (design-rules §5 cap). */

  --font-display: 'Yeseva One', 'Yeseva One Fallback', Georgia, serif;
  --font-body:    'Karla', 'Karla Fallback', Arial, Helvetica, sans-serif;

  --font-weight-body: 400;
  --font-weight-body-strong: 700;
  /* Yeseva One ships in its single static weight — the display role never
     asks for anything else (brief §2.2). */
  --font-weight-display: 400;

  /* --- Type scale --------------------------------------------------------
     Fluid via clamp(), values copied verbatim from brief §2.2's table
     (computed at 375/768/1024/1440 there; not re-derived here). */

  --text-eyebrow: clamp(0.75rem, 0.7rem + 0.22vw, 0.85rem);   /* eyebrow, tracked labels */
  --text-hero:    clamp(1.9rem, 1.3rem + 3.2vw, 3.25rem);     /* H1 wordmark */
  --text-h2:      clamp(1.4rem, 1.15rem + 1.1vw, 2rem);       /* section titles */
  --text-lead:    clamp(1rem, 0.95rem + 0.3vw, 1.15rem);      /* hero lead, testimonial body */
  --text-body:    clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);    /* body copy */
  --text-small:   clamp(0.8rem, 0.77rem + 0.15vw, 0.9rem);    /* card attributions, facts labels */
  --text-numeral: clamp(1.6rem, 1.3rem + 1.6vw, 2.5rem);      /* fact-row stats, process numerals */

  --leading-tight: 1.05;   /* Yeseva One display */
  --leading-snug: 1.2;     /* eyebrow, card attributions */
  --leading-body: 1.6;     /* Karla body */

  --tracking-tight: 0em;   /* display face is not tightened (brief carries no value for this) */
  --tracking-normal: 0em;
  --tracking-wide: 0.13em;    /* eyebrow — carried forward from the tile's measured value exactly */
  --tracking-label: 0.08em;   /* smaller uppercase labels (FAQ tags etc.), distinct from the eyebrow */

  /* --- Space -------------------------------------------------------------
     House scale, values fixed by the brief at the house steps (brief §2.3). */

  --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 — the one token; 64px at every breakpoint (brief §2.3). */
  --section-gap: var(--space-xl);

  /* --- Layout --------------------------------------------------------------
     House defaults hold (brief does not override container/measure/gutter).
     Two brief-specific inner max-widths (§4): 680px for prose-bearing bands
     (process, FAQ), 960px for ruled/card-bearing bands (roster, hours, crew,
     reviews) — band-rhythm's alternating-panel register. */

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

  --layout-prose: 42.5rem;   /* 680px */
  --layout-cards: 60rem;     /* 960px */

  /* Sticky header's own measured height (brief §4: "the tile's own measured
     .sticky-header{height:56px}"), consumed as min-height so the box always
     resolves to this figure regardless of content — the arithmetic the brief
     computes the first screen against depends on it staying fixed. */
  --header-height: 3.5rem;   /* 56px */

  /* --- Radius / shadow / border -------------------------------------------
     Brief §2.3: two distinct radius treatments, not one uniform value.
     --radius-sm (4px) for buttons, form inputs, the driver-card frame.
     --radius-none (0) for dashed dividers, the sign board's frame, FAQ rows.
     No --radius-lg / --radius-pill anywhere on this site (unused steps
     dropped rather than shipped dead, house precedent). */

  --radius-none: 0;
  --radius-sm: 4px;

  --shadow-none: none;      /* the only shadow token this site consumes */

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

  /* Dashed hairline used for band-rhythm's decorative section dividers and
     the sign board's own frame stroke (brief §2.3: unrounded, hairline
     separation, never a drop shadow). */
  --border-style-dashed: dashed;

  /* --- Motion ----------------------------------------------------------------
     House transition timings for buttons/nav/skip-link — not brief-specified,
     kept at house defaults. Reveal timing IS brief-specified (§2.3,
     --duration-reveal): base.css's reveal system consumes --duration-slow, so
     --duration-slow is set FROM --duration-reveal below rather than the two
     drifting apart. */

  --duration-fast: 140ms;
  --duration-base: 320ms;
  --duration-reveal: 500ms;             /* brief §2.3 — scroll reveals */
  --duration-slow: var(--duration-reveal);

  --ease-out: cubic-bezier(.16,1,.3,1);  /* brief §2.3 — scroll reveals */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

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

  /* Signature-move tokens (brief §2.3/§6 — "the hours sign"), carried forward
     from the tile's own specified values exactly. */
  --duration-sign-settle: 2.4s;   /* one-shot creak-into-place on load */
  --duration-sign-sway: 6.8s;     /* settled board's ambient sway loop */
  --duration-hook-sway: 7.6s;     /* wrecker-hook icon, independent loop, offset 1.1s */
  --duration-pennant: 5.2s;       /* pennant flutter, independent loop */
  --hook-sway-offset: 1.1s;
  --ease-overshoot: cubic-bezier(.2,.8,.2,1);  /* the sign settle */
  --ease-ambient: ease-in-out;                  /* every sway/flutter loop, never linear */

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

/* --------------------------------------------------------------------------
   @font-face — self-hosted woff2, subset to house-tech-spec §8's declared
   safe range, identical unicode-range on every face. Licences:
   Yeseva One — SIL OFL 1.1, Sorkin Type (assets/fonts/OFL-YesevaOne.txt).
   Karla — SIL OFL 1.1, Jonathan Pinhorn/Huerta Tipográfica (assets/fonts/OFL-Karla.txt).
   -------------------------------------------------------------------------- */

@font-face {
  font-family: 'Yeseva One';
  src: url('../assets/fonts/yeseva-one-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: 'Karla';
  src: url('../assets/fonts/karla-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: 'Karla';
  src: url('../assets/fonts/karla-700-latin.woff2') format('woff2');
  font-weight: 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: 'Karla';
  src: url('../assets/fonts/karla-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-2015, U+2018-201A, U+201C-201E, U+2026, U+2032-2033;
}

/* --- Metrics-matched fallbacks (house-tech-spec §8) -----------------------
   One per shipped face/weight/style, so font-display: swap cannot move a
   line. Values are direct fontTools OS/2+hhea measurements of these exact
   shipped woff2 files (unitsPerEm 1000 / 2000, verified this pass against
   the identical bytes already shipped on pk-son-lawn-care-green-bay-wi
   (Yeseva One) and chattanooga-tree-service-chattanooga-tn (Karla trio) —
   the metrics are a property of the font file, not the site, so the prior
   measurement transfers exactly. Donors: Georgia (Yeseva One), Arial
   (Karla) — no Georgia/Arial binary exists in this build environment, so
   the CSS still names local('Georgia')/local('Arial') first, matching every
   real browser's own system font, exactly as the donor sites recorded. */

@font-face {
  font-family: 'Yeseva One Fallback';
  src: local('Georgia'), local('Gelasio');
  font-weight: 400;
  size-adjust: 105.6%;
  ascent-override: 86.7%;
  descent-override: 22.7%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Karla Fallback';
  src: local('Arial');
  font-weight: 400;
  font-style: normal;
  size-adjust: 103.53%;
  ascent-override: 88.57%;
  descent-override: 24.34%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Karla Fallback';
  src: local('Arial Bold'), local('Arial');
  font-weight: 700;
  font-style: normal;
  size-adjust: 100.06%;
  ascent-override: 91.64%;
  descent-override: 25.18%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Karla Fallback';
  src: local('Arial Italic'), local('Arial');
  font-weight: 400;
  font-style: italic;
  size-adjust: 93.62%;
  ascent-override: 97.95%;
  descent-override: 26.92%;
  line-gap-override: 0%;
}

/* --- Reduced motion: signature-move tokens ---------------------------------
   base.css's kill switch (house, never edited per site) collapses
   --duration-fast/-base/-slow at :root under prefers-reduced-motion. It has
   no way to know about this brief's own signature-move tokens, so they are
   collapsed here, alongside base.css's mechanism rather than instead of it.
   site.css also states the REQUIRED explicit end-states (sign settled, hook
   at a fixed angle, pennant at scaleX(1)) — collapsing durations to ~0 alone
   would still technically finish an animation at its last keyframe, but the
   explicit rule is what the brief requires and what a reviewer can check
   without doing the arithmetic. */
@media (prefers-reduced-motion: reduce) {
  :root {
    /* @allow-literal: a duration token must resolve to a real time value */
    --duration-sign-settle: 0.01ms;
    --duration-sign-sway: 0.01ms;
    --duration-hook-sway: 0.01ms;
    --duration-pennant: 0.01ms;
  }
}