@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;700&family=Space+Grotesk:wght@700;800&display=swap');

:root {
  /* --- Palette --- */
  --color-deep: #01524c;
  --color-teal: #0c9382;
  --color-cyan: #00b7d9;
  
  /* --- Backgrounds --- */
  --color-bg-primary: #0a0a0a;
  --color-bg-secondary: #0f1111;
  --color-bg-elevated: #1a1c1c;
  --color-gradient-hero: linear-gradient(135deg, #01524c 0%, #0a0a0a 70%);
  --color-gradient-cta: linear-gradient(135deg, #0c9382 0%, #00b7d9 100%);
  
  /* --- Text --- */
  --color-text-primary: #ffffff;
  --color-text-secondary: #8a9ba8;
  --color-text-muted: #4a5568;
  --color-text-accent: #00b7d9;
  
  /* --- Borders & Glows --- */
  --color-border: rgba(12, 147, 130, 0.2);
  --color-border-hover: rgba(0, 183, 217, 0.4);
  --color-glow-teal: 0 0 40px rgba(12, 147, 130, 0.3);
  --color-glow-cyan: 0 0 60px rgba(0, 183, 217, 0.2);
  
  /* --- Typography Scale (Perfect Fourth - 1.333) --- */
  --font-h1: clamp(3rem, 6vw, 5.5rem);
  --font-h2: clamp(2rem, 4vw, 3.5rem);
  --font-h3: clamp(1.25rem, 2vw, 1.75rem);
  --font-body-lg: 1.125rem;
  --font-body: 1rem;
  --font-caption: 0.875rem;
  --font-overline: 0.75rem;
  --font-stat: clamp(2.5rem, 5vw, 4.5rem);
  
  /* --- Spacing --- */
  --space-unit: 8px;
  --space-xs: calc(var(--space-unit) * 1);
  --space-sm: calc(var(--space-unit) * 2);
  --space-md: calc(var(--space-unit) * 3);
  --space-lg: calc(var(--space-unit) * 4);
  --space-xl: calc(var(--space-unit) * 6);
  --space-2xl: calc(var(--space-unit) * 10);
  
  /* --- Transitions --- */
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}