/* Hallmark · tokens · Belcher Lawnscapes
 * theme: custom · vibe: "golden-hour water, high-desert dusk, engineered"
 * Every colour below was sampled from the client's own footage (assets/video/hero-film.mp4)
 * and converted to OKLCH — the palette is literally the film's own light.
 *   footage shadow  #181204 → oklch(18.5% 0.029 88)   → paper family
 *   footage sun     #ef9f65 → oklch(77.0% 0.121 56)   → accent family
 *   footage sky     #4d3941 → oklch(37.0% 0.031 353)  → ember (secondary bloom)
 * axes: dark / classical-serif / chromatic-amber (~58°)
 */

:root {
  /* ── Paper (dark, tinted toward the anchor hue) ───────────────────────── */
  --color-paper:        oklch(13.0% 0.014 62);
  --color-paper-2:      oklch(16.5% 0.016 60);
  --color-paper-3:      oklch(21.0% 0.018 58);
  --color-paper-sunk:   oklch(10.0% 0.012 62);

  /* ── Ink ──────────────────────────────────────────────────────────────── */
  --color-ink:          oklch(94.0% 0.012 70);
  --color-ink-2:        oklch(80.0% 0.013 68);
  --color-muted:        oklch(64.0% 0.015 64);
  /* NOT a text colour — 2.8:1 on paper. Shading, borders, and canvas work
     only. Anything readable uses --color-muted or lighter. */
  --color-neutral:      oklch(46.0% 0.014 60);

  /* ── Rules ────────────────────────────────────────────────────────────── */
  --color-rule:         oklch(30.0% 0.016 58);
  --color-rule-2:       oklch(23.0% 0.014 58);

  /* ── Accent — the sun off the spray ───────────────────────────────────── */
  --color-accent:       oklch(78.0% 0.150 62);
  --color-accent-dim:   oklch(64.0% 0.130 54);
  --color-accent-ink:   oklch(15.0% 0.022 58);
  --color-focus:        oklch(84.0% 0.185 66);

  /* ── Ember — the dusk sky. Blooms, alarm states, and error text. ──────── */
  --color-ember:        oklch(52.0% 0.095 8);
  --color-ember-dim:    oklch(37.0% 0.055 5);
  /* --color-ember reads 3.3:1 on paper-2 — fine for a large alarm word, not
     for an error sentence. This is the text-grade variant (verified ≥4.5:1). */
  --color-ember-text:   oklch(74.0% 0.115 14);

  /* ── Semantic state — used ONLY inside the freeze simulation canvas.
   *    Not page chrome; this is data-visualisation vocabulary (like error-red). */
  --color-state-freeze: oklch(78.0% 0.095 232);
  --color-state-freeze-deep: oklch(56.0% 0.105 245);

  /* ── Type ─────────────────────────────────────────────────────────────── */
  --font-display: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --font-body:    "Manrope", "Avenir Next", "Segoe UI", sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  --text-2xs:  0.6875rem;
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.3125rem;
  --text-2xl:  1.625rem;
  --text-3xl:  2.125rem;
  --text-4xl:  2.75rem;
  --text-display-s:  clamp(2.25rem, 1.4rem + 3.6vw, 4rem);
  --text-display:    clamp(2.75rem, 1.2rem + 6.6vw, 6.5rem);
  --text-display-xl: clamp(3.25rem, 0.9rem + 9.4vw, 9rem);

  --leading-tight: 0.94;
  --leading-snug:  1.12;
  --leading-body:  1.62;
  --tracking-tight: -0.022em;
  --tracking-wide:  0.14em;

  /* ── Space — 4pt scale ────────────────────────────────────────────────── */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;
  --space-4xl: 8rem;
  --space-5xl: 12rem;

  /* ── Motion ───────────────────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.16, 1, 0.30, 1);
  --ease-in:     cubic-bezier(0.70, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short: 140ms;
  --dur-mid:   260ms;
  --dur-long:  440ms;

  /* ── Shape ────────────────────────────────────────────────────────────── */
  --radius-xs:  2px;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-pill: 999px;
  --rule-hair:  1px;
  --rule-thick: 3px;

  /* ── Elevation (z) ────────────────────────────────────────────────────── */
  --z-base:    0;
  --z-raised:  10;
  --z-sticky:  20;
  --z-nav:     30;
  --z-overlay: 40;
  --z-modal:   50;

  /* ── Measure ──────────────────────────────────────────────────────────── */
  --measure:       66ch;
  --measure-tight: 46ch;
  --shell:         78rem;
  --shell-wide:    92rem;
}
