:root {
  /* ── Background layers ── */
  --bg-deep:           #0E0D09;
  --bg-primary:        #1C1B13;
  --bg-elevated:       #252418;

  /* ── Glass surfaces ── */
  --surface-glass:       rgba(255, 255, 255, 0.06);
  --surface-glass-hover: rgba(255, 255, 255, 0.10);
  --surface-glass-strong: rgba(255, 255, 255, 0.12);
  --border-glass:        rgba(255, 255, 255, 0.12);
  --border-glass-strong: rgba(255, 255, 255, 0.20);

  /* ── Brand accent: gold (from 3D metallic logo) ── */
  --accent-gold:       #C9A66B;
  --accent-gold-light: #E4C48A;
  --accent-gold-dark:  #A07A3E;
  --shadow-gold:       rgba(201, 166, 107, 0.20);
  --glow-gold:         rgba(201, 166, 107, 0.35);

  /* ── Brand accent: silver (from chrome logo) ── */
  --accent-silver:     #9BA8B5;
  --accent-silver-light: #C0C8D4;
  --shadow-silver:     rgba(155, 168, 181, 0.15);

  /* ── Text ── */
  --text-primary:      #F5F3EE;
  --text-muted:        #9A9589;
  --text-gold:         #C9A66B;
  --text-silver:       #9BA8B5;

  /* ── Semantic / status ── */
  --color-success:     #4CAF50;
  --color-error:       #EF4444;

  /* ── Typography ── */
  --font-display:      'Playfair Display', Georgia, serif;
  --font-body:         'Inter', system-ui, sans-serif;
  --font-script:       'Great Vibes', cursive;

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

  /* ── Border radius ── */
  --radius-sm:   8px;
  --radius-md:   16px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-card:    0 8px 32px rgba(0, 0, 0, 0.45);
  --shadow-card-lg: 0 16px 48px rgba(0, 0, 0, 0.55);
  --shadow-gold-sm: 0 4px 20px var(--shadow-gold);
  --shadow-gold-lg: 0 8px 40px var(--glow-gold);

  /* ── Transitions ── */
  --transition-fast:   150ms ease-out;
  --transition-base:   250ms ease-out;
  --transition-slow:   400ms ease-out;

  /* ── Z-index scale ── */
  --z-base:    0;
  --z-card:    10;
  --z-nav:     100;
  --z-overlay: 200;
  --z-modal:   300;
  --z-loading: 400;

  /* ── Layout ── */
  --container-max: 1280px;
  --nav-height:    72px;
}