/* ==========================================================================
   tokens.css — the design brief, compiled. Pump Pros Inc., Turlock, CA —
   brief.md v1 (C3 approved 2026-09-21). Family: warm-craft. Archetype:
   band-rhythm. Dominant hue: harvest-gold #B8862B (derived from Central
   Valley agriculture + the business's own ag/irrigation secondary line,
   brief §2.1 — NOT the brand's navy logo, which is demoted to a single
   named accent role, see --color-brand-navy below). Display: Fraunces +
   Fraunces Italic. Body: Hanken Grotesk.
   THIS FILE IS THE ONLY PLACE RAW VALUES LIVE (house-tech-spec §3).
   ========================================================================== */

:root {

  /* --- Colour (brief §2.2, contrast table §2.3). One deliberate mode: light. */

  --scheme: light;

  --color-bg:              #F6EFE1;  /* walnut-cream */
  --color-surface:         #FFFDF8;  /* cards, review quote, form fields */
  --color-ink:             #2B2013;  /* warm near-black */
  --color-ink-muted:       #6B5B44;

  --color-accent:          #B8862B;  /* harvest-gold — FILL/RULE/DECORATION ONLY, never raw text (brief §2.3 X1/X2) */
  --color-accent-ink:      #2B2013;  /* ink sits ON gold fills (F5, 4.92:1) */

  --color-border:          #E6DCC6;  /* decorative hairline only — no contrast floor */
  --color-border-strong:   #8A6A3F;  /* control outlines / focus ring — >=3:1 both grounds (F8/F9) */
  --color-focus:           #8A6A3F;

  /* The one accent kept from brand-echo (brief §2.1's argued departure — the
     business's own sampled logo navy, V-tier, dossier front-matter
     brand_color). NEVER a ground, NEVER a CTA fill, NEVER inside a generated
     image. Its single call site is the licence/registration line in the
     trust strip (brief §5.4). */
  --color-brand-navy:      #165083;

  --color-selection-bg:    #B8862B;
  --color-selection-ink:   #2B2013;

  /* Hero atmosphere (design-rules §0 — never a flat ground). 3-stop radial,
     centred 25% 0%, brief §2.2/§2.4. Text over it is measured at its worst
     case, the LIGHTEST stop (0%), per design-rules §6. */
  --color-hero-halo-light: #4A3520;  /* 0% stop — lightest, the worst case for light-on-dark text */
  --color-hero-halo-mid:   #2B2013;  /* 60% stop */
  --color-hero-halo-deep:  #1A1209;  /* 100% stop — darkest corner, never under body text */

  --color-hero-eyebrow:    #E9C988;  /* light gold, hero-only eyebrow ink (G1, 7.23:1 worst case) */
  --color-hero-lead:       #D9CDB8;  /* muted warm cream, hero-only lead ink (G4, 7.34:1 worst case) */

  /* No --color-focus-on-band: the hero's only focusable control is the
     primary CTA, which sits on the opaque gold fill, not the gradient
     itself — handled by the N2a override below, not this token (tokens.css
     house convention: left undeclared rather than unused). */

  /* --- Typography (brief §3). Two families, three woff2 files — within the
     ≤4-file, ≤2-family cap. Fraunces Italic is a style of the same family,
     not a third typeface. */

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

  --font-weight-body:           400;
  --font-weight-body-strong:    700;
  --font-weight-display:        600;
  --font-weight-display-italic: 500;

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

  --text-hero:    clamp(2rem, 1.2rem + 5vw, 4.4rem);      /* 37.95 @375 -> 70.4 @1440 */
  --text-h2:      clamp(1.6rem, 1.1rem + 3vw, 2.35rem);   /* 28.85 @375 -> 37.6 @1440 */
  --text-h3:      clamp(1.15rem, 1rem + 1vw, 1.4rem);     /* 19.75 @375 -> 22.4 @1440 */
  --text-lead:    clamp(1.05rem, 0.95rem + 0.6vw, 1.25rem); /* 17.45 @375 -> 20 @1440 */
  --text-body:    1rem;       /* fixed, deliberate — brief §3.2 */
  --text-small:   0.9rem;     /* fixed */
  --text-eyebrow: 0.78rem;    /* fixed */

  --leading-tight: 1.08;   /* brief §3.2's H1 line-box multiplier, also used for h2/h3 */
  --leading-snug:  1.25;
  --leading-body:  1.6;

  --tracking-tight: -0.02em;
  --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. 64px, fixed at every width. */
  --section-gap: var(--space-xl);

  /* --- Layout -------------------------------------------------------------
     Header content height is fixed at 56px (design-rules §7.2 rule 3's own
     worked shape), not derived from font line-height, so the brief's sticky-
     stack arithmetic (101px = 44px expiry bar + 56px header content + 1px
     border) reproduces exactly at every width. */

  --layout-container: 72rem;
  --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: 56px;        /* brief §5.2 sticky-stack arithmetic */

  /* The living-hero field — fixed height at every width (brief §5.2). */
  --layout-hero-field-height: 220px;

  /* Hero min-height — fixed, brief §5.2's own arithmetic constant. */
  --hero-min-height: 620px;

  /* --- Radius / shadow / border -------------------------------------------
     Warm-craft's honest, hand-built register (ref-010's letterpress-card
     treatment, brief §1): flat cards (no radius, no shadow), 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 32 19 / 0.06);
  --shadow-md: 0 6px 24px rgb(43 32 19 / 0.09);
  --shadow-lg: 0 24px 60px rgb(43 32 19 / 0.14);

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

  /* The one repeated ornament — the band-rule (brief §3.2). Fixed at every
     width, never shrinks: a decorative, non-content-bearing rule, not a
     column that must yield to content. */
  --ornament-band-rule-height: 3px;
  --ornament-band-rule-width: 64px;

  /* --- Motion (brief §7). 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;

  /* Three independent satellite loops over the living-hero field — no shared
     timing base (brief §7, ref-001). */
  --duration-flag-sway: 6.2s;
  --duration-panel-glow: 4.1s;
  --duration-ripple: 3.6s;

  /* --- 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, licences in
   assets/fonts/OFL-Fraunces.txt and OFL-HankenGrotesk.txt). Variable
   instances (wght axis only — the house-tech-spec §8 wght/opsz trap is
   unreachable by construction: font-variation-settings ships nowhere on this
   site, weight is set with font-weight everywhere), subset to the house
   declared safe range, byte-identical unicode-range on every face.
   -------------------------------------------------------------------------- */

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

/* 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 above. Donor faces: Georgia is not
   redistributable in this build container, so its free metric-compatible
   clone Gelasio (Google Fonts, OFL) stands in for measurement only, while
   the @font-face's own src still lists Georgia (what real visitors have);
   Arial/Helvetica is Liberation Sans (already on this system). Full
   derivation: README.md § Font fallback derivation. */

@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%;
}