:root {
  --bg-primary: #050B1E;
  --bg-secondary: #0A1428;
  --bg-card: rgba(15, 27, 56, 0.6);
  --bg-card-hover: rgba(20, 36, 70, 0.8);

  --brand-blue: #1FA9F0;
  --brand-blue-light: #4FC3F7;
  --brand-blue-dark: #0288D1;
  --brand-cyan: #00D4FF;

  --gradient-blue: linear-gradient(135deg, #4FC3F7 0%, #1FA9F0 50%, #0288D1 100%);
  --gradient-text: linear-gradient(135deg, #4FC3F7 0%, #1FA9F0 100%);
  --gradient-cta: linear-gradient(135deg, #4FC3F7 0%, #1FA9F0 100%);

  --text-primary: #FFFFFF;
  --text-secondary: rgba(255, 255, 255, 0.75);
  --text-muted: rgba(255, 255, 255, 0.55);
  --text-accent: var(--brand-blue-light);

  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-card: rgba(79, 195, 247, 0.18);
  --border-card-hover: rgba(79, 195, 247, 0.45);

  --glow-blue: 0 0 40px rgba(31, 169, 240, 0.4);
  --glow-cta: 0 8px 32px rgba(31, 169, 240, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.2);

  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 8rem;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  --container-max: 1200px;
  --container-narrow: 800px;

  --fs-hero: clamp(2rem, 5vw + 1rem, 6rem);
  --fs-h2: clamp(1.75rem, 4vw + 0.5rem, 4rem);
  --fs-h3: clamp(1.25rem, 1.5vw + 0.5rem, 1.75rem);

  --fs-lg: clamp(1.125rem, 0.5vw + 1rem, 1.375rem);
  --fs-md: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug: 1.25;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  --ls-tight: -0.02em;
  --ls-wider: 0.05em;
  --ls-widest: 0.15em;

  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}