/* QTouch — « Passez devant un écran, scannez » (JS : lib/site/sc7.js) */
.sc7{position:relative;height:560vh;background:#F7F4EF;font-family:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#141218}
.sc7-pin{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;grid-template-columns:minmax(300px,.8fr) 1.4fr;align-items:center;gap:4vw;padding:80px max(24px,6vw) 40px}
.sc7-t h2{margin:0;font-family:'Figtree',sans-serif;font-weight:600;font-size:clamp(38px,4.8vw,72px);line-height:1;letter-spacing:-.05em}
.sc7-t h2 b{font-weight:inherit;color:#E8763A}
.sc7-t p{margin:18px 0 0;max-width:40ch;font-size:clamp(16px,1.3vw,19px);line-height:1.55;color:#6B6378}
.sc7-t h2,.sc7-t p{opacity:0;transform:translateY(14px);transition:opacity .4s,transform .6s cubic-bezier(.22,1,.36,1)}
.sc7.tin .sc7-t h2,.sc7.tin .sc7-t p{opacity:1;transform:none}
.sc7-sc{position:relative;aspect-ratio:16/11;max-height:78vh}
.sc7-room{position:absolute;inset:0;border-radius:30px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(40,20,10,.45)}
.sc7-room img{width:100%;height:100%;object-fit:cover;filter:brightness(.8) saturate(.9);transform:scale(1.08);transition:transform 1.4s cubic-bezier(.22,1,.36,1)}
.sc7.s-walk .sc7-room img{transform:scale(1)}
.sc7-tv{position:absolute;left:14%;top:12%;width:58%;aspect-ratio:16/9;border-radius:12px;background:#0B0A09;padding:1.2%;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);transition:transform 1s cubic-bezier(.22,1,.36,1)}
.sc7.s-ph .sc7-tv{transform:translateX(-6%) scale(.96)}
.sc7-tv .scr{position:relative;width:100%;height:100%;border-radius:7px;overflow:hidden;container-type:inline-size}
.sc7-tv .scr>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .8s,transform 1s}
.sc7-tv .scr .b{opacity:0;transform:scale(1.1)}
.sc7.s-live .sc7-tv .scr .a{opacity:0}.sc7.s-live .sc7-tv .scr .b{opacity:1;transform:none}
.sc7-tv .qr{position:absolute;right:3%;top:5%;display:flex;align-items:center;gap:2.4cqw;padding:1.6cqw 2.6cqw 1.6cqw 1.6cqw;border-radius:2.6cqw;background:rgba(20,18,16,.78);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:scale(.8);opacity:0;transition:.6s cubic-bezier(.3,1.5,.5,1)}
.sc7-tv .qr img{width:12cqw;height:12cqw;border-radius:1.4cqw;background:#fff;padding:.6cqw}
.sc7-tv .qr small{display:block;font-size:2cqw;letter-spacing:.14em;text-transform:uppercase;opacity:.75}.sc7-tv .qr b{font-size:3.2cqw}
.sc7.s-qr .sc7-tv .qr{opacity:1;transform:none}
.sc7.s-qr:not(.s-ph) .sc7-tv .qr{box-shadow:0 0 0 .8cqw rgba(242,107,29,.55)}
.sc7.s-live .sc7-tv .qr{opacity:0}
.sc7-tv .lv{position:absolute;left:3%;top:5%;display:flex;align-items:center;gap:1cqw;padding:1cqw 2cqw;border-radius:99px;background:#EF4444;color:#fff;font-size:2.4cqw;font-weight:800;letter-spacing:.08em}
.sc7-tv .lv i{width:1.4cqw;height:1.4cqw;border-radius:50%;background:#fff;animation:mlBl 1s infinite}
.sc7-tv .mine{position:absolute;left:50%;bottom:6%;transform:translate(-50%,20px);padding:1.4cqw 3cqw;border-radius:99px;background:#F26B1D;color:#fff;font-size:3cqw;font-weight:800;opacity:0;transition:.5s .4s}
.sc7.s-live .sc7-tv .mine{opacity:1;transform:translate(-50%,0)}
.sc7.s-live .sc7-tv{box-shadow:0 0 0 4px #F26B1D,0 30px 70px -20px rgba(242,107,29,.7)}
/* téléphone */
.sc7-ph{position:absolute;right:4%;bottom:-4%;width:26%;aspect-ratio:9/19;border-radius:12%/6%;background:#141218;padding:2.4%;box-shadow:0 40px 70px -24px rgba(0,0,0,.7);transform:translateY(170%) rotate(8deg);transition:transform 1s cubic-bezier(.22,1,.36,1);container-type:inline-size}
.sc7.s-ph .sc7-ph{transform:translateY(0) rotate(-4deg)}
.sc7-ph .s{position:relative;width:100%;height:100%;border-radius:9%/4.5%;overflow:hidden;background:#fff}
.sc7-ph .v{position:absolute;inset:0;opacity:0;transition:opacity .4s;display:flex;flex-direction:column}
.sc7.s-ph:not(.s-pick) .v.cam,.sc7.s-pick:not(.s-pay) .v.pick,.sc7.s-pay:not(.s-live) .v.pay,.sc7.s-live .v.ok{opacity:1}
.v.cam{background:#0E0C0B;align-items:center;justify-content:center;gap:8cqw;color:#fff}
.v.cam small{font-size:6cqw;font-weight:600;opacity:.85}
.v.cam .fr{position:relative;width:58%;aspect-ratio:1;padding:5%;border-radius:8cqw;background:#fff}
.v.cam .fr img{width:100%;display:block}
.v.cam .fr::before{content:"";position:absolute;inset:-9%;border:1.4cqw solid #F26B1D;border-radius:10cqw;-webkit-mask:linear-gradient(#000 0 0) 0 0/30% 30% no-repeat,linear-gradient(#000 0 0) 100% 0/30% 30% no-repeat,linear-gradient(#000 0 0) 0 100%/30% 30% no-repeat,linear-gradient(#000 0 0) 100% 100%/30% 30% no-repeat;mask:linear-gradient(#000 0 0) 0 0/30% 30% no-repeat,linear-gradient(#000 0 0) 100% 0/30% 30% no-repeat,linear-gradient(#000 0 0) 0 100%/30% 30% no-repeat,linear-gradient(#000 0 0) 100% 100%/30% 30% no-repeat}
.v.cam .fr::after{content:"";position:absolute;left:4%;right:4%;top:8%;height:1cqw;background:#F26B1D;box-shadow:0 0 4cqw #F26B1D;animation:scLine 1.3s ease-in-out infinite alternate}
@keyframes scLine{to{top:88%}}
.sc7.s-scan .v.cam .fr{box-shadow:0 0 0 2cqw #22C55E}
.v.pick{padding:14cqw 7cqw 7cqw;gap:3cqw;background:#F7F4EF}
.v.pick b{font-size:8cqw;letter-spacing:-.02em}.v.pick small{font-size:5cqw;color:#6B6378}
.v.pick .g{display:grid;grid-template-columns:1fr 1fr;gap:3cqw;margin-top:3cqw}
.v.pick .g img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4cqw;opacity:.6}
.v.pick .g img.on{opacity:1;box-shadow:0 0 0 1.4cqw #F26B1D}
.v.pick .du{display:flex;gap:2cqw;margin-top:2cqw}.v.pick .du span{flex:1;text-align:center;padding:2.4cqw 0;border-radius:99px;background:#fff;font-size:4.6cqw;font-weight:700;color:#6B6378}
.v.pick .du span.on{background:#141218;color:#fff}
.v.pick button{margin-top:auto;border:0;padding:4.4cqw;border-radius:99px;background:#F26B1D;color:#fff;font:800 6cqw/1 'Figtree',sans-serif}

.v.ok{align-items:center;justify-content:center;gap:3cqw;background:#F26B1D;color:#fff;text-align:center}
.v.ok i{width:22cqw;height:22cqw;border-radius:50%;background:#fff;color:#F26B1D;display:grid;place-items:center;font-style:normal;font-size:12cqw;font-weight:900}
.v.ok b{font-size:9cqw}.v.ok small{font-size:5.4cqw;opacity:.9}
@media(max-width:900px){.sc7{height:380vh}.sc7-pin{grid-template-columns:1fr;align-content:center;gap:24px;padding-top:90px}.sc7-t h2{font-size:34px}.sc7-ph{width:30%}}
/* étape extérieure : devanture + vignette QR */
.sc7-out{position:absolute;inset:0;z-index:3;border-radius:30px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(40,20,10,.45);transition:opacity .8s,transform 1.1s cubic-bezier(.65,0,.35,1)}
.sc7-out>img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 1.4s cubic-bezier(.22,1,.36,1)}
.sc7.s-walk .sc7-out>img{transform:scale(1)}
.sc7.s-in .sc7-out{opacity:0;transform:scale(1.25);pointer-events:none}
.sc7-out .stk{position:absolute;left:var(--sx,43.5%);top:var(--sy,26%);width:12.5%;container-type:inline-size;display:grid;justify-items:center;gap:3cqw;padding:8cqw 7cqw 9cqw;border-radius:9cqw;background:#fff;color:#141218;text-align:center;box-shadow:0 10px 24px rgba(0,0,0,.3);transform:scale(.6) rotate(-4deg);opacity:0;transition:.6s cubic-bezier(.3,1.5,.5,1)}
.sc7.s-stk .sc7-out .stk{opacity:1;transform:rotate(-2deg)}
.sc7.s-stk:not(.s-ph) .sc7-out .stk{animation:stkP 1.4s ease-in-out infinite}
@keyframes stkP{50%{box-shadow:0 10px 24px rgba(0,0,0,.3),0 0 0 8cqw rgba(242,107,29,.35)}}
.sc7-out .stk .lg{width:62%}.sc7-out .stk .q{width:100%;border-radius:4cqw}
.sc7-out .stk b{font-size:9.5cqw;line-height:1.15;color:#F26B1D}.sc7-out .stk small{font-size:7cqw;font-weight:700;color:#6B6378}
.sc7.s-scan:not(.s-in) .sc7-out .stk{box-shadow:0 0 0 6cqw #22C55E}
/* téléphone : 2e scan (écran) puis choix */
.sc7.s-ph:not(.s-pick) .v.cam{opacity:1}
.sc7.s-in:not(.s-scan2) .v.cam .fr{box-shadow:none}
.sc7.s-scan2 .v.cam .fr{box-shadow:0 0 0 2cqw #22C55E}
.sc7.s-qr:not(.s-ph) .sc7-tv .qr,.sc7.s-in:not(.s-scan2) .sc7-tv .qr{box-shadow:0 0 0 .8cqw rgba(242,107,29,.55)}
.sc7-sc{container-type:inline-size}
.sc7-out .stk{font-size:.85cqw;gap:.5em;padding:1.1em 1em 1.2em;border-radius:1.4em;container-type:normal}
.sc7.s-stk:not(.s-ph) .sc7-out .stk{animation:stkP2 1.4s ease-in-out infinite}
@keyframes stkP2{50%{box-shadow:0 10px 24px rgba(0,0,0,.3),0 0 0 .9em rgba(242,107,29,.4)}}
.sc7-out .stk .q{border-radius:.5em}
.sc7-out .stk b{font-size:1.25em}.sc7-out .stk small{font-size:.95em}
.sc7.s-scan:not(.s-in) .sc7-out .stk{box-shadow:0 0 0 .7em #22C55E}
.sc7-ph{z-index:5}
/* vignette intégrée à la vitre, puis zoom dessus */
.sc7-out .ow{position:absolute;inset:0;transform-origin:49.5% 37%;transition:transform 1.3s cubic-bezier(.65,0,.35,1)}
.sc7-out .ow>img{width:100%;height:100%;object-fit:cover}
.sc7.s-ph .sc7-out .ow{transform:scale(2.6)}
.sc7-out .stk{left:46.2%;top:30%;width:6.6%;font-size:.42cqw;gap:.4em;padding:.9em .8em 1em;border-radius:.9em;background:rgba(255,255,255,.93);box-shadow:0 2px 6px rgba(0,0,0,.25);transform:none!important;opacity:0}
.sc7.s-stk .sc7-out .stk{opacity:1}
.sc7-out .stk::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,rgba(255,255,255,.35),transparent 35%,transparent 70%,rgba(255,220,180,.18));pointer-events:none}
.sc7.s-stk:not(.s-ph) .sc7-out .stk{animation:stkP3 1.4s ease-in-out infinite}
@keyframes stkP3{50%{box-shadow:0 2px 6px rgba(0,0,0,.25),0 0 0 .8em rgba(242,107,29,.5)}}
.sc7.s-scan:not(.s-in) .sc7-out .stk{box-shadow:0 0 0 .5em #22C55E}
/* téléphone identique à celui de l'accueil (bord fin, coins ronds, îlot) */
.sc7-ph{aspect-ratio:214/446!important;border-radius:17.8%/8.5%!important;background:#0C0A12!important;padding:1.1%!important;box-shadow:0 60px 120px -30px rgba(30,15,70,.6),inset 0 0 0 2px #2B2738!important}
.sc7-ph::before{content:"";position:absolute;left:50%;top:3.8%;width:29%;height:4%;translate:-50% 0;border-radius:99px;background:#000;z-index:4}
.sc7-ph .s{border-radius:15.3%/7%!important}
@media(max-width:900px){.sc7-ph{padding:1.26%!important}}

/* paiement : récap + prix avant la mise en ligne */
.v.pay{padding:14cqw 7cqw 7cqw;gap:3.2cqw;background:#F7F4EF}
.v.pay>b{font-size:8cqw;letter-spacing:-.02em}
.v.pay .it{display:flex;align-items:center;gap:3cqw;padding:3cqw;border-radius:5cqw;background:#fff}
.v.pay .it img{width:16cqw;height:16cqw;border-radius:3cqw;object-fit:cover}
.v.pay .it b{display:block;font-size:5.6cqw}.v.pay .it small{display:block;font-size:4.4cqw;color:#6B6378}
.v.pay .ln{display:flex;justify-content:space-between;font-size:4.8cqw;color:#6B6378}
.v.pay .ln b{color:#141218;font-weight:700}
.v.pay .ln.tt{margin-top:1cqw;padding-top:3cqw;border-top:1px dashed #D9D2C7;font-size:6cqw;color:#141218;font-weight:800}
.v.pay .ln.tt b{font-weight:900;color:#F26B1D}
.v.pay .ap{position:relative;margin-top:auto;border:0;height:13cqw;border-radius:99px;background:#141218;color:#fff;font:800 6cqw/1 'Figtree',sans-serif;overflow:hidden}
.v.pay .ap span{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .3s}
.v.pay .pk,.v.pay .pd{opacity:0}
.sc7.s-paid .v.pay .pi{opacity:0}.sc7.s-paid .v.pay .pd{opacity:1}
.sc7.s-paid .v.pay .ap{background:#16A34A;animation:p6Bump .5s}
.v.pay .sec{text-align:center;font-size:4cqw;color:#8A8296}
.v.pay .ln.tt{margin-bottom:auto}
.v.pay .ap{margin-top:0;flex:none;height:15cqw;min-height:15cqw}