:root {
  /* ── Colors ── */
  --bg:           #0A0A0A;
  --bg-card:      #111111;
  --bg-elevated:  #161616;
  --bg-subtle:    #0E0E0E;

  --gold:         #C8A84B;
  --gold-light:   #E8C96A;
  --gold-dark:    #8B6914;
  --gold-glow:    rgba(200, 168, 75, 0.18);
  --gold-glow-sm: rgba(200, 168, 75, 0.08);
  --gold-border:  rgba(200, 168, 75, 0.25);
  --gold-border-h:rgba(200, 168, 75, 0.6);

  --text:         #F5F5F0;
  --text-muted:   #888888;
  --text-dim:     #444444;

  /* ── Typography ── */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-accent:  'Bebas Neue', 'Arial Narrow', sans-serif;

  /* ── Spacing ── */
  --section-py:   110px;
  --container-max:1280px;
  --container-px: clamp(20px, 4vw, 60px);

  /* ── Border Radius ── */
  --radius-sm:    6px;
  --radius:       12px;
  --radius-lg:    20px;
  --radius-xl:    32px;

  /* ── Transitions ── */
  --ease:         cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out:     cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --t:            0.3s var(--ease);
  --t-fast:       0.15s var(--ease);
  --t-slow:       0.6s var(--ease);

  /* ── Shadows ── */
  --shadow-sm:    0 2px 12px rgba(0,0,0,0.4);
  --shadow-card:  0 8px 32px rgba(0,0,0,0.5);
  --shadow-gold:  0 0 40px rgba(200,168,75,0.12);
  --shadow-hover: 0 24px 60px rgba(0,0,0,0.7), 0 0 30px rgba(200,168,75,0.15);

  /* ── Z-index ── */
  --z-nav:        1000;
  --z-loader:     9999;
  --z-overlay:    100;
}