/* tokens.css — the design brief, compiled.
   Earth Friendly Lawn Care, Traverse City MI. Source: brief.md (approved C3
   2026-09-17), family quiet-premium, archetype annotated-column ("the seed
   settles"). Every value below is the brief's — nothing improvised
   (house-tech-spec §3). */

:root {

  /* --- Colour — brief §3 --------------------------------------------------
     Derivation (design-rules §6 order, argued in full in brief §3.1):
     brand_color #1b4c24 excluded by its own recorded provenance (site-CSS-
     only, dossier front-matter); local character (dossier §4.5, Grand
     Traverse orchard-and-wine country) supplies orchard-gold directly; the
     semantic anchor's earth half (playbooks/landscaping.md §6.1) licenses it
     as dominant, the green half is carried in the hero image itself (§7.1). */

  --scheme: light;

  --color-bg:          #FAF6EE;   /* ivory */
  --color-surface:     #F0E9DA;   /* warm parchment — chip/card grounds, form fields */
  --color-ink:         #2B2420;   /* near-black warm brown */
  --color-ink-muted:   #5C5145;   /* muted warm brown */
  --color-accent:      #B9862F;   /* DOMINANT — orchard-gold. FILL/RULE/ICON ONLY, never text (brief §4) */
  --color-accent-ink:  #2B2420;   /* text ON accent fill — primary CTA, tick rules */

  /* Text-safe accent variant, added at brief stage (brief §2.1, §3.2, §4):
     the ONLY accent role usable as text colour — h1 accent phrase, the
     annotated-column a-tag labels. Raw --color-accent as text measures
     2.99:1 against bg and fails even the 3:1 large-text floor (brief §4.3). */
  --color-accent-text: #8A5E1C;

  /* House-required structural colours (consumed by base.css) */
  --color-border:        #5C5145;              /* = ink-muted — interactive component borders (form fields), brief §3.2 */
  --color-border-strong: #5C5145;               /* nav-toggle unused on this site (no persistent nav, brief §5.1 rule 5); kept equal to --color-border so the token resolves if base.css ever reaches for it */
  --color-hairline:       rgba(43, 36, 32, 0.12); /* decorative-only: section rules, annotated-column row dividers */

  --color-focus: #2B2420;          /* :focus-visible ring — 14.16:1 vs bg, brief §4.2 row 10 */

  /* No dark band anywhere on this site (brief §5.1 rule 6, one light register
     throughout), so --color-focus-on-band is not declared. */

  --color-selection-bg: #B9862F;
  --color-selection-ink: #2B2420;

  /* Hero atmosphere — grading target for the generated asset + the CSS
     gradient layers that sit with it (brief §3.2). NOT general UI tokens;
     the only call sites are the .hero-field gradients (site.css). */
  --color-atmos-warm:  #B9862F;    /* base radial, low opacity — orchard-gold depth */
  --color-atmos-light: #FFFFFF;    /* top radial, low opacity — the tile's own wash */

  /* --- Typography — brief §2 ----------------------------------------------
     Prata (display, single static 400 weight, no italic master — brief §2.1
     drops font-style:italic and carries emphasis through --color-accent-text
     instead) / Mulish (body, static 400/500/600). Both subset to the house
     declared safe range (house-tech-spec §8), unicode-range identical on
     every face below. */

  --font-display: 'Prata', 'Prata Fallback', 'Prata Fallback 2', Georgia, 'Times New Roman', serif;
  --font-body:    'Mulish', 'Mulish Fallback', 'Helvetica Neue', Arial, sans-serif;

  --font-weight-body:        400;
  --font-weight-body-strong: 600;
  --font-weight-display:     400;   /* Prata's only weight — never request 700 (brief §2.1) */

  /* font-variation-settings is not used anywhere: all four instances are
     static (brief §2.2), so the wght-vs-font-weight trap (house-tech-spec
     §8) has no call site here. */

  /* --- Type scale — brief §2.9, computed across its range at §2.10
     (breakpoints 375/640/1024/1440). */

  --text-hero:    clamp(2.5rem, 1.9rem + 2.6vw, 3.9rem);
  --text-h2:      clamp(1.4rem, 1.2rem + 1.0vw, 2.1rem);
  --text-lead:    clamp(1.1rem, 1.02rem + 0.3vw, 1.3rem);
  --text-body:    clamp(1rem, 0.95rem + 0.2vw, 1.1rem);
  --text-eyebrow: clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
  --text-small:   0.85rem;   /* fixed — form hints, footer small print */
  --text-h3:      1.05rem;   /* fixed — header wordmark <1024, brief §6 sticky chrome */
  --text-h3-lg:   1.0625rem; /* 17px — header wordmark >=1024, brief §6 sticky chrome */

  --leading-tight:   1.15;   /* h1 — brief §2.9, verified against the shipped Prata face at build (brief §2.10) */
  --leading-snug:    1.20;   /* h2/h3 section heads */
  --leading-lead:    1.55;
  --leading-body:    1.62;
  --leading-eyebrow: 1.3;

  --tracking-tight:  0em;    /* Prata carries no negative tracking in this brief (unlike the skeleton default) */
  --tracking-normal: 0em;
  --tracking-wide:   0.18em; /* eyebrow, a-tag labels — brief §2.9 */

  /* --- Space ---------------------------------------------------------------
     House scale, unmodified (brief §3.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 — brief §5.4: 64px, fixed at every breakpoint. */
  --section-gap: var(--space-xl);

  /* --- Layout ---------------------------------------------------------------
     Brief §5.3: narrow single-column measure, matching the archetype. */

  --layout-container: 40rem;    /* 640px — the archetype's single restrained column, brief §5.3 */
  --layout-measure:   62ch;     /* running body copy */
  --layout-row-measure: 56ch;   /* annotated-column row sentence / services row (brief §5.1 rule 1) */
  --layout-gutter:    clamp(1.25rem, 5vw, 3rem);
  --layout-tap-min:   44px;

  /* Hero field geometry — brief §5.2, stated per regime. */
  --hero-field-height:    150px;  /* < 1024 */
  --hero-field-height-lg: 220px;  /* >= 1024 */

  /* Hero padding-block-start — brief §5.3. */
  --hero-pad-top:    28px;  /* < 1024 */
  --hero-pad-top-lg: 48px;  /* >= 1024 */

  /* Hero rhythm — brief §5.5's fixed (non-fluid, rem-based) spacing values,
     identical at every breakpoint. --space-sm already equals the eyebrow→h1
     gap (16px) exactly, so no separate token is needed for that one gap. */
  --hero-rule-margin:        0.875rem;  /* 14px — rule footprint's margin half (+1px line height) */
  --hero-h1-cta-gap:         1.2rem;    /* 19.2px */
  --hero-cta-secondary-gap:  0.55rem;   /* 8.8px */
  --hero-cta-field-gap:      2rem;      /* 32px */
  --hero-lead-measure:       32ch;      /* brief §6 §I lead, matches the tile exactly */

  /* Hero-field satellite geometry (brief §8.2) — the seed/plates/tendril's
     SVG viewBox is 0 0 260 150. */
  --sat-seed-origin:      130px 108px;
  --sat-tendril-origin:   130px 122px;
  --sat-bob-distance:     -7px;   /* seed's bob peak */
  --sat-bob-settled:      -3px;   /* seed's reduced-motion settled offset */
  --sat-drift-a-distance:  6px;   /* plate 1 drift peak */
  --sat-drift-b-distance: -5px;   /* plate 2 drift peak */

  /* Row-list device geometry (brief §5.1 rule 3, §5.4) */
  --row-tick-top:     1.35rem;  /* tick's vertical position, matches the tile exactly */
  --row-tick-width:   0.55rem;  /* tick footprint, matches the tile exactly */
  --row-trust-padding: 1.1rem;  /* 17.6px — the trust device's own row padding, brief §5.4 */

  /* Sticky chrome — brief §5.5: expiry 44 + header 56 + 1px border = 101px,
     identical to every other site in the ledger (house skeleton chrome). */
  --bar-height: 3.5rem;   /* 56px header */

  /* --- Radius / shadow / border ---------------------------------------------
     Brief §3.2: zero rounded corners, no shadow anywhere on this site. */

  --radius-none: 0;
  --radius-sm:   0;      /* no call site diverges from --radius-none on this brief */
  --radius-pill: 999px;  /* unused — kept for token-contract completeness */

  --shadow-none: none;   /* NO SHADOW IS USED ANYWHERE ON THIS SITE (brief §3.2) */

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

  /* --- Motion — brief §8: house reveal defaults, plus the hero's own
     independent satellite loops (§8.2). ------------------------------------ */

  --duration-fast: 140ms;
  --duration-base: 480ms;   /* brief §8.1 — reveal fade+settle */
  --duration-slow: 640ms;

  --ease-out:      cubic-bezier(0.22, 1, 0.36, 1);   /* brief §8.1 --ease-standard */
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);

  --reveal-shift:   8px;    /* brief §8.1 — fade + 8px upward settle */
  --reveal-stagger: 90ms;

  /* The hero's four independent, non-synchronised satellite loops (brief
     §8.2) — unchanged from the tile for the seed and both plates, plus the
     tweaks-bar's new third satellite, the root tendril. */
  --orbit-seed:   8.6s;
  --orbit-plate1: 11s;
  --orbit-plate2: 9.4s;
  --orbit-tendril: 13.2s;

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

/* Brief §8.3: reduced motion holds every satellite at its settled/mid-point
   state rather than collapsing it to nothing — base.css already collapses
   --duration-* and --reveal-shift for the scroll-reveal system; the hero's
   own orbit tokens are stopped the same way, at matching specificity, so the
   satellites freeze via `animation: none` in site.css (which reads these
   tokens for their base-state durations only). No !important anywhere
   (house-tech-spec §12). */
@media (prefers-reduced-motion: reduce) {
  :root {
    --reveal-shift: 0;
  }
}

/* --------------------------------------------------------------------------
   @font-face — two families, four static files (Prata 400, Mulish 400/500/
   600), all SIL OFL 1.1 (assets/fonts/OFL-Prata.txt, OFL-Mulish.txt).
   Subset to the HOUSE declared safe range (house-tech-spec §8),
   unicode-range identical on every face below. Self-hosted only, no CDN.

   Metrics-matched fallbacks first (house-tech-spec §7/§8), MEASURED with
   fontTools against the real shipped woff2 files (post-subset), never
   guessed — `node scripts/font-metrics.mjs --webfont … --fallback …`.

   PRATA gets two fallback tiers, the pipeline's standing precedent
   (auto-evolution-north-logan-ut; hky-services-hickory-nc, same face):
   Georgia is the correct real-world donor (Windows/macOS/iOS all ship it)
   but is not an inspectable open file here, so 'Prata Fallback' is measured
   against Gelasio (Georgia's open metric twin); 'Prata Fallback 2',
   measured directly against DejaVu Serif, covers environments without
   Georgia (`fc-match Georgia` → DejaVu Serif in this build/QA environment).
   MULISH needs one tier: Liberation Sans is this environment's actual
   `local('Arial')` resolution target, verified the same way — measured once
   against the 400-weight file and applied to all three Mulish weight cuts,
   since that is the one physical fallback file a real Arial/Helvetica Neue
   local-match resolves to regardless of the requested weight.

   COVERAGE GAP, recorded per house-tech-spec §8 rather than silently
   shipped: Prata's own authoritative Latin master (google/fonts
   ofl/prata/Prata-Regular.ttf) carries NO glyph for U+2010, U+2011, U+2012,
   U+2015, U+2026, U+2032, U+2033 or U+2122 — verified against the unsubset
   file, so this is not a subsetting artifact. Mulish DOES carry U+2010,
   U+2012, U+2015, U+2026, U+2032, U+2033 and U+2122 (only U+2011 is absent
   from both faces, the symmetric case house-tech-spec §8 already permits).
   This site's own copy (copy.md) never sets any of those seven asymmetric
   codepoints in Prata-styled text — no ellipsis, prime mark or trademark
   symbol appears in any h1/h2/h3 or the wordmark; the one ellipsis on the
   site ("Sending…", the JS-enhanced form-status string) renders in Mulish,
   which carries U+2026. A future copy amendment that puts one of those seven
   characters into a heading would fall to the metrics-matched fallback for
   that one word — this is the exact failure mode the declared range exists
   to make visible rather than silent, and is flagged here at the point the
   range is consumed, per house-tech-spec §8. -------------------------------- */

@font-face {
  font-family: 'Prata Fallback';
  src: local('Georgia'), local('Gelasio');
  size-adjust: 108.43%;
  ascent-override: 91.58%;
  descent-override: 33.39%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Prata Fallback 2';
  src: local('DejaVu Serif');
  size-adjust: 92.91%;
  ascent-override: 106.87%;
  descent-override: 38.96%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Mulish Fallback';
  src: local('Helvetica Neue'), local('Arial'), local('Liberation Sans');
  font-weight: 400;
  size-adjust: 104.47%;
  ascent-override: 96.20%;
  descent-override: 23.93%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Mulish Fallback';
  src: local('Helvetica Neue'), local('Arial'), local('Liberation Sans');
  font-weight: 500;
  size-adjust: 105.36%;
  ascent-override: 95.39%;
  descent-override: 23.73%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Mulish Fallback';
  src: local('Helvetica Neue'), local('Arial'), local('Liberation Sans');
  font-weight: 600;
  size-adjust: 106.27%;
  ascent-override: 94.57%;
  descent-override: 23.53%;
  line-gap-override: 0%;
}

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

@font-face {
  font-family: 'Mulish';
  src: url('../assets/fonts/mulish-600.woff2') format('woff2');
  font-weight: 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;
}