:root {
  /* Colors */
  --color-primary: #1C2B8C;
  --color-primary-hover: #2E45B0;
  --color-navy-deep: #0E1547;
  --color-navy-deeper: #080E38;
  --color-navy-mid: #131C5C;
  --color-blue-accent: #A8C4FF;
  --color-cream: #F6F2EA;
  --color-cream-alt: #EFE9DB;
  --color-border: #EBE6DC;
  --color-border-alt: #E2DBC9;
  --color-text-body: #6B6657;
  --color-text-muted: #9A9080;
  --color-text-dark: #2A2318;

  --color-climax-teal: #0C8A9C;
  --color-climax-teal-dark: #0B6473;
  --color-climax-teal-bg: #EEF6F7;
  --color-climax-orange: #F58220;

  --color-success: #1F9D55;
  --color-whatsapp: #25D366;
  --color-error: #C0392B;
  --color-parker-red: #C8102E;

  --color-gas-pink: #FF3D8A;
  --color-gas-orange: #FF9D3D;
  --color-gas-mint: #3DFFB0;
  --color-gas-cyan: #3DDCFF;

  /* Typography */
  --font-body: 'Plus Jakarta Sans', sans-serif;

  /* Layout */
  --page-padding: 52px;
  --content-max: 1280px;
  --nav-height: 72px;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-badge: 2px;

  /* Shadows */
  --shadow-card-hover: 0 10px 36px rgba(28, 43, 140, .1);
  --shadow-panel: 0 6px 18px rgba(0, 0, 0, .18);
}

@media (max-width: 900px) {
  :root {
    --page-padding: 20px;
  }
}