/* =====================================================================
   THE MEDICAL MARVEL — Design Tokens
   Editorial authority system. Warm cream canvas, terracotta reserved
   for primary CTAs only. Typography-led.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..600;1,9..144,400..500&family=Newsreader:ital,opsz,wght@0,6..72,300..500;1,6..72,320..420&family=Hanken+Grotesk:wght@400;500;600;700&display=swap');

:root {
  /* ---- Canvas & surfaces ---- */
  --cream:        #FDFAF4;   /* page background */
  --cream-panel:  #F6EFE2;   /* subtle raised panel */
  --cream-sink:   #F0E7D6;   /* deeper inset panel */
  --paper:        #FFFFFF;   /* cards on dark, report sheet */

  /* ---- Ink (warm near-black) ---- */
  --ink:    #221B16;
  --ink-2:  #574C43;
  --ink-3:  #8B7E71;
  --on-dark:    #F4ECDD;
  --on-dark-2:  #C8B7A1;

  /* ---- Accent — TERRACOTTA. Primary CTAs only. ---- */
  --terra:        #B8513A;
  --terra-deep:   #9C3F2A;
  --terra-wash:   #F2E1D8;   /* tint block bg */
  --terra-line:   #E3C3B6;

  /* ---- Dark editorial section ---- */
  --espresso:     #2A201A;
  --espresso-2:   #36291F;

  /* ---- Hairlines & shadow ---- */
  --line:    #E6DBC8;
  --line-2:  #D8CAB2;
  --shadow-sm: 0 1px 2px rgba(34,27,22,.05), 0 2px 8px rgba(34,27,22,.04);
  --shadow-md: 0 4px 18px rgba(34,27,22,.08), 0 12px 40px rgba(34,27,22,.06);
  --shadow-lg: 0 18px 60px rgba(34,27,22,.14);

  /* ---- Score band palette (warm, functional, muted) ---- */
  --band-critical: #B8513A;  /* Critical 10–20 */
  --band-below:    #C2873D;  /* Below Benchmark 21–30 */
  --band-at:       #7C7A3A;  /* At Benchmark 31–40 */
  --band-above:    #4F7A52;  /* Above Benchmark 41–50 */

  /* ---- Typography ---- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'Newsreader', Georgia, serif;
  --font-ui:      'Hanken Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Fluid type scale */
  --fs-mega:  clamp(2.9rem, 1.6rem + 5.4vw, 6.2rem);
  --fs-h1:    clamp(2.35rem, 1.5rem + 3.4vw, 4.3rem);
  --fs-h2:    clamp(1.85rem, 1.3rem + 2.2vw, 3.05rem);
  --fs-h3:    clamp(1.4rem, 1.1rem + 1.1vw, 1.95rem);
  --fs-h4:    clamp(1.15rem, 1rem + .5vw, 1.4rem);
  --fs-lede:  clamp(1.18rem, 1.05rem + .6vw, 1.5rem);
  --fs-body:  clamp(1.04rem, 1rem + .2vw, 1.16rem);
  --fs-sm:    .94rem;
  --fs-xs:    .8rem;
  --fs-kicker: .76rem;

  /* ---- Spacing & rhythm ---- */
  --space-section: clamp(4rem, 7vw, 8.5rem);
  --wrap:      1180px;
  --wrap-text: 760px;   /* long-form reading column */
  --wrap-wide: 1320px;

  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-pill: 999px;

  --ease: cubic-bezier(.22,.61,.36,1);
}