/* Stories archive: a title-forward checkerboard of thumbnails and story names. */
.archive-page{overflow-x:hidden}
.archive-hero{padding-bottom:64px}
.archive-hero .page-kicker{max-width:680px}
.archive-board{padding:0 0 128px}
.archive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}
.archive-story{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:#e7e2d9;overflow:hidden;min-height:260px;transition:background .25s ease}
.archive-story:nth-child(4n+2),.archive-story:nth-child(4n+3){background:#ddd7cd}
/* figure has a browser-default 40px inline margin; reset it so the photo actually fills its 50% grid track. */
.archive-story__media{position:relative;min-width:0;margin:0;overflow:hidden;background:#d2ccc2;aspect-ratio:1}
.archive-story__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .8s cubic-bezier(.2,.7,.2,1),filter .45s ease}
.archive-story__body{min-width:0;padding:clamp(18px,2.1vw,34px);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.archive-story__meta{display:flex;justify-content:space-between;gap:16px;font-size:8px;line-height:1.25;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.archive-story h2{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.25vw,38px);line-height:1.02;letter-spacing:-.035em;margin:0;text-wrap:balance}
.archive-story__number{font-size:8px;letter-spacing:.14em;color:var(--muted)}
.archive-story:nth-child(even) .archive-story__media{order:2}
.archive-story:nth-child(even) .archive-story__body{order:1}
.archive-story:hover{background:#d8d1c6}
.archive-story:hover .archive-story__media img{transform:scale(1.018);filter:saturate(1.04)}

/* Scroll-driven reveal: CSS-only so the static renderer does not add maintained JavaScript. Titles remain visible throughout. */
@keyframes archive-image-reveal{from{opacity:0;transform:scale(.985) translateY(14px);filter:saturate(.82)}to{opacity:1;transform:none;filter:none}}
@supports (animation-timeline:view()){
  .archive-story__media img{animation-name:archive-image-reveal;animation-duration:1ms;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 0% cover 32%}
}

@media(max-width:980px){
  .archive-grid{grid-template-columns:1fr;gap:14px}
  .archive-story{min-height:230px}
  .archive-story h2{font-size:clamp(25px,4.5vw,36px)}
}

@media(max-width:640px){
  .archive-hero{padding-top:122px;padding-bottom:50px}
  .archive-hero h1{font-size:17vw}
  .archive-board{padding-bottom:82px}
  .archive-grid{width:100%;gap:8px}
  .archive-story{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0;aspect-ratio:2/1}
  .archive-story__media,.archive-story__body{min-width:0;max-width:100%}
  .archive-story__media{aspect-ratio:auto;height:100%}
  .archive-story__body{padding:14px 13px;gap:10px;overflow:hidden}
  .archive-story__meta{font-size:6.5px;gap:8px}
  .archive-story h2{font-size:clamp(20px,6vw,28px);line-height:1.01;letter-spacing:-.032em;overflow-wrap:anywhere}
  .archive-story__number{font-size:6.5px}
}

@media(orientation:landscape) and (max-height:720px){
  .archive-hero{padding-top:96px!important;padding-bottom:36px!important}
  .archive-hero h1{font-size:clamp(50px,min(7.5vw,13vh),88px)!important}
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .archive-story{min-height:190px}
  .archive-story__body{padding:16px}
  .archive-story h2{font-size:clamp(21px,2.5vw,30px)}
}

@media(hover:none),(pointer:coarse){.archive-story:hover .archive-story__media img{transform:none;filter:none}}
@media(prefers-reduced-motion:reduce){.archive-story,.archive-story__media img{transition:none!important;animation:none!important;opacity:1!important;transform:none!important;filter:none!important}}
