/* The original three-banner mosaic remains the default. */
@media (min-width: 761px) {
.banner-mosaic[data-banner-count="1"] { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
.banner-mosaic[data-banner-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); }
.banner-mosaic:not([data-banner-count="1"]):not([data-banner-count="2"]):not([data-banner-count="3"]) { height: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: 250px; }
}
.banner-mosaic:not([data-banner-count="3"]) .promo-banner--primary { grid-row: auto; }
.banner-markup { width: 100%; height: 100%; overflow: auto; overflow-wrap: anywhere; }
.banner-markup :is(iframe, video) { display: block; width: 100%; height: 100%; border: 0; }
.banner-markup img { max-width: 100%; height: auto; }
.banner-carousel { position: relative; min-width: 0; }
.banner-carousel:not(.owl-loaded) { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; }
.banner-carousel:not(.owl-loaded) > .promo-banner { flex: 0 0 100%; }
.banner-carousel .promo-banner { width: 100%; height: 410px; border-radius: 30px; box-shadow: none; }
.banner-carousel .owl-nav { display: flex; justify-content: space-between; position: absolute; top: calc(50% - 22px); inset-inline: 12px; pointer-events: none; }
.banner-carousel .owl-nav button { width: 44px; height: 44px; border: 1px solid var(--line) !important; border-radius: 50%; background: white !important; color: var(--plum-950) !important; pointer-events: auto; }
.banner-carousel .owl-nav button.disabled { opacity: .4; }
.banner-carousel .owl-nav.disabled, .banner-carousel .owl-dots.disabled { display: none; }
.banner-carousel .owl-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.banner-carousel button.owl-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--lilac-200); }
.banner-carousel button.owl-dot.active { background: var(--plum-700); }
.banner-playback { display: block; margin: 12px auto 0; border: 1px solid var(--line); border-radius: 12px; padding: 8px 14px; background: white; color: var(--plum-950); }
.banner-playback[hidden] { display: none; }
.banner-carousel :is(button, a):focus-visible, .banner-playback:focus-visible { outline: 3px solid var(--plum-700); outline-offset: 3px; }
.banner-carousel .owl-stage { padding: 0; }
.banner-carousel .owl-item { animation-duration: .45s; }
.banner-carousel .banner-fade-out { animation-name: banner-fade-out; }
@keyframes banner-fade-out { to { opacity: 0; } }
@media (max-width: 1080px) { .banner-carousel .promo-banner { height: 360px; } }
@media (max-width: 760px) {
    .banner-mosaic[data-banner-count] { height: auto; grid-template-columns: none; grid-template-rows: 210px; grid-auto-rows: auto; }
    .banner-mosaic[data-banner-count="1"] { grid-auto-columns: 100%; }
    .banner-carousel .promo-banner { height: 260px; border-radius: 22px; }
}
@media (max-width: 600px) {
    .banner-mosaic[data-banner-count] { grid-template-rows: 180px; }
    .banner-carousel .promo-banner { height: 210px; border-radius: 18px; }
}