:root {
  color-scheme: light;

  --navy-950: #06172a;
  --navy-900: #08223d;
  --navy-800: #113653;
  --ocean-700: #045b91;
  --ocean-600: #0077b6;
  --cyan-400: #21c1df;
  --canvas: #ffffff;
  --surface: #f4f8fa;
  --surface-strong: #eaf2f6;
  --ink: #102a43;
  --muted: #52677a;
  --line: #dce7ee;
  --line-strong: #c6d8e4;
  --success: #16825d;
  --warning: #9a6518;

  --font-brand: "Kanit", system-ui, sans-serif;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  --type-display: clamp(2.875rem, 5.2vw, 5rem);
  --type-section: clamp(2rem, 3.5vw, 3.375rem);
  --type-card: clamp(1.175rem, 1.7vw, 1.625rem);
  --type-lead: clamp(1.05rem, 1.3vw, 1.1875rem);
  --type-body: 1rem;
  --type-nav: .90625rem;
  --type-button: .9375rem;
  --type-label: .71875rem;

  --leading-display: 1.17;
  --leading-section: 1.22;
  --leading-card: 1.36;
  --leading-lead: 1.68;
  --leading-body: 1.65;
  --leading-nav: 1.45;
  --leading-button: 1.4;
  --leading-label: 1.4;
  --tracking-thai: 0;
  --tracking-label: .1em;

  --container: 1180px;
  --gutter: clamp(20px, 5vw, 72px);
  --section-space: clamp(72px, 8vw, 116px);
  --space-eyebrow: 16px;
  --space-heading: 24px;
  --space-content: clamp(48px, 5vw, 56px);
  --space-card: 12px;

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --border: 1px solid var(--line);
  --border-strong: 1px solid var(--line-strong);
  --shadow-sm: 0 12px 32px -24px rgba(6, 23, 42, .32);
  --shadow-md: 0 26px 70px -44px rgba(6, 23, 42, .42);
  --shadow-accent: 0 24px 64px -42px rgba(0, 119, 182, .58);

  --duration-fast: 160ms;
  --duration-base: 240ms;
  --ease-out: cubic-bezier(.2, .72, .28, 1);
}