:root {
  /* ===== COLORS ===== */
  /* Primary Medical Colors - Original Teal/Sage Theme */
  --primary-ocean: #0A7EA4;
  /* Deep teal - trust, clarity, depth */
  --accent-sage: #6B9080;
  /* Calming sage green - healing, natural */
  --highlight-amber: #E8B349;
  /* Warm amber - optimism, energy */

  /* Sophisticated Neutrals & Clean Background Theme */
  --white: #FFFFFF;
  --cream: #FDFBF7;
  /* Warm white */
  --light-gray: #F8F9FA;
  /* Ultra-light neutral gray */
  --bg-neutral-soft: rgba(0, 0, 0, 0.02);
  /* Very subtle overlay */
  --medium-gray: #E9ECEF;
  /* Borders, subtle divisions */
  --text-charcoal: #1F2937;
  /* Rich charcoal for primary text */
  --text-slate: #4B5563;
  /* Secondary text */
  --text-muted: #9CA3AF;
  /* Tertiary text */

  /* Functional Colors */
  --success: #10B981;
  /* Green for success states */
  --cta-gradient-start: #0A7EA4;
  /* CTA button gradient */
  --cta-gradient-end: #0D9488;
  /* CTA button gradient */

  /* Shadows */
  --shadow-soft: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-medium: 0 4px 16px rgba(0, 0, 0, 0.10);
  --shadow-strong: 0 8px 24px rgba(10, 126, 164, 0.15);

  /* ===== TYPOGRAPHY ===== */
  /* Distinctive font choices - NO Inter/Roboto/Arial */
  --font-heading: 'Cormorant Garamond', serif;
  /* Elegant, distinctive serif */
  --font-body: 'Literata', serif;
  /* Readable, warm serif body */
  --font-accent: 'DM Sans', sans-serif;
  /* Clean sans for labels/UI */
  --font-credentials: 'IBM Plex Mono', monospace;
  /* Technical precision */

  /* Fluid Typography - Responsive scaling with clamp() */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  /* 12-14px */
  --text-sm: clamp(0.875rem, 0.8rem + 0.375vw, 1rem);
  /* 14-16px */
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  /* 16-18px */
  --text-lg: clamp(1.125rem, 1rem + 0.625vw, 1.375rem);
  /* 18-22px */
  --text-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.75rem);
  /* 20-28px */
  --text-2xl: clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem);
  /* 24-40px */
  --text-3xl: clamp(2rem, 1.5rem + 2.5vw, 3.5rem);
  /* 32-56px */

  /* Line Heights */
  --lh-tight: 1.2;
  /* Headings */
  --lh-normal: 1.5;
  /* Labels, captions */
  --lh-relaxed: 1.7;
  /* Body text - optimal readability */

  /* ===== SPACING ===== */
  --space-xs: 0.5rem;
  /* 8px */
  --space-sm: 1rem;
  /* 16px */
  --space-md: 2rem;
  /* 32px */
  --space-lg: 4rem;
  /* 64px */
  --space-xl: 6rem;
  /* 96px */
  --space-2xl: 8rem;
  /* 128px */

  /* ===== LAYOUT ===== */
  --container-max: 1320px;
  --header-height: 80px;

  /* ===== Z-INDEX SCALE ===== */
  --z-base: 1;
  --z-dropdown: 10;
  --z-sticky: 20;
  --z-nav: 50;
  --z-modal: 100;

  /* ===== BORDERS ===== */
  --border-radius-sm: 0.375rem;
  /* 6px */
  --border-radius-md: 0.5rem;
  /* 8px */
  --border-radius-lg: 1rem;
  /* 16px */
  --border-radius-full: 9999px;
  /* Circular */

  /* ===== TRANSITIONS ===== */
  --transition-fast: 150ms ease-out;
  --transition-base: 250ms ease-out;
  --transition-slow: 350ms ease-out;
}

/* Alternate font pairings - User can uncomment to change typography */

/* Option 2: Modern Medical
:root {
  --font-heading: 'Playfair Display', serif;
  --font-body: 'Source Serif 4', serif;
  --font-accent: 'Plus Jakarta Sans', sans-serif;
}
*/

/* Option 3: Clean Contemporary
:root {
  --font-heading: 'Fraunces', serif;
  --font-body: 'Noto Serif', serif;
  --font-accent: 'Manrope', sans-serif;
}
*/