.twelve-engine{--engine-bg: #03070b;--engine-fg: #f4f7f8;--engine-muted: #8d9ba5;--engine-cyan: #83dcff;background:var(--engine-bg);color:var(--engine-fg);height:220svh;position:relative}.twelve-engine *{box-sizing:border-box}.twelve-engine__sticky{background:radial-gradient(circle at 50% 58%,rgba(65,130,160,.17),transparent 35%),linear-gradient(180deg,#071019 0%,var(--engine-bg) 72%);height:100svh;min-height:540px;overflow:hidden;position:sticky;top:0}.twelve-engine__grid{background-image:linear-gradient(rgba(131,220,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(131,220,255,.07) 1px,transparent 1px);background-size:38px 38px;top:0;right:0;bottom:0;left:0;mask-image:linear-gradient(transparent 4%,#000 24%,#000 82%,transparent);-webkit-mask-image:linear-gradient(transparent 4%,#000 24%,#000 82%,transparent);opacity:.55;pointer-events:none;position:absolute}.twelve-engine__particles{height:100%;top:0;right:0;bottom:0;left:0;pointer-events:none;position:absolute;width:100%;z-index:5}.twelve-engine__orbit{border:1px solid rgba(131,220,255,.2);border-radius:50%;bottom:11svh;box-shadow:0 0 22px #83dcff1f;height:54px;left:12%;position:absolute;transform:rotateX(68deg);width:76%;z-index:2}.twelve-engine__brand{display:flex;font-size:.9rem;justify-content:space-between;left:18px;letter-spacing:.24em;position:absolute;right:18px;top:17px;z-index:8}.twelve-engine__brand span:last-child{color:var(--engine-muted)}.twelve-engine__skip{-webkit-appearance:none;appearance:none;background:transparent;border:0;color:var(--engine-muted);cursor:pointer;font:inherit;font-size:1rem;letter-spacing:.12em;opacity:calc(1 - var(--engine-final, 0));padding:12px;position:absolute;right:16px;text-transform:uppercase;top:32px;z-index:12}.twelve-engine__progress{background:#ffffff1f;bottom:56px;position:absolute;right:10px;top:78px;width:2px;z-index:10}.twelve-engine__progress span{background:linear-gradient(180deg,var(--engine-cyan),var(--twelve-engine-accent));box-shadow:0 0 10px var(--engine-cyan);display:block;height:calc(var(--engine-progress, 0) * 100%);width:100%}.twelve-engine__opening,.twelve-engine__reveal,.twelve-engine__final{left:20px;position:absolute;right:24px;z-index:8}.twelve-engine__opening{opacity:calc(1 - var(--engine-open, 0));top:clamp(64px,9svh,92px);transform:translateY(calc(var(--engine-open, 0) * -14px))}.twelve-engine__opening p,.twelve-engine__reveal p,.twelve-engine__final p{color:var(--engine-cyan);font-size:1rem;letter-spacing:.22em;margin:0 0 .9rem;text-transform:uppercase}.twelve-engine__opening h2,.twelve-engine__reveal h2,.twelve-engine__final h2{color:var(--engine-fg);font-family:var(--font-heading-family);font-size:clamp(3rem,9.6vw,4.6rem);font-weight:500;letter-spacing:-.05em;line-height:.96;margin:0;text-wrap:balance}.twelve-engine__opening>span,.twelve-engine__final>span{color:var(--engine-muted);display:block;font-size:1.25rem;line-height:1.4;margin-top:1.2rem;max-width:32rem}.twelve-engine__product{bottom:7svh;left:42px;opacity:var(--engine-product, 1);position:absolute;perspective:900px;right:42px;top:clamp(174px,27svh,232px);transform:translateY(calc(var(--engine-final, 0) * -20%)) scale(calc(.92 + var(--engine-product, 0) * .08 - var(--engine-final, 0) * .32));transform-origin:center;z-index:4}.twelve-engine__product img{filter:drop-shadow(0 18px 20px rgba(0,0,0,.42));left:50%;object-fit:contain;position:absolute;transform:translate(-50%) rotateY(calc(var(--engine-turn, 0) * 1deg));transform-style:preserve-3d;transition:filter .18s ease;width:100%}.twelve-engine__shirt{height:58%;top:0}.twelve-engine__shorts{height:38%;top:53%;width:78%!important}.twelve-engine__scan{left:0;opacity:var(--engine-scan-opacity, 0);position:absolute;right:0;top:calc(18% + var(--engine-scan-y, 0) * 62%);z-index:7}.twelve-engine__scan:before{background:linear-gradient(90deg,transparent,var(--engine-cyan),transparent);box-shadow:0 0 14px var(--engine-cyan);content:"";display:block;height:1px}.twelve-engine__scan span{background:linear-gradient(180deg,rgba(131,220,255,.09),transparent);display:block;height:54px}.twelve-engine__hotspots{top:0;right:0;bottom:0;left:0;pointer-events:none;position:absolute;z-index:7}.twelve-engine__hotspots span{color:var(--engine-fg);font-size:.9rem;left:var(--x);letter-spacing:.18em;opacity:var(--engine-visible, 0);position:absolute;text-transform:uppercase;top:var(--y);transform:translateY(calc((1 - var(--engine-visible, 0)) * 8px))}.twelve-engine__hotspots span:before{border:1px solid var(--engine-cyan);border-radius:50%;box-shadow:0 0 8px var(--engine-cyan);content:"";height:7px;left:0;position:absolute;top:20px;width:7px}.twelve-engine__hotspots span:after{background:linear-gradient(90deg,var(--engine-cyan),transparent);content:"";height:1px;left:5px;position:absolute;top:23px;transform:rotate(18deg);transform-origin:left;width:42px}.twelve-engine__reveal{opacity:var(--engine-reveal, 0);text-align:center;top:40%;transform:scale(calc(.92 + var(--engine-reveal, 0) * .08))}.twelve-engine__reveal strong{-webkit-text-stroke:1px rgba(131,220,255,.55);color:transparent;display:block;font-size:clamp(10rem,34vw,15rem);font-weight:500;letter-spacing:-.09em;line-height:.8;margin-top:2.6rem;text-shadow:0 0 22px rgba(131,220,255,.16)}.twelve-engine__final{bottom:clamp(58px,8svh,84px);opacity:var(--engine-final, 0);transform:translateY(calc((1 - var(--engine-final, 0)) * 16px))}.twelve-engine__final h2{font-size:clamp(2.8rem,8.5vw,4rem)}.twelve-engine__actions{display:grid;gap:1rem;margin-top:1.6rem}.twelve-engine__button{align-items:center;background:var(--engine-fg);border-radius:999px;color:var(--engine-bg);display:flex;font-size:1.15rem;font-weight:600;justify-content:space-between;letter-spacing:.05em;min-height:5rem;padding:0 1.6rem;text-decoration:none;text-transform:uppercase;width:100%}.twelve-engine__secondary{align-items:center;border:1px solid rgba(246,247,244,.36);border-radius:999px;color:var(--engine-fg);display:flex;font-size:1.1rem;font-weight:600;justify-content:center;letter-spacing:.1em;min-height:4.7rem;padding:0 1.6rem;text-decoration:none;text-transform:uppercase}.twelve-engine__scroll-cue{align-items:center;bottom:18px;color:var(--engine-muted);display:flex;font-size:.95rem;gap:.8rem;left:50%;letter-spacing:.16em;opacity:var(--engine-cue, 1);position:absolute;text-transform:uppercase;transform:translate(-50%);z-index:9}@media screen and (min-width:750px){.twelve-engine{height:240svh}.twelve-engine__opening,.twelve-engine__final{left:max(5vw,48px);max-width:46rem;right:auto;width:40vw}.twelve-engine__opening{top:18svh}.twelve-engine__product{bottom:8svh;left:52%;right:5%;top:10svh}.twelve-engine__product{transform:scale(calc(.92 + var(--engine-product, 0) * .08 - var(--engine-final, 0) * .08))}.twelve-engine__reveal{left:50%;max-width:60rem;transform:translate(-50%) scale(calc(.92 + var(--engine-reveal, 0) * .08));width:100%}.twelve-engine__final{bottom:14svh}.twelve-engine__hotspots span{font-size:1rem}.twelve-engine__actions{grid-template-columns:minmax(22rem,30rem) minmax(16rem,22rem)}}.twelve-engine__skip{opacity:1;min-height:44px;display:flex;align-items:center;text-decoration:none;color:#c8d3da}.twelve-engine__shop{position:absolute;z-index:12;left:20px;top:32px;min-height:44px;display:flex;align-items:center;gap:1.2rem;padding:0 1.6rem;border:1px solid #83dcff66;border-radius:999px;color:#f4f7f8;background:#071019;font-size:1.2rem;text-decoration:none}.twelve-engine__scroll-cue{left:auto;right:24px;bottom:33px;transform:none}.twelve-engine__hotspots span{font-size:1.15rem;letter-spacing:.08em;padding:6px 8px;background:#071019e6;border-radius:3px}.twelve-engine__hotspots span:before{top:34px;left:8px}.twelve-engine__hotspots span:after{top:37px;left:12px}.twelve-engine__shop:focus-visible,.twelve-engine__skip:focus-visible{outline:2px solid #83dcff;outline-offset:4px}@media screen and (min-width:750px){.twelve-engine__hotspots span:nth-child(odd){left:54%}.twelve-engine__hotspots span:nth-child(2n){left:77%}}@media screen and (max-width:749px){.twelve-engine__opening h2{font-size:clamp(2.8rem,8vw,3.8rem);line-height:1.03}.twelve-engine__opening{top:108px}.twelve-engine__product{top:clamp(250px,32svh,280px);bottom:72px}.twelve-engine__opening>span{max-width:25rem;font-size:1.35rem}.twelve-engine__final{bottom:86px}}@media(prefers-reduced-motion:reduce){.twelve-engine{height:auto}.twelve-engine__sticky{min-height:760px;position:relative}.twelve-engine__grid,.twelve-engine__particles,.twelve-engine__progress,.twelve-engine__scan,.twelve-engine__hotspots,.twelve-engine__reveal,.twelve-engine__scroll-cue,.twelve-engine__skip,.twelve-engine__opening{display:none}.twelve-engine__product{opacity:1;transform:translateY(-20%) scale(.68)}.twelve-engine__final{opacity:1;transform:none}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/twelve-scroll-story.css.map */