:root {
  --navy: #0A3D62;
  --navy-deep: #082E48;
  --teal: #0FA3B1;
  --teal-hover: #0B8089;
  --teal-soft: rgba(15, 163, 177, 0.10);
  --mint: #7BDDD9;
  --mint-soft: #E6F7F6;
  --mint-deep: #4FCBC5;
  --gray: #F9FAFB;
  --cream: #F9FAFB;
  --white: #FFFFFF;
  --border: #E5E7EB;
  --border-soft: #F3F4F6;
  --text: #0A3D62;
  --text-2: #4B5563;
  --text-3: #9CA3AF;
  --amber: var(--teal-hover);
  --amber-hot: var(--navy);
  --amber-soft: var(--mint-soft);
  --green: var(--teal);
  --green-soft: var(--mint-soft);
  --red: #DC2626;
  --red-soft: #FEE2E2;
  --star: #0FA3B1;

  --shadow-xs: 0 1px 2px rgba(10, 61, 98, 0.06);
  --shadow-sm: 0 2px 8px rgba(10, 61, 98, 0.06);
  --shadow-md: 0 8px 24px rgba(10, 61, 98, 0.08);
  --shadow-lg: 0 16px 48px rgba(10, 61, 98, 0.12);

  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;

  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}