.vr-page-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.storefront{overflow-x:clip}
.vr-carousel{
 position:relative;
 width:100%;
 height:calc(100vh - var(--vr-chrome, 140px));
 height:calc(100dvh - var(--vr-chrome, 140px));
 min-height:220px;
 overflow:hidden;
 isolation:isolate;
 background:#102b46;
 color:#fff;
}
.storefront .vr-carousel{
 width:100vw;
 max-width:none;
 margin-left:calc(50% - 50vw);
}
.storefront main:has(> .vr-carousel){padding-top:0}
.vr-carousel-stage,.vr-carousel .vr-slide{position:absolute;inset:0}
.vr-carousel .vr-slide{z-index:0;opacity:0;transition:opacity .7s ease;pointer-events:none}
.vr-carousel .vr-slide.is-active{z-index:1;opacity:1}
.vr-carousel .vr-slide img{
 display:block;
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center center;
}
.vr-carousel .vr-slide[data-category="Marc au comptoir"] img{object-position:center 18%}
.vr-carousel .vr-slide[data-category="Rayonnages"] img{object-position:center 40%}
.vr-carousel .vr-slide[data-category="Cuivre"] img{object-position:center 45%}
.vr-carousel .vr-slide[data-category="PE"] img{object-position:center 40%}
.vr-carousel .vr-slide[data-category="Laiton"] img{object-position:center 40%}
.vr-carousel .vr-slide[data-category="Flexible"] img{object-position:center 42%}
.vr-carousel .vr-slide[data-category="Compartiments"] img{object-position:center 35%}
.vr-carousel .vr-slide[data-category="Fixation"] img{object-position:center 40%}
.vr-carousel .vr-slide[data-category="Électrozingué"] img{object-position:center 38%}
.vr-carousel::after{
 content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
 background:linear-gradient(0deg,#07182866,transparent 22%,transparent 78%,#07182826);
}
.vr-carousel-pitch{
 position:absolute;z-index:2;inset:0;
 display:flex;align-items:center;justify-content:center;
 padding:80px 64px;text-align:center;pointer-events:none;box-sizing:border-box;
}
.vr-carousel-pitch-box{
 max-width:44rem;width:100%;
 padding:0;background:none;color:#fff;
}
.vr-carousel-pitch-title{
 margin:0 0 14px;
 font:800 28px/1.2 Arial,Helvetica,sans-serif;
 text-shadow:0 0 2px #000,0 2px 10px #000d,0 8px 28px #0009;
}
.vr-carousel-pitch-box>p:last-child{
 margin:0;
 font:600 17px/1.55 Arial,Helvetica,sans-serif;
 color:#fff;
 text-shadow:0 0 2px #000,0 2px 10px #000d,0 8px 24px #0009;
}
.vr-carousel-caption{
 position:absolute;z-index:3;top:22px;left:24px;
 display:flex;align-items:center;gap:12px;
 padding:10px 15px;border-radius:5px;background:#071828c9;
 font:500 14px/1.4 system-ui,sans-serif;
}
.vr-carousel-caption strong{font-weight:650}
.vr-carousel-caption span{color:#e2e9ef;font-size:12px}
.vr-carousel button{
 box-sizing:border-box;border:0;margin:0;padding:0;
 cursor:pointer;color:#fff;font-family:inherit;
}
.vr-carousel button:focus-visible{outline:3px solid white;outline-offset:-3px}
.vr-carousel .vr-arrow{
 position:absolute;z-index:3;top:50%;transform:translateY(-50%);
 width:44px;height:54px;border-radius:6px;
 background:#07182880;font-size:32px;line-height:1;
}
.vr-carousel .vr-arrow:hover{background:#071828c9}
.vr-carousel .vr-prev{left:14px}
.vr-carousel .vr-next{right:14px}
.vr-carousel-controls{
 position:absolute;z-index:3;bottom:14px;left:50%;transform:translateX(-50%);
 display:flex;align-items:center;gap:6px;
 width:max-content;max-width:calc(100% - 24px);box-sizing:border-box;
 padding:5px 9px;border-radius:24px;background:#071828c9;
}
.vr-carousel-dots{display:flex;align-items:center;overflow-x:auto;min-width:0;max-width:640px;scrollbar-width:thin;scrollbar-color:#8fabbf transparent}
.vr-carousel .vr-dot{width:24px;height:32px;min-height:32px;flex:0 0 24px;background:transparent}
.vr-carousel .vr-dot::before{content:'';display:block;width:7px;height:7px;margin:auto;border:1px solid #fff;border-radius:50%;background:#ffffff50}
.vr-carousel .vr-dot[data-group-start=true]{margin-left:6px}
.vr-carousel .vr-dot[aria-current=true]::before{background:#fff;transform:scale(1.15)}
.vr-carousel .vr-pause{min-height:36px;padding:0 10px;flex-shrink:0;background:transparent;font-size:12px}
.vr-carousel-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (max-width:1024px),(pointer:coarse){
 html body .vr-carousel .vr-arrow{width:48px;height:48px}
 .vr-carousel .vr-prev{left:10px}
 .vr-carousel .vr-next{right:10px}
 .vr-carousel-caption{top:12px;left:12px;padding:8px 12px;max-width:calc(100% - 24px)}
 .vr-carousel-pitch{padding:64px 20px}
 .vr-carousel-pitch-title{font-size:22px}
 .vr-carousel-pitch-box>p:last-child{font-size:14px;line-height:1.45}
 .vr-carousel .vr-slide[data-category="Marc au comptoir"] img{object-position:center 10%}
}
@media (max-width:600px){
 .vr-carousel .vr-slide img{object-position:center 30%}
 .vr-carousel .vr-slide[data-category="Marc au comptoir"] img{object-position:center 8%}
 .vr-carousel-pitch{padding:56px 12px}
}
@media (orientation:landscape) and (max-height:500px){
 .vr-carousel .vr-slide[data-category="Marc au comptoir"] img{object-position:center 28%}
 .vr-carousel-caption{top:8px;left:8px}
 .vr-carousel-pitch{padding:40px 72px}
 .vr-carousel-pitch-title{font-size:18px;margin-bottom:8px}
 .vr-carousel-pitch-box>p:last-child{font-size:13px;line-height:1.4}
}
@media (prefers-reduced-motion:reduce){.vr-carousel .vr-slide{transition:none}}
