/*
  Arrow Pharmacy — design tokens.
  Palette per brief §5. Blue/neutral carry ~90% of the UI; red is reserved
  for CTAs/alerts only so the site doesn't read as alarming for a health topic.
*/
:root {
  /* Brand */
  --color-primary: #3b7ddd;
  --color-primary-light: #eaf2fd;
  --color-primary-dark: #1f4fa3;
  --color-accent: #d6323c;
  --color-accent-dark: #a92330;
  --color-success: #2fa88a;
  --color-success-light: #e4f6f1;

  /* Neutrals */
  --color-bg: #f8f9fb;
  --color-surface: #ffffff;
  --color-text: #24303d;
  --color-text-muted: #55636f;
  --color-border: #e2e6ec;

  /* Feedback (contrast-checked against --color-surface) */
  --color-warning-bg: #fff4e5;
  --color-warning-border: #f0b862;
  --color-warning-text: #7a4a06;

  /* Typography */
  --font-display: 'Source Serif Arrow', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter Arrow', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.625rem;
  --fs-2xl: 2.125rem;
  --fs-3xl: 2.75rem;

  --lh-tight: 1.2;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  /* Spacing scale (8px base) */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4.5rem;

  /* Layout */
  --content-max: 1180px;
  --content-narrow: 760px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(31, 79, 163, 0.06), 0 1px 3px rgba(31, 79, 163, 0.08);
  --shadow-md: 0 4px 14px rgba(31, 79, 163, 0.1);
  --focus-ring: 0 0 0 3px rgba(59, 125, 221, 0.45);
}