.banniere3d{--w: clamp(230px, 27vw, 400px);--ecart: clamp(170px, 22vw, 340px);--ease-out: cubic-bezier(.23, 1, .32, 1);position:relative;isolation:isolate;overflow:hidden;padding:56px 0 72px;border-bottom:1px solid var(--trait);background:var(--noir)}.b3d-fond{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none}.b3d-fond:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(120% 70% at 50% 100%,rgba(10,10,10,0),var(--noir) 75%)}.lueur{position:absolute;top:46%;width:46vw;height:46vw;max-width:720px;max-height:720px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 70%,transparent),transparent);opacity:.35;filter:blur(20px);transition:opacity .8s var(--ease-out)}.lueur-0{left:26%}.lueur-1{left:50%}.lueur-2{left:74%}.lueur.n1{left:50%}.lueur.n2.lueur-0{left:36%}.lueur.n2.lueur-1{left:64%}.banniere3d[data-actif="0"] .lueur-0,.banniere3d[data-actif="1"] .lueur-1,.banniere3d[data-actif="2"] .lueur-2{opacity:.8}.b3d-tete{text-align:center;position:relative;z-index:2}.b3d-tete .sur-titre{display:inline-block}.banniere3d h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(44px,6.2vw,90px);line-height:.95;letter-spacing:.005em;margin:18px auto 0;max-width:14ch}.banniere3d h1 em{font-style:normal;color:var(--rouge)}.b3d-scene{position:relative;height:calc(var(--w) * 1.13 + 140px);perspective:1600px;perspective-origin:50% 40%;margin-top:28px}.b3d-monde{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;transform:rotateX(var(--mx, 0deg)) rotateY(var(--my, 0deg));pointer-events:none}.b3d-monde .b3d-veste{pointer-events:auto}.b3d-geant{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%) translateZ(-520px) scale(1.35);font-family:var(--display);font-size:clamp(140px,26vw,420px);line-height:1;letter-spacing:.02em;white-space:nowrap;text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(243,239,232,.13);pointer-events:none;-webkit-user-select:none;user-select:none}.b3d-veste{--x: 0px;--y: 0px;--z: 0px;--ry: 0deg;--lift: 0px;--s: 1;position:absolute;left:50%;top:0;width:var(--w);display:flex;flex-direction:column;align-items:center;transform:translate(-50%) translate(calc(var(--x) * (1 + var(--etale, 0) * .35))) translateY(var(--y)) translateZ(calc(var(--z) + var(--lift))) rotateY(calc(var(--ry) * (1 - var(--redresse, 0)))) scale(var(--s));transition:transform .7s var(--ease-out),filter .5s var(--ease-out),opacity .7s var(--ease-out);-webkit-tap-highlight-color:transparent}.pos-centre{--z: 40px;z-index:3}.pos-gauche{--x: calc(var(--ecart) * -1);--z: -170px;--ry: 24deg;--y: 18px;z-index:2}.pos-droite{--x: var(--ecart);--z: -170px;--ry: -24deg;--y: 18px;z-index:2}.b3d-veste.actif{--lift: 70px;--redresse: .55;z-index:4}.pos-gauche.actif,.pos-droite.actif{--lift: 250px}.b3d-monde.survol .pos-centre:not(.actif){--z: -60px}.b3d-monde.survol .b3d-veste:not(.actif){filter:brightness(.45) saturate(.6)}.banniere3d:not(.pret) .b3d-veste{opacity:0;--y: 90px}.banniere3d.entree .b3d-veste{transition-delay:calc(var(--i) * .14s + .1s);transition-duration:1.1s}.b3d-flotte{width:100%;animation:b3d-flotter 7s ease-in-out infinite;animation-delay:calc(var(--i) * -2.3s)}@keyframes b3d-flotter{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(.4deg)}}.b3d-visuel{position:relative;width:100%;aspect-ratio:1178 / 1335;isolation:isolate}.b3d-visuel:before{content:"";position:absolute;top:8%;right:4%;bottom:10%;left:4%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 55%,transparent),transparent);filter:blur(24px);opacity:.55;transition:opacity .6s var(--ease-out)}.b3d-veste.actif .b3d-visuel:before{opacity:.95}.b3d-visuel img{width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-mask-image:radial-gradient(ellipse 52% 56% at 50% 50%,#000 54%,rgba(0,0,0,.45) 74%,transparent 94%);mask-image:radial-gradient(ellipse 52% 56% at 50% 50%,#000 54%,rgba(0,0,0,.45) 74%,transparent 94%);filter:contrast(1.12) brightness(.9)}.mode-detoure .b3d-visuel img{object-fit:contain;-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 34px 34px rgba(0,0,0,.65))}.b3d-sol{width:62%;height:26px;margin-top:-34px;background:radial-gradient(closest-side,rgba(0,0,0,.8),transparent);filter:blur(3px);animation:b3d-ombre 7s ease-in-out infinite;animation-delay:calc(var(--i) * -2.3s)}@keyframes b3d-ombre{0%,to{transform:scaleX(1);opacity:1}50%{transform:scaleX(.86);opacity:.7}}.b3d-legende{display:grid;justify-items:center;gap:4px;margin-top:14px;text-align:center;opacity:.55;transform:translateY(4px);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out)}.b3d-veste.actif .b3d-legende,.pos-centre .b3d-legende{opacity:1;transform:none}.b3d-monde.survol .b3d-veste:not(.actif) .b3d-legende{opacity:.4}.b3d-couleur{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}.b3d-couleur i{width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff4d}.b3d-legende b{font-size:15px;font-weight:600}.b3d-prix{font-size:14px;color:var(--gris)}.b3d-bas{display:grid;justify-items:center;gap:22px;text-align:center;position:relative;z-index:2}.b3d-bas p{color:var(--gris);max-width:46ch;font-size:16px}.b3d-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}@media(max-width:820px){.banniere3d{--w: 40vw;--ecart: 31vw;padding:40px 0 56px}.b3d-scene{perspective:1100px;height:calc(var(--w) * 1.13 + 110px)}.pos-gauche,.pos-droite{--z: -140px}.pos-gauche{--ry: 20deg}.pos-droite{--ry: -20deg}.pos-gauche .b3d-legende,.pos-droite .b3d-legende{opacity:0}.b3d-veste.actif .b3d-legende{opacity:1}.b3d-geant{font-size:38vw}}@media(max-width:560px){.banniere3d{--w: 54vw;--ecart: 27vw}.b3d-scene{height:calc(var(--w) * 1.13 + 150px);margin-top:16px}.b3d-legende b{font-size:13px}.b3d-cta .btn{flex:1 1 100%}}@media(prefers-reduced-motion:no-preference){.js:not(.gsap-actif) .banniere3d .b3d-tete,.js:not(.gsap-actif) .banniere3d .b3d-scene,.js:not(.gsap-actif) .banniere3d .b3d-bas{visibility:hidden}}.banniere3d.intro .b3d-veste,.banniere3d.intro .b3d-legende{transition:none}.banniere3d .b3d-tete h1{font-kerning:none}@media(prefers-reduced-motion:reduce){.b3d-flotte,.b3d-sol{animation:none}.b3d-veste,.lueur{transition:none}.banniere3d:not(.pret) .b3d-veste{opacity:1;--y: 0px}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/banniere3d.css.map */