:root {
  color-scheme: light;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --c-bg: #f7f9fc;
  --c-bg-elevated: #ffffff;
  --c-bg-soft: #eef5ff;
  --c-bg-accent: #e9fbf7;
  --c-text: #0d172b;
  --c-text-muted: #536078;
  --c-text-subtle: #77839a;
  --c-border: rgba(15, 35, 67, 0.12);
  --c-border-strong: rgba(15, 35, 67, 0.2);
  --c-primary: #2478d4;
  --c-primary-deep: #155ca9;
  --c-secondary: #12b89a;
  --c-secondary-deep: #07866f;
  --c-highlight: #78d1f0;
  --c-success: #158a66;
  --c-danger: #c53c52;
  --c-warning: #b8790a;
  --c-navy: #0c162a;
  --c-navy-soft: #14213a;
  --c-white: #ffffff;
  --c-shadow: 15 35 65;

  --gradient-brand: linear-gradient(135deg, #2478d4 0%, #1a9fbc 48%, #12b89a 100%);
  --gradient-brand-soft: linear-gradient(135deg, rgba(36, 120, 212, 0.12), rgba(18, 184, 154, 0.12));
  --gradient-hero: radial-gradient(circle at 16% 22%, rgba(36, 120, 212, 0.18), transparent 33%), radial-gradient(circle at 86% 12%, rgba(18, 184, 154, 0.14), transparent 28%);

  --shadow-xs: 0 1px 2px rgba(var(--c-shadow), 0.05);
  --shadow-sm: 0 10px 30px rgba(var(--c-shadow), 0.08);
  --shadow-md: 0 20px 60px rgba(var(--c-shadow), 0.12);
  --shadow-lg: 0 30px 100px rgba(var(--c-shadow), 0.18);

  --radius-sm: 0.75rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  --radius-pill: 999px;

  --container: 76rem;
  --header-height: 4.75rem;
  --section-y: clamp(4.5rem, 8vw, 8rem);
  --gutter: clamp(1rem, 3vw, 2rem);

  --step--1: clamp(0.82rem, 0.8rem + 0.08vw, 0.9rem);
  --step-0: clamp(0.98rem, 0.94rem + 0.16vw, 1.08rem);
  --step-1: clamp(1.12rem, 1.02rem + 0.38vw, 1.32rem);
  --step-2: clamp(1.38rem, 1.14rem + 0.85vw, 1.85rem);
  --step-3: clamp(1.85rem, 1.42rem + 1.55vw, 2.65rem);
  --step-4: clamp(2.55rem, 1.9rem + 2.55vw, 4.45rem);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --c-bg: #07101f;
  --c-bg-elevated: #0f1a2f;
  --c-bg-soft: #12213a;
  --c-bg-accent: #0c2a2b;
  --c-text: #f5f8ff;
  --c-text-muted: #b4bfd2;
  --c-text-subtle: #8290aa;
  --c-border: rgba(255, 255, 255, 0.11);
  --c-border-strong: rgba(255, 255, 255, 0.2);
  --c-primary: #62b4ff;
  --c-primary-deep: #8bc8ff;
  --c-secondary: #45dfbf;
  --c-secondary-deep: #72efd6;
  --c-highlight: #9ee6ff;
  --c-success: #61d7ad;
  --c-danger: #ff8192;
  --c-warning: #ffd07a;
  --c-navy: #050b16;
  --c-navy-soft: #0d1729;
  --c-shadow: 0 0 0;
  --gradient-brand: linear-gradient(135deg, #62b4ff 0%, #36bdd3 50%, #45dfbf 100%);
  --gradient-brand-soft: linear-gradient(135deg, rgba(98, 180, 255, 0.14), rgba(69, 223, 191, 0.12));
  --gradient-hero: radial-gradient(circle at 16% 22%, rgba(36, 120, 212, 0.18), transparent 34%), radial-gradient(circle at 86% 12%, rgba(18, 184, 154, 0.13), transparent 28%);
}