/* =====================================================================
   ARE YOU ACTUALLY HUNGRY? — IDENTITY TOKENS + BASE LAYER
   "The look of listening." Single source of truth — mirrors
   design/visual-system/identity.html :root. Bright / high-key / warm.
   NEVER dark backgrounds, NEVER dark overlays, NEVER pure white/black.
   Imported by every page (front door + the re-skinned Living Library).
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..600;1,9..144,400..500&family=Inter:wght@400;500;600&display=swap');

:root{
  /* --- PALETTE: bright / high-key / a touch of warmth --- */
  --paper:      #FBF8F2;  /* the page — warm off-white. NEVER white-white, NEVER dark */
  --paper-2:    #F4EFE4;  /* quiet card / box fill */
  --ink:        #2E2A26;  /* text — warm near-black, never pure #000 */
  --ink-soft:   #6B635A;  /* captions, glosses, secondary */
  --line:       #DED5C4;  /* hairline rule — the "noise" tone */

  --sage:       #7C9A7E;  /* primary — listening / growth, not clinical lab-green */
  --sage-deep:  #5C7A60;  /* emphasis on light fills, primary CTA */
  --clay:       #D98E73;  /* warm human accent — sparingly */
  --honey:      #E8B04B;  /* the "light" / spark beats only */
  --sky:        #9FB8C4;  /* rest / water / pause */
  --sage-wash:  #E8EFE6;  /* tint fills */
  --clay-wash:  #F6E4DC;
  --sky-wash:   #E6EEF1;

  --focus:      #2f6fb0;  /* accessible focus ring (not a brand color) */

  /* --- TYPE --- */
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;  /* humane serif — headers, quotes */
  --sans:  'Inter', -apple-system, system-ui, sans-serif;  /* body + UI labels */

  /* --- rhythm --- */
  --maxw: 1080px;
  --radius: 14px;
  --radius-lg: 20px;
}

*{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* ---- headings: Fraunces, light, humane ---- */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:300; letter-spacing:-.012em; line-height:1.08; margin:0 0 .5em; color:var(--ink); }
h1{ font-size:clamp(34px, 5.4vw, 60px); }
h2{ font-size:clamp(27px, 3.4vw, 40px); }
h3{ font-size:clamp(20px, 2.2vw, 26px); font-weight:400; }
h4{ font-size:19px; font-weight:500; }
/* the italic-emphasis word (Function pattern) — Fraunces italic, sage-deep */
h1 em, h2 em, h3 em, .em{ font-style:italic; color:var(--sage-deep); }

p{ margin:0 0 1.1rem; }
strong{ font-weight:600; }
em{ font-style:italic; }

a{ color:var(--sage-deep); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover{ color:var(--sage); }

:focus-visible{ outline:3px solid var(--focus); outline-offset:2px; border-radius:4px; }

img,svg{ max-width:100%; height:auto; }

/* ---- shared label / kicker / lede ---- */
.kicker{ font-family:var(--sans); font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--sage-deep); font-weight:600; }
.eyebrow{ font-family:var(--sans); font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--clay); font-weight:600; }
.lede{ font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(18px,2.2vw,23px); line-height:1.5; color:var(--ink-soft); }
.muted{ color:var(--ink-soft); }
.small{ font-size:.9rem; }

/* ---- buttons (shared primitives) ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:var(--sans); font-weight:600; font-size:17px; letter-spacing:.01em;
  padding:15px 28px; border-radius:999px; border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; transition:filter .14s ease, transform .14s ease, background .14s ease;
}
.btn:hover{ filter:brightness(1.04); transform:translateY(-1px); }
.btn .arr{ font-size:1.1em; transform:translateY(-1px); }
.btn-primary{ background:var(--sage-deep); color:var(--paper); box-shadow:0 10px 26px -12px rgba(92,122,96,.6); }
.btn-primary:hover{ color:var(--paper); }
.btn-secondary{ background:transparent; color:var(--sage-deep); border-color:var(--sage); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-lg{ font-size:18px; padding:17px 32px; }
.btn:disabled{ opacity:.45; cursor:not-allowed; transform:none; }

/* ---- the Pause sigil (brand mark) — a circle with one breath-gap ---- */
.sigil{ flex:0 0 auto; display:inline-block; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
