/* La mosaïque conserve les photos entières au repos et le rollover existant. */
#produits .products{align-items:start;position:relative}
#produits .products .visual>a{aspect-ratio:auto}
#produits .products .visual img{display:block;width:100%;height:auto}
#produits .products .visual{background:transparent}
#produits .products.mosaic-ready{display:block}
#produits .products.mosaic-ready>.product{position:absolute;left:0;top:0}
#produits .products>.product[hidden]{display:none!important}
/* Colonnes identiques à la grille existante, sans contraindre les hauteurs. */
#produits .products{--mosaic-columns:5;--mosaic-gap:18px;--mosaic-row-gap:31px}
@media(max-width:1100px){#produits .products{--mosaic-columns:4}}
@media(max-width:760px){#produits .products{--mosaic-columns:2;--mosaic-gap:12px;--mosaic-row-gap:25px}}
/* Les photos du présentoir gardent leur format, avec le nom sous l'image. */
.hero-rack{--hero-photo-height:clamp(300px,26vw,400px);align-items:center}
.hero-rack .hero-product{flex:0 0 auto;width:calc(var(--hero-photo-height)*var(--photo-ratio,.75) + 18px);max-width:none}
.hero-rack .hero-product img{display:block;width:100%;height:var(--hero-photo-height);object-fit:contain;background:transparent}
.hero-product .motif-label{display:block;max-width:100%;width:fit-content;margin:10px auto 2px;padding:7px 11px;border:1px solid #191919;border-radius:16px;background:#fff;color:#191919;font-size:13px;font-weight:750;line-height:1.25;text-align:center;transition:transform .4s cubic-bezier(.16,1,.3,1),background .3s}
.hero-product:hover .motif-label,.hero-product:focus-visible .motif-label{transform:rotate(-1deg);background:#f0f6ff}
.hero-copy h1{font-size:clamp(42px,4.7vw,72px)}
@media(max-width:760px){.hero-rack{--hero-photo-height:300px}.hero-product .motif-label{font-size:12px}.hero-copy h1{font-size:clamp(39px,10vw,58px)}}
@media(prefers-reduced-motion:reduce){.hero-product .motif-label{transition:none}.hero-product:hover .motif-label,.hero-product:focus-visible .motif-label{transform:none}}

.rail .product .visual>a{aspect-ratio:auto}.rail .product .visual img{display:block;width:100%;height:auto}.rail .product .visual{background:transparent}