/* ============================================================
   THRIFTRUPEE — Design Tokens
   Single source of truth. All values defined here.
   ============================================================ */

:root {
  /* ── Brand greens ── */
  --tr-ink:        #0a2e1a;   /* deepest forest — headings, hero bg */
  --tr-forest:     #0f4a28;   /* dark section backgrounds */
  --tr-pine:       #155c32;   /* nav hover, card borders */
  --tr-emerald:    #1a7a3e;   /* primary CTA bg */
  --tr-green:      #22a554;   /* interactive green */
  --tr-mint:       #34d47a;   /* accent, hover states */
  --tr-lime:       #6eefaa;   /* highlight text on dark */
  --tr-pale:       #e8f8ee;   /* light green tint */

  /* ── Neutrals ── */
  --tr-cream:      #faf7f2;   /* warm page background */
  --tr-warm:       #f4f0e8;   /* card backgrounds */
  --tr-sand:       #e8e1d4;   /* borders on light */
  --tr-stone:      #c4b8a6;   /* muted borders */
  --tr-muted:      #6b7280;   /* secondary text */
  --tr-body:       #374151;   /* body text */
  --tr-heading:    #111827;   /* dark headings */
  --tr-white:      #ffffff;

  /* ── Accent / status ── */
  --tr-gold:       #d4a017;   /* star ratings, badges */
  --tr-red:        #dc2626;   /* errors, warnings */
  --tr-blue:       #2563eb;   /* info links */

  /* ── Typography ── */
  --font-display:  'DM Serif Display', Georgia, serif;
  --font-body:     'Plus Jakarta Sans', -apple-system, sans-serif;
  --font-ui:       'Plus Jakarta Sans', -apple-system, sans-serif;
  --font-mono:     'JetBrains Mono', 'Fira Code', monospace;

  /* ── Spacing scale ── */
  --sp-1:   4px;
  --sp-2:   8px;
  --sp-3:   12px;
  --sp-4:   16px;
  --sp-5:   20px;
  --sp-6:   24px;
  --sp-8:   32px;
  --sp-10:  40px;
  --sp-12:  48px;
  --sp-16:  64px;
  --sp-20:  80px;
  --sp-24:  96px;

  /* ── Layout ── */
  --container:     1200px;
  --container-sm:  860px;
  --radius-sm:     8px;
  --radius:        12px;
  --radius-lg:     16px;
  --radius-xl:     24px;
  --radius-pill:   999px;

  /* ── Shadows ── */
  --shadow-sm:   0 1px 4px rgba(10,46,26,0.06);
  --shadow:      0 4px 20px rgba(10,46,26,0.10);
  --shadow-md:   0 8px 32px rgba(10,46,26,0.14);
  --shadow-lg:   0 16px 56px rgba(10,46,26,0.18);
  --shadow-card: 0 2px 12px rgba(0,0,0,0.07);

  /* ── Transitions ── */
  --ease:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --dur-fast:    150ms;
  --dur:         250ms;
  --dur-slow:    400ms;

  /* ── Z-index layers ── */
  --z-below:     -1;
  --z-base:      1;
  --z-raised:    10;
  --z-nav:       100;
  --z-overlay:   200;
  --z-modal:     300;
}
