.kit-story{--kit-accent:#b5ef54;position:relative;height:260vh;background:#141815;color:#f0f0e8}.kit-sticky{height:calc(100svh - 80px);min-height:670px;position:sticky;top:0;overflow:hidden;background:radial-gradient(ellipse at 75% 42%,#33403555,transparent 58%),#141815}.kit-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent,#000)}.kit-word{position:absolute;left:3%;bottom:4%;font:clamp(110px,17vw,280px)/.9 Anton,Impact,sans-serif;white-space:nowrap;color:#ffffff04;letter-spacing:-.025em}.kit-copy{position:absolute;top:13%;left:5%;width:46%;z-index:2}.kit-eyebrow{font:10px/1.7 'JetBrains Mono',monospace;letter-spacing:2px;color:var(--kit-accent,#54732c);margin:0 0 24px}.kit-copy h1{font:clamp(36px,4.7vw,78px)/1.04 Anton,Impact,sans-serif;letter-spacing:-1px;text-transform:uppercase;margin:0 0 25px;max-width:720px}.kit-copy h1 em{font-style:normal;color:var(--kit-accent);transition:color .5s}.kit-intro{font-size:20px;margin:0 0 12px}.kit-description{font:14px/1.8 Inter,sans-serif;color:#a9b1a9;max-width:370px;margin:0 0 26px}.kit-cta{display:inline-flex;gap:35px;padding:17px 23px;background:var(--kit-accent);color:#131813;font-size:13px;font-weight:800;text-decoration:none;transition:background .5s}.kit-cta:hover{filter:brightness(1.12)}.kit-secondary{display:block;color:#d8ded6;font-size:12px;margin-top:20px;text-decoration:none}.kit-visual{position:absolute;inset:3% 0 12% 46%;}.kit-halo{position:absolute;inset:15% 12%;border:1px solid #b5ef5420;border-radius:50%;transform:rotate(-24deg);box-shadow:0 0 90px #b5ef5405}.kit-halo:after{content:'';position:absolute;inset:10%;border:1px solid #ffffff08;border-radius:50%}#jersey-view{position:absolute;inset:0;touch-action:pan-y}#jersey-view canvas{display:block;width:100%;height:100%}.kit-fallback{width:100%;height:100%;object-fit:contain}.kit-model-label{position:absolute;right:8%;top:5%;font:10px/1.9 'JetBrains Mono',monospace;letter-spacing:1px;color:#c5cfc1}.kit-model-label small{font-size:8px;letter-spacing:0;color:#8c988d}.kit-controls{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:11px;white-space:nowrap}.kit-swatch{width:23px;height:23px;background:var(--swatch);border:3px solid #141815;border-radius:50%;cursor:pointer;outline:1px solid transparent}.kit-swatch.active{outline-color:#fff}#kit-motion{margin-left:8px;background:transparent;border:1px solid #ffffff30;color:#bdc5b9;padding:7px 10px;font:10px Inter,sans-serif;cursor:pointer}.kit-bottom{position:absolute;bottom:25px;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff20;padding-top:23px;font:9px 'JetBrains Mono',monospace;letter-spacing:1px}.kit-chapters{display:flex;gap:25px}.kit-chapters button{background:none;border:0;color:#6e7a70;font:10px 'JetBrains Mono',monospace;cursor:pointer;padding:5px}.kit-chapters button.active{color:var(--kit-accent)}.kit-chapters span{margin-left:8px}.kit-progress{position:absolute;bottom:0;height:3px;left:0;width:var(--progress,0%);background:var(--kit-accent)}.kit-brief{background:#edece4;padding:85px 5%;color:#19231b}.kit-brief h2{font:clamp(32px,4vw,58px)/1.1 Anton,Impact,sans-serif;text-transform:uppercase;margin:0 0 40px}.kit-brief-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.kit-brief-grid article{border-top:1px solid #bac1b8;padding-top:22px}.kit-brief-grid span{font:10px 'JetBrains Mono',monospace;color:#687761}.kit-brief h3{font-size:23px;letter-spacing:-.6px;margin:20px 0 12px}.kit-brief p:not(.kit-eyebrow){font-size:14px;line-height:1.8}.kit-brief a{color:#233d20;text-underline-offset:4px;font-size:13px}.kit-brief-grid a{font-weight:700}.kit-answer{max-width:920px;border-top:1px solid #bac1b8;margin:45px 0 0;padding-top:25px;color:#4c5849}button:focus-visible,.kit-story a:focus-visible{outline:2px solid #b5ef54;outline-offset:5px}
@media(min-width:1000px){body:has(.kit-story) .site-header{background:#141815;color:#ecefe8;border-bottom:1px solid #ffffff18}body:has(.kit-story) .desktop-nav a{color:#d0d9ce}body:has(.kit-story) .announcement{background:#b5ef54;color:#172412}}
@media(max-width:800px){.kit-sticky{height:calc(100svh - 50px);min-height:780px}.kit-copy{top:5%;left:6%;width:88%}.kit-copy h1{font-size:37px;max-width:600px;margin-bottom:13px}.kit-eyebrow{margin-bottom:15px;font-size:8px}.kit-intro{font-size:15px}.kit-description{font-size:12px;max-width:90%;margin-bottom:15px}.kit-cta{padding:12px 17px;font-size:12px}.kit-secondary{display:inline-block;margin-left:15px;font-size:10px}.kit-visual{inset:40% 0 12% 0}.kit-model-label{top:8%;right:5%;font-size:8px}.kit-model-label small{display:none}.kit-controls{bottom:0}.kit-bottom{bottom:18px;padding-top:14px;gap:10px}.kit-scroll{display:none}.kit-chapters{gap:12px}.kit-chapters button{font-size:8px}.kit-chapters span{margin-left:4px}.kit-counter{font-size:8px}.kit-brief{padding:50px 6%}.kit-brief-grid{grid-template-columns:1fr;gap:30px}.kit-word{bottom:20%;font-size:24vw}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.kit-story{height:auto}.kit-sticky{position:relative}.kit-copy h1 em,.kit-cta{transition:none}}
.kit-fallback[hidden]{display:none}body:has(.kit-story) .site-header .brand{background:#eeeee6;padding:7px 12px;border-radius:2px}

/* White navigation across desktop and mobile. */
body:has(.kit-story) .site-header{background:#fff;color:#17191c;border-bottom:1px solid #e8e8e8}
body:has(.kit-story) .site-header .brand{background:transparent;padding:7px 12px}
body:has(.kit-story) .desktop-nav a{color:#202321}
body:has(.kit-story) .desktop-nav a:hover{color:#b52731}
body:has(.kit-story) .mobile-nav{background:#fff;color:#17191c}
body:has(.kit-story) .mobile-nav a{color:#17191c}

.kit-photo{position:absolute;top:8%;height:82%;left:50%;transform:translateX(-50%);aspect-ratio:536/710;max-width:100%;background-image:url('assets/homepage/jersey-reference-fit-v1.png');background-repeat:no-repeat;background-size:286.56% 144.225%;background-position:0 44.586%;mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent);}
.kit-photo-controls{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;white-space:nowrap;z-index:3}
.kit-photo-controls button{font:11px Inter,sans-serif;background:#172119;border:1px solid #7c887366;color:#e6ebdf;padding:9px 12px;cursor:pointer}
.kit-photo-controls button[aria-pressed=true]{background:#e9e9de;color:#172119;border-color:#e9e9de}
.kit-photo-controls [data-view-mode]{margin-left:8px;border-color:#b5ef5480}
.kit-visual[data-view=photo] #jersey-view,.kit-visual[data-view=photo] .kit-controls,.kit-visual[data-view='3d'] .kit-photo{display:none}
.kit-visual[data-view='3d'] .kit-controls{bottom:40px}
.kit-photo-controls button[hidden]{display:none}
@media(max-width:800px){.kit-photo{top:5%;height:84%}.kit-photo-controls button{font-size:10px;padding:8px 10px}}
.kit-photo{mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 96%,transparent);mask-composite:intersect}

/* Keep the complete garment below the sticky navigation. */
.kit-sticky{top:var(--kit-header-height,78px);height:calc(100svh - var(--kit-header-height,78px));min-height:620px}
@media(max-width:800px){.kit-sticky{min-height:740px}}
@media(max-width:800px) and (max-height:820px){.kit-story{height:auto}.kit-sticky{position:relative;top:0;height:780px}}
@media(prefers-reduced-motion:reduce){.kit-sticky{top:0}}
@media(max-width:800px){.kit-visual{top:46%}.kit-model-label{top:0}.kit-secondary{position:relative;z-index:4}}

/* Reference-textured 3D jersey is now the primary experience. */
.kit-story{--kit-accent:#f26a69}
.kit-controls [data-kit-view]{background:#19191b;border:1px solid #ffffff40;color:#f1efeb;font:11px Inter,sans-serif;padding:8px 15px;cursor:pointer}
.kit-visual[data-view='3d'] .kit-controls{bottom:0}
#jersey-view{cursor:grab}#jersey-view:active{cursor:grabbing}
#jersey-view canvas[hidden]{display:none}
body:has(.kit-story) .announcement{background:#a81d29;color:#fff}

/* Finished photographic garment: preserve its natural silhouette at every size. */
.kit-visual[data-view=realistic]{background:#171b16;isolation:isolate;mask-image:linear-gradient(to right,transparent,#000 8%,#000 94%,transparent)}
.kit-visual[data-view=realistic] #jersey-view{position:absolute;inset:5% 5% 8%;display:flex;justify-content:center;align-items:center;cursor:default;transform:translateY(var(--jersey-shift,0px));transition:transform .6s ease}
.jersey-realistic-hero{display:block;max-width:100%;width:auto;height:100%;object-fit:contain;animation:jersey-drift 7s ease-in-out infinite;mask-image:linear-gradient(to bottom,transparent,#000 5%,#000 96%,transparent)}
.motion-paused .jersey-realistic-hero{animation-play-state:paused}
.kit-visual[data-view=realistic] .kit-controls{bottom:0;z-index:4}
@keyframes jersey-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.jersey-realistic-hero{animation:none}.kit-visual[data-view=realistic] #jersey-view{transition:none}}
@media(max-width:800px){.kit-visual[data-view=realistic] #jersey-view{inset:4% 3% 12%}}

.jersey-sequence{position:relative;height:100%;aspect-ratio:2/3;max-width:100%;perspective:1000px;overflow:hidden}
.jersey-frame{position:absolute;inset:0;background-image:url('assets/homepage/jersey-three-design-v3.png');background-size:300% 133.333%;background-repeat:no-repeat;opacity:0;transform:rotateY(-16deg) scale(.96);transition:opacity 1.1s ease,transform 1.8s cubic-bezier(.22,.7,.22,1);mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent)}
.jersey-front{background-position:0% 50%;transform-origin:34% 26%}
.jersey-angle{background-position:50% 50%}
.jersey-back{background-position:100% 50%}
.jersey-sequence[data-pose="0"] .jersey-front,.jersey-sequence[data-pose="1"] .jersey-angle,.jersey-sequence[data-pose="3"] .jersey-back{opacity:1;transform:rotateY(0) scale(1)}
.jersey-sequence[data-pose="2"] .jersey-front{opacity:1;transform:rotateY(0) scale(2.15)}
#kit-next{background:#202321;color:#eee;border:1px solid #ffffff40;padding:8px 12px;font:11px Inter,sans-serif;cursor:pointer}

@media(prefers-reduced-motion:reduce){.jersey-frame,.jersey-number{transition:none}}

/* Eight photographic angles, held at a consistent scale without fake 3D stretching. */
.jersey-sequence.turntable{aspect-ratio:.58;overflow:hidden;perspective:none;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent)}
.turntable-frame{position:absolute;inset:0;background-image:url('assets/homepage/jersey-turntable-v4.png');background-size:344.828% 200%;background-repeat:no-repeat;opacity:0;transition:opacity .65s cubic-bezier(.4,0,.2,1);will-change:opacity}
.turntable-frame.is-current{opacity:1}
.turntable-frame[data-angle="0"]{background-position:-.4% 0%}
.turntable-frame[data-angle="1"]{background-position:36.6% 0%}
.turntable-frame[data-angle="2"]{background-position:68.9% 0%}
.turntable-frame[data-angle="3"]{background-position:101.5% 0%}
.turntable-frame[data-angle="4"]{background-position:-.4% 100%}
.turntable-frame[data-angle="5"]{background-position:36.6% 100%}
.turntable-frame[data-angle="6"]{background-position:68.9% 100%}
.turntable-frame[data-angle="7"]{background-position:101.5% 100%}
#kit-prev,#kit-next{width:34px;height:34px;padding:0;background:transparent;border:1px solid #ffffff35;color:#fff;cursor:pointer}
#kit-angle-count{font:10px monospace;letter-spacing:2px;color:#d5d5ce;min-width:65px;text-align:center}
.kit-visual[data-view=realistic] .kit-controls{gap:12px}
@media(prefers-reduced-motion:reduce){.turntable-frame{transition:none}}