/* ==========================================================================
   K9 Mold Scouts LLC — Brand design tokens
   Edited by the Kura Design tab. Keep this file to brand tokens only.
   ========================================================================== */
:root{
  /* ---- Brand palette (pulled from the logo) ---- */
  --color-forest:#17381d;       /* deep pine — headings, nav, dark UI */
  --color-forest-deep:#0e2614;  /* near-black green — footer, dark bands */
  --color-leaf:#5f9e39;         /* leafy accent — buttons, links, active */
  --color-leaf-ink:#4a7d2c;     /* darker leaf — hovers, small type on light */
  --color-leaf-bright:#8fc63f;  /* lime pop — small accents, scent motif */
  --color-tan:#c2915f;          /* German-Shepherd warm tan — sparing accent */
  --color-cream:#f4f6ef;        /* warm green-tinted off-white — page ground */
  --color-sage:#e7ece0;         /* soft sage — subtle fills */
  --color-sage-line:#d6ddca;    /* sage border line */
  --color-ink:#1b241b;          /* warm near-black — body text */
  --color-muted:#56634f;        /* green-gray — secondary text */
  --color-white:#ffffff;

  /* ---- Semantic roles (reference these in components) ---- */
  --color-primary:var(--color-leaf);
  --color-primary-ink:var(--color-leaf-ink);
  --color-accent:var(--color-leaf-bright);
  --color-bg:var(--color-cream);
  --color-surface:var(--color-white);
  --color-heading:var(--color-forest);
  --color-text:var(--color-ink);
  --color-text-muted:var(--color-muted);
  --color-border:var(--color-sage-line);
  --color-dark:var(--color-forest);
  --color-dark-deep:var(--color-forest-deep);

  /* ---- Typography ---- */
  --font-display:"Montserrat","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --font-body:"Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --text-base:17px;

  /* ---- Radii ---- */
  --radius-sm:10px;
  --radius:16px;
  --radius-lg:24px;
  --radius-xl:34px;

  /* ---- Shadows ---- */
  --shadow:0 1px 2px rgba(14,38,20,.04),0 12px 28px -14px rgba(14,38,20,.22);
  --shadow-lg:0 2px 4px rgba(14,38,20,.05),0 30px 60px -24px rgba(14,38,20,.30);

  /* ---- Layout ---- */
  --maxw:1200px;
}