/* The family's real archive carries the journey. Native scroll sets its pace. */
.story-page { --chapter-ink: #e8eef1; --chapter-muted: #a6b4c4; background:#040810; }
.story-page .story-prologue {
  position:relative; isolation:isolate; display:flex; align-items:center;
  min-height:min(860px, 100svh); padding:9rem var(--gutter) 7rem;
  overflow:hidden; background:#040810;
}
.story-prologue-image { position:absolute; inset:0; z-index:-2; }
.story-prologue-image img { width:100%; height:100%; object-fit:cover; object-position:70% 60%; }
.story-prologue-image::after {
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(4,8,16,.96) 0%,rgba(4,8,16,.81) 28%,rgba(4,8,16,.08) 75%),linear-gradient(0deg,#040810 0%,transparent 45%,rgba(4,8,16,.35));
}
.story-prologue-copy { max-width:52rem; }
.story-prologue .section-label { color:var(--ice);font-size:.65rem;line-height:1.7;letter-spacing:.16em;margin:0 0 2rem; }
.story-prologue h1 { font-family:"Open Sans",Arial,sans-serif;font-size:clamp(3.2rem,6.8vw,7rem);font-weight:800;letter-spacing:-.065em;line-height:1.04;margin:0 0 1.7rem; }
.story-prologue h1 span { color:var(--ice); }
.story-prologue-copy > p:not(.section-label) { max-width:29rem; font-size:clamp(.95rem,1.2vw,1.1rem);line-height:1.8;color:#c2ccd8; }
.story-begin { display:inline-flex;align-items:center;gap:1rem;min-height:48px;margin-top:1.5rem;font-size:.73rem;font-weight:700; }
.story-begin-line { width:3.5rem;height:1px;background:var(--ice);box-shadow:0 0 10px #73ddff77;transition:width .3s; }
.story-begin:hover .story-begin-line { width:5rem; }
.story-prologue-caption { position:absolute;right:var(--gutter);bottom:3.5rem;margin:0;text-align:right;color:#a9b9c9;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.8; }
.story-prologue-caption span { display:block;color:#e7edf5;letter-spacing:0;text-transform:none;font-size:.83rem; }
.story-page .story { padding:0 var(--gutter) 7rem;color:var(--chapter-ink);background:#040810;overflow:visible; }
.story-page .story::before { display:none; }
.story-page .year-nav { position:sticky;top:4.4rem;z-index:30;max-width:none;margin:0 calc(-1 * var(--gutter));padding:.55rem var(--gutter);gap:clamp(1rem,3vw,3rem);align-items:center;flex-wrap:nowrap;overflow-x:auto;background:rgba(4,8,16,.95);backdrop-filter:blur(18px);border-block:1px solid #ffffff16;scrollbar-width:none; }
.story-page .year-nav a { flex-shrink:0;position:relative;min-height:42px;border-bottom:0;color:#7e90a4;font-size:.73rem;font-weight:600;transition:color .25s; }
.story-page .year-nav a:hover,.story-page .year-nav a.is-current { color:var(--ice); }
.story-page .year-nav a.is-current::after { content:"";position:absolute;bottom:-.6rem;inset-inline:0;height:2px;background:var(--ice);box-shadow:0 0 14px #73ddff88; }
.story-page .story-journey { max-width:1440px;padding-left:2rem; }
.story-page .journey-stop { min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);column-gap:clamp(2rem,6vw,6rem);row-gap:3.5rem;padding:6rem 0;border-top:1px solid #d6e5ff19;scroll-margin-top:10rem; }
.story-page .journey-stop:first-child { border-top:0; }
.story-page .journey-stop > div { max-width:none;align-self:start; }
.story-page .chapter-scene { position:sticky;top:10.2rem;min-width:0; }
.story-page .chapter-year { display:flex;align-items:baseline;justify-content:space-between;margin:0 0 1.6rem;gap:1rem; }
.story-page .chapter-year .section-label { color:#8397ac;font-size:.6rem; }
.story-page .journey-stop time { display:block; margin:0; font-family:"Open Sans",Arial,sans-serif;font-size:clamp(3.6rem,6.5vw,6rem);font-weight:700;color:var(--ice);-webkit-text-stroke:0;line-height:.9;letter-spacing:-.07em; }
.story-page .journey-photo { margin:0; }
.story-page .journey-photo > a { display:block;position:relative;overflow:hidden;background:#0b1421; }
.story-page .journey-photo img { width:100%;height:auto;transform:scale(calc(1 + var(--chapter-progress,0) * .025)); }
.story-page .journey-photo figcaption { display:block;color:#8397ac;font-size:.66rem;line-height:1.7;padding-top:.8rem; }
.story-page .journey-photo figcaption > * { display:block; }
.story-page .journey-photo figcaption a { width:fit-content;margin-top:.25rem;color:#a5b9ce; }
.story-page .journey-copy { padding-top:.25rem; }
.story-page .journey-place { color:#85bbd0;letter-spacing:.09em;font-size:.62rem;line-height:1.8;margin-bottom:1.2rem; }
.story-page .journey-stop h3 { max-width:15ch;font-family:"Open Sans",Arial,sans-serif;font-size:clamp(2rem,3.1vw,3.4rem);font-weight:700;line-height:1.1;letter-spacing:-.045em;text-transform:none;margin-bottom:1.8rem; }
.story-page .journey-copy > p:not(.journey-place) { color:#acb9c9;font-size:1rem;line-height:1.9;margin-bottom:1.25rem; }
.story-page .journey-copy strong { color:#e5edf7;font-weight:600; }
.story-page .archive-source { color:var(--ice);font-size:.69rem;margin-top:.5rem; }
.story-page .origin-quote { border-color:#73ddff33;padding:1.5rem 0 0;margin-top:2rem; }
.story-page .origin-quote p { font-family:"Open Sans",Arial,sans-serif;font-size:clamp(1.3rem,2.2vw,2rem);letter-spacing:-.035em;line-height:1.4;font-weight:600; }
.story-page .origin-quote cite { color:#8da1b8; }
.story-page .chapter-quiet { position:relative;min-height:17rem;padding:2rem;border:1px solid #b1d9ff21;background:linear-gradient(130deg,#0d1a29,#040810 70%); }
.chapter-quiet p { position:relative;z-index:1;font-family:"Open Sans",Arial,sans-serif;font-size:clamp(1.5rem,2.4vw,2.5rem);font-weight:600;letter-spacing:-.04em;line-height:1.4;margin:2rem 0 0; }
.chapter-quiet p span { color:var(--ice); }
.chapter-light { position:absolute;top:2rem;left:2rem;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 12px 3px #b3e9ff88,0 0 60px 20px #5bcfff22; }
.chapter-future .text-link { margin-top:2rem; }
.story-page .journey-next { margin:0;padding:6rem 0;background:transparent;border-color:#d6e5ff19; }
.story-page .photo-gallery { grid-column:1/-1; }
.story-page .photo-gallery-heading { border-color:#d6e5ff25;padding-top:2.5rem; }
.story-page .photo-gallery-heading :is(h2,h4) { color:#edf3fb; }
.story-page .photo-gallery-heading .section-label { color:#86a6bc; }
.story-page .photo-gallery-heading > p,.story-page .photo-gallery-grid figcaption { color:#acb9c9; }
.story-page .photo-gallery-grid .photo-date { color:#7790a7; }
.story-page .photo-gallery-grid { gap:2rem 1.5rem; }
.story-page .story-thanks { grid-template-columns:.9fr 1fr;border-top:1px solid #73ddff33;padding-top:4rem;margin-top:1rem;gap:4rem; }
.story-page .story-thanks .section-label { color:var(--ice); }
.story-page .story-thanks h3 { font-family:"Open Sans",Arial,sans-serif;font-size:clamp(2rem,3.6vw,3.5rem);font-weight:600;letter-spacing:-.045em;line-height:1.15; }
.story-page .thanks-copy { color:#acb9c9;font-size:1rem;line-height:1.85; }
.story-page .thanks-copy strong { color:#e5edf7; }
.story-page .thanks-copy .thanks-signature { color:var(--ice);font-size:1.7rem; }
.story-page :focus-visible { outline-color:var(--ice); }
@media(max-width:760px) {
  .story-page .story-prologue { min-height:850px;min-height:95svh;padding:8.5rem var(--gutter) 10rem;align-items:flex-start; }
  .story-prologue-image img { object-position:65% 100%; }
  .story-prologue-image::after { background:linear-gradient(180deg,rgba(4,8,16,.96),rgba(4,8,16,.84) 32%,rgba(4,8,16,.16) 73%,#040810); }
  .story-prologue h1 { font-size:clamp(2.9rem,10.8vw,4.6rem); }
  .story-prologue-copy > p:not(.section-label) { max-width:25rem;font-size:.9rem; }
  .story-prologue .section-label { max-width:25ch;font-size:.58rem; }
  .story-prologue-caption { bottom:2rem;right:var(--gutter);font-size:.56rem; }
  .story-prologue-caption span { font-size:.72rem; }
  .story-page .year-nav { top:4.7rem;gap:1.5rem; }
  .story-page .story-journey { padding-left:1rem; }
  .story-page .journey-stop { grid-template-columns:minmax(0,1fr);gap:2rem;padding:3rem 0;scroll-margin-top:10rem; }
  .story-page .chapter-scene { position:relative;top:auto; }
  .story-page .chapter-year { margin-bottom:1.3rem; }
  .story-page .journey-stop time { font-size:4rem;margin:0; }
  .story-page .journey-stop h3 { font-size:2rem;max-width:17ch; }
  .story-page .journey-copy > p:not(.journey-place) { font-size:.93rem;line-height:1.85; }
  .story-page .chapter-quiet { min-height:13rem;padding:1.5rem; }
  .chapter-light { left:1.5rem;top:1.5rem; }
  .chapter-quiet p { font-size:1.7rem; }
  .story-page .story-thanks { grid-template-columns:1fr;gap:2rem;padding-top:3rem; }
}
@media(prefers-reduced-motion:reduce) {
  .story-page .journey-photo img { transform:none; }
}
.story-prologue-image img { transform:scale(1.15);transform-origin:25% 55%; }
@media(max-width:760px) { .story-page .story-journey { --story-rail-x:0; } }
@media(max-width:760px) {
  .story-prologue-image img { position:absolute;bottom:0;left:0;height:auto;transform:scale(1.5);transform-origin:50% 100%; }
  .story-prologue-image::after { background:linear-gradient(180deg,#040810 0%,rgba(4,8,16,.88) 36%,rgba(4,8,16,.3) 64%,rgba(4,8,16,.12) 78%,#040810 100%); }
}

/* The pinned lead image belongs only to the chapter's narrative row. */
.story-page #year-2023 { display:block; }
.story-page .chapter-row { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);column-gap:clamp(2rem,6vw,6rem);align-items:start; }
.story-page .chapter-gallery { margin-top:3.5rem; }
@media(max-width:760px) {
  .story-page .chapter-row { grid-template-columns:minmax(0,1fr);gap:2rem; }
  .story-page .chapter-gallery { margin-top:3rem; }
}
