.product-scroll-3d{--stage-line: #ffffff26;height:500vh;position:relative;background:#111214;color:#fff}.product-scroll-3d__sticky{height:100vh;position:sticky;top:0;overflow:hidden;background:#111214;border-block:1px solid #343539}.product-scroll-3d__sticky:before{content:"";width:1px;position:absolute;inset:0 auto 0 39%;background:var(--stage-line)}.product-scroll-3d__sticky:after{content:"PA10";position:absolute;right:-.03em;bottom:-.24em;color:#ffffff08;font:900 clamp(190px,31vw,520px)/1 var(--mono);letter-spacing:-.1em;pointer-events:none}.product-scroll-3d__canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:34%;z-index:1}.product-scroll-3d canvas{width:100%;height:100%;display:block}.product-scroll-3d noscript img{width:70%;height:80%;object-fit:contain}.product-scroll-3d__loading{position:absolute;left:50%;top:50%;display:flex;gap:12px;align-items:center;transform:translate(-50%,-50%);color:#fff;font:800 10px var(--mono);letter-spacing:.14em;transition:opacity .25s}.product-scroll-3d__loading span{width:10px;height:10px;background:var(--red);animation:modelBlink .8s steps(2,end) infinite alternate}.is-model-ready .product-scroll-3d__loading{opacity:0;pointer-events:none}@keyframes modelBlink{to{opacity:.2}}.product-scroll-3d__hud{position:absolute;left:4vw;right:4vw;top:28px;z-index:4;display:flex;justify-content:flex-end;color:#fff;font:800 10px var(--mono);letter-spacing:.15em}.product-scroll-3d__hud span:last-child{min-width:54px;padding:7px 8px;background:var(--red);text-align:center}.product-scroll-3d__chapters{width:min(520px,38vw);height:100%;position:absolute;left:4vw;top:0;z-index:3;display:grid;align-items:center}.product-scroll-3d__chapters article{grid-area:1 / 1;opacity:0;transform:translateY(28px);pointer-events:none;transition:opacity .32s ease,transform .32s ease}.product-scroll-3d__chapters article.is-active{opacity:1;transform:none}.product-scroll-3d__chapters h2{margin:18px 0 22px;font-size:clamp(48px,5.8vw,92px);line-height:.82;letter-spacing:-.07em;text-transform:uppercase}.product-scroll-3d__chapters article>p:last-child{max-width:470px;color:#c9c9c9;font-size:18px;line-height:1.55}.product-scroll-3d__rail{position:absolute;left:4vw;bottom:30px;z-index:4;display:flex;gap:14px;align-items:center;color:#a7a7a7;font:800 9px var(--mono);letter-spacing:.14em}.product-scroll-3d__rail i{width:90px;height:3px;position:relative;background:#46474b}.product-scroll-3d__rail i:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--red);transform:scaleX(var(--model-progress, 0));transform-origin:left}.model-callout{padding:8px 10px;position:absolute;z-index:4;border:1px solid #fff;background:#111214e8;color:#fff;font:800 9px var(--mono);letter-spacing:.1em;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease}.model-callout:before{content:"";width:7px;height:7px;position:absolute;left:-4px;top:calc(50% - 4px);background:var(--red)}.model-callout--slot{right:12%;top:63%}.model-callout--magnets{right:8%;top:35%}.model-callout--label{right:17%;top:20%}.product-scroll-3d[data-stage="1"] .model-callout--slot,.product-scroll-3d[data-stage="2"] .model-callout--magnets,.product-scroll-3d[data-stage="3"] .model-callout--label{opacity:1;transform:none}@media(max-width:900px){.product-scroll-3d{height:440vh}.product-scroll-3d__sticky:before{display:none}.product-scroll-3d__canvas-wrap{top:27%;right:0;bottom:0;left:0}.product-scroll-3d__chapters{width:auto;height:38%;left:22px;right:22px;top:38px;align-items:start;padding-top:45px}.product-scroll-3d__chapters h2{margin:12px 0 14px;font-size:clamp(32px,9.5vw,52px);line-height:.88}.product-scroll-3d__chapters article>p:last-child{max-width:310px;margin-top:0;font-size:15px;line-height:1.4;overflow-wrap:anywhere}.product-scroll-3d__hud{left:22px;right:22px}.product-scroll-3d__rail{left:22px;bottom:20px}.model-callout{display:none}}@media(prefers-reduced-motion:reduce){.product-scroll-3d__chapters article{transition:none}.product-scroll-3d__loading span{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/18/assets/product-scroll-3d.css.map */