/* Progressive enhancement: all copy remains in document order and readable. */
.scroll-stage,.scroll-meter{display:none}
.scroll-story .hero-film .brand-film{transform:scale(var(--film-scale,1));transform-origin:65% 50%}
.scroll-story .hero-copy{transform:translateY(var(--copy-shift,0px))}
.scroll-story .story-opening h2 em{color:color-mix(in srgb,#c3cbd6 calc((1 - var(--story-ink,1))*100%),#3478ef)}
.scroll-story .connection{position:relative;padding-block:30px 65px}
.scroll-story .connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}
.scroll-story .connection-grid>.scroll-stage{display:block;position:relative;aspect-ratio:1;overflow:hidden;border-radius:32px;background:#eff4fa}
.scroll-scene{position:absolute;inset:0;opacity:0;transform:scale(1.06);transition:opacity .55s ease,transform .8s ease;overflow:hidden;background:#e8dfd3}
.scroll-scene.story-active{opacity:1;transform:scale(1)}
.scroll-scene img{width:100%;height:100%;object-fit:cover}
.scroll-scene:last-child{background:radial-gradient(circle,#55492b,#171714 78%)}
.scroll-scene:last-child img{object-fit:contain;padding:25px}
.scroll-scene>span{position:absolute;left:24px;bottom:24px;border-radius:12px;padding:12px 16px;background:#ffffffed;color:#344258;font-size:12px;letter-spacing:.07em;font-weight:650}
.scroll-story .connection-flow{display:flex;flex-direction:column;gap:12px}
.scroll-story .connection-flow li{background:#f6f8fb;border:1px solid transparent;transition:background .4s,border-color .4s,transform .4s;opacity:.65;padding:22px 24px}
.scroll-story .connection-flow li.story-active{opacity:1;background:#edf4ff;border-color:#b9d3ff;transform:translateX(8px)}
.scroll-story .connection-flow li.story-active>span{background:#3478ef;color:#fff}
.scroll-story .connection-flow li.story-complete{opacity:1}
.scroll-story .connection-flow small{margin-top:0}
.scroll-story .connection-flow p{margin-bottom:0}
.scroll-story .connection.scroll-pinned{height:185vh;min-height:1250px;padding-top:0;padding-bottom:100px}
.scroll-pinned .connection-grid{position:sticky;top:125px;min-height:510px}
.scroll-story .scroll-meter{display:block;height:3px;background:#eaf0f7;position:absolute;left:0;right:0;bottom:25px;overflow:hidden;border-radius:3px}
.scroll-meter i{display:block;width:100%;height:100%;background:#3478ef;transform:scaleX(var(--progress,0));transform-origin:left}
.scroll-story .project .project-art{translate:0 var(--art-shift,0px)}
.scroll-story .project.scroll-card{position:sticky;top:100px;z-index:calc(2 + var(--card-index));transform:scale(var(--card-scale,1));filter:brightness(var(--card-shade,1));transform-origin:50% 0;box-shadow:0 -12px 45px #172d4c0a}
.scroll-story .project-grid{isolation:isolate}
.scroll-story .project.scroll-card:focus-within{filter:none;transform:none;z-index:8}
@media(max-width:1000px){.scroll-story .connection-grid{gap:25px}.scroll-story .connection-flow li{padding:18px}.scroll-story .connection-flow h3{font-size:22px}}
@media(max-width:700px){.scroll-story .connection{padding-block:15px 35px}.scroll-story .connection-grid{display:block}.scroll-story .connection-grid>.scroll-stage{display:none}.scroll-story .connection-flow li{opacity:1;transform:none}.scroll-story .connection-flow li.story-active{transform:none}.scroll-story .project .project-art{translate:0 calc(var(--art-shift,0px)*.35)}.scroll-story .scroll-meter{bottom:14px}}
@media(prefers-reduced-motion:reduce){.scroll-stage,.scroll-meter{display:none!important}}
@media print{.connection.scroll-pinned{height:auto!important;min-height:0!important}.connection-grid,.project.scroll-card{position:static!important;transform:none!important;filter:none!important}.scroll-stage,.scroll-meter{display:none!important}.connection-grid{display:block!important}.connection-flow li{opacity:1!important}}