:root {
  /* Surface & Canvas (Mercury Alpine Dark) */
  --bg-primary: #0b0c10;
  --bg-canvas: #0b0c10;
  --bg-elevated: #14151f;
  --bg-elevated-hover: #1b1c2b;
  --bg-glass: rgba(20, 21, 31, 0.7);
  
  /* Borders & Dividers */
  --border: rgba(255, 255, 255, 0.08);
  --border-subtle: rgba(255, 255, 255, 0.04);
  --border-active: rgba(212, 160, 76, 0.4);
  --border-glow: rgba(212, 160, 76, 0.2);
  
  /* High-Contrast Typography */
  --text-primary: #f5f5f7;
  --text-secondary: #9ea0ad;
  --text-muted: #676977;
  --accent: #d4a04c;
  --accent-hover: #e5b364;
  --accent-text: #0b0c10;
  --accent-glow: rgba(212, 160, 76, 0.18);
  --accent-subtle: rgba(212, 160, 76, 0.08);
  
  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --title-weight: 600;
  --letter-spacing-tight: -0.03em;
  --letter-spacing-heading: -0.02em;
  
  /* Fluid Font Scales */
  --text-hero: clamp(2.25rem, 5.5vw, 4.25rem);
  --text-section-title: clamp(1.85rem, 3.8vw, 2.75rem);
  --text-large: clamp(1.05rem, 1.35vw, 1.25rem);
  --text-body: clamp(0.95rem, 1.1vw, 1.05rem);
  --text-small: 0.875rem;
  --text-xs: 0.75rem;
  --line-height: 1.6;
  --line-height-heading: 1.15;
  
  /* Spacing Scale */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;
  --space-3xl: 96px;
  
  /* Radii */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-pill: 9999px;
  
  /* Premium Motion Curves */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-base: 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  
  /* Layout */
  --container-max: 1180px;
  --container-padding: clamp(20px, 5vw, 40px);
  --header-height: 76px;
}