/* ============================================================
   Maniheal — Design Tokens
   "Clinical Warmth": forest green + saffron + ivory
   ============================================================ */
:root {
  /* ---- Brand color ---- */
  --forest: #1B4332;        /* primary */
  --forest-2: #2D6A4F;      /* secondary */
  --forest-dark: #0F2B1F;   /* depth */
  --saffron: #E8A838;       /* accent */
  --saffron-dark: #D4942A;  /* accent hover */
  --ink: #2D2D2D;           /* body text */
  --ink-soft: #5A5A54;      /* secondary text */
  --ivory: #FAF3E8;         /* warm background */
  --ivory-2: #FEFCF8;       /* near-white */
  --sage: #6B9080;          /* muted sage */
  --sage-light: #E8F0EC;    /* light sage tint */
  --line: #E5E0D5;          /* borders */
  --white: #FFFFFF;

  /* ---- Semantic ---- */
  --bg-body: var(--ivory-2);
  --bg-alt: var(--ivory);
  --text: var(--ink);
  --text-soft: var(--ink-soft);
  --text-invert: #FBFAF6;

  /* ---- Type ---- */
  --font-head: 'Clash Display', 'Georgia', serif;
  --font-body: 'Switzer', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* fluid type scale */
  --fs-display: clamp(2.4rem, 1.6rem + 3.2vw, 4rem);
  --fs-h1: clamp(2rem, 1.5rem + 2vw, 3rem);
  --fs-h2: clamp(1.6rem, 1.3rem + 1.3vw, 2.25rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fs-lead: clamp(1.05rem, 1rem + 0.35vw, 1.25rem);
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;

  /* ---- Spacing ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --section-y: clamp(3.5rem, 2.5rem + 4vw, 6rem);

  /* ---- Layout ---- */
  --container: 1200px;
  --container-wide: 1360px;
  --container-narrow: 820px;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* ---- Elevation ---- */
  --shadow-sm: 0 1px 2px rgba(15, 43, 31, 0.05), 0 1px 3px rgba(15, 43, 31, 0.06);
  --shadow: 0 4px 16px rgba(15, 43, 31, 0.08);
  --shadow-md: 0 10px 30px rgba(15, 43, 31, 0.10);
  --shadow-lg: 0 20px 50px rgba(15, 43, 31, 0.14);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 0.28s;

  /* ---- Header ---- */
  --header-h: 76px;
  --z-header: 1000;
  --z-overlay: 1100;
  --z-drawer: 1200;
}
