:root {
  /* ===== COLOR — Earth / Energy from Earth ===== */
  --clay-900: #3A2A1E;      /* deepest bark */
  --clay-800: #4A3527;
  --clay-700: #6B4A34;
  --clay-600: #8B4F32;      /* terracotta dark — hover states */
  --terracotta-500: #B36A45;
  --terracotta-400: #C4835F;
  --sand-300: #D9BFA0;
  --sand-200: #E8DCC8;
  --sand-100: #F1E8D8;
  --cream-50: #F8F3E9;
  --cream-0: #FDFBF6;

  --moss-600: #5B6144;      /* secondary accent — grounding green */
  --moss-500: #74795A;
  --ochre-500: #C9A15A;     /* accent — CTAs, highlights, gold */
  --ochre-600: #A9813F;

  --ink: #241A12;           /* near-black, warm */
  --ink-soft: #4A3F35;
  --line: rgba(58, 42, 30, 0.14);
  --line-strong: rgba(58, 42, 30, 0.28);

  --white: #FFFFFF;

  /* ===== Semantic — DARK EARTH =====
     The site's only identity: deep soil brown, candlelit amber accents. */
  --bg-page: #150F0A;
  --bg-surface: #211810;
  --bg-surface-alt: #1B140D;
  --bg-inset: #2C2116;
  --bg-inverse: #0C0805;
  --tag-bg: #2C2116;
  --tag-text: #E0CFB6;
  --nav-bg: rgba(21, 15, 10, 0.82);
  --text-primary: #F5ECDD;
  --text-secondary: #CBB699;
  --text-inverse: #F5ECDD;
  --text-muted: #9C876C;
  --border-default: rgba(245, 236, 221, 0.10);
  --border-strong: rgba(245, 236, 221, 0.22);
  --accent-primary: #D98F5F;
  --accent-gold: #E3BE7C;
  --accent-moss: #9AA47D;
  --overlay: rgba(8, 5, 3, 0.72);
  --shadow-color: 0, 0, 0;

  /* ===== TYPOGRAPHY =====
     Brand face: Neue Haas Grotesk (licensed — Text for body, Display for headings).
     Fallback stack loads a free geometric-grotesk (General Sans) so the
     system renders correctly before the licensed webfont is installed. */
  --font-display: 'Neue Haas Grotesk Display', 'General Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-text: 'Neue Haas Grotesk Text', 'General Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --fs-h1: clamp(2.6rem, 5vw + 1rem, 5.2rem);
  --fs-h2: clamp(2rem, 3vw + 1rem, 3.4rem);
  --fs-h3: clamp(1.4rem, 1.4vw + 1rem, 2rem);
  --fs-h4: 1.25rem;
  --fs-body-lg: 1.15rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-micro: 0.75rem;

  --lh-tight: 1.08;
  --lh-heading: 1.2;
  --lh-body: 1.6;

  --tracking-tight: -0.02em;
  --tracking-wide: 0.08em;
  --tracking-wider: 0.16em;

  /* ===== SPACING (8pt-derived earth rhythm) ===== */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 28px;
  --radius-full: 999px;

  --shadow-sm: 0 2px 10px rgba(var(--shadow-color), 0.28);
  --shadow-md: 0 10px 28px rgba(var(--shadow-color), 0.38);
  --shadow-lg: 0 24px 56px rgba(var(--shadow-color), 0.48);

  --ease-organic: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur-base: 280ms;
  --dur-slow: 520ms;

  --container-max: 1240px;
}