.page-head{padding-top:clamp(40px,7vw,80px);padding-bottom:clamp(20px,3vw,32px)}
.page-head h1{font-size:clamp(3rem,9vw,6.4rem)}
.page-head .sub{font-size:clamp(1.15rem,2vw,1.4rem);font-weight:600;font-stretch:108%;max-width:38ch;margin:18px 0 0;line-height:1.3}
.timeline{list-style:none;margin:0;padding:clamp(24px,4vw,48px) 0 clamp(56px,8vw,96px)}
.timeline > li{position:relative;display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:clamp(16px,4vw,48px);padding:0 0 clamp(48px,7vw,80px)}
.timeline > li::before{content:"";position:absolute;left:calc(min(220px,max(150px,22vw)) + clamp(8px,2vw,24px) - 1px);top:10px;bottom:0;border-left:2px solid var(--ink)}
.timeline > li:last-child::before{display:none}
.when{font-stretch:125%;font-weight:900;font-size:clamp(1.25rem,2.4vw,1.7rem);line-height:1.05;text-align:right;padding-top:2px}
.when small{display:block;font-size:.95rem;font-stretch:100%;font-weight:600;color:var(--muted);margin-top:6px}
.what{position:relative}
.what::before{content:"";position:absolute;left:calc(-1 * clamp(16px,4vw,48px) / 2 - 8px);top:6px;width:16px;height:16px;border-radius:50%;background:var(--paper);border:3px solid var(--ink)}
.timeline > li.now .what::before{background:var(--blue);border-color:var(--blue)}
.what h2{font-stretch:118%;font-weight:900;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.05;margin:0 0 10px}
.what p{margin:0 0 12px;max-width:58ch}
.pics{display:grid;grid-template-columns:repeat(2,minmax(0,300px));gap:14px;margin-top:20px}
.pics figure{margin:0}
.pics img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:14px;background:var(--field)}
.pics figcaption{font-size:.88rem;color:var(--muted);margin-top:6px}
.pics.mri img{object-fit:contain;background:#000}
@media (max-width:700px){
  .timeline > li{grid-template-columns:minmax(0,1fr);gap:10px;padding-left:28px}
  .timeline > li::before{left:7px;top:12px}
  .when{text-align:left}
  .what::before{left:-29px;top:-34px}
}
.diagram{margin:16px 0 0;max-width:420px}
/* Black line art on white, same as the logo, so it inverts in dark mode
   instead of sitting on the page as a bright white card. */
.diagram img{width:100%;height:auto;display:block;filter:var(--logo-filter)}
.diagram figcaption{font-size:.88rem;color:var(--muted);margin-top:6px}
.disclaim{font-size:.92rem;color:var(--muted);max-width:60ch;margin:0}
