/* ==========================================================================
   Design tokens — shared by every stylesheet. Change the look from here.
   ========================================================================== */
:root {
  /* Palette */
  --c-ink: #0f1f17;          /* near-black forest, darkest surface */
  --c-forest: #163a29;       /* primary dark surface */
  --c-forest-2: #1f4a35;     /* raised dark surface */
  --c-moss: #3c6b4c;         /* mid green */
  --c-sage: #9bb79a;         /* soft green */
  --c-mint: #dfe9d6;         /* pale green tint */
  --c-lime: #d6ec6b;         /* signature accent (CTAs, highlights) */
  --c-lime-2: #c3dd4c;       /* accent hover */
  --c-cream: #f4efe4;        /* primary light surface */
  --c-paper: #faf7f0;        /* raised light surface (cards) */
  --c-sand: #e7dcc6;         /* warm neutral */
  --c-clay: #c46b43;         /* secondary accent, used sparingly */
  --c-lavender: #9c8fd0;     /* illustration accent */
  --c-white: #ffffff;

  /* Semantic text + lines */
  --c-text: #14261c;
  --c-text-muted: #4d5f53;
  --c-line: rgba(20, 38, 28, 0.12);
  --c-on-dark: #eef3e6;
  --c-on-dark-muted: rgba(238, 243, 230, 0.66);
  --c-line-dark: rgba(238, 243, 230, 0.14);
  --c-error: #b9412b;
  --c-success: #3c8a55;

  /* Type */
  --f-display: "Fraunces", Georgia, "Times New Roman", serif;
  --f-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-hero: clamp(3rem, 8.2vw, 8.25rem);
  --fs-h2: clamp(2.2rem, 5vw, 4.6rem);
  --fs-h3: clamp(1.3rem, 2.1vw, 1.85rem);
  --fs-lead: clamp(1.05rem, 1.35vw, 1.28rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-micro: 0.75rem;
  --lh-tight: 1.02;
  --lh-snug: 1.2;
  --lh-body: 1.6;

  /* Spacing scale */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --s-10: 128px;
  --section-pad: clamp(72px, 11vw, 160px);

  /* Shape */
  --radius-s: 10px;
  --radius-m: 18px;
  --radius-l: 28px;
  --radius-xl: 40px;
  --radius-pill: 999px;

  /* Depth */
  --shadow-s: 0 1px 2px rgba(15, 31, 23, 0.06), 0 2px 8px rgba(15, 31, 23, 0.05);
  --shadow-m: 0 6px 18px rgba(15, 31, 23, 0.08), 0 2px 6px rgba(15, 31, 23, 0.05);
  --shadow-l: 0 24px 60px rgba(15, 31, 23, 0.16), 0 8px 20px rgba(15, 31, 23, 0.08);
  --ring: 0 0 0 3px rgba(214, 236, 107, 0.9);
  --ring-dark: 0 0 0 3px rgba(22, 58, 41, 0.9);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 0.2s;
  --dur: 0.45s;
  --dur-slow: 0.9s;

  /* Layout */
  --container: 1280px;
  --gutter: clamp(16px, 4vw, 48px);
  --header-h: 76px;

  /* Layers */
  --z-base: 1;
  --z-sticky: 20;
  --z-header: 50;
  --z-overlay: 80;
  --z-intro: 100;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0.01s;
    --dur: 0.01s;
    --dur-slow: 0.01s;
  }
}