/* ==========================================================================
   NEXO FOUNDRY — DESIGN SYSTEM & TOKENS
   Color Palette: Deep Navy, Metallic Gold Accents, Warm Off-White
   ========================================================================== */

:root {
  /* Color Palette — Deep Navy Base */
  --bg-darker: #06080D;
  --bg-primary: #0A0D14;
  --bg-secondary: #0F1320;
  --bg-tertiary: #141A2B;
  --bg-card: #121726;
  --bg-card-hover: #171E31;
  --bg-elevated: #1B2236;

  /* Accent Palette — Muted & Metallic Gold */
  --gold-primary: #D4AF37;
  --gold-light: #E5C158;
  --gold-dark: #A88623;
  --gold-muted: rgba(212, 175, 55, 0.12);
  --gold-subtle: rgba(212, 175, 55, 0.06);
  --gold-border: rgba(212, 175, 55, 0.28);
  --gold-glow: rgba(212, 175, 55, 0.15);

  /* Text & Content */
  --text-primary: #F4F5F8;
  --text-secondary: #9DA4B4;
  --text-muted: #646D7E;
  --text-dark: #0A0D14;

  /* Borders & Dividers */
  --border-subtle: rgba(255, 255, 255, 0.07);
  --border-medium: rgba(255, 255, 255, 0.12);
  --border-gold: rgba(212, 175, 55, 0.25);

  /* Typography */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'Space Grotesk', 'JetBrains Mono', monospace;

  /* Layout Spacing */
  --container-max: 1240px;
  --header-height: 80px;

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-subtle: 0 4px 20px rgba(0, 0, 0, 0.4);
  --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.5);
  --shadow-gold: 0 0 25px rgba(212, 175, 55, 0.18);

  /* Transitions */
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}