/* ============================================================
   Let's Talk Science Now — Design System
   A small, modern, minimal CSS foundation.
   Sections: 1 Tokens · 2 Reset · 3 Base · 4 Layout · 5 Components · 6 Utilities
   ============================================================ */

/* ---------- 1. DESIGN TOKENS ---------- */
:root{
  /* Neutrals (cool-biased, chosen) */
  --bg:#ffffff;
  --surface:#ffffff;
  --surface-soft:#f4f9fe;
  --line:#e6edf4;
  --ink:#1c2733;
  --muted:#5e6e7e;

  /* Brand */
  --blue:#1667c6;         /* friendly, confident azure */
  --blue-deep:#0f4e9c;
  --blue-soft:#e7f1fc;
  --red:#439b63;          /* the "Now" */
  --red-soft:#fdecec;

  /* Topic tints (wayfinding) */
  --t-planet:#1e88c9;
  --t-nature:#2fa25c;
  --t-space:#6c5ce7;
  --t-ingenuity:#f0873c;
  --t-compsci:#3f5bd9;

  /* Hero sky */
  --sky:linear-gradient(180deg,#f2faff 0%,#eaf5ff 42%,#ffffff 100%);

  /* Typography — three roles, one font each.
     Change a font on the line below and it updates everywhere that role is used:
       --font-display : big headings + wordmark      (serif, characterful)
       --font-body    : paragraphs / reading text     (serif, readable)
       --font-head    : buttons, nav, small UI labels (sans, crisp when small) */
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-body:'EB Garamond',Georgia,serif;
  --font-head:'Poppins',system-ui,sans-serif;
  --fs-display:clamp(2.6rem,6vw,4.1rem);
  --fs-h1:clamp(2rem,4.5vw,3rem);
  --fs-h2:clamp(1.7rem,3.2vw,2.1rem);
  --fs-h3:1.15rem;
  --fs-lead:1.18rem;   /* body serif runs a bit larger — EB Garamond has a small x-height */
  --fs-body:1.08rem;
  --fs-small:.82rem;
  --fs-eyebrow:.72rem;

  /* Spacing scale */
  --sp-xs:.5rem;
  --sp-sm:.75rem;
  --sp-md:1rem;
  --sp-lg:1.5rem;
  --sp-xl:2.5rem;
  --sp-2xl:4rem;
  --sp-3xl:6rem;

  /* Shape & depth */
  --radius:18px;
  --radius-sm:12px;
  --radius-pill:50px;
  --shadow:0 10px 30px rgba(22,71,140,.08);
  --shadow-hover:0 18px 44px rgba(22,71,140,.14);

  --container:1140px;
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
img,svg,video{display:block;max-width:100%;height:auto;}
input,button{font:inherit;color:inherit;}
a{color:inherit;text-decoration:none;}

/* ---------- 3. BASE ---------- */
body{
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:1.65;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.08;letter-spacing:0;text-wrap:balance;}
h1{font-size:var(--fs-h1);}
h2{font-size:var(--fs-h2);}
h3{font-size:var(--fs-h3);font-weight:600;}
p{line-height:1.7;}
:focus-visible{outline:3px solid var(--blue-soft);outline-offset:2px;border-radius:4px;}

/* ---------- 4. LAYOUT ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--sp-lg);}
.section{padding-block:var(--sp-3xl);}
.stack > * + *{margin-top:var(--sp-md);}

/* ---------- 5. COMPONENTS ---------- */

/* Eyebrow label */
.eyebrow{
  font-family:var(--font-head);font-weight:600;
  font-size:var(--fs-eyebrow);letter-spacing:.15em;text-transform:uppercase;
  color:var(--blue);
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-head);font-weight:600;
  border:none;border-radius:var(--radius-pill);cursor:pointer;
  padding:.85em 1.6em;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease,color .15s ease;
}
.btn-primary{background:var(--blue);color:#fff;box-shadow:var(--shadow);}
.btn-primary:hover{background:var(--blue-deep);transform:translateY(-2px);box-shadow:var(--shadow-hover);}
.btn-ghost{background:var(--surface);color:var(--ink);border:1.5px solid var(--line);box-shadow:var(--shadow);}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px);}
.btn-cover{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.55);backdrop-filter:blur(4px);}
.btn-cover:hover{background:rgba(255,255,255,.22);border-color:#fff;transform:translateY(-2px);}
.btn svg{width:1.1em;height:1.1em;flex:none;}
.btn-ig svg{color:#e4405f;}
.btn-yt svg{color:#ff0000;}
/* Social follow buttons (Instagram / YouTube) */
.social-buttons{display:flex;gap:.5rem;justify-self:end;}
.btn-social{gap:.45em;padding:.5em 1em;font-size:.85rem;background:var(--surface);color:var(--ink);border:1.5px solid var(--line);box-shadow:var(--shadow);}
.btn-social:hover{transform:translateY(-1px);box-shadow:var(--shadow-hover);}
.btn-social svg{width:1.05em;height:1.05em;flex:none;}
.btn-social--ig svg,.btn-social--yt svg,.btn-social--gh svg{color:#000;}
.btn-social--ig:hover{border-color:#e4405f;}
.btn-social--yt:hover{border-color:#ff0000;}
.btn-social--gh:hover{border-color:var(--ink);}

/* Site header / navigation */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(10px);}
.site-nav{max-width:none;padding-inline:clamp(var(--sp-lg),4vw,var(--sp-2xl));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-md);height:68px;}
.brandmark{justify-self:start;font-family:var(--font-display);font-weight:700;font-size:1.62rem;letter-spacing:0;color:var(--ink);}
.brandmark .now{color:var(--red);}
.site-menu{display:contents;}
.nav-links{display:flex;align-items:center;gap:1.6rem;justify-self:center;}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:40px;padding:0 11px;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;cursor:pointer;}
.nav-toggle:focus-visible{outline:3px solid var(--blue-soft);outline-offset:2px;}
.nav-toggle__bar{display:block;width:100%;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-links a{font-family:var(--font-head);font-weight:500;font-size:.9rem;color:var(--ink);opacity:.78;transition:opacity .15s,color .15s;}
.nav-links a:hover,.nav-links a.active{opacity:1;color:var(--blue);}

/* Site footer */
.site-footer{margin-top:var(--sp-3xl);padding-block:3.25rem 2rem;background:#12202e;color:#cdd9e5;}
.site-footer__top{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.site-footer .brandmark{color:#fff;font-size:1.15rem;}
.site-footer .brandmark .now{color:var(--red);}
.site-footer__brand p{max-width:34ch;margin-top:.5rem;color:#8fa2b4;font-size:.9rem;}
.site-footer__cols{display:flex;gap:3.5rem;flex-wrap:wrap;}
.site-footer__cols h4{margin-bottom:.75rem;font-family:var(--font-head);font-weight:600;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#7f93a6;}
.site-footer__cols a{display:block;padding:.25rem 0;color:#cdd9e5;font-size:.92rem;opacity:.85;}
.site-footer__cols a:hover{opacity:1;color:#fff;}
.site-footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-top:2rem;padding-top:1.25rem;border-top:1px solid #24354a;color:#7f93a6;font-size:.84rem;}

/* Badge / pill */
.badge{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:var(--font-head);font-weight:600;font-size:.95rem;
  color:var(--ink);background:var(--surface);
  padding:.7em 1.3em;border-radius:var(--radius-pill);
  box-shadow:var(--shadow);
}

/* Topic pills (wayfinding tints) */
.pill{
  font-family:var(--font-head);font-weight:600;font-size:.8rem;
  color:#fff;padding:.35em .9em;border-radius:var(--radius-pill);
}
.pill-planet{background:var(--t-planet);}
.pill-nature{background:var(--t-nature);}
.pill-space{background:var(--t-space);}
.pill-ingenuity{background:var(--t-ingenuity);}
.pill-compsci{background:var(--t-compsci);}

/* Text link */
.text-link{color:var(--blue);font-family:var(--font-head);font-weight:600;font-size:.92rem;}
.text-link:hover{color:var(--blue-deep);}

/* Hero — full-bleed rotating story cover with intro text blended over the left */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(520px,66vh,660px);display:flex;background:#0e1a26;margin-top:5px;}
.hero + .section{padding-top:var(--sp-3xl);}

/* rotating cover images (each carries its own left scrim + caption) */
.hero__track{position:absolute;inset:0;z-index:0;display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1);}
.hero__slide{position:relative;flex:0 0 100%;min-width:100%;background-size:cover;background-position:center;}
.hero__slide::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,17,25,.9) 0%,rgba(10,17,25,.78) 26%,rgba(10,17,25,.44) 46%,rgba(10,17,25,.1) 64%,transparent 78%);}
.hero__slide-link{position:absolute;inset:0;z-index:2;}
.hero__slide-cap{position:absolute;right:0;bottom:0;z-index:3;width:min(60%,640px);padding:var(--sp-2xl) var(--sp-xl) 3.4rem;color:#fff;background:linear-gradient(120deg,transparent 0%,rgba(8,14,20,.55) 45%,rgba(8,14,20,.8) 100%);pointer-events:none;}
.hero__slide-cap a{pointer-events:auto;}
.hero__slide-kicker{font-family:var(--font-head);font-weight:600;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#d8e6f2;}
.hero__slide-title{margin-top:.35rem;font-size:clamp(1.3rem,2.2vw,1.85rem);line-height:1.14;color:#fff;text-shadow:0 2px 14px rgba(6,12,18,.5);}
.hero__slide-go{display:inline-block;margin-top:.55rem;font-family:var(--font-head);font-weight:600;font-size:.82rem;color:#fff;opacity:.9;}
/* photo credit (reused on hero slides + story cover banners) */
.cover-credit{font-family:var(--font-head);font-weight:500;font-size:.62rem;letter-spacing:.01em;color:rgba(255,255,255,.62);}
.cover-credit a{color:rgba(255,255,255,.82);text-decoration:underline;text-underline-offset:2px;}
.hero__slide-cap .cover-credit{display:block;margin-top:.75rem;}

/* left intro text, aligned to the page container, blended over the image */
.hero__content{position:relative;z-index:2;width:100%;display:flex;align-items:center;pointer-events:none;}
.hero__content-inner{width:100%;padding:var(--sp-2xl) var(--sp-lg) var(--sp-2xl) clamp(var(--sp-lg),4vw,var(--sp-2xl));}
.hero__text{max-width:min(38%,290px);}
.hero__text > *{pointer-events:auto;}
.hero__title{font-size:clamp(2.1rem,4.4vw,3rem);color:#fff;text-shadow:0 2px 18px rgba(6,12,18,.55);}
.hero__title .now{color:#ff8a8a;}
.hero__lede{margin-top:var(--sp-sm);color:rgba(255,255,255,.93);font-size:var(--fs-lead);line-height:1.6;text-shadow:0 1px 12px rgba(6,12,18,.6);}
.hero__cta-line{margin-top:var(--sp-md);font-family:var(--font-body);font-weight:700;font-size:clamp(1.15rem,2.1vw,1.35rem);color:#fff;text-shadow:0 1px 12px rgba(6,12,18,.6);}
.hero__cta-line .now{color:#ff8a8a;}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--sp-sm);margin-top:var(--sp-lg);}
.hero__actions .btn{padding:.62em 1.05em;font-size:.92rem;}

/* slider controls */
.hero__slide-btn{position:absolute;bottom:1.2rem;z-index:3;width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:1.35rem;line-height:1;color:var(--ink);background:rgba(255,255,255,.9);border:none;border-radius:50%;cursor:pointer;box-shadow:var(--shadow);transition:background .15s;}
.hero__slide-btn:hover{background:#fff;}
.hero__slide-btn--prev{right:4.3rem;}
.hero__slide-btn--next{right:1.2rem;}
.hero__dots{position:absolute;left:var(--sp-lg);bottom:1.7rem;z-index:3;display:flex;gap:7px;}
.hero__dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.5);border:none;padding:0;cursor:pointer;transition:background .15s,transform .15s;}
.hero__dot.is-active{background:#fff;transform:scale(1.25);}

/* Section header */
.section-soft{background:var(--surface-soft);}
.section-head{margin-bottom:var(--sp-xl);}
.section-head.split{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-md);flex-wrap:wrap;}
.section-head h2{margin-top:var(--sp-xs);}
.head-actions{display:flex;align-items:center;gap:var(--sp-md);flex:none;}

/* Shared topic tints (used by topic + story cards) */
.tint-planet{--tint:var(--t-planet);}
.tint-nature{--tint:var(--t-nature);}
.tint-space{--tint:var(--t-space);}
.tint-ingenuity{--tint:var(--t-ingenuity);}
.tint-compsci{--tint:var(--t-compsci);}

/* Topic cards */
.topic-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-md);}
.topic-card{position:relative;display:block;border-radius:var(--radius);padding:1.4rem 1.25rem 1.5rem;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;transition:transform .18s,box-shadow .18s;}
.topic-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--tint,var(--blue));}
.topic-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.topic-card .dot{width:38px;height:38px;border-radius:11px;background:var(--tint,var(--blue));opacity:.14;margin-bottom:.9rem;}
.topic-card p{font-size:.9rem;color:var(--muted);margin-top:.4rem;line-height:1.55;}
.topic-card .go{display:inline-block;margin-top:.9rem;color:var(--tint,var(--blue));font-family:var(--font-head);font-weight:600;font-size:.82rem;}

/* Story cards */
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-lg);}
.story-card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s;}
.story-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.story-card__thumb{aspect-ratio:16/10;position:relative;background:linear-gradient(140deg,var(--tint,var(--blue)),color-mix(in srgb,var(--tint,var(--blue)) 55%,#111));}
.story-card__play{position:absolute;right:12px;top:12px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;}
.story-card__play::after{content:"";margin-left:2px;border-left:9px solid var(--ink);border-top:6px solid transparent;border-bottom:6px solid transparent;}
.story-card__kicker{position:absolute;left:12px;bottom:12px;padding:4px 10px;border-radius:var(--radius-pill);background:rgba(255,255,255,.94);color:#1a1a1a;font-family:var(--font-head);font-weight:600;font-size:.66rem;letter-spacing:.05em;text-transform:uppercase;}
.story-card__body{padding:1rem 1.1rem 1.25rem;}
.story-card__sub{font-family:var(--font-head);font-weight:600;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tint,var(--blue));}
.story-card__body h3{margin:.45rem 0 .6rem;font-size:1.12rem;font-weight:600;line-height:1.28;}
.story-card__meta{font-size:.8rem;color:var(--muted);font-weight:500;}

/* Newsletter band */
.newsletter{padding:3rem 2.5rem;text-align:center;border-radius:26px;border:1px solid var(--line);background:linear-gradient(150deg,#eaf4ff,#f4faff);}
.newsletter p{max-width:52ch;margin:.6rem auto 1.5rem;color:var(--muted);}
.nl-form{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;}
.nl-form input{min-width:280px;padding:.8em 1.1em;border-radius:var(--radius-pill);border:1.5px solid var(--line);background:#fff;font-family:var(--font-body);font-size:1rem;}
.nl-form input:focus{outline:none;border-color:var(--blue);}

/* ---------- 6. UTILITIES ---------- */
.text-center{text-align:center;}
.measure{max-width:60ch;}
.mx-auto{margin-inline:auto;}

/* Narrow container for article reading */
.container--narrow{max-width:820px;}

/* Real cover image inside a story card */
.story-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

/* Page header (index/landing pages) */
.page-head{padding-block:var(--sp-2xl) var(--sp-xl);text-align:center;background:var(--sky);}
.page-head h1{font-size:clamp(2rem,4.5vw,3rem);margin-top:var(--sp-xs);}
.page-head p{max-width:60ch;margin:var(--sp-md) auto 0;color:var(--muted);font-size:var(--fs-lead);}
.page-head .eyebrow{color:var(--tint,var(--blue));}

/* Single story */
.story{padding-block:var(--sp-2xl) var(--sp-3xl);}
.story__cover{position:relative;height:clamp(220px,34vh,380px);margin-top:calc(-1 * var(--sp-2xl));margin-bottom:var(--sp-xl);background-size:cover;background-position:center;}
.story__cover .cover-credit{position:absolute;right:.8rem;bottom:.5rem;max-width:72%;text-align:right;line-height:1.3;text-shadow:0 1px 5px rgba(0,0,0,.8);z-index:2;}
/* contain: show the whole image (for maps/diagrams that shouldn't be cropped), with a blurred fill behind the letterbox bars */
.story__cover--contain{overflow:hidden;}
.story__cover--contain::before,.story__cover--contain::after{content:"";position:absolute;inset:0;background-image:inherit;background-position:center;background-repeat:no-repeat;}
.story__cover--contain::before{background-size:cover;filter:blur(24px) brightness(.75);transform:scale(1.15);z-index:0;}
.story__cover--contain::after{background-size:contain;z-index:1;}

/* Two-column story layout: text left, sticky video right (desktop) */
.story__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);grid-template-areas:"header aside" "main aside";column-gap:var(--sp-2xl);align-items:start;}
.story__header{grid-area:header;margin-bottom:var(--sp-xl);}
.story__aside{grid-area:aside;position:sticky;top:88px;}
.story__main{grid-area:main;min-width:0;}
.story__grid--single{grid-template-columns:minmax(0,620px);grid-template-areas:"header" "main";justify-content:center;}
/* single-column stories: let the fact card, lead and prose fill one shared (wider) measure instead of a narrow left-hugging block */
.story__grid--single .factcard,.story__grid--single .story__lead,.story__grid--single .prose{max-width:none;}
.story__aside .video-embed{max-width:100%;margin:0 0 var(--sp-md);}
.story__aside .story__links{margin:0;}
/* content in the reading column: left-aligned, capped for readability */
.story .story__main > *{margin-left:0;margin-right:0;}
.story .story__main .prose{margin-left:0;margin-right:0;}
.story .story__main > :first-child{margin-top:0;}
.back-link{display:inline-block;margin-bottom:var(--sp-lg);font-family:var(--font-head);font-weight:600;font-size:.88rem;color:var(--blue);}
.back-link:hover{color:var(--blue-deep);}
.story__title{font-size:clamp(1.9rem,4vw,2.6rem);margin-top:var(--sp-xs);}
.story__meta{margin-top:var(--sp-sm);color:var(--muted);font-weight:500;}
.video-embed{position:relative;width:100%;max-width:340px;margin:var(--sp-xl) auto 0;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#000;box-shadow:var(--shadow);}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* Prose (caption / notes) */
.prose{max-width:65ch;margin-inline:auto;color:var(--ink);font-size:1.05rem;line-height:1.75;}
.prose--pre{white-space:pre-line;}
.story .prose{margin-top:var(--sp-xl);}

/* Notes / corrections block */
.notes{max-width:65ch;margin:var(--sp-2xl) auto 0;padding:1.5rem 1.6rem;border-radius:16px;background:var(--surface-soft);border:1px solid var(--line);}
.notes__title{margin-bottom:var(--sp-sm);font-size:1.05rem;color:var(--ink);}
.notes .prose{margin-top:0;font-size:.98rem;color:#42525f;}

/* References */
.refs{max-width:65ch;margin:var(--sp-2xl) auto 0;}
.refs h2{margin-bottom:var(--sp-sm);font-size:1.15rem;}
.refs ul{padding-left:1.1rem;}
.refs li{margin-bottom:.5rem;color:var(--muted);font-size:.92rem;line-height:1.5;}

/* Story footer links */
.story__links{display:flex;flex-wrap:wrap;gap:.8rem;max-width:65ch;margin:var(--sp-2xl) auto 0;}
.story__links--top{justify-content:center;margin-top:var(--sp-lg);}

/* Big idea callout */
.big-idea{max-width:65ch;margin:var(--sp-2xl) auto 0;padding:1.3rem 1.6rem;border-radius:16px;background:var(--blue-soft);border-left:4px solid var(--blue);}
.big-idea__label{font-family:var(--font-head);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:.45rem;}
.big-idea__text{font-family:var(--font-head);font-weight:500;font-size:1.12rem;line-height:1.55;color:var(--ink);}

/* Feature fact card (map features): geological type + age, in the light-blue box */
.factcard{position:relative;max-width:65ch;margin:var(--sp-lg) auto 0;padding:1.3rem 1.6rem;border-radius:16px;background:var(--blue-soft);border-left:4px solid var(--blue);}
.factcard__share{position:absolute;top:.9rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;color:var(--blue-deep);background:var(--surface);border:1px solid var(--line);border-radius:9px;cursor:pointer;transition:background .15s,border-color .15s,color .15s;}
.factcard__share:hover,.factcard__share[aria-expanded="true"]{border-color:var(--blue);background:#fff;}
.factcard__share-menu{position:absolute;top:2.9rem;right:1rem;z-index:20;min-width:172px;padding:.3rem;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 26px rgba(22,71,140,.16);display:flex;flex-direction:column;gap:.15rem;}
.factcard__share-item{display:block;width:100%;text-align:left;font:500 .9rem/1.2 var(--font-head);color:var(--ink);background:none;border:0;border-radius:7px;padding:.55rem .65rem;cursor:pointer;text-decoration:none;}
.factcard__share-item:hover{background:var(--blue-50,#eef4fd);color:var(--blue-deep);}
.factcard__title{font-family:var(--font-head);font-weight:600;font-size:1.9rem;line-height:1.1;letter-spacing:-.01em;color:var(--ink);padding-right:2.4rem;}
.factcard__loc{color:var(--muted);font-size:.98rem;margin-top:.2rem;}
.factcard__type{font-family:var(--font-head);font-weight:600;font-size:1.1rem;color:var(--ink);margin-top:.9rem;}
.factcard__age{font-family:var(--font-head);font-weight:500;font-size:.95rem;color:var(--blue-deep);margin-top:.15rem;}
.factcard__credit{color:var(--muted);font-size:.8rem;margin-top:.7rem;border-top:1px solid var(--line,#eee);padding-top:.55rem;}
.factcard__credit a{color:inherit;}
/* Lead sentence under the fact card (was the "big idea" text, minus the label) */
.story__lead{max-width:65ch;margin:var(--sp-lg) auto 0;font-family:var(--font-head);font-weight:500;font-size:1.12rem;line-height:1.55;color:var(--ink);}

/* Story body (markdown) */
.story__body h3{font-family:var(--font-head);font-weight:600;font-size:1.2rem;letter-spacing:-.01em;color:var(--ink);margin:var(--sp-lg) 0 .5rem;}
.story__body p{margin-bottom:.95rem;}
.story__body ul{margin:.2rem 0 .95rem 1.2rem;}
.story__body li{margin-bottom:.4rem;}
.story__body em{color:var(--muted);}

/* Key terms */
.key-terms{max-width:65ch;margin:var(--sp-2xl) auto 0;}
.key-terms h2{font-size:1.2rem;margin-bottom:var(--sp-md);}
.key-terms dl{display:grid;gap:1rem;}
.key-terms dt{font-family:var(--font-head);font-weight:600;color:var(--ink);}
.key-terms dd{margin:.15rem 0 0;color:var(--muted);font-size:.96rem;line-height:1.6;}

/* Sources & further reading */
.further{max-width:65ch;margin:var(--sp-2xl) auto 0;}
.further h2{font-size:1.2rem;margin-bottom:var(--sp-md);}
.further__group{margin-bottom:var(--sp-md);}
.further__group h3{font-family:var(--font-head);font-weight:600;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:.5rem;}
.further__group ul{list-style:none;padding:0;}
.further__group li{margin-bottom:.6rem;line-height:1.5;font-size:.96rem;color:var(--ink);}
.further__group a{color:var(--blue);font-weight:500;}
.further__group a:hover{color:var(--blue-deep);}
.further__note{display:block;margin-top:.1rem;color:var(--muted);font-size:.85rem;}

/* Transcript (collapsible) */
.transcript{max-width:65ch;margin:var(--sp-2xl) auto 0;padding-top:var(--sp-md);border-top:1px solid var(--line);}
.transcript summary{font-family:var(--font-head);font-weight:600;font-size:.92rem;color:var(--muted);cursor:pointer;}
.transcript summary:hover{color:var(--ink);}
.transcript .prose{margin-top:var(--sp-md);font-size:.95rem;color:var(--muted);}

/* Related stories */
.related{margin-top:var(--sp-3xl);}

@media (max-width:900px){
  /* Hero on phones: cover fills, text sits at the bottom over a vertical veil */
  .hero{align-items:flex-end;min-height:clamp(480px,80vh,620px);}
  .hero__slide::before{background:linear-gradient(180deg,transparent 0%,rgba(10,17,25,.5) 40%,rgba(10,17,25,.92) 100%);}
  .hero__content-inner{padding:var(--sp-2xl) var(--sp-lg) 3.4rem;}
  .hero__text{max-width:none;}
  .hero__slide-cap{display:none;}
  .hero__slide-btn{display:none;}
  .hero__dots{bottom:1.3rem;}
  .topic-grid{grid-template-columns:repeat(2,1fr);}
  .story-grid{grid-template-columns:1fr;}
  .site-nav{display:flex;}
  .brandmark{margin-right:auto;}
  .nav-toggle{display:flex;}
  .site-menu{position:absolute;top:calc(100% + 1px);left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:.5rem 0 1rem;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 14px 26px rgba(22,71,140,.12);}
  .site-menu.is-open{display:flex;}
  .nav-links{flex-direction:column;align-items:stretch;gap:0;}
  .nav-links a{padding:.8rem var(--sp-lg);font-size:1.02rem;opacity:1;}
  .social-buttons{flex-direction:column;gap:.5rem;margin-top:.4rem;padding:.85rem var(--sp-lg) 0;border-top:1px solid var(--line);}
  .social-buttons .btn-social{justify-content:flex-start;width:100%;}
  .story__grid,.story__grid--single{grid-template-columns:1fr;grid-template-areas:"header" "aside" "main";}
  .story__aside{position:static;}
  .story__aside .video-embed{max-width:340px;margin:var(--sp-md) auto var(--sp-md);}
  .story__aside .story__links{justify-content:center;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;animation:none !important;}
}