:root {
  /* Logo-aligned palette */
  --blue-start: #007BFF;
  --blue-end: #66B3FF;
  --orange-start: #FFA500;
  --orange-end: #FFD700;
  --green-start: #00CC66;
  --green-end: #66FF99;
  
  --color-primary: var(--blue-start);
  --color-accent: var(--orange-start);
  --color-success: var(--green-start);
  --gradient-brand: linear-gradient(135deg, var(--blue-start), var(--orange-start), var(--green-end));
  --gradient-blue: linear-gradient(135deg, var(--blue-start), var(--blue-end));
  --gradient-orange: linear-gradient(135deg, var(--orange-start), var(--orange-end));
  --gradient-green: linear-gradient(135deg, var(--green-start), var(--green-end));
  
  --bg-base: #0a0e17;
  --bg-card: rgba(17, 24, 39, 0.7);
  --bg-alt: rgba(10, 14, 23, 0.95);
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-highlight: rgba(0, 123, 255, 0.3);
  
  --text-primary: #ffffff;
  --text-secondary: #b0b8c8;
  --text-muted: #6b7280;
  
  --font-heading: 'Sora', sans-serif;
  --font-body: 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  
  --text-h1: clamp(2rem, 4vw, 3.5rem);
  --text-h2: clamp(1.75rem, 3vw, 2.5rem);
  --text-h3: 1.5rem;
  --text-body: 1rem;
  --text-small: 0.9375rem;
  
  --radius-btn: 10px;
  --radius-card: 16px;
  --radius-card-sm: 12px;
  --radius-card-lg: 20px;
  --space-section: clamp(4rem, 8vw, 7.5rem);
  --space-inner: clamp(2rem, 4vw, 3rem);
  --container-max: 1200px;
  --motion: 0.3s ease;
}
