.jx-scene{position:relative;height:420vh}
.jx-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center;gap:4vw;padding:72px 6vw 0;background:radial-gradient(ellipse at 68% 55%,#141414 0%,#050505 62%)}
.jx-copy{position:relative;max-width:30rem;min-height:16rem}
.jx-count{display:flex;align-items:baseline;gap:.6rem;font-weight:800;color:#8a8f96;font-size:.95rem;margin-bottom:1.1rem}
.jx-count b{color:#fbb401;font-size:2.6rem;line-height:1;font-weight:900;font-variant-numeric:tabular-nums}
.jx-step{position:absolute;inset:3.6rem 0 auto 0;opacity:0;transform:translateY(14px);transition:opacity .45s ease,transform .45s ease;pointer-events:none}
.jx-step.on{opacity:1;transform:none;pointer-events:auto}
.jx-step h2{font-size:clamp(2.1rem,4.4vw,3.6rem);line-height:1.02;font-weight:900;letter-spacing:-.02em;margin:0 0 1rem}
.jx-step p{font-size:1.05rem;line-height:1.6;color:#c9c6bf;max-width:28rem;margin:0}
.jx-cta{display:flex;gap:.75rem;margin-top:1.6rem;flex-wrap:wrap}
.jx-box{position:relative;width:min(70vh,44vw);aspect-ratio:1;justify-self:center}
.jx-dial{position:absolute;inset:-5.5%;width:111%;height:111%;transform:rotate(-90deg);overflow:visible}
.jx-dial .tr{fill:none;stroke:#26272a;stroke-width:1.2}
.jx-dial .pg{fill:none;stroke:#fbb401;stroke-width:2.2;stroke-linecap:round}
.jx-dial .tk{stroke:#55575c;stroke-width:2}
.jx-dial .tk.done{stroke:#fbb401}
.jx-wheel{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:#000;--rot:0deg}
.jx-l{position:absolute;inset:0;background:#000 url(https://static.wixstatic.com/media/cb3375_1bf648f6aa324da294341871c3f88711~mv2.png/v1/fill/w_900,h_900,al_c,q_90,enc_avif,quality_auto/fren.webp) center/86% no-repeat}
.jx-r{position:absolute;inset:0;transform:rotate(var(--rot));will-change:transform}
.jx-r img{width:100%;height:100%;display:block;object-fit:cover;filter:url(#jxkey)}
.jx-l+.jx-l{clip-path:circle(0% at 50% 50%)}
.jx-cut{position:absolute;left:50%;top:50%;width:0;height:0;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #fbb401,0 0 22px 4px rgba(251,180,1,.45);opacity:0;pointer-events:none}
.jx-halo{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle,rgba(251,180,1,.16),rgba(251,180,1,.04) 45%,transparent 66%);pointer-events:none}
.jx-hint{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);font-size:.8rem;font-weight:700;color:#8a8f96;transition:opacity .3s}
@media (max-width:820px){
.jx-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-items:start;gap:0;padding:calc(76px + 2vh) 7vw 0;background:radial-gradient(ellipse at 50% 30%,#141414 0%,#050505 65%)}
.jx-box{width:min(74vw,44vh);order:-1;margin-top:1vh}
.jx-copy{min-height:0;margin-top:4.5vh}
.jx-count{margin-bottom:.6rem}
.jx-count b{font-size:2rem}
.jx-step{inset:2.8rem 0 auto 0}
.jx-step h2{font-size:2rem;margin-bottom:.6rem}
.jx-step p{font-size:.98rem}
.jx-cta{margin-top:1.1rem}
.jx-hint{display:none}
}
@media (prefers-reduced-motion:reduce){.jx-step{transition:none}}