/* ============================================================
   Derby Fish & Game Club — North Woods Theme Tokens
   Palette sampled directly from the club patch + pond sign.
   Drop this into your Astro project (e.g. src/styles/tokens.css)
   and reference the var(--*) names anywhere.
   ============================================================ */

:root {
  /* --- Forest greens -------------------------------------------------
     spruce-* sampled from the pond sign; pine-* from the patch field. */
  --spruce-deep: #112a22;   /* near-black green — hero overlays, footer */
  --spruce:      #173a2d;   /* deep weathered green — dark sections     */
  --pine:        #234f2e;   /* the patch's kelly field — primary green  */
  --pine-600:    #2c6238;   /* hover / lift                             */
  --pine-500:    #387346;   /* bright accent green                      */
  --moss:        #71803f;   /* earthy olive — supporting / tags         */

  /* --- Brass & gold (patch rim + artwork) --------------------------- */
  --brass-deep:  #876819;   /* deep brass — borders, pressed            */
  --brass:       #b8902a;   /* primary metallic accent                  */
  --gold:        #d8b13f;   /* bright gold — highlights, the seal rim   */
  --gold-light:  #ecd488;   /* glints                                   */

  /* --- Birch & cream (sign lettering / artwork) --------------------- */
  --birch:       #f1ead7;   /* cream surface / text on dark             */
  --cream:       #f6f0e1;   /* warm paper highlight                     */

  /* --- Lake & water (north woods, for forest+lake breadth) ---------- */
  --lake-deep:   #1f4d5d;
  --lake:        #2f6b82;
  --lake-mist:   #9ec3cc;

  /* --- Bark & earth ------------------------------------------------- */
  --bark:        #4a3826;
  --bark-light:  #715539;

  /* --- Neutrals (warm) --------------------------------------------- */
  --paper:   #f4efe3;   /* page background — warm birch-bark             */
  --paper-2: #ebe2d0;   /* alternating section                          */
  --ink:     #232618;   /* body text — warm near-black                  */
  --ink-2:   #4d503f;   /* muted / secondary text                       */
  --line:    #d8ceb6;   /* hairline borders                             */

  /* --- Semantic ----------------------------------------------------- */
  --bg:        var(--paper);
  --surface:   #fffdf6;
  --text:      var(--ink);
  --text-mute: var(--ink-2);
  --accent:    var(--brass);
  --accent-fg: var(--spruce-deep);
  --on-dark:   var(--birch);

  /* --- Type --------------------------------------------------------- */
  --font-display: "Oswald", "Arial Narrow", sans-serif;       /* signage headings */
  --font-slab:    "Bitter", Georgia, serif;                   /* carved eyebrows/quotes */
  --font-body:    "Source Sans 3", "Segoe UI", sans-serif;    /* body / UI */

  --t-eyebrow: 0.78rem;
  --t-sm:   0.95rem;
  --t-base: 1.075rem;
  --t-md:   1.25rem;
  --t-lg:   1.6rem;
  --t-xl:   2.1rem;
  --t-2xl:  2.9rem;
  --t-3xl:  3.9rem;
  --t-4xl:  5.2rem;

  --lh-tight: 1.05;
  --lh-snug:  1.25;
  --lh-body:  1.62;

  /* --- Spacing rhythm ---------------------------------------------- */
  --s-1: 0.4rem;
  --s-2: 0.7rem;
  --s-3: 1rem;
  --s-4: 1.5rem;
  --s-5: 2.25rem;
  --s-6: 3.25rem;
  --s-7: 5rem;
  --s-8: 7rem;

  /* --- Radii (small/rugged) ---------------------------------------- */
  --r-xs:   3px;
  --r-sm:   5px;
  --r-md:   9px;
  --r-lg:   16px;
  --r-pill: 999px;

  /* --- Borders & shadows (restrained, warm-tinted) ----------------- */
  --border:        1px solid var(--line);
  --border-strong: 1.5px solid var(--brass-deep);
  --shadow-sm: 0 1px 2px rgba(17, 42, 34, .08);
  --shadow-md: 0 6px 18px -8px rgba(17, 42, 34, .28);
  --shadow-lg: 0 22px 48px -20px rgba(17, 42, 34, .45);

  /* --- Motion ------------------------------------------------------- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur:  .26s;
}