/*
  NARRATIVE — horizontal story slides (sticky rail + GSAP transform on desktop, native strip on mobile).
  Scoped under .hc-narrative. Requires the .hc-narrative-hold to carry `--nslides`.
*/
.hc-narrative{background:var(--paper);color:var(--ink)}
.hc-narrative-hold{position:relative;height:calc(var(--nslides) * 100vh)}
.hc-narrative-sticky{position:sticky;top:0;height:100vh;width:100%;overflow:hidden}
.hc-narrative-track{display:flex;height:100%;will-change:transform}
.hc-slide{
  width:100vw;flex:0 0 100vw;min-height:100vh;
  display:flex;align-items:center;
  padding:clamp(3rem,7vh,7rem) clamp(5vw,8vw,10vw);gap:clamp(2rem,5vw,5rem);
}
.hc-slide .hc-media{flex:1;min-width:0;overflow:hidden}
.hc-slide .hc-media img{width:100%;height:100%;object-fit:cover}
.hc-slide .hc-media.wide img{aspect-ratio:4/5}
.hc-slide .hc-txt{flex:1;min-width:0}
.hc-slide .hc-idx{font-family:var(--serif);font-weight:800;font-size:clamp(4rem,3rem+4vw,8rem);line-height:1;color:var(--accent)}
.hc-slide h3{font-family:var(--serif);font-weight:700;font-size:clamp(1.9rem,1.3rem+2vw,3.2rem);line-height:1.1;margin:1rem 0}
.hc-slide p{color:#3d3a31;max-width:34rem}
@media(max-width:820px){
  .hc-slide{flex-direction:column;padding-top:clamp(4rem,12vh,6rem)}
  .hc-slide .hc-media.wide img{aspect-ratio:16/10}
  .hc-narrative-sticky{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .hc-narrative-sticky::-webkit-scrollbar{display:none}
  .hc-narrative-sticky{scrollbar-width:none;-ms-overflow-style:none}
  .hc-narrative-track{will-change:auto}
}