:root {
  color-scheme: light;
  --font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  --color-bg: #f7f9fc;
  --color-surface: #ffffff;
  --color-surface-soft: #eef6fb;
  --color-text: #102033;
  --color-muted: #5f6f82;
  --color-primary: #2563eb;
  --color-primary-strong: #1d4ed8;
  --color-primary-soft: #dbeafe;
  --color-accent: #0f9f8f;
  --color-accent-soft: #d8f5ef;
  --color-border: #d9e2ec;
  --color-shadow: rgba(16, 32, 51, 0.1);
  --color-focus: #f59e0b;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 30px;
  --shadow-soft: 0 18px 50px var(--color-shadow);
  --shadow-card: 0 12px 34px rgba(16, 32, 51, 0.08);
  --container: 1180px;
  --header-height: 76px;
  --space-section: clamp(56px, 8vw, 96px);
  --transition: 180ms ease;
}

[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #111827;
  --color-surface: #172132;
  --color-surface-soft: #1d2b3f;
  --color-text: #edf4ff;
  --color-muted: #b6c4d5;
  --color-primary: #7aa8ff;
  --color-primary-strong: #a8c4ff;
  --color-primary-soft: #233b64;
  --color-accent: #54d6c6;
  --color-accent-soft: #153e3b;
  --color-border: #304158;
  --color-shadow: rgba(0, 0, 0, 0.28);
  --color-focus: #fbbf24;
}