/* ==========================================================================
   tokens.css — Hess Well Drilling, Inc. (Millerton, PA). Compiled from
   brief.md v1 (C3 approved 2026-09-22) §3, §4, §5, §7.1, §8. Every value
   below is the brief's; nothing here is improvised (house-tech-spec §3).
   ========================================================================== */

:root {

  /* --- Colour — brief §4 -------------------------------------------------
     Derivation order (design-rules §6): (1) the business's own real-world
     truck/rig maroon (dossier §4.5, sampled #9c5d76) → (2) local character
     (rural Tioga County) → (3) family norms (warm-craft). The accent is
     carried at HSL(336°, 30%, 40%), the closest direct echo of the sampled
     hue that still clears AA against cream. One deliberate mode: light. */

  --scheme: light;

  --color-bg:          #F6EEE2;  /* cream — the honest warm ground */
  --color-surface:     #EFE3D2;  /* deeper paper, section-alternation ground */
  --color-ink:         #2A1F1B;  /* rig-timber near-black brown */
  --color-ink-muted:   #6B584C;
  --color-accent:      #854760;  /* dusty-rose-maroon — echoes dossier §4.5's #9c5d76 */
  --color-accent-ink:  #FBF0F3;

  /* The one cool accent on the whole site — decorative only, never text
     (brief §4). Marks the §6.1 anchor's single water-at-the-surface moment
     in the hero field and nowhere else carries a text role. */
  --color-water:       #5C97A8;

  /* House-required structural colours (consumed by base.css). Not a named
     brief value — derived from the palette above so nothing here is a raw
     invention: a quiet tint between --color-surface and --color-ink-muted
     for the decorative hairline, and --color-ink-muted itself (already
     5.84:1 / 5.32:1 in the brief's own contrast table, so it clears the
     control-boundary 3:1 floor on both grounds with margin) for anything
     that needs to read as a control's edge. */
  --color-border:        #DDD3C7;  /* decorative hairlines only, no contrast floor */
  --color-border-strong: var(--color-ink-muted); /* control boundaries, WCAG 1.4.11 */

  --color-focus:         var(--color-accent);   /* 5.94:1 / 5.41:1 — brief §4 table */
  --color-selection-bg:  var(--color-accent);
  --color-selection-ink: var(--color-accent-ink);

  /* No dark band ships on this site (brief §6, §8 — light mode only, one
     living-hero field, no inverted section), so no --color-focus-on-band
     is declared: an unused token is noise (tokens.css house note). */

  /* --- Typography — brief §3 ----------------------------------------------
     Bitter 700 upright (display) + Bitter Italic 500 (emphasis), both
     static — no font-variation-settings axis exists on either face, so the
     wght-axis trap (house-tech-spec §8) has no surface to appear on. Karla
     variable 400/600 (body). Fallback stacks share the display faces'
     serif/sans proportions. */

  --font-display:  'Bitter', 'Bitter Fallback', Georgia, 'Times New Roman', serif;
  --font-emphasis: 'Bitter Italic', 'Bitter Italic Fallback', Georgia, 'Times New Roman', serif;
  --font-body:     'Karla', 'Karla Fallback', Arial, sans-serif;

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

  /* --- Fluid type scale — brief §5, specified across its range at every
     breakpoint the brief declares (design-rules §5). Values verbatim. */

  --text-eyebrow: clamp(0.72rem, 0.68rem + 0.18vw, 0.82rem);
  --text-h1:      clamp(2rem, 1.5rem + 2.4vw, 3.4rem);
  --text-h2:      clamp(1.3rem, 1.12rem + 0.9vw, 1.85rem);
  --text-lead:    clamp(1.02rem, 0.96rem + 0.3vw, 1.2rem);
  --text-body:    clamp(0.98rem, 0.94rem + 0.16vw, 1.08rem);
  --text-quote:   clamp(1.15rem, 1.02rem + 0.55vw, 1.4rem);
  --text-fact:    clamp(0.7rem, 0.66rem + 0.16vw, 0.78rem);
  --text-small:   clamp(0.78rem, 0.75rem + 0.12vw, 0.86rem);

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

  --tracking-tight: -0.01em;
  --tracking-normal: 0em;
  --tracking-wide:  0.06em;   /* eyebrow / fact-chip letterspacing, Tile B's own value */

  /* --- Space — house scale (house-tech-spec §3). --space-2xl is fluid,
     brief §5's own value, so it can serve as --section-gap directly
     (design-rules §7.1: "resolves to a step on the scale... the choice of
     step is the brief's"). Every other step is the house fixed scale. */

  --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: clamp(2.5rem, 2rem + 2vw, 4.5rem); /* brief §5: floor 40px <400px, ceiling 72px >2000px */
  --space-3xl: 9rem;

  /* Inter-section rhythm — design-rules §7.1's one token. Two call sites
     only: .section's padding-block and the hero's padding-block-end. */
  --section-gap: var(--space-2xl);

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

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

  /* The measured shape of the sticky header (design-rules §7.2 rule 3 —
     the sticky-stack term is the header's own real height, never a token
     sum by itself; this is the input the Builder measures against the
     live DOM, not a substitute for that measurement): two --space-sm
     paddings around a --layout-tap-min control, plus the hairline border. */
  --header-height: calc(var(--layout-tap-min) + (var(--space-sm) * 2) + var(--border-hairline));

  /* Hero's own internal rhythm (brief §6.1: 12px flex gap between rows —
     matches --space-xs exactly). */
  --hero-row-gap: var(--space-xs);

  /* Split-hero breakpoint, brief §2: >= 60rem (960px) two-column split. */
  --hero-columns-lg: 1.15fr 1fr; /* text column ~55%, field column ~45% */

  /* --- Radius / shadow / border ------------------------------------------
     Tile B's own hero used a 3px radius throughout; expressed here as the
     house --radius-sm step (2px) — the closest step on the house scale,
     since 3px is not itself a token and the scale is house (design-rules
     §7.1's "resolves to a step" logic applied to radius, not invented). */

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

  --shadow-none: none;

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

  /* --- Motion — brief §8 --------------------------------------------------
     Reveal system: house pattern. Signature move ("the pump settles,
     once"): Tile B's own timings, carried forward exactly. */

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

  /* The signature move's own timings — brief §8, verbatim. --settle-travel
     is recorded but NOT currently consumed by site.css: the brief's
     translateY(-16px) clause measured CLS 0.102 on the hero's own LCP
     picture (Lighthouse, throttled mobile) against the house's ~0 budget,
     and opacity-only measures 0.000 with LCP unchanged — see the flagged
     deviation at site.css's .field__media rule. Kept here rather than
     deleted so the brief's literal value stays on record. */
  --settle-duration: 1.4s;
  --settle-ease:     cubic-bezier(0.2, 0.7, 0.3, 1);
  --settle-travel:   -16px;

  --sway-duration:  8.2s;   /* cable sway, independent loop */
  --sway-angle:     1.6deg;

  --glint-duration: 6.6s;   /* worklight glint, independent loop, non-synchronised with sway */

  --flow-duration: 0.9s;    /* wellhead flow-line, one-shot draw */
  --flow-delay:    1.4s;

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

/* Brief §8: prefers-reduced-motion collapses the signature-move tokens at
   their source — the settle skips straight to its resting state, the two
   loops read as already-settled, matching base.css's house kill switch. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --settle-duration: 0.01ms;
    --sway-duration: 0.01ms;
    --glint-duration: 0.01ms;
    --flow-duration: 0.01ms;
    --flow-delay: 0s;
    --reveal-shift: 0;
  }
}

/* --------------------------------------------------------------------------
   @font-face — three files, two families, both SIL OFL 1.1 (brief §3);
   licence notices in assets/fonts/OFL-Bitter.txt and OFL-Karla.txt. Self-
   hosted woff2, subset to the house declared safe range, identical
   unicode-range on all three faces (house-tech-spec §8).
   -------------------------------------------------------------------------- */

@font-face {
  font-family: 'Bitter';
  src: url('../assets/fonts/bitter-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: 'Bitter Italic';
  src: url('../assets/fonts/bitter-italic-500-latin.woff2') format('woff2');
  font-weight: 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;
}

@font-face {
  font-family: 'Karla';
  src: url('../assets/fonts/karla-latin-var.woff2') format('woff2');
  font-weight: 400 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), MEASURED via
   scripts/font-metrics.mjs — never guessed. Georgia and Arial are not
   installed under those exact family names in this build environment and
   are not redistributable, so the measurement donor (never the shipped
   src, which still names the brief's own local() faces first) is the
   nearest open metric twin: Gelasio 700 / Gelasio Italic 500 (Google's own
   open metric-compatible Georgia clone) for the two Bitter faces, and
   Liberation Sans Regular (installed locally, Arial's own metric-
   compatible clone) for Karla — same method and donor family as
   eastview-landscaping-huntsville-al and hytek-water-conditioning-north-
   logan-ut. Full measurement record: README.md. */

@font-face {
  font-family: 'Bitter Fallback';
  src: local('Georgia Bold'), local('Georgia');
  font-weight: 700;
  font-style: normal;
  size-adjust: 91.87%;
  ascent-override: 101.77%;
  descent-override: 28.84%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Bitter Italic Fallback';
  src: local('Georgia Italic'), local('Georgia');
  font-weight: 500;
  font-style: italic;
  size-adjust: 97.37%;
  ascent-override: 96.02%;
  descent-override: 27.22%;
  line-gap-override: 0%;
}

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