/* One reversible story, tied to ordinary page scrolling. */
.hero .home-showcase{height:620px}
.hero .hero-paper-object{z-index:4;width:220px;transform-origin:top left;opacity:0;pointer-events:none}
.scan-beam{position:absolute;left:0;right:0;top:0;height:2px;background:#147ce5;box-shadow:0 -12px 24px 7px #1688e522;opacity:0}
.hero .scan-result{position:absolute;inset:37px 8px 19px;background:#f5f6f8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;pointer-events:none;border-radius:0 0 23px 23px}
.result-title{font-size:14px;font-weight:600;color:#1d1d1f}
.hero .result-page{display:block;width:82%;aspect-ratio:3/4;background:white;box-shadow:0 4px 16px #1820300a}
.hero .home-shot .result-page img{display:block;width:100%;height:100%;object-fit:contain;flex:none}
.result-tools{font-size:10px;color:#62626b}
.result-save{font-size:12px;font-weight:600;background:#087beb;color:white;padding:10px 0;width:86%;border-radius:20px;text-align:center}
.scan-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;color:#1d1d1f;font-size:18px;font-weight:500;line-height:1.5}
.scan-phase{display:block}.phase-paper,.phase-scan{display:none}.scan-caption small{display:block;font-size:11px;color:#86868b;font-weight:400;margin-top:7px}
.scroll-story .hero{height:calc(100svh + 850px);align-items:start;padding-bottom:90px}
.scroll-story .hero-copy{position:sticky;top:150px}
.scroll-story .hero .home-showcase{position:sticky;top:90px}
.scroll-story .hero .hero-paper-object{opacity:1;will-change:transform,opacity}
.scroll-story .scan-result{opacity:0}
.scroll-story .scan-phase{display:none}
.scroll-story [data-phase=paper] .phase-paper,.scroll-story [data-phase=scan] .phase-scan,.scroll-story [data-phase=done] .phase-done{display:block}
@media(max-width:1050px){.hero .hero-paper-object{width:165px}.hero .home-showcase{height:530px}.hero .scan-result{gap:14px}.result-title{font-size:12px}.result-save{padding:8px 0;font-size:11px}}
@media(max-width:700px){.hero .home-showcase{height:530px}.scroll-story .hero{height:auto;padding-bottom:40px}.scroll-story .hero::after{content:'';display:block;height:650px}.scroll-story .hero-copy{position:static}.scroll-story .hero .home-showcase{top:28px}.scan-caption{font-size:16px}.hero .scan-result{inset:37px 7px 18px;gap:13px}}
@media(max-height:650px) and (min-width:701px){.scroll-story .hero-copy{top:40px}.scroll-story .hero .home-showcase{top:20px}}
@media(prefers-reduced-motion:reduce){.hero .hero-paper-object{display:none}.scan-beam{display:none}}
