.home-carousel{position:relative;width:100%;height:var(--carousel-mobile-height,200px);overflow:hidden;touch-action:pan-y;background:#fff}.home-carousel-link,.home-carousel-link img{display:block;width:100%;height:100%}.home-carousel-link img{object-fit:contain;object-position:center}.home-carousel-prev,.home-carousel-next{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:38px;border:0;border-radius:9px;background:#0005;color:white;font-size:25px;opacity:0}.home-carousel-prev{left:12px}.home-carousel-next{right:12px}.home-carousel:hover .home-carousel-prev,.home-carousel:hover .home-carousel-next{opacity:1}.home-carousel-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:7px}.home-carousel-dots button{padding:0;width:7px;height:7px;border:0;border-radius:50%;background:#ffffff80}.home-carousel-dots button[aria-current=true]{background:white;width:18px;border-radius:5px}@media(min-width:701px){.home-carousel{height:var(--carousel-desktop-height,260px);max-width:1408px;margin:auto}}
body.frontend-light .home-carousel .home-carousel-dots button{background:#ffffff80!important;border:0!important}body.frontend-light .home-carousel .home-carousel-dots button[aria-current=true]{background:#fff!important}body.frontend-light .home-carousel .home-carousel-prev,body.frontend-light .home-carousel .home-carousel-next{background:#0005!important;color:#fff!important;border:0!important}

/* Preserve the complete original banner on both device sizes, including legacy single banners. */
body.frontend-light img.hero{object-fit:contain!important;object-position:center!important;background:#fff!important}

/* Follow the former banner edges while sizing to the complete image ratio. */
body.frontend-light .home-carousel{width:calc(100% + 32px);max-width:none;margin-left:-16px;margin-right:-16px;height:var(--carousel-mobile-height,200px);background:#fff}
body.frontend-light .home-carousel .home-carousel-link{height:100%}
body.frontend-light .home-carousel .home-carousel-link img{width:100%;height:100%;object-fit:contain;display:block}
@media(min-width:701px){body.frontend-light .home-carousel{width:100%;max-width:none;margin-left:0;margin-right:0;height:var(--carousel-desktop-height,260px)}}

/* The unloaded image has no src until decoding finishes: never paint a broken icon. */
.home-carousel img:not([src]){visibility:hidden}

/* Once decoded, fill the content width at the first slide ratio, not a fixed-height letterbox. */
body.frontend-light .home-carousel[style*="--carousel-aspect-ratio"]{height:auto;aspect-ratio:var(--carousel-aspect-ratio)}
