/* ============================================
   PENNY'S ARK · DESIGN TOKENS
   Single source of truth for colors, type, spacing.
   Import into any page: <link rel="stylesheet" href="tokens.css">
   ============================================ */

:root {
  /* ---- PAPER / CREAM ---------------------- */
  --paper:      #f4ecd6;   /* primary background — warm cream */
  --paper-2:    #ecdfba;   /* slightly darker cream — section alternation */
  --paper-3:    #dfd0a8;   /* deepest cream — image fallback */
  --paper-w:    #fbf6e7;   /* near-white — light text on dark, button labels */
  --paper-green:#edf2e0;   /* off-white green: pillars section bg */

  /* ---- INK / TYPE ------------------------- */
  --ink:        #2a3326;   /* deep forest charcoal — primary body type */
  --ink-2:      #4a4a3d;   /* secondary text */
  --muted:      #7a7363;   /* muted captions, eyebrows */

  /* ---- LINES / DIVIDERS ------------------- */
  --line:       #c8b994;
  --line-soft:  #d8c9a4;

  /* ---- GREENS ----------------------------- */
  --green-d:    #1e3a2a;   /* deepest forest — dark sections, footer */
  --green:      #3c7950;   /* mid forest — primary brand */
  --green-l:    #5b9a63;   /* moss — accent */
  --green-ll:   #7eb78a;   /* sage / spring leaf — paws, decorations */
  --green-mist: #d2e8cf;   /* pale meadow tint (rare) */
  --green-deep: #067632;   /* logo vivid emerald */

  /* ---- BROWNS ----------------------------- */
  --brown:      #8a5a3b;   /* warm earth brown */
  --brown-d:    #6b4429;   /* roasted brown — accents */
  --brown-l:    #b28760;   /* tan — image borders */

  /* ---- YELLOWS / GOLD --------------------- */
  --gold:       #e4b25b;   /* warm honey gold — primary yellow */
  --gold-l:     #efcd86;   /* light gold */
  --gold-d:     #b9852f;   /* deep mustard gold — strong accents */
  --yellow:     #edca66;   /* bright sunshine yellow */
  --gold-bright:#fdb003;   /* logo bright gold */

  /* ---- ACCENT COLORS ---------------------- */
  --rust:       #b84a2a;   /* terracotta — secondary accent (rare) */
  --red:        #70161E;   /* wine red — urgency, latest rescue */
  --blue-d:     #011936;   /* navy — Tara story section, in-memoriam */
  --blue-l:     #82A3A1;   /* dusty teal — sanctuary pillar, education */

  /* ---- SECTION BACKGROUND TINTS ----------- */
  --leaf:       #a0bc5f;   /* leafy green — tertiary brand colour (replaces former blue-soft) */
  --yellow-soft:#f5e296;   /* (unused; replaced by --paper-2 / --gold) */
  --rose-soft:  #d8a4a0;   /* dusty rose (retired but kept) */

  /* ---- TYPOGRAPHY ------------------------- */
  --slab:        "Roboto Slab", "Roboto Slab Fallback", Georgia, serif;
  --serif-body:  "Lora", Georgia, serif;
  --serif-accent:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:        "Inter", system-ui, sans-serif;

  /* ---- LAYOUT ----------------------------- */
  --maxw:    1340px;
  --gutter:  clamp(20px, 4vw, 56px);

  /* ---- BORDER RADIUS ---------------------- */
  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-xl: 40px;

  /* ---- SHADOWS ---------------------------- */
  --shadow:      0 2px 14px rgba(42,51,38,0.06), 0 12px 40px rgba(42,51,38,0.08);
  --shadow-warm: 0 4px 18px rgba(107,68,41,0.10), 0 18px 50px rgba(107,68,41,0.10);
}

/* ============================================
   PALETTE THEMES (Tweaks panel sets these)
   ============================================ */
html[data-theme="brown"]  { --rust: var(--brown-d);  --rust-h: #4d3017; }
html[data-theme="moss"]   { --rust: var(--green-l);  --rust-h: #3e5a35; }