/* Parcours plein écran */
.jn{position:relative;height:2800vh;margin-top:-100svh;z-index:2}
.jn__pin{position:sticky;top:0;height:100svh;overflow:hidden}
.jn__ground{position:absolute;inset:0;opacity:0;background:radial-gradient(40% 50% at 18% 50%,#fff,rgba(255,255,255,0) 70%),radial-gradient(30% 36% at 5% 12%,rgba(249,119,8,.1),transparent 70%),var(--ivory)}
.jl{position:absolute;inset:0;visibility:hidden;pointer-events:none}.jl.on{visibility:visible}
.jr,.jo{position:absolute;overflow:hidden;container-type:size}
.jr{z-index:10}.jo{z-index:25;overflow:visible;background:none!important}
#jp{position:absolute;z-index:20;object-fit:cover;pointer-events:none;box-shadow:0 30px 60px -30px rgba(0,0,0,.45);will-change:left,top,width,height}
.jn__titles{position:absolute;z-index:30;left:var(--pad);top:8vh;bottom:13vh;width:calc(40% - 1.5 * var(--pad));pointer-events:none}
.jt{position:absolute;left:0;right:0;top:50%;margin-top:0;transform-origin:left;opacity:0}
.jt>*{position:relative}
.jt .gp{display:inline-flex;border-radius:100px;padding:8px 18px;font-weight:600;font-size:16px;color:#fff;background:color-mix(in oklch,var(--c) 78%,black);margin-bottom:22px}
.jt h2{font-size:clamp(40px,min(4.5vw,8.4vh),92px);letter-spacing:-.055em;line-height:.98;font-weight:500;text-wrap:balance}
.jt h2 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.jt h2 .w>span{display:inline-block;transform:translateY(110%);transition:transform .9s cubic-bezier(.2,.8,.2,1) var(--d)}
.jt.cur h2 .w>span{transform:none}
.jt .stt{display:flex;align-items:flex-end;gap:16px;margin-top:min(4vh,36px)}
.jt .stt b{font-size:clamp(48px,min(5.4vw,10vh),104px);font-weight:600;letter-spacing:-.065em;line-height:.8;font-variant-numeric:tabular-nums;color:var(--ink)}
.jt .stt span{font-size:clamp(15px,1.15vw,19px);color:var(--soft);max-width:15ch;line-height:1.25;padding-bottom:2px}
.jt .bt{display:flex;flex-direction:column;gap:min(1.5vh,14px);margin-top:min(4vh,36px);padding-top:min(3vh,26px);border-top:1px solid var(--line)}
.jt .bt>div{display:flex;align-items:center;gap:14px;font-size:clamp(16px,min(1.25vw,2.3vh),21px);color:#B5AC9E;transition:color .35s}
.jt .bt i{width:22px;height:22px;border-radius:50%;border:2px solid #D9D2C5;flex:none;position:relative;transition:all .35s}
.jt .bt .now{color:var(--ink);font-weight:500}.jt .bt .now i{border-color:var(--c);box-shadow:0 0 0 5px color-mix(in oklch,var(--c) 18%,transparent)}
.jt .bt .done{color:var(--soft)}.jt .bt .done i{background:var(--c);border-color:var(--c)}
.jt .bt .done i::after{content:'';position:absolute;left:6px;top:2.5px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.jt p{font-size:clamp(18px,min(1.5vw,2.7vh),25px);color:var(--soft);margin-top:min(3vh,26px);max-width:30ch;line-height:1.45;text-wrap:pretty}
.jt{transform:translateY(-50%)}
.jprog{position:absolute;z-index:30;left:var(--pad);bottom:6vh;width:calc(40% - 2 * var(--pad));max-width:420px;display:flex;align-items:center;gap:6px}
.jprog i{flex:1;height:4px;border-radius:4px;background:#E2DCD0;position:relative;overflow:hidden;cursor:pointer}
.jprog i::after{content:'';position:absolute;inset:0;background:var(--c);transform:scaleX(var(--f,0));transform-origin:left}
.jprog b{flex:none;margin-left:12px;font-size:15px;font-weight:600;min-width:140px}
.c-o{--c:#F97708}.c-v{--c:#7C5CFF}.c-g{--c:#16B364}
@media(max-width:900px){.jt .stt{display:none}.jt .bt{margin-top:12px;padding-top:0;border:0}.jt .bt>div:not(.now){display:none}.jt .bt>div{font-size:15px}.jn__titles{width:auto;right:var(--pad);top:80px;bottom:auto;height:40vh}.jt{top:50%;margin-top:0}.jt h2{font-size:clamp(28px,7vw,40px)}.jt p{font-size:16px;margin-top:10px}.jt .gp{margin-bottom:12px}.jprog{display:none}}
body.in-journey .nav{transform:translateY(-140%);opacity:0;pointer-events:none}

/* 4 galerie */
.s4 .br{position:absolute;left:0;right:0;top:0;height:6cqh;display:flex;align-items:center;gap:.9cqh;padding:0 2cqw;background:#FAF8F3;border-bottom:1px solid var(--line)}
.s4 .br i{width:1.2cqh;height:1.2cqh;border-radius:50%;background:#E0D9CC}
.s4 .br span{margin-left:2cqw;background:#fff;border:1px solid var(--line);border-radius:100px;padding:.6cqh 1.8cqh;font:500 1.6cqh var(--m);color:var(--mute)}.s4 .br span b{color:var(--ink);font-weight:600}
.s4 .br em{margin-left:auto;font:500 1.5cqh var(--m);font-style:normal;color:var(--soft)}
.s4 .s4c{position:absolute;left:0;right:0;top:6cqh;height:66%}
.s4 .s4o{position:absolute}
.s4 .scrim{position:absolute;inset:0;background:linear-gradient(transparent 38%,rgba(10,8,6,.72));opacity:0}
.s4 .txt{position:absolute;left:5%;bottom:9%;color:#fff}
.s4 .acc{display:block;width:70px;height:4px;border-radius:2px;margin-bottom:20px;transition:background .5s}
.s4 .ttl{font-size:clamp(34px,4.4vw,84px);font-weight:500;letter-spacing:-.05em;line-height:1;min-height:1em;display:flex;align-items:center}
.s4 .ttl u{display:inline-block;width:3px;height:.9em;background:var(--acc);margin-left:4px}
.s4 .dt{font:500 15px var(--m);letter-spacing:.2em;margin-top:16px;opacity:0}
.s4 .cta{display:inline-flex;margin-top:22px;padding:12px 22px;border-radius:12px;font-weight:600;font-size:16px;opacity:0;transition:background .5s,color .5s}
.s4 .pan{position:absolute;right:4%;top:6%;width:220px;background:#fff;border-radius:18px;padding:18px;box-shadow:0 30px 60px -30px rgba(0,0,0,.5);color:var(--ink);opacity:0}
.s4 .pan .l{font:600 11px var(--m);letter-spacing:.16em;color:var(--mute);margin:0 0 10px}.s4 .pan .l:not(:first-child){margin-top:16px}
.s4 .sw{display:flex;gap:10px}.s4 .sw i{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);transition:box-shadow .3s}
.s4 .sw i.on{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ink)}
.s4 .ft,.s4 .ly{display:flex;gap:8px}.s4 .ft span{flex:1;text-align:center;border:1px solid var(--line);border-radius:10px;padding:8px 0;font-size:18px;font-weight:500}.s4 .ft span:last-child{font-family:var(--m);font-size:15px}
.s4 .ft span.on,.s4 .ly span.on{border-color:var(--ink)}
.s4 .ly span{flex:1;height:34px;border:1px solid var(--line);border-radius:8px;position:relative}.s4 .ly span::before{content:'';position:absolute;left:5px;top:5px;width:40%;height:60%;border-radius:3px;background:#EDE8DD}
.s4 .s4b{position:absolute;left:4%;right:4%;top:calc(66% + 6cqh + 2.4cqh);bottom:3cqh;opacity:0}
.s4 .tabs{display:flex;gap:2.4cqw;font-size:1.9cqh;color:var(--soft);margin-bottom:2cqh}.s4 .tabs .on{color:var(--ink);font-weight:600;border-bottom:2px solid var(--ink)}
.s4 .th{display:grid;grid-template-columns:repeat(6,1fr);gap:1.2cqh}.s4 .th i{aspect-ratio:1;border-radius:1cqh;background-size:cover;background-position:center;opacity:0}

/* 5 livraison / 6 selfie : téléphone */
.ph{position:absolute;left:50%;top:50%;height:86%;aspect-ratio:9/19.3;margin:0;translate:-50% -50%;border-radius:clamp(36px,6cqh,60px);background:#0E0C0A;padding:1.1cqh;box-shadow:0 60px 110px -40px rgba(43,24,16,.6),inset 0 0 0 2px #2a2622;opacity:0}
.ph .scr{position:relative;width:100%;height:100%;border-radius:calc(clamp(36px,6cqh,60px) - 1.1cqh);overflow:hidden;background:#F2EFE8}
.ph .scr::before{content:'';position:absolute;left:50%;top:1.6%;width:30%;height:3.8%;border-radius:40px;background:#000;transform:translateX(-50%);z-index:9}
.s5 .chd{position:absolute;left:0;right:0;top:0;height:15%;display:flex;align-items:flex-end;gap:calc(var(--pu) * 4);padding:0 calc(var(--pu) * 6) calc(var(--pu) * 4);background:#FAF8F3;border-bottom:1px solid var(--line)}
.s5 .chd i{width:calc(var(--pu) * 12);height:calc(var(--pu) * 12);border-radius:50%;background-size:cover;background-position:center}
.s5 .chd b{display:block;font-size:calc(var(--pu) * 5);font-weight:600}.s5 .chd span{font-size:calc(var(--pu) * 3.6);color:#16B364}
.s5 .dots{position:absolute;right:calc(var(--pu) * 6);top:19%;display:flex;gap:calc(var(--pu) * 1.6);background:#F97708;padding:calc(var(--pu) * 4) calc(var(--pu) * 5);border-radius:calc(var(--pu) * 6);opacity:0}
.s5 .dots i{width:calc(var(--pu) * 2);height:calc(var(--pu) * 2);border-radius:50%;background:#fff}.s5 .dots i:nth-child(2){opacity:.6}.s5 .dots i:nth-child(3){opacity:.35}
@keyframes dt{50%{opacity:.3}}
.s5 .bub{position:absolute;opacity:0;font-size:calc(var(--pu) * 4.4);line-height:1.35}
.s5 .bub.out{right:calc(var(--pu) * 5);top:19%;width:calc(var(--pu) * 76);background:#fff;border-radius:calc(var(--pu) * 5) calc(var(--pu) * 5) calc(var(--pu) * 1.4) calc(var(--pu) * 5);overflow:hidden;box-shadow:0 10px 30px -18px rgba(0,0,0,.35);transform-origin:bottom right}
.s5 .s5s{width:100%;aspect-ratio:3/2}
.s5 .bt{padding:calc(var(--pu) * 3.6) calc(var(--pu) * 4) calc(var(--pu) * 1.6)}.s5 .bt em{display:block;font-style:normal;font-family:var(--m);font-size:calc(var(--pu) * 3.4);color:#C45A00;margin-top:calc(var(--pu) * 1.6)}.s5 .bt small{display:block;font-family:var(--m);font-size:calc(var(--pu) * 3);color:var(--mute);margin-top:calc(var(--pu) * 1.2)}
.s5 .tm{display:block;text-align:right;font-size:calc(var(--pu) * 3);color:#16B364;padding:0 calc(var(--pu) * 4) calc(var(--pu) * 2.6)}
.s5 .bub.in{left:calc(var(--pu) * 5);max-width:calc(var(--pu) * 70);background:#fff;border-radius:calc(var(--pu) * 5) calc(var(--pu) * 5) calc(var(--pu) * 5) calc(var(--pu) * 1.4);padding:calc(var(--pu) * 3.2) calc(var(--pu) * 4.4);box-shadow:0 10px 30px -18px rgba(0,0,0,.35)}
.s5 .r1{top:67%}.s5 .r2{top:76%}
.fl{position:absolute;background:#fff;border-radius:18px;padding:16px 20px;box-shadow:0 30px 60px -30px rgba(43,24,16,.45);font-size:16px;color:var(--soft);opacity:0;max-width:240px}
.fl b{display:block;font-size:30px;font-weight:600;letter-spacing:-.04em;color:var(--ink);line-height:1.05}
.fl.f1{left:6%;top:24%}.fl.f2{right:6%;top:58%}
.fl.dk{background:#231E1A;color:rgba(240,237,228,.65)}.fl.dk b{color:#F0EDE4}

/* 7 mur invités */
.s7 .wh{position:absolute;left:3%;right:3%;top:3.4%;display:flex;align-items:center;gap:1.6cqw;color:#F0EDE4}
.s7 .live{display:flex;align-items:center;gap:8px;font:700 1.4cqh var(--m);letter-spacing:.18em;color:#FF6B6B;background:rgba(255,107,107,.12);padding:.8cqh 1.4cqh;border-radius:100px}
.s7 .live i{width:.8cqh;height:.8cqh;border-radius:50%;background:#FF6B6B}
.s7 .wc{font-size:3.6cqh;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.s7 .wt{font-size:2cqh;color:rgba(240,237,228,.6)}
.s7 .wf{margin-left:auto;font:600 1.3cqh var(--m);letter-spacing:.16em;color:var(--acc);opacity:0}
.s7 .wg{position:absolute;left:3%;right:3%;top:12%;bottom:3.5%;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,1fr);gap:1.2cqh}
.s7 .w{position:relative;border-radius:1.2cqh;background-size:cover;background-position:center;overflow:hidden;opacity:0;transition:box-shadow .35s}
.s7 .w span{position:absolute;left:0;right:0;bottom:0;padding:2.2cqh 1cqh .9cqh;background:linear-gradient(transparent,rgba(0,0,0,.7));font:500 1.3cqh var(--m);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s7 .w.me{box-shadow:inset 0 0 0 .4cqh var(--acc)}
.s7 .w.me::after{content:'LÉA';position:absolute;top:.9cqh;left:.9cqh;background:var(--acc);color:#fff;font:700 1.1cqh var(--m);letter-spacing:.1em;padding:.4cqh .8cqh;border-radius:.6cqh}
.s7 .s7s{grid-column:3/5;grid-row:2/4}
.s7 .card{position:absolute;left:4%;bottom:6%;width:22cqh;background:#F0EDE4;color:var(--ink);border-radius:1.6cqh;padding:2.4cqh 2cqh;text-align:center;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);opacity:0;z-index:3}
.s7 .tb{font:700 1.2cqh var(--m);letter-spacing:.24em;color:var(--acc)}.s7 .nm{font-size:2.2cqh;margin:1cqh 0 1.6cqh;letter-spacing:-.02em}
.s7 .qr{display:grid;grid-template-columns:repeat(7,1fr);gap:.35cqh;width:13cqh;margin:0 auto}.s7 .qr i{aspect-ratio:1;background:var(--ink);border-radius:.3cqh}
.s7 .cd{font:700 2.8cqh var(--m);letter-spacing:.22em;margin-top:1.4cqh}

/* 8 album */
.s8 .sp{position:absolute;left:50%;top:44%;width:84%;aspect-ratio:2.5/1;display:flex;background:#fff;border-radius:8px;box-shadow:0 50px 90px -40px rgba(43,24,16,.55);transform:translate(-50%,-50%) perspective(1600px) rotateX(14deg)}
.s8 .sp::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:40px;margin-left:-20px;background:linear-gradient(90deg,rgba(0,0,0,0),rgba(0,0,0,.12),rgba(0,0,0,0))}
.s8 .pg{flex:1;padding:5%;position:relative}
.s8 .s8s{position:absolute;inset:8% 6%}
.s8 .pg.r{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:4%;padding:8% 7%}
.s8 .ps{border-radius:3px;background:#F4F0E8;outline:1.5px dashed #D6CEBF;outline-offset:-1.5px}
.s8 .tray{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);display:flex;gap:1.4cqh;background:#fff;padding:1.4cqh;border-radius:1.8cqh;box-shadow:0 20px 40px -24px rgba(43,24,16,.5);opacity:0}
.s8 .tray i{width:11cqh;aspect-ratio:3/2;border-radius:.9cqh;background-size:cover;background-position:center;transition:opacity .3s}
.s8 .fly{position:absolute;border-radius:4px;background-size:cover;background-position:center;opacity:0;box-shadow:0 20px 40px -20px rgba(0,0,0,.5);z-index:4}
.s8 .stamp{position:absolute;left:50%;top:12%;background:#16B364;color:#fff;font-weight:600;font-size:2.4cqh;padding:1.2cqh 2.4cqh;border-radius:100px;opacity:0;z-index:5;box-shadow:0 20px 40px -20px rgba(22,179,100,.8)}
.s8 .bk{position:absolute;left:50%;top:50%;width:min(34cqw,48cqh);aspect-ratio:1/1.22;background:linear-gradient(135deg,#3A2319,#2B1810);border-radius:6px 14px 14px 6px;box-shadow:inset 10px 0 18px -10px rgba(0,0,0,.6),0 60px 100px -40px rgba(43,24,16,.8);opacity:0;display:flex;flex-direction:column;align-items:center}
.s8 .bs{position:absolute;left:12%;right:12%;top:10%;height:52%}
.s8 .bt{position:absolute;top:70%;left:0;right:0;text-align:center;color:#E8D9C4;font-size:3.4cqh;font-weight:500;letter-spacing:-.03em}
.s8 .by{position:absolute;top:79%;left:0;right:0;text-align:center;color:rgba(232,217,196,.6);font:500 1.5cqh var(--m);letter-spacing:.3em}
.s8 .done{position:absolute;left:0;right:0;bottom:6%;text-align:center;font-size:clamp(22px,2vw,34px);font-weight:500;letter-spacing:-.03em;color:var(--ink);opacity:0}

/* 1 analyse : écran identique à l'ordinateur */
.s1 .a1{position:absolute;left:0;top:0;width:1600px;height:1000px;transform-origin:0 0;background:#fff;overflow:hidden}
.s1 .a1>div{position:absolute}
.s1 .a1 .tx{white-space:nowrap;line-height:1}
.s1 .a1 .t{border-radius:12px;background-size:cover;background-position:center;background-color:#EDE8DD}
.bd{position:absolute;width:86px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font:600 20px 'JetBrains Mono',monospace;color:#fff;white-space:nowrap}
.s1 .b0{background:#F97708;transform-origin:0 0;z-index:2}
.s1 .o0{position:absolute;pointer-events:none}
.s1 .anl{position:absolute;opacity:0;z-index:1}
.s1 .scan{position:absolute;left:0;right:0;height:3px;background:var(--acc);box-shadow:0 0 24px 6px rgba(249,119,8,.55)}
.s1 .fb{position:absolute;border:2px solid var(--acc);border-radius:5px;opacity:0;box-shadow:0 0 0 1px rgba(0,0,0,.25),0 0 14px rgba(249,119,8,.45)}
.s1 .fb.c{border-width:3px;border-radius:8px}
.s1 .fb span{position:absolute;white-space:nowrap;background:rgba(20,17,15,.85);color:#fff;font:600 11px var(--m);letter-spacing:.02em;padding:3px 6px;border-radius:5px;left:50%;transform:translateX(-50%)}
.s1 .fb span.top{bottom:calc(100% + 5px)}.s1 .fb span.bot{top:calc(100% + 5px)}
.s1 .fb.c span{background:var(--acc);font:600 14px var(--s);padding:6px 10px;border-radius:8px}
.s1 .fb span.lft{right:calc(100% + 8px);left:auto;top:50%;transform:translateY(-50%)}
.s1 .chips{position:absolute;display:flex;flex-wrap:wrap;gap:8px}
.s1 .chips span{background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:500;font-size:16px;padding:9px 14px;border-radius:100px;opacity:0;box-shadow:0 10px 24px -18px rgba(43,24,16,.5)}
.s1 .chips span::before{content:'✓ ';color:var(--acc);font-weight:700}

/* 2 notation */
.s2 .hd2{position:absolute;left:5%;right:5%;top:4.5%;display:flex;align-items:center;gap:1.4cqw;flex-wrap:wrap}
.s2 .pl{background:var(--acc);color:#fff;font-weight:600;font-size:1.8cqh;padding:.7cqh 1.4cqh;border-radius:100px}
.s2 .nn{font-size:3.6cqh;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums;min-width:3.2em}
.s2 .lt{font-size:1.9cqh;color:var(--soft);margin-left:-.8cqw}
.s2 .lg{margin-left:auto;display:flex;align-items:center;gap:.8cqh;font:500 1.4cqh var(--m);color:var(--soft)}
.s2 .lg i{width:1.2cqh;height:1.2cqh;border-radius:50%;margin-left:1cqh}.s2 .lg i.b{background:#D64545}.s2 .lg i.m{background:#B8AC9A}.s2 .lg i.g{background:var(--acc)}
.s2 .ng{position:absolute;left:5%;right:5%;top:14%;display:grid;grid-template-columns:repeat(4,1fr);gap:1.4cqh}
.s2 .cd{position:relative;aspect-ratio:3/2;border-radius:8px;opacity:0}
.s2 .cd .im{position:absolute;inset:0;border-radius:8px;background-size:cover;background-position:center;transition:opacity .3s}
.s2 .cd b{position:absolute;top:.8cqh;right:.8cqh;font:600 1.6cqh var(--m);color:#fff;padding:.4cqh .8cqh;border-radius:.7cqh;opacity:0;background:rgba(26,21,16,.75);z-index:2}
.s2 .cd.g b{background:var(--acc)}.s2 .cd.b b{background:#D64545}.s2 .cd.m b{background:#8C8171}
.s2 .cd em{position:absolute;left:.8cqh;bottom:.8cqh;font:600 1.3cqh var(--m);font-style:normal;color:#fff;padding:.4cqh .8cqh;border-radius:.7cqh;opacity:0;transition:opacity .3s}
.s2 .cd.b em{background:#D64545}.s2 .cd.m em{background:rgba(26,21,16,.7)}
.s2 .cd.on em{opacity:1}
.s2 .cd.b.on .im{box-shadow:inset 0 0 0 3px #D64545}.s2 .cd.g.on:not(.hero) .im{box-shadow:inset 0 0 0 3px var(--acc)}
.s2 .cd.hero b{display:none}
.s2 .b5{background:var(--acc);width:64px;font-size:17px;height:30px}
.s2 .tip{position:absolute;z-index:5;width:230px;background:#fff;border-radius:14px;padding:14px 16px;box-shadow:0 30px 60px -24px rgba(43,24,16,.55);opacity:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.s2 .tip .tt{width:100%;font:600 11px var(--m);letter-spacing:.14em;color:var(--mute);margin-bottom:2px}
.s2 .tip span{font-size:14px;font-weight:500;color:#B83232;background:rgba(214,69,69,.1);padding:5px 9px;border-radius:8px}
.s2 .tip b{margin-left:auto;font-size:26px;font-weight:600;letter-spacing:-.04em;color:#D64545}
.s2 .ft2{position:absolute;left:5%;right:5%;bottom:5%;display:flex;align-items:center;justify-content:space-between;opacity:0}
.s2 .cnt{font-size:2.2cqh;color:var(--soft)}.s2 .cnt b{font-size:4.4cqh;font-weight:600;letter-spacing:-.05em;color:var(--ink);font-variant-numeric:tabular-nums;margin-right:.6cqw}
.s2 .btn{background:var(--ink);color:#fff;font-weight:600;font-size:2cqh;padding:1.6cqh 2.6cqh;border-radius:1.4cqh;transition:transform .15s,background .3s}
.s2 .btn.pr{transform:scale(.95)}.s2 .btn.dn{background:#16B364}

/* 3 sélection */
.s3 .cmd{position:absolute;left:8%;right:8%;top:50%;margin-top:-26cqh;background:#fff;border-radius:2.4cqh;padding:3.6cqh 3.4cqh;box-shadow:0 40px 80px -40px rgba(43,24,16,.45);border:1px solid var(--line)}
.s3 .ev{display:flex;align-items:center;gap:1.6cqw;padding-bottom:2.6cqh;border-bottom:1px solid var(--line)}
.s3 .s3t{width:14cqh;aspect-ratio:3/2;flex:none;border-radius:8px}
.s3 .ev b{display:block;font-size:2.4cqh;font-weight:600;letter-spacing:-.02em}.s3 .ev span{font:500 1.5cqh var(--m);color:var(--mute)}
.s3 .q{font-size:2.3cqh;color:var(--soft);margin:2.8cqh 0 1cqh}
.s3 .in{display:flex;align-items:baseline;gap:.8cqw;border-bottom:3px solid var(--ink);padding-bottom:.8cqh;min-height:10cqh}
.s3 .num{font-size:8cqh;font-weight:600;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.s3 .car{display:inline-block;width:3px;height:6.4cqh;background:var(--acc);align-self:center}
.s3 .in span{margin-left:auto;font-size:2.4cqh;color:var(--mute)}
.s3 .chp{display:flex;gap:1cqh;margin:2.2cqh 0 2.8cqh;flex-wrap:wrap}
.s3 .chp span{padding:1cqh 2cqh;border-radius:100px;border:1px solid var(--line);font:600 1.8cqh var(--m);color:var(--soft);transition:all .2s}
.s3 .chp span.on{background:var(--ink);border-color:var(--ink);color:#fff}
.s3 .go{background:var(--acc);color:#fff;font-weight:600;font-size:2.4cqh;padding:2cqh;border-radius:1.6cqh;text-align:center;transition:transform .15s;box-shadow:0 20px 40px -20px rgba(249,119,8,.8)}
.s3 .go.pr{transform:scale(.96);filter:brightness(1.1)}
.s3 .res3{position:absolute;inset:0;opacity:0}
.s3 .rh{position:absolute;left:5%;right:5%;top:4.5%;display:flex;align-items:baseline;gap:1cqw}
.s3 .rh b{font-size:3.4cqh;font-weight:600;letter-spacing:-.04em}.s3 .rh span{font-size:2.2cqh;color:var(--mute)}.s3 .rh em{margin-left:auto;font:500 1.5cqh var(--m);font-style:normal;color:var(--soft)}
.s3 .s3b{position:absolute;left:5%;top:13%;width:54%;aspect-ratio:3/2}
.s3 .d3{position:absolute;left:5%;width:54%;top:calc(13% + 36cqw + 2.6cqh);opacity:0}
.s3 .d3 .sc{display:flex;align-items:baseline;gap:1cqw}.s3 .d3 .sc span{font:600 1.4cqh var(--m);letter-spacing:.18em;color:var(--acc)}.s3 .d3 .sc b{font-size:4.6cqh;font-weight:600;letter-spacing:-.05em}
.s3 .bn{display:flex;flex-wrap:wrap;gap:.8cqh;margin:1.2cqh 0 1.6cqh}.s3 .bn span{font-size:1.6cqh;font-weight:500;color:#0E7A45;background:rgba(22,179,100,.12);padding:.6cqh 1.2cqh;border-radius:100px;opacity:0}
.s3 .ai{font-size:1.9cqh;line-height:1.45;color:var(--soft);min-height:5.6cqh}
.s3 .g3{position:absolute;left:62%;right:5%;top:13%;display:grid;grid-template-columns:1fr 1fr;gap:1.2cqh}
.s3 .c3{position:relative;aspect-ratio:1;border-radius:1cqh;background-size:cover;background-position:center;opacity:0;transition:background-image .3s}
.s3 .c3 b{position:absolute;left:.7cqh;bottom:.7cqh;font:600 1.4cqh var(--m);color:#fff;background:rgba(26,21,16,.75);padding:.4cqh .7cqh;border-radius:.6cqh}
.s3 .c3.sw{box-shadow:inset 0 0 0 3px #16B364}.s3 .c3.sw b{background:#16B364}
.s3 .rj{position:absolute;inset:0;border-radius:1cqh;background:rgba(214,69,69,.55);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1.9cqh;opacity:0}
.s3 .toast{position:absolute;right:5%;bottom:4%;background:var(--ink);color:#fff;font-size:1.8cqh;font-weight:500;padding:1.2cqh 2cqh;border-radius:100px;opacity:0}
.s3 .rk{position:absolute;display:flex;gap:6px;opacity:0}
.s3 .rk b{background:var(--ink);color:#fff;font:700 15px var(--m);padding:6px 10px;border-radius:8px}.s3 .rk span{background:var(--acc);color:#fff;font:600 15px var(--m);padding:6px 10px;border-radius:8px}

/* 6 selfie */

/* 6 selfie */
.s6 .ph{box-shadow:0 60px 120px -40px rgba(0,0,0,.9),inset 0 0 0 2px #2a2622}
.s6 .scr>div{position:absolute;inset:0}
.s6 .cv{background:#FAF8F3}
.s6 .s6c{position:absolute;left:5%;right:5%;top:8%;height:44%}
.s6 .cvt{position:absolute;left:0;right:0;top:57%;text-align:center}
.s6 .cvt b{display:block;font-size:calc(var(--pu) * 8.4);font-weight:500;letter-spacing:-.045em;margin-bottom:calc(var(--pu) * 1.6)}.s6 .cvt span{font:500 calc(var(--pu) * 2.8) var(--m);letter-spacing:.14em;color:var(--mute)}
.s6 .cvb{position:absolute;left:8%;right:8%;top:74%;background:var(--acc);color:#fff;text-align:center;font-weight:600;font-size:calc(var(--pu) * 4.6);padding:calc(var(--pu) * 4.4) 0;border-radius:calc(var(--pu) * 4);transition:transform .15s}
.s6 .cvb.pr{transform:scale(.95)}
.s6 .tap{position:absolute;left:50%;top:50%;width:calc(var(--pu) * 20);height:calc(var(--pu) * 20);border-radius:50%;background:rgba(255,255,255,.55);opacity:0}
.s6 .cvn{position:absolute;left:0;right:0;top:87%;text-align:center;font-size:calc(var(--pu) * 3.4);color:var(--soft)}
.s6 .cam{background:#000;transform:translateY(100%);overflow:hidden}
.s6 .sf{position:absolute;inset:0;background-size:cover;background-position:52% 40%;transform:scaleX(-1)}
.s6 .md{position:absolute;left:0;right:0;top:8%;display:flex;justify-content:center;gap:calc(var(--pu) * 2);font:600 calc(var(--pu) * 2.6) var(--m);letter-spacing:.1em;color:rgba(255,255,255,.8);z-index:2}
.s6 .md span{padding:calc(var(--pu) * 1) calc(var(--pu) * 2.4);border:1px solid rgba(255,255,255,.35);border-radius:6px}.s6 .md .on{background:var(--acc);border-color:var(--acc);color:#fff}
.s6 .ov{position:absolute;left:21%;right:17%;top:26%;bottom:31%;border-radius:50%;box-shadow:0 0 0 calc(var(--pu) * .9) rgba(255,255,255,.75),0 0 0 999px rgba(0,0,0,.5);overflow:hidden;transition:box-shadow .4s}
.s6 .ov.ok{box-shadow:0 0 0 calc(var(--pu) * 1.2) var(--acc),0 0 0 999px rgba(0,0,0,.5)}
.s6 .ov svg{position:absolute;inset:8% 10%;width:80%;height:84%;opacity:0;overflow:visible}
.s6 .ov circle{fill:var(--acc)}.s6 .ov polyline{fill:none;stroke:var(--acc);stroke-width:.5;opacity:.75;stroke-dasharray:100;stroke-dashoffset:calc(var(--dl,100) * 1)}
.s6 .sl{position:absolute;left:0;right:0;height:3px;background:var(--acc);box-shadow:0 0 18px 4px rgba(249,119,8,.6)}
.s6 .st{position:absolute;left:0;right:0;top:72%;text-align:center;color:#fff}
.s6 .st b{display:block;font:700 calc(var(--pu) * 3.4) var(--m);letter-spacing:.12em}.s6 .st span{font:500 calc(var(--pu) * 2.8) var(--m);color:rgba(255,255,255,.7)}
.s6 .st.ok b{color:var(--acc)}
.s6 .shb{position:absolute;left:50%;bottom:5%;width:calc(var(--pu) * 17);height:calc(var(--pu) * 17);margin-left:calc(var(--pu) * -8.5);border-radius:50%;border:calc(var(--pu) * 1.2) solid #fff;background:rgba(255,255,255,.25);transition:transform .15s}
.s6 .shb.pr{transform:scale(.85)}
.s6 .fls{position:absolute;inset:0;background:#fff;opacity:0}
.s6 .mt{background:#14110F;opacity:0;color:#F0EDE4}
.s6 .mc{position:absolute;left:0;right:0;top:12%;text-align:center}
.s6 .mc b{display:block;font-size:calc(var(--pu) * 26);font-weight:600;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}.s6 .mc span{font-size:calc(var(--pu) * 4.4);color:rgba(240,237,228,.6)}
.s6 .mg{position:absolute;left:6%;right:6%;top:44%;display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--pu) * 1.6)}
.s6 .mg i{aspect-ratio:1;border-radius:calc(var(--pu) * 1.8);background-size:cover;background-position:center 30%;opacity:0}
.s6 .mt .ok{position:absolute;left:0;right:0;top:84%;text-align:center;font-weight:600;font-size:calc(var(--pu) * 4.2);color:var(--acc);opacity:0}
.s6 .res{background:#FAF8F3;transform:translateY(100%);overflow:hidden}
.s6 .s6s{position:absolute;left:4%;right:4%;top:6%;height:15%}
.s6 .rh{position:absolute;left:5%;right:5%;top:23.5%;display:flex;align-items:flex-end;gap:calc(var(--pu) * 3)}
.s6 .rh i{width:calc(var(--pu) * 12);height:calc(var(--pu) * 12);border-radius:50%;background-size:cover;background-position:center 40%;box-shadow:0 0 0 calc(var(--pu) * 1) #FAF8F3,0 0 0 calc(var(--pu) * 1.8) var(--acc);flex:none;position:relative;z-index:21}
.s6 .rh b{display:block;font-size:calc(var(--pu) * 5.8);font-weight:600;letter-spacing:-.04em}.s6 .rh span{font:500 calc(var(--pu) * 2.6) var(--m);letter-spacing:.08em;color:var(--mute)}
.s6 .lk{position:absolute;left:5%;right:5%;top:31%;font-size:calc(var(--pu) * 3);font-weight:500;color:#0E7A45;background:rgba(22,179,100,.12);padding:calc(var(--pu) * 1.6) calc(var(--pu) * 3);border-radius:100px;text-align:center}
.s6 .tb{position:absolute;left:5%;right:5%;top:37%;display:flex;gap:calc(var(--pu) * 4);font-size:calc(var(--pu) * 3.2);color:var(--soft)}.s6 .tb .on{color:var(--ink);font-weight:600;border-bottom:2px solid var(--ink)}
.s6 .rgw{position:absolute;left:3%;right:3%;top:42%;bottom:0;overflow:hidden}
.s6 .rg{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--pu) * 1.4)}
.s6 .rg i{position:relative;aspect-ratio:1;border-radius:calc(var(--pu) * 2);background-size:cover;background-position:center 30%}
.s6 .rg em{position:absolute;left:5%;bottom:5%;font:700 calc(var(--pu) * 2) var(--m);font-style:normal;color:#fff;background:rgba(22,179,100,.9);padding:2px 4px;border-radius:4px}
.s6 .buy{position:absolute;left:4%;right:4%;bottom:3%;display:flex;gap:calc(var(--pu) * 2);transform:translateY(120%)}
.s6 .buy span,.s6 .buy b{flex:1;text-align:center;padding:calc(var(--pu) * 3.6) 0;border-radius:calc(var(--pu) * 3.4);font-size:calc(var(--pu) * 3.4);font-weight:600}
.s6 .buy span{background:#fff;border:1px solid var(--line);color:var(--ink)}.s6 .buy b{background:var(--ink);color:#fff}

@media(min-width:901px) and (max-height:820px){
.jt .gp{margin-bottom:12px;padding:6px 14px;font-size:14px}
.jt h2{font-size:clamp(34px,min(4.2vw,7.4vh),80px)}
.jt p{font-size:clamp(16px,min(1.4vw,2.5vh),22px);margin-top:1.8vh}
.jt .stt{margin-top:2.4vh}.jt .stt b{font-size:clamp(40px,8vh,80px)}
.jt .bt{margin-top:2.4vh;padding-top:2vh;gap:1vh}.jt .bt>div{font-size:clamp(14px,2.3vh,18px);gap:11px}.jt .bt i{width:18px;height:18px}
.jt .bt .done i::after{left:4.5px;top:1.5px;width:4px;height:8px}}
@media(min-width:901px) and (max-height:680px){
.jt p{display:none}
.jt .stt b{font-size:7vh}.jt .stt span{font-size:14px}
.jt .bt>div:not(.now):not(.now + div){display:none}
.jt .bt>div.now~div~div{display:none}}

@media(max-width:900px){.jn__titles{top:72px;height:calc(40svh - 84px)}.jt .gp{margin-bottom:10px;padding:5px 12px;font-size:13px}.jt h2{font-size:clamp(26px,7.2vw,40px)}.jt p{font-size:15px;margin-top:8px;max-width:none}
.s1 .chips span{font-size:12px;padding:6px 10px}.s1 .fb span{font-size:9px;padding:2px 4px}.s1 .fb.c span{font-size:11px;padding:4px 7px}
.s2 .ng{grid-template-columns:repeat(4,1fr);gap:6px}.s2 .tip{width:180px;padding:10px 12px}.s2 .tip span{font-size:12px}.s2 .lg{display:none}
.s3 .cmd{left:5%;right:5%}.s3 .g3{left:61%}}
@media(max-width:900px) and (max-height:760px){.jt p{display:none}}
