/* ============================================================
   Arrowleaf Pediatrics — Design Tokens (v2, unified palette)
   SINGLE SOURCE OF TRUTH. Do not hardcode colors, fonts, sizes,
   or spacing anywhere else. Reference these variables only.
   ============================================================ */
:root {
  --c-conifer:   #2E3D2C;
  --c-sage:      #8A9A7B;
  --c-butter:    #F4D35E;
  --c-balsam:    var(--c-butter);
  --c-ember:     var(--c-butter);
  --c-sand:      #E6DCC8;
  --c-cream:     #F5F0E6;
  --c-ivory:     #FBF8F1;
  --c-ink:       #2A2A24;
  --c-muted:     #6B6A60;
  --c-hairline:  rgba(46,61,44,0.14);
  --c-blush:     #FBEFF4;

  --bg:          var(--c-cream);
  --surface:     var(--c-ivory);
  --text:        var(--c-ink);
  --text-muted:  var(--c-muted);
  --brand:       var(--c-conifer);
  --accent:      var(--c-butter);
  --highlight-surface: var(--c-blush);
  --accent-fill: var(--c-butter);
  --on-accent:   var(--c-ink);

  --font-display: "Lora", Georgia, "Times New Roman", serif;
  --font-body:    "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "DM Mono", ui-monospace, "SFMono-Regular", monospace;

  --fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 4.5rem);
  --fs-h1:      clamp(2.25rem, 1.5rem + 2.6vw, 3.25rem);
  --fs-h2:      clamp(1.6rem, 1.25rem + 1.4vw, 2.15rem);
  --fs-h3:      clamp(1.25rem, 1.1rem + 0.5vw, 1.45rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.9375rem;
  --fs-label:   0.75rem;

  --fs-lede: 1.1875rem;
  --lh-display: 1.06;
  --tracking-display: -0.02em;

  --lh-tight: 1.12;
  --lh-body:  1.65;
  --tracking-label: 0.16em;

  --s-1: 0.5rem;  --s-2: 1rem;   --s-3: 1.5rem;  --s-4: 2rem;
  --s-5: 3rem;    --s-6: 4rem;   --s-7: 6rem;    --s-8: 8rem;
  --section-y: clamp(4rem, 8vw, 8rem);
  --container: 1120px;

  --r-sm: 8px;  --r-md: 14px;  --r-lg: 20px;  --r-pill: 999px;

  --icon-stroke: 1.5;
  --icon-size: 28px;
  --eyebrow-rule: 18px;

  --shadow-sm: 0 1px 2px rgba(46,61,44,0.06), 0 2px 6px rgba(46,61,44,0.05);
  --shadow-md: 0 2px 4px rgba(46,61,44,0.05), 0 6px 16px rgba(46,61,44,0.07),
               0 12px 32px rgba(46,61,44,0.06);
  --shadow-lg: 0 4px 8px rgba(46,61,44,0.06), 0 16px 40px rgba(46,61,44,0.10);

  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 200ms;
  --dur-mid:  320ms;
  --dur-slow: 480ms;

  --hero-scrim-core: 78%; /* radial center, lower-left where the headline and subhead sit */
  --hero-scrim-text: 64%; /* the radial still holds >=64% conifer across the text column; keeps the 19px cream subhead above the 4.5:1 AA floor on the brightest stills */
  --hero-scrim-veil: 14%; /* light whole-image brand tint; the photos read naturally lit outside the text zone */

  --logo-height: 47.59px; /* 44px + 4% + 4% */

  --motif-src:  none;
  --motif-tint: var(--c-sage);
}