/* V15.5 — Timeline reflow: header top, full-width track below, hint at end */
.memory-timeline{
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:100vw!important;
  min-height:100svh!important;
  box-sizing:border-box!important;
}
.memory-timeline .timeline-header{
  width:min(900px,100%)!important;
  box-sizing:border-box!important;
  margin:0 auto 28px!important;
  flex:0 0 auto!important;
}
.memory-timeline .timeline-track{
  width:100%!important;
  max-width:1180px!important;
  box-sizing:border-box!important;
  margin:0 auto!important;
  flex:0 0 auto!important;
}
.memory-timeline .timeline-progress{
  width:min(1080px,calc(100% - 44px))!important;
  flex:0 0 auto!important;
}
.memory-timeline .timeline-hint{
  flex:0 0 auto!important;
}

@media (max-width:720px){
  .memory-timeline{
    padding:78px 0 86px!important;
    min-height:100svh!important;
  }
  .memory-timeline .timeline-header{
    padding:0 20px!important;
    margin-bottom:20px!important;
  }
  .memory-timeline .timeline-header .eyebrow{
    font-size:.64rem!important;
    letter-spacing:.20em!important;
    margin-bottom:10px!important;
  }
  .memory-timeline .timeline-header h2{
    font-size:clamp(2.8rem,13vw,4.4rem)!important;
    line-height:.9!important;
    margin:.15em 0 .3em!important;
  }
  .memory-timeline .timeline-header p:last-child{
    max-width:520px!important;
    margin:14px auto 0!important;
    font-size:1.02rem!important;
    line-height:1.42!important;
  }
  .memory-timeline .timeline-track{
    width:100vw!important;
    max-width:none!important;
    height:clamp(440px,62svh,620px)!important;
    padding:16px 18px 26px!important;
    gap:14px!important;
    scroll-snap-type:x mandatory!important;
    overscroll-behavior-x:contain!important;
    touch-action:pan-x!important;
    align-items:stretch!important;
  }
  .memory-timeline .timeline-track:before{
    top:50%!important;
    left:18px!important;
    right:18px!important;
    height:1px!important;
    background:linear-gradient(90deg,transparent,rgba(218,178,91,.58),transparent)!important;
  }
  .memory-timeline .timeline-card{
    flex:0 0 calc(100vw - 36px)!important;
    width:calc(100vw - 36px)!important;
    min-height:0!important;
    height:100%!important;
    box-sizing:border-box!important;
    padding:20px 20px 22px!important;
    border-radius:14px!important;
    scroll-snap-align:center!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
    background:linear-gradient(155deg,rgba(255,255,255,.075),rgba(255,255,255,.018))!important;
  }
  .memory-timeline .timeline-card.is-active{
    transform:translateY(-2px)!important;
    border-color:rgba(226,188,100,.72)!important;
  }
  .memory-timeline .timeline-year{
    top:17px!important;
    right:18px!important;
    font-size:.64rem!important;
  }
  .memory-timeline .timeline-dot{
    top:50%!important;
    left:50%!important;
    width:13px!important;
    height:13px!important;
    transform:translate(-50%,-50%)!important;
    z-index:3!important;
    background:#18090d!important;
  }
  .memory-timeline .timeline-memory{
    order:0!important;
    flex:0 0 150px!important;
    width:100%!important;
    height:150px!important;
    margin:0 0 14px!important;
    border-radius:10px!important;
  }
  .memory-timeline .timeline-memory img{
    object-position:center!important;
  }
  .memory-timeline .timeline-age{
    order:1!important;
    margin:0 0 5px!important;
    font-size:.68rem!important;
    letter-spacing:.16em!important;
  }
  .memory-timeline .timeline-card h3{
    order:2!important;
    margin:0 0 7px!important;
    font-size:1.18rem!important;
    line-height:1.1!important;
  }
  .memory-timeline .timeline-card>p:not(.timeline-age){
    order:3!important;
    margin:0!important;
    font-size:1.02rem!important;
    line-height:1.34!important;
    opacity:.82!important;
    max-width:34rem!important;
  }
  .memory-timeline .timeline-photo{
    order:4!important;
    align-self:flex-start!important;
    margin-top:auto!important;
    padding:9px 0 5px!important;
    font-size:.68rem!important;
    min-height:34px!important;
  }
  .memory-timeline .timeline-progress{
    width:calc(100% - 36px)!important;
    max-width:none!important;
    margin:14px 18px 0!important;
  }
  .memory-timeline .timeline-hint{
    margin:18px 22px 0!important;
    font-size:.68rem!important;
    line-height:1.65!important;
    letter-spacing:.13em!important;
    opacity:.82!important;
    text-transform:uppercase!important;
  }
  .memory-timeline .timeline-hint::first-line{color:#f1d28d}
}

@media (max-width:380px){
  .memory-timeline{padding-top:70px!important;padding-bottom:72px!important}
  .memory-timeline .timeline-header h2{font-size:clamp(2.55rem,12.5vw,3.5rem)!important}
  .memory-timeline .timeline-header p:last-child{font-size:.96rem!important}
  .memory-timeline .timeline-track{height:clamp(420px,60svh,540px)!important;padding-left:14px!important;padding-right:14px!important}
  .memory-timeline .timeline-card{flex-basis:calc(100vw - 28px)!important;width:calc(100vw - 28px)!important;padding:17px 17px 19px!important}
  .memory-timeline .timeline-memory{height:132px!important;flex-basis:132px!important}
  .memory-timeline .timeline-card>p:not(.timeline-age){font-size:.96rem!important}
  .memory-timeline .timeline-progress{width:calc(100% - 28px)!important;margin-left:14px!important;margin-right:14px!important}
}

@media (prefers-reduced-motion:reduce){
  .memory-timeline .timeline-card{transform:none!important}
}