:root{--qm:url('data:image/svg+xml,%3Csvg%20version%3D%221.2%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2049%2049%22%20width%3D%2249%22%20height%3D%2249%22%3E%20%3Cg%3E%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22m37.7%2043.52v4.3c-1.54-0.41-3.08-0.89-4.52-1.59q-0.5-0.24-0.97-0.52c-1.26-0.75-2.36-1.69-3.38-2.74q-0.83-0.87-1.59-1.82c-1.37-1.71-2.52-3.6-3.86-5.33-0.68-0.88-1.4-1.71-2.23-2.46q-1.37-1.24-3.03-2.07v6.63c0%203.61%202.94%206.55%206.55%206.55q1.38-0.01%202.58-0.53c0.95%201.17%201.96%202.27%203.09%203.22-1.65%201.02-3.59%201.61-5.67%201.61-5.98%200-10.85-4.87-10.85-10.85v-7.94q-1.91-0.25-3.82%200.09%200-1.93%200-3.86%200.06-0.01%200.11-0.01%201.85-0.16%203.71%200.06%201.72%200.2%203.36%200.64%200.48%200.13%200.94%200.28c2.95%200.96%205.61%202.63%207.61%205.06%200.87%201.07%201.61%202.25%202.36%203.4%200.89%201.37%201.82%202.72%202.91%203.92q0.21-0.79%200.21-1.64v-27.13c0-3.23-2.35-5.92-5.44-6.45v-4.33c5.46%200.55%209.74%205.18%209.74%2010.78v27.13c0%201.59-0.34%203.11-0.96%204.47%200.99%200.51%202.07%200.83%203.15%201.13z%22/%3E%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22m23.62%200v4.33c-3.11%200.5-5.5%203.21-5.5%206.46v14.11q-0.46-0.15-0.94-0.28-1.64-0.44-3.36-0.64v-13.19c0-5.62%204.31-10.26%209.8-10.79z%22/%3E%20%3C/g%3E%20%3C/svg%3E')}
/* QTouch — « Pas juste un écran » façon oryzo (JS : lib/site/qz7.js) */
.qz{position:relative;height:420vh;background:#16110E;color:#FBEEDC;font-family:'Figtree',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.qz-pin{position:sticky;top:0;height:100vh;overflow:hidden;background:radial-gradient(70% 70% at 0% 100%,rgba(140,70,30,.45),transparent 60%),#16110E}
.qz-glow{position:absolute;inset:0;pointer-events:none;opacity:var(--g,0);box-shadow:inset 0 0 140px 20px rgba(236,72,153,.35),inset 0 0 60px rgba(242,107,29,.4);background:linear-gradient(90deg,rgba(168,85,247,.25),transparent 25%,transparent 75%,rgba(242,107,29,.25))}
.qz h2{margin:0;font-family:'Figtree',sans-serif;font-weight:700;letter-spacing:-.035em;color:#FBEEDC}
.qz-a .l{position:absolute;left:max(24px,6vw);top:50%;transform:translateY(-50%);font-size:clamp(34px,4vw,64px);line-height:.98;text-transform:uppercase}
.qz .r{margin:0;font-size:clamp(16px,1.5vw,22px);line-height:1.35;font-weight:600;color:#FBEEDC}
.qz-a .r{position:absolute;right:max(24px,6vw);top:50%;transform:translateY(-50%);width:min(320px,24vw)}
.qz-a{opacity:calc(1 - var(--b,0) * 2)}
.qz-b{position:absolute;inset:0;opacity:var(--b,0);pointer-events:none}
.qz-b h2{position:absolute;left:0;right:0;top:11vh;text-align:center;font-size:clamp(46px,7.4vw,124px);line-height:.95;transform:translateY(calc((1 - var(--b,0)) * 60px))}
.qz-b h2 span{display:inline-block}
.qz-b sup{font-size:.45em;vertical-align:top;margin-left:.04em}
.qz-b em{display:block;margin:.12em 8vw 0 0;text-align:right;font-style:normal;font-size:clamp(18px,2vw,34px);letter-spacing:.02em;color:#F26B1D}
.qz-b .r{position:absolute;right:max(24px,22vw);bottom:12vh;text-align:right;text-transform:uppercase;font-size:clamp(15px,1.4vw,22px);letter-spacing:-.01em}
.qz-b .ft{position:absolute;right:20px;bottom:18px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#B9A894;border-top:1px dashed #6B5B4C;padding-top:8px}
.qz-c{position:absolute;left:max(24px,6vw);bottom:10vh;display:grid;gap:14px;opacity:var(--c,0);transform:translateY(calc((1 - var(--c,0)) * 30px))}
.qz-c .it{padding-left:14px;border-left:2px solid #F26B1D}
.qz-c b{display:block;font-size:16px}.qz-c small{font-size:13px;color:#B9A894}
/* le Q en 3D */
.qz-q{position:absolute;left:50%;top:50%;width:min(36vw,52vh);aspect-ratio:1;transform:translate(-50%,-50%) translate(var(--qx,0),var(--qy,0)) scale(var(--qs,1));perspective:1400px}
.qz-r{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx,55deg)) rotateY(var(--ry,-30deg)) rotateZ(var(--rz,0deg))}
.qz-r i,.qz-r .f{position:absolute;inset:0;-webkit-mask:var(--qm) center/contain no-repeat;mask:var(--qm) center/contain no-repeat}
.qz-r i{transform:translateZ(calc(var(--z) * -1.6px));background:linear-gradient(135deg,#5A2E14,#2A140A)}
.qz-r .f{transform:translateZ(1px);background:radial-gradient(120% 90% at 30% 20%,#F5A55C 0%,#D9733A 35%,#9A4A1F 75%,#5E2C12 100%)}
.qz-r .f::after{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 40% 40%,rgba(255,255,255,.07) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}
.qz-q .sh{position:absolute;left:15%;right:15%;bottom:-14%;height:14%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent);transform:scale(var(--shs,1))}
@media(max-width:900px){.qz-a .l{top:16vh;transform:none}.qz-a .r{top:auto;bottom:10vh;transform:none;width:auto;left:24px}.qz-q{width:62vw}.qz-b .r{right:24px;bottom:28vh}.qz-c{bottom:4vh}}

/* intro : un écran en plan technique qui change de format, puis le Q en sort */
.qz{height:620vh}
.qz-pin::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(242,107,29,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(242,107,29,.07) 1px,transparent 1px);background-size:48px 48px;opacity:var(--gr,1);pointer-events:none}
.qz-sc{position:absolute;left:50%;top:50%;width:var(--sw,38vw);height:var(--sh,21.4vw);transform:translate(-50%,-50%) scale(var(--ss,1));opacity:var(--so,1);transition:width .9s cubic-bezier(.22,1,.36,1),height .9s cubic-bezier(.22,1,.36,1);z-index:1}
.qz-sc .fr{position:absolute;inset:0;border:2px solid #F26B1D;border-radius:var(--sr,16px);transition:border-radius .9s}
.qz-sc .fr .in{position:absolute;inset:14px;border:2px dashed #F26B1D;border-radius:calc(var(--sr,16px) - 8px);opacity:.85;transition:border-radius .9s}
.qz-sc .fr .ft{position:absolute;left:50%;top:100%;width:16%;height:40px;transform:translateX(-50%);border:2px dashed #F26B1D;border-top:0;opacity:var(--ft,1);transition:opacity .5s}
.qz-sc .dm{position:absolute;display:flex;align-items:center;gap:12px;color:#F26B1D;font:800 15px/1 'Figtree',sans-serif;letter-spacing:.12em}
.qz-sc .dm i{flex:1;background:#F26B1D;opacity:.7}
.qz-sc .dm.h{left:0;right:0;top:-44px}.qz-sc .dm.h i{height:1.5px}
.qz-sc .dm.v{top:0;bottom:0;right:-60px;width:30px;flex-direction:column}.qz-sc .dm.v i{width:1.5px}
.qz-sc .cr{position:absolute;width:20px;height:20px;border:0 solid #F26B1D}
.qz-sc .c1{left:-20px;top:-20px;border-left-width:3px;border-top-width:3px}.qz-sc .c2{right:-20px;top:-20px;border-right-width:3px;border-top-width:3px}
.qz-sc .c3{left:-20px;bottom:-20px;border-left-width:3px;border-bottom-width:3px}.qz-sc .c4{right:-20px;bottom:-20px;border-right-width:3px;border-bottom-width:3px}
.qz-sc .nm{position:absolute;left:0;right:0;bottom:-90px;text-align:center;font:800 13px/1 'Figtree',sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#FBEEDC;opacity:.8}
.qz-sc.f1{--sw:30vw;--sh:22.5vw;--sr:22px;--ft:0}
.qz-sc.f2{--sw:14vw;--sh:29vw;--sr:34px;--ft:0}
.qz-sc.f3{--sw:16vw;--sh:34vw;--sr:18px;--ft:1}
.qz-sc::after{content:"";position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;transform:translate(-50%,-50%) scale(var(--gl,0));border-radius:50%;background:radial-gradient(closest-side,rgba(242,107,29,.85),rgba(242,107,29,0));pointer-events:none}
.qz-q{opacity:var(--qo,1)}
@media(max-width:900px){.qz-sc{--sw:80vw;--sh:46vw}.qz-sc.f1{--sw:60vw;--sh:45vw}.qz-sc.f2{--sw:34vw;--sh:70vw}.qz-sc.f3{--sw:38vw;--sh:70vw}.qz-sc .dm.v{right:-40px}}
/* formats : écran TV plus compact (ne touche plus le texte), QBOX et QTOTEM dessinés */
.qz-sc{--sw:30vw;--sh:16.9vw}
.qz-sc.f1{--sw:24vw;--sh:18vw}
.qz-sc .dm.v{right:-50px}
.qz-sc.f3{--sw:17vw;--sh:32vw;--sr:16px;--ft:0}
.qz-sc.f3 .fr .in{inset:14px 14px 40% 14px}
.qz-sc.f4{--sw:14vw;--sh:30vw;--sr:20px;--ft:0}
.qz-sc.f4 .fr .in{inset:14px 14px 13% 14px}
.qz-sc .fr .in{transition:border-radius .9s,inset .9s cubic-bezier(.22,1,.36,1)}
.qz-sc .qx{position:absolute;inset:0;width:100%;height:100%;overflow:visible;opacity:0;transition:opacity .5s;pointer-events:none}
.qz-sc .qx rect,.qz-sc .qx path{fill:none;stroke:#F26B1D;stroke-width:2;stroke-dasharray:7 6;vector-effect:non-scaling-stroke}
.qz-sc.f3 .x3,.qz-sc.f4 .x4{opacity:.9;transition-delay:.55s}
.qz-sc.f4 .nm{bottom:-110px}
@media(max-width:900px){.qz-sc{--sw:80vw;--sh:45vw}.qz-sc.f1{--sw:60vw;--sh:45vw}.qz-sc.f3{--sw:40vw;--sh:72vw}.qz-sc.f4{--sw:34vw;--sh:70vw}}
.qz-sc{top:46%}
.qz-sc.f4{--sw:15vw;--sh:30vw;--sr:16px}
.qz-sc.f4 .fr .in{inset:14px 14px 42% 14px}
.qz-sc.f4 .nm{bottom:-100px}
/* QTOTEM = borne prisme : écran large, panneau cadeau dessous, flanc triangulaire */
.qz-sc.f4{--sw:20vw;--sh:28vw;--sr:18px}
.qz-sc.f4 .fr .in{inset:14px 14px 30% 14px}
.qz-sc.f4 .dm.v{right:-90px}
