/* ==========================================================================
   tokens.css — the design brief, compiled. Crystal Peak Landscaping, Spokane
   WA: warm-craft / granite-moss / full-bleed-immersive ("the water finds
   level"). Every value is transcribed from the approved brief (§2, §3, §5,
   §8); nothing was chosen at build time. THIS FILE IS THE ONLY PLACE RAW
   VALUES LIVE (house-tech-spec §3). See README.md for the fuller derivation
   notes (font metrics, the coverage-gap finding, imagery).
   ========================================================================== */

:root {

  /* --- Colour (brief §3.1, §3.2) -------------------------------------------
     Step 1 (real-world brand colour) is EMPTY, recorded as such (no
     qualifying sighting, dossier §4.5). --color-moss is the vertical's
     semantic-anchor carrier, imagery/decorative only — never text, never a
     UI role. No dark band anywhere on this site, so no --color-focus-on-band
     is declared. */

  --scheme: light;

  --color-bg:          #F6F1E4;       /* parchment-ivory */
  --color-surface:     #ECE4D2;
  --color-ink:         #2B322C;       /* granite-moss — DOMINANT, hsl(129,10%,17%) */
  --color-ink-muted:   #6B6355;
  --color-accent:      #8A4B2E;       /* fir-bark, hsl(21,50%,36%) */
  --color-accent-ink:  #F6F1E4;

  --color-border:      #847C69;       /* 3.68:1 vs bg, 3.28:1 vs surface */
  --color-focus:       #8A4B2E;
  --color-selection-bg:  #8A4B2E;
  --color-selection-ink: #F6F1E4;

  /* Brief-specific, imagery/decorative ONLY (brief §3.2). */
  --color-moss:   #3E5C3F;   /* the anchor's carrier — grass tuft, rivulet cool cast */
  --color-water:  #4E6E68;   /* rivulet, decorative only */
  --color-atmo-1: #F6F1E4;   /* hero radial, lightest stop — = bg */
  --color-atmo-3: #ECE4D2;   /* hero radial, darkest stop — = surface */
  --color-atmo-veil-strong: rgba(246, 241, 228, 0.55);  /* = --color-atmo-1 (#F6F1E4) at 55% alpha */
  --color-atmo-veil-soft:   rgba(246, 241, 228, 0.22);  /* = --color-atmo-1 at 22% alpha */

  /* --- Typography (brief §2.9) --------------------------------------------- */

  --font-display:        'Spectral', 'Spectral Fallback', Georgia, 'Times New Roman', serif;
  --font-display-italic: 'Spectral Italic', 'Spectral Italic Fallback', 'Georgia Italic', Georgia, serif;
  --font-body:            'Karla', 'Karla Fallback', 'Helvetica Neue', Arial, sans-serif;

  --font-weight-body:         400;
  --font-weight-body-strong:  600;
  --font-weight-body-bold:    700;    /* .line b service labels only */
  --font-weight-display:      400;    /* Spectral has one static weight */

  /* Fluid scale, brief §2.10 — floor/ceiling bind exactly at 375/1440. */
  --text-display: clamp(2rem, 1.384rem + 2.629vw, 3.75rem);         /* 32 -> 60px */
  --text-h2:      clamp(1.375rem, 1.111rem + 1.127vw, 2.125rem);    /* 22 -> 34px */
  --text-lead:    clamp(1.0625rem, 0.9525rem + 0.4695vw, 1.375rem); /* 17 -> 22px */
  --text-body:    1rem;
  --text-eyebrow: 0.75rem;
  --text-micro:   0.6875rem;

  --leading-tight:   1.08;  /* h1 */
  --leading-snug:    1.20;  /* h2/h3, section heads */
  --leading-lead:    1.55;
  --leading-body:    1.62;
  --leading-eyebrow: 1.35;
  --leading-facts:   1.70;

  --tracking-wide: 0.16em;
  --tracking-tight: 0em;    /* house name, base.css; brief specifies no tightening */
  --tracking-normal: 0em;

  /* Header wordmark (brief §6): 14px <1024, redeclared 17px ≥1024 below. */
  --text-wordmark: 0.875rem;

  /* --- Space — the house scale (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;

  --section-gap: var(--space-xl);   /* 64px, every width (brief §5.4) */

  /* --- Layout ---------------------------------------------------------------
     --layout-gutter's clamp already resolves to exactly 20/32/48px at
     375/640/1024, holding 48px through 1440 (brief §5.3) — verified against
     the house default formula, not re-derived. */

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

  /* Content column caps at 640px from 1024 up (brief §5.3). */
  --hero-content-max: 40rem;

  /* Header: 56px content + 1px border (brief §6). Feeds the sticky offset
     (css/preview.css) and the fold arithmetic (brief §5.5). */
  --header-height: 56px;

  /* Off-scale hero gaps/control sizes (brief §5.3), <1024 values here,
     redeclared ≥1024 below. */
  --hero-h1-cta-gap: 1.125rem;  /* 18px */
  --hero-cta-height: 52px;

  /* On-scale hero gaps, aliased so site.css needs no media query for them. */
  --hero-content-pad-start: var(--space-md);  /* 24px <1024 / 64px >=1024 */
  --hero-eyebrow-h1-gap: var(--space-xs);     /* 12px <1024 / 24px >=1024 */

  /* The field's own geometry (brief §5.2) — independent of content height. */
  --hero-field-height: clamp(28.375rem, 24.722rem + 15.587vw, 38.75rem); /* 454 -> 620px */
  --hero-atmo-veil-height: 10.5rem;  /* 168px, fixed at every width — see derivation below */

  /* Satellite layer + contact-aside sizing — execution detail, not a
     brief-stated number. */
  --satellite-shimmer-width: clamp(3rem, 12vw, 6rem);
  --satellite-tuft-width: clamp(2rem, 6vw, 3rem);
  --satellite-tuft-height: clamp(2.5rem, 7vw, 3.75rem);
  --contact-aside-width: 20rem;

  /* --- Radius / shadow / border (brief §3.2) --------------------------------
     NO SHADOW ANYWHERE. --radius-md/lg/pill, --shadow-sm/md/lg keep house
     defaults with zero call sites — no cards on this site. */

  --radius-none: 0;
  --radius-sm:   2px;    /* the primary CTA only */
  --radius-md:   6px;    --radius-lg: 16px;    --radius-pill: 999px;

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

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

  /* --- Motion (brief §8) -----------------------------------------------------
     base.css's reveal engine reads --duration-slow/--ease-out by name
     (house file, never edited per site); aliased to the brief's own
     --duration-base/--ease-standard rather than forking a second number
     (yard-master-services-logan-ut precedent). */

  --duration-fast: 140ms;
  --duration-base: 320ms;    /* the scroll reveal */
  --duration-slow: var(--duration-base);

  --ease-standard: cubic-bezier(.2, .6, .2, 1);
  --ease-out:      var(--ease-standard);
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);   /* house default, unused */

  /* Reveal geometry (brief §8.1). */
  --reveal-shift: 0.75rem;   /* 12px */
  --reveal-stagger: 60ms;

  /* The signature move, carried forward from the C2-winning tile unchanged
     (brief §8.2). 7 and 11 share no common factor. */
  --loop-shimmer: 7s;
  --loop-tuft-sway: 11s;

  /* --- Z layers --------------------------------------------------------------- */
  --z-base: 0;  --z-field: 0;  --z-atmosphere: 1;  --z-content: 2;
  --z-header: 100;  --z-nav-panel: 200;  --z-skip-link: 300;
}

/* Breakpoint-varying tokens, redeclared at the house 64em breakpoint so no
   other file needs a media-conditioned literal (base.css's own pattern). */
@media (min-width: 64em) {
  :root {
    --text-wordmark: 1.0625rem;                 /* 17px */
    --hero-h1-cta-gap: var(--space-md);         /* 24px */
    --hero-cta-height: 56px;
    --hero-content-pad-start: var(--space-xl);  /* 64px */
    --hero-eyebrow-h1-gap: var(--space-md);     /* 24px */
  }
}

/* --------------------------------------------------------------------------
   @font-face — self-hosted woff2, subset to house-tech-spec §8's declared
   safe range, declared identically on all three faces (brief §2.5). Two
   static single-weight Spectral faces + one variable Karla face (400-700).

   COVERAGE-GAP FINDING (brief §2.5, full detail in README.md): U+2010/11/12/
   2015 absent from all three faces alike (consistent, not a mid-sentence
   split). SEPARATELY, Karla lacks U+2032/U+2033 which BOTH Spectral faces
   carry — a genuine cross-face mismatch, house-tech-spec §8's FIX case,
   flagged rather than silently narrowed. Nothing in this site's copy
   renders either character today. -------------------------------------- */

@font-face {
  font-family: 'Spectral';
  src: url('../assets/fonts/spectral-roman-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: 'Spectral Italic';
  src: url('../assets/fonts/spectral-italic-400.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;
}

@font-face {
  font-family: 'Karla';
  src: url('../assets/fonts/karla-variable.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 (brief §2.4, house-tech-spec §8) — local() only,
   zero download bytes. The four overrides are MEASURED (scripts/font-
   metrics.mjs, fontTools) against the real shipped faces. Georgia/Helvetica
   Neue are not installable on this Linux build host, so the MEASUREMENT
   donor (never the shipped src, which still names the brief's own local()
   faces) is the nearest open metric twin: Gelasio for both Spectral
   fallbacks, Liberation Sans for Karla's. Full method in README.md. */

@font-face {
  font-family: 'Spectral Fallback';
  src: local('Georgia');
  font-weight: 400;
  font-style: normal;
  size-adjust: 100.44%;
  ascent-override: 105.44%;
  descent-override: 46.10%;
  line-gap-override: 0%;
}

@font-face {
  font-family: 'Spectral Italic Fallback';
  src: local('Georgia Italic');
  font-weight: 400;
  font-style: italic;
  size-adjust: 89.97%;
  ascent-override: 117.71%;
  descent-override: 51.46%;
  line-gap-override: 0%;
}

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