/* ============================================================
   Design tokens — dark theme
   Page-wide deep navy base with layered surface depths.
   ============================================================ */
:root {
  /* Brand palette (kept consistent with hero/dark sections) */
  --color-brand: #051a36;
  --color-brand-2: #0a2347;
  --color-brand-3: #143461;
  --color-accent: #ff4d06;
  --color-accent-hover: #ff5e1f;
  --color-accent-soft: rgba(255, 77, 6, 0.14);

  /* Surfaces — deep layered navy */
  --color-bg: #051a36;
  --color-bg-alt: #081f3e;
  --color-surface: #0c2649;
  --color-surface-2: #102d56;
  --color-surface-3: #163669;
  --color-surface-dark: #04132a;
  --color-surface-darker: #020c1e;

  /* Text — light scale on dark */
  --color-fg: #f0f3fa;
  --color-text: #eef1f8;
  --color-text-secondary: #b6bfd0;
  --color-text-muted: #8390a4;
  --color-text-placeholder: #5b6680;

  /* Border — white at low alpha for soft dividers on dark */
  --color-border: rgba(255, 255, 255, 0.1);
  --color-border-light: rgba(255, 255, 255, 0.06);
  --color-border-strong: rgba(255, 255, 255, 0.18);

  /* Status */
  --color-success: #58c47a;
  --color-danger: #ff6f5a;

  /* Typography */
  --font-display:
    "Geist", "Inter", "Noto Sans SC", "PingFang SC", "Microsoft YaHei",
    system-ui, sans-serif;
  --font-body:
    "Geist", "Inter", "Noto Sans SC", "PingFang SC", "Microsoft YaHei",
    system-ui, sans-serif;
  --font-serif:
    "Instrument Serif", "Source Han Serif SC", "Noto Serif SC", "Songti SC",
    "STSong", Georgia, serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, "SFMono-Regular",
    Menlo, monospace;

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;

  /* Radius */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-2xl: 32px;
  --radius-pill: 999px;

  /* Shadow — dark tuned */
  --shadow-sm: 0 4px 14px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 12px 32px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.45);
  --shadow-glow: 0 12px 32px rgba(255, 77, 6, 0.28);

  /* Layout */
  --max-w: 1240px;
  --nav-h: 72px;
}