/* Story pages only. The series cover index is unchanged. */
.story-page{--paper:#faf9f6;--story-width:1600px;--story-gutter:clamp(24px,4vw,64px);--story-pause:clamp(64px,7vw,112px);background:var(--paper);color:#242622}.story-page .masthead{max-width:var(--story-width);width:calc(100% - var(--story-gutter)*2);margin:auto;padding:26px 0;border:0}.story-skip{position:absolute;top:-100px;left:24px;background:var(--paper);padding:12px;z-index:5}.story-skip:focus{top:12px}.visual-story{max-width:var(--story-width);width:calc(100% - var(--story-gutter)*2);margin:auto}.story-hero{margin:10px 0 0}.story-photo{margin:0;min-width:0}.story-photo img{display:block;width:100%;height:auto}.story-intro{display:flex;gap:64px;align-items:start;padding:48px 0 64px;border-bottom:1px solid #d9d8d2;margin-bottom:var(--story-pause)}.story-intro>div:first-child{flex:1}.story-intro h1{font-family:Arial,Helvetica,sans-serif;font-size:clamp(30px,3vw,48px);font-weight:400;line-height:1.12;letter-spacing:-.035em;margin:0 0 22px}.story-credit{font-size:12px;line-height:1.7;margin:0;color:#646660}.story-credit span{margin:0 8px}.story-description{flex:1;font-size:clamp(16px,1.15vw,19px);line-height:1.65;max-width:660px}.story-description p{margin:0 0 18px}.story-description p:last-child{margin-bottom:0}.story-sequence{display:flex;flex-direction:column;gap:var(--story-pause)}.story-block{margin:0}.story-block.single{width:100%;margin:0 auto}.story-block.single.portrait{max-width:720px}.story-block.single.square{max-width:800px}.story-block.pair{display:flex;align-items:center;gap:32px;max-width:1280px;width:100%;margin:0 auto}.story-block.pair>.story-photo{width:calc(50% - 16px)}.story-end{display:flex;justify-content:space-between;gap:32px;padding:48px 0 72px;margin-top:var(--story-pause);border-top:1px solid #d9d8d2;font-size:12px;line-height:1.6}.story-end>span{color:#646660}.story-page footer{max-width:var(--story-width);width:calc(100% - var(--story-gutter)*2);margin:auto;font-size:10px}.story-page dialog{margin:0}.story-page .open-work:focus-visible{outline-offset:5px}
@media(max-width:700px){.story-page{--story-gutter:20px;--story-pause:56px}.story-page .masthead{padding:23px 0}.visual-story{width:100%}.story-hero{margin-top:8px}.story-intro{display:block;margin:0 var(--story-gutter) 56px;padding:30px 0 36px}.story-intro h1{font-size:32px;margin-bottom:14px}.story-credit{font-size:11px}.story-description{font-size:16px;line-height:1.65;margin-top:26px;max-width:none}.story-sequence{padding:0 var(--story-gutter)}.story-block.pair{display:flex;flex-direction:column;gap:32px}.story-block.pair>.story-photo{width:100%}.story-block.single.landscape{width:calc(100% + var(--story-gutter)*2);margin:0 calc(var(--story-gutter)*-1)}.story-end{display:block;margin:56px var(--story-gutter) 0;padding:28px 0 42px;font-size:11px}.story-end>span{display:block;margin-top:16px}.story-page footer{font-size:9px}.story-page .masthead>a:last-child{font-size:10px}}

/* Edge-to-edge opening; the sequence below retains its original dimensions. */
.story-hero{width:100%;max-width:none;margin:0}.story-intro{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,96px);padding:48px 0 56px}.story-intro h1{font-size:clamp(32px,3.2vw,50px);line-height:1.12;margin:0 0 20px}.story-description{max-width:660px;font-size:clamp(16px,1.2vw,20px);line-height:1.65}.story-credit{font-size:12px;letter-spacing:.01em}
@media(max-width:700px){.story-hero{margin:0;width:100%}.story-intro{display:block;padding:30px 0 36px}.story-intro h1{font-size:32px;line-height:1.15;margin-bottom:14px}.story-credit{font-size:11px}.story-description{font-size:16px;line-height:1.65;margin-top:26px}}

/* Opening-only overlay; all content and photo dimensions remain unchanged. */
.story-overlay{position:relative}.story-overlay .masthead{position:absolute;z-index:2;top:0;left:0;width:100%;max-width:none;margin:0;padding:26px var(--story-gutter);background:rgba(250,249,246,.08);color:#171b16;border:0;text-shadow:0 1px 2px rgba(255,255,255,.22)}.story-overlay .masthead a{color:inherit}.story-overlay .masthead a:focus-visible{outline-color:currentColor}.story-overlay .story-hero{margin:0}.story-overlay .story-skip:focus{z-index:3}
@media(max-width:700px){.story-overlay .masthead{padding:23px var(--story-gutter);background:rgba(250,249,246,.06)}.story-overlay .brand span{font-size:8px}}

.story-overlay .masthead>a:last-child{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.65);font-weight:500}

@media(max-width:700px){.story-overlay .brand span{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.65)}}

/* Fixed navigation changes appearance only as its lower edge leaves the hero. */
.story-overlay .masthead{position:fixed;z-index:20;transition:background-color .24s ease,color .24s ease,box-shadow .24s ease,text-shadow .24s ease}.story-overlay .masthead a,.story-overlay .masthead .brand span{transition:color .24s ease,text-shadow .24s ease}.story-overlay .masthead.is-on-paper{background:rgba(250,249,246,.96);color:#242622;text-shadow:none;box-shadow:0 1px 0 rgba(36,38,34,.09)}.story-overlay .masthead.is-on-paper>a:last-child,.story-overlay .masthead.is-on-paper .brand span{color:#242622;text-shadow:none}.story-overlay .story-skip:focus{z-index:30}.story-overlay #story-title{scroll-margin-top:100px}
@media(prefers-reduced-motion:reduce){.story-overlay .masthead,.story-overlay .masthead a,.story-overlay .masthead .brand span{transition:none}}

/* One photograph and a reserved, intentionally blank editorial column. */
.story-in-progress .story-block.editorial{display:flex;align-items:flex-start;gap:clamp(32px,4vw,64px);width:100%;max-width:none;margin:0}.story-in-progress .editorial>.story-photo,.story-in-progress .editorial>.story-copy{flex:1;min-width:0}.story-in-progress .story-end{margin-top:64px;padding:28px 0 40px}
@media(max-width:700px){.story-in-progress .story-block.editorial{display:block}.story-in-progress .editorial>.story-photo{width:100%}.story-in-progress .story-copy:empty{display:none}.story-in-progress .story-end{margin-top:42px}}

/* The next image begins precisely at the previous image's bottom edge. */
.story-in-progress .story-sequence{gap:0}.story-in-progress .editorial-right>.story-photo{order:2}.story-in-progress .editorial-right>.story-copy{order:1}
@media(max-width:700px){.story-in-progress .story-sequence{gap:32px}}

.story-in-progress .story-block.full-width{width:100%;max-width:none;margin:0}.story-in-progress .story-block.full-width>.story-photo{width:100%}

/* Small, consistent breathing space between successive story photographs. */
.story-in-progress .story-sequence{gap:24px}
@media(max-width:700px){.story-in-progress .story-sequence{gap:20px}}

/* Pure white paper throughout this story; photograph pixels are untouched. */
.story-page{--paper:#fff;background:#fff}.story-overlay .masthead.is-on-paper{background:rgba(255,255,255,.96)}

/* Remaining photographs: regular rows, equal columns, full original frames. */
.story-in-progress .remaining-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;row-gap:48px;margin-top:40px;align-items:start}.remaining-grid .story-photo{width:100%;min-width:0}.remaining-grid .open-work{display:flex;align-items:center;justify-content:center;height:clamp(240px,32vw,540px)}.remaining-grid .story-photo img{width:100%;height:100%;object-fit:contain}
@media(min-width:701px) and (max-width:1000px){.story-in-progress .remaining-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.remaining-grid .open-work{height:48vw}}
@media(max-width:700px){.story-in-progress .remaining-grid{grid-template-columns:1fr;row-gap:28px;margin-top:20px}.remaining-grid .open-work{height:auto;display:block}.remaining-grid .story-photo img{height:auto;object-fit:contain}}

/* Align the actual photographs to row tops, with equal widths and uncropped natural heights. */
.remaining-grid .open-work{height:auto;display:block}.remaining-grid .story-photo img{height:auto;width:100%}

/* Four columns; each row groups matching original aspect ratios. */
.story-in-progress .remaining-grid{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:24px;row-gap:32px}
@media(min-width:701px) and (max-width:1000px){.story-in-progress .remaining-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.story-in-progress .remaining-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:24px}}
@media(max-width:420px){.story-in-progress .remaining-grid{grid-template-columns:1fr}}

/* Restrained editorial typography, matching the reference's actual Roboto family. */
.story-in-progress .story-intro,.story-in-progress .story-copy,.story-in-progress .story-sources{font-family:Roboto,Arial,sans-serif;font-weight:400}
.story-in-progress .story-intro h1{font-family:Roboto,Arial,sans-serif;font-size:clamp(36px,4.5vw,68px);font-weight:400;line-height:1.03;letter-spacing:-.035em;text-transform:uppercase;color:#777;max-width:10ch}
.story-in-progress .story-description p{font-size:clamp(20px,1.85vw,27px);line-height:1.3;color:#171717;margin:0 0 1.5em}
.story-in-progress .story-description p+p{font-size:clamp(17px,1.4vw,20px);line-height:1.45;color:#737373}
.story-in-progress .story-copy{padding:clamp(8px,2.5vw,40px) 0 32px;align-self:flex-start}
.story-in-progress .story-copy h2{font-size:clamp(25px,2.5vw,36px);font-weight:400;line-height:1.13;letter-spacing:-.025em;color:#777;margin:0 0 28px}
.story-in-progress .story-copy p{font-size:clamp(18px,1.6vw,23px);line-height:1.45;margin:0 0 1.35em;max-width:48ch;color:#171717}
.story-in-progress .story-copy p+p{color:#737373;font-size:clamp(17px,1.35vw,19px);line-height:1.5}
.story-sources{font-size:13px;line-height:1.6;color:#777;margin:40px 0 0}.story-sources a{color:inherit;text-underline-offset:3px}
@media(max-width:700px){.story-in-progress .story-copy{padding:28px 0 8px}.story-in-progress .story-intro h1{font-size:42px}.story-in-progress .story-description p{font-size:21px}.story-in-progress .story-copy h2{margin-bottom:20px}.story-sources{margin-left:20px;margin-right:20px}}
