/* ═══════════════════════════════════════════════════════
   css/01-tokens.css
   DESIGN TOKENS — Edit here to retheme the entire site.
   All colours, typography, spacing and motion in one place.
═══════════════════════════════════════════════════════ */

/* ── DARK THEME (default) ── */
:root {
  /* Backgrounds */
  --bg:            #080808;
  --bg-nav:        rgba(8,8,8,0.88);
  --bg-surface:    rgba(255,255,255,0.022);
  --bg-surface2:   rgba(201,168,76,0.04);
  --bg-card:       rgba(255,255,255,0.02);
  --bg-card-hover: rgba(201,168,76,0.055);
  --bg-btn:        rgba(0,0,0,0.55);

  /* Text */
  --text-primary:  #f2ece0;
  --text-dim:      rgba(242,236,224,0.6);
  --text-mute:     rgba(242,236,224,0.38);
  --text-muted:    #686868;

  /* Gold accent */
  --gold:          #c9a84c;
  --gold-pale:     #e8d5a3;
  --gold-glow:     rgba(201,168,76,0.16);
  --gold-border:   rgba(201,168,76,0.22);
  --gold-border2:  rgba(201,168,76,0.48);

  /* Borders */
  --border-nav:    rgba(201,168,76,0.1);
  --border-card:   rgba(201,168,76,0.13);
  --border-rule:   rgba(201,168,76,0.22);

  /* Typography */
  --font-display: 'Cinzel', serif;
  --font-body:    'Cormorant Garamond', serif;
  --font-arabic:  'Noto Naskh Arabic', serif;

  /* Motion */
  --ease:      0.35s ease;
  --ease-slow: 0.88s ease;

  /* Geo grid */
  --geo-opacity: 0.045;
  --geo-color:   rgba(201,168,76,1);
}

/* ── LIGHT THEME ──
   Redesigned: aged-parchment base, deep ink text,
   gold darkened for contrast. Passes WCAG AA throughout.
── */
body.light {
  --bg:            #faf6ee;
  --bg-nav:        rgba(250,246,238,0.95);
  --bg-surface:    rgba(0,0,0,0.03);
  --bg-surface2:   rgba(110,72,16,0.06);
  --bg-card:       rgba(255,252,244,0.85);
  --bg-card-hover: rgba(110,72,16,0.05);
  --bg-btn:        rgba(250,246,238,0.92);

  /* Deep ink — maximum legibility on warm parchment */
  --text-primary:  #1c1407;
  --text-dim:      #3a2a0e;
  --text-mute:     #6b5228;
  --text-muted:    #917a52;

  /* Gold darkened for light background */
  --gold:          #7a5010;
  --gold-pale:     #4e3308;
  --gold-glow:     rgba(110,72,16,0.1);
  --gold-border:   rgba(110,72,16,0.28);
  --gold-border2:  rgba(110,72,16,0.52);

  --border-nav:    rgba(110,72,16,0.14);
  --border-card:   rgba(110,72,16,0.14);
  --border-rule:   rgba(110,72,16,0.24);

  --geo-opacity: 0.03;
  --geo-color:   rgba(110,72,16,1);
}