:root {
  --cc-bg: #f4f7fc;
  --cc-surface: #ffffff;
  --cc-ink: #102538;
  --cc-ink-muted: #5b6b7b;
  --cc-accent: #19a4b8;
  --cc-accent-2: #2bd1d1;
  --cc-border: rgba(16, 37, 56, 0.12);
  --cc-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  --cc-shadow-soft: 0 12px 32px rgba(16, 37, 56, 0.12);
  --cc-radius-lg: 18px;
  --cc-radius-md: 12px;
  --cc-radius-sm: 10px;
  --cc-space-1: 4px;
  --cc-space-2: 8px;
  --cc-space-3: 12px;
  --cc-space-4: 16px;
  --cc-space-5: 24px;
  --cc-space-6: 32px;
  --cc-space-7: 48px;
  --cc-space-8: 64px;
  --cc-space-9: 80px;
  --cc-max-width: 1180px;
  --cc-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --cc-font-size-base: 16px;
  --cc-line-height-base: 1.6;
  --cc-font-size-sm: 0.9rem;
  --cc-font-size-xs: 0.8rem;
  --cc-font-size-h1: 2.4rem;
  --cc-font-size-h2: 1.9rem;
  --cc-font-size-h3: 1.35rem;
  --cc-letter-spacing-tight: 0.01em;
  --cc-letter-spacing-wide: 0.12em;
  --cc-button-height: clamp(34px, 2.2vw, 44px);
  --cc-button-padding-x: clamp(14px, 1.6vw, 24px);
  --cc-button-font-size: clamp(0.9rem, 0.4vw + 0.7rem, 1rem);
}

body {
  background: var(--cc-bg);
  color: var(--cc-ink);
  font-family: var(--cc-font-sans);
  font-size: var(--cc-font-size-base);
  line-height: var(--cc-line-height-base);
  margin: 0;
}

* {
  box-sizing: border-box;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}
