:root {
  /* ── WROHT — Logo-derived Palette ──────────────────────────────────── */
  /*
   * Extracted directly from the Wroht logo JPEG:
   *   Logo background:  #F5EDE0  warm ivory cream  ← nav bg matches this
   *   Wordmark text:    #2D1A0C  deep chocolate brown
   *   Flower petals:    #E07828  warm orange
   *   Leaves:           #5A8A3C  herb green
   *   Flower centre:    #F0C030  golden amber
   */

  /* ── Page backgrounds ── */
  --bg:  #F5EDE0;   /* logo ivory — used for nav + page bg */
  --bg1: #FDFAF7;   /* near-white warm surface (modals, cards) */
  --bg2: #EDE0CC;   /* slightly deeper warm parchment */
  --bg3: #DDD0B8;   /* aged edge / dividers */

  /* ── Text ── */
  --ink:  #2D1A0C;  /* deep chocolate (logo wordmark) */
  --ink2: #5C3820;  /* mid warm brown */
  --ink3: #9A7A62;  /* warm taupe */

  /* ── Brand accents (all from logo) ── */
  --orange:       #E07828;   /* logo flower — warm orange */
  --orange-dark:  #B85E18;   /* pressed / hover */
  --orange-pale:  #FAE8D0;   /* tint background */
  --green:        #5A8A3C;   /* logo leaf */
  --green-dark:   #3D6228;
  --green-pale:   #D8EBCC;
  --gold:         #F0C030;   /* flower centre */
  --brown:        #2D1A0C;   /* = --ink */
  --brown-mid:    #6B3E26;   /* warm mid-brown */

  /* ── Semantic aliases (keeps all existing CSS working without edits) ── */
  --forest:       #5A8A3C;
  --moss:         #6EA048;
  --amber:        #E07828;
  --terracotta:   #B85E18;
  --sage:         #7AA862;
  --burgundy:     #6B3E26;
  --antique-gold: #F0C030;
  --slate:        #5C3820;
  --purple:       #5A8A3C;   /* primary action → leaf green */
  --coral:        #E07828;
  --teal:         #5A8A3C;
  --cyan:         #6EA048;
  --yellow:       #F0C030;

  --cream:  #F5EDE0;
  --cream2: #EDE0CC;
  --cream3: #DDD0B8;

  --green2: #3D6228;
  --green3: #D8EBCC;
  --sienna:  #5A8A3C;
  --sienna2: #6EA048;
  --sienna3: #D8EBCC;
  --gold2: #E07828;
  --gold3: #FAE8D0;

  /* ── Primary action color — deep chocolate ── */
  --primary:      #2D1A0C;   /* used for CTAs, eyebrows, stat values */
  --accent:       #E07828;   /* orange — used for links, sparks */
  --accent-dark:  #B85E18;

  /* ── Primary button — deep chocolate, cream text ──
   * #2D1A0C vs #F5EDE0 ≈ 17:1 contrast  ✓ WCAG AAA
   * hover darkens slightly; focus ring uses orange
   */
  --btn-gradient: #2D1A0C;

  /* ── Decorative gradient (hero / pills) ── */
  --gradient: linear-gradient(90deg, #5A8A3C, #E07828, #F0C030, #B85E18, #2D1A0C);

  /* ── Shape ── */
  --r:    6px;
  --r-lg: 10px;
  --r-xl: 16px;

  /* ── Shadows — warm brown-tinted ── */
  --shadow:    0 2px 12px rgba(45, 26, 12, 0.10);
  --shadow-md: 0 6px 28px rgba(45, 26, 12, 0.18);

  /* ── Typography ── */
  --font-display: 'Playfair Display', 'DM Serif Display', Georgia, serif;
  --font-body:    'Lora', Georgia, serif;
  --font-ui:      'DM Sans', system-ui, sans-serif;
}