:root {
  --color-bg: #ffffff;
  --color-bg-soft: #f5f9fb;
  --color-bg-section: #eef8fb;
  --color-text: #10223a;
  --color-text-muted: #6f7f91;
  --color-primary: #10223a;
  --color-accent: #1598a8;
  --color-accent-soft: #e6f6f8;
  --color-border: #e2eaf0;
  --color-orange: #ff7a45;
  --color-white: #ffffff;
  --shadow-soft: 0 12px 40px rgba(16, 34, 58, 0.08);
  --shadow-card: 0 8px 24px rgba(16, 34, 58, 0.06);
  --shadow-button: 0 16px 34px rgba(16, 34, 58, 0.14);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --font-family-base: Inter, Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: 13px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-md: 18px;
  --font-size-lg: 22px;
  --font-size-xl: 32px;
  --font-size-2xl: 48px;
  --font-size-hero: 64px;
  --container-width: min(100% - 40px, 1280px);
  --section-space: 80px;
  --section-gap: 32px;
  --section-stack-gap: 16px;
  --section-frame-pad-y: 46px;
  --section-frame-pad-x: 44px;
  --section-frame-pad-y-tablet: 38px;
  --section-frame-pad-x-tablet: 28px;
  --section-frame-pad-y-mobile: 30px;
  --section-frame-pad-x-mobile: 18px;
  --card-padding: 28px;
  --transition-base: 0.24s ease;
  --bg: var(--color-bg-soft);
  --surface: var(--color-bg);
  --text: var(--color-text);
  --title: var(--color-primary);
  --muted: var(--color-text-muted);
  --line: var(--color-border);
  --soft: var(--color-bg-soft);
  --accent: var(--color-accent-soft);
  --teal: var(--color-accent);
  --teal-dark: #0f7280;
  --cyan: var(--color-accent-soft);
  --orange: var(--color-orange);
}

@media (max-width: 768px) {
  :root {
    --container-width: min(100% - 24px, 100%);
    --section-space: 48px;
    --section-gap: 24px;
    --section-stack-gap: 12px;
    --section-frame-pad-y: 30px;
    --section-frame-pad-x: 18px;
    --card-padding: 24px;
  }
}