:root {
  --color-navy: #18395F;
  --color-teal: #3BBFB2;
  --color-coral: #FF7A6B;
  --color-white: #F8F9FC;
  --color-gray: #8A97A8;
  --color-dark: #0F2238;

  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-hero: 56px;
  --fs-h2: 40px;
  --fs-h3: 28px;
  --fs-body: 18px;
  --fs-small: 14px;
  --fs-xs: 12px;
  --fs-badge: 11px;

  --lh-heading: 1.15;
  --lh-body: 1.65;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 20px;
  --radius-full: 50%;

  --color-border: #E8EDF2;
  --color-bg-alt: #FAFBFD;
  --color-text-muted: #6B7A8D;
  --color-text-trust: #9AA5B4;
  --color-navy-deep: #0F2A45;
  --color-navy-mid: #152F50;

  --teal-8: rgba(59, 191, 178, 0.08);
  --teal-12: rgba(59, 191, 178, 0.12);
  --teal-30: rgba(59, 191, 178, 0.3);
  --teal-40: rgba(59, 191, 178, 0.4);
  --coral-8: rgba(255, 122, 107, 0.08);
  --coral-12: rgba(255, 122, 107, 0.12);
  --coral-20: rgba(255, 122, 107, 0.2);
  --white-5: rgba(255, 255, 255, 0.05);
  --white-10: rgba(255, 255, 255, 0.1);
  --white-55: rgba(255, 255, 255, 0.55);
  --white-60: rgba(255, 255, 255, 0.6);
  --white-65: rgba(255, 255, 255, 0.65);
  --white-70: rgba(255, 255, 255, 0.7);
  --white-80: rgba(255, 255, 255, 0.8);
  --white-85: rgba(255, 255, 255, 0.85);

  --shadow-card: 0 4px 24px rgba(24, 57, 95, 0.07);
  --shadow-card-hover: 0 16px 48px rgba(24, 57, 95, 0.12);
  --shadow-btn: 0 4px 20px rgba(59, 191, 178, 0.3);
  --shadow-btn-hover: 0 8px 24px rgba(59, 191, 178, 0.35);

  --container-max: 1200px;
  --container-padding: 24px;

  --nav-height: 72px;

  --transition-default: 0.25s ease;
  --transition-reveal: 0.55s ease;
}

@media (max-width: 768px) {
  :root {
    --fs-hero: 36px;
    --fs-h2: 28px;
    --fs-h3: 22px;
    --fs-body: 16px;
    --container-padding: 16px;
  }
}

@media (max-width: 640px) {
  :root {
    --fs-hero: 30px;
    --fs-h2: 24px;
    --fs-h3: 20px;
  }
}
