/* ============================================================
   tokens.css — MODERNIZED THEME
   Refined palette, contemporary typography, softer geometry.
   Variable names preserved so all components/sections still work.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {

  /* ── BACKGROUNDS ───────────────────────────────────────── */
  --cream:            #f6f4ef;   /* warm off-white page bg     */
  --parchment:        #ecebe5;   /* alt section bg             */
  --linen:            #f6f4ef;
  --linen-warm:       #ecebe5;

  /* ── TEXT ──────────────────────────────────────────────── */
  --ink:              #14110f;
  --ink-mid:          rgba(20,17,15,0.70);
  --ink-soft:         rgba(20,17,15,0.45);

  /* ── PRIMARY ACCENT — modern terracotta / clay ─────────── */
  --burgundy:         #c5523a;
  --burgundy-deep:    #14110f;   /* near-black for dark sections */
  --gold:             #c9a36a;   /* warm brass                  */
  --gold-soft:        #e6d2a8;

  /* Aliases (same set, modernized values) */
  --terra:            #c5523a;
  --terra-deep:       #14110f;
  --terra-light:      #e07a5f;
  --sand:             #c9a36a;
  --sand-soft:        #e6d2a8;

  /* ── SECONDARY ACCENT — deep navy / teal ───────────────── */
  --slate:            #15233b;
  --slate-deep:       #0a1322;
  --sky:              #5eead4;   /* fresh teal pop              */
  --steel:            #3b556e;

  /* Aliases */
  --plum:             #15233b;
  --plum-deep:        #0a1322;
  --plum-mid:         #3b556e;
  --plum-light:       #5eead4;
  --lavender:         #c5f1e5;

  /* ── DARK & NEUTRALS ───────────────────────────────────── */
  --charcoal:         #18181b;
  --white:            #ffffff;
  --black:            #000000;
  --stone:            #ecebe5;
  --graphite:         #52606d;
  --forest:           #2d4a3e;

  /* ── TYPOGRAPHY ────────────────────────────────────────── */
  --font-display: 'Fraunces', 'Times New Roman', serif;
  --font-serif:   'Fraunces', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'Space Grotesk', 'Inter', sans-serif;

  /* ── SPACING ───────────────────────────────────────────── */
  --space-xs:   0.5rem;
  --space-sm:   1rem;
  --space-md:   2rem;
  --space-lg:   4rem;
  --space-xl:   6rem;
  --space-2xl:  8rem;

  /* ── RADIUS — softer modern curves ─────────────────────── */
  --radius-sm:  6px;
  --radius-md:  14px;
  --radius-lg:  24px;

  /* ── SHADOWS — crisper, more contemporary ──────────────── */
  --shadow-sm:    0 1px 2px rgba(20,17,15,0.04), 0 4px 16px -6px rgba(20,17,15,0.08);
  --shadow-md:    0 4px 12px -2px rgba(20,17,15,0.08), 0 16px 40px -12px rgba(20,17,15,0.18);
  --shadow-lg:    0 12px 32px -8px rgba(20,17,15,0.18), 0 32px 80px -20px rgba(20,17,15,0.28);
  --shadow-terra: 0 12px 40px -10px rgba(197,82,58,0.40);
  --shadow-plum:  0 12px 40px -10px rgba(21,35,59,0.45);
  --shadow-gold:  0 12px 40px -10px rgba(201,163,106,0.35);

  /* ── TRANSITIONS ───────────────────────────────────────── */
  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast:   0.18s;
  --t-mid:    0.35s;
  --t-slow:   0.6s;

  /* ── Z-INDEX ───────────────────────────────────────────── */
  --z-base:     1;
  --z-card:     10;
  --z-nav:      100;
  --z-dropdown: 150;
  --z-modal:    200;
}