.km-banners { --km-banner-accent: #c90000; --km-banner-max-width: 1440px; --km-banner-peek: 64px; --km-banner-gap: 24px; --km-banner-card-width: min(var(--km-banner-max-width), calc(100% - var(--km-banner-peek) - var(--km-banner-peek))); width: 100%; max-width: var(--km-banner-max-width); margin-inline: auto; position: relative; background: #191919; display: flex; flex-direction: column; isolation: isolate; }
.km-banners [hidden] { display: none !important; }
.km-banners .km-banners__viewport { position: relative; width: 100%; aspect-ratio: var(--km-banner-desktop); overflow: hidden; order: 0; touch-action: pan-y; }
.km-banners .km-banners__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 320ms ease, visibility 320ms; }
.km-banners .km-banners__slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; z-index: 1; }
.km-banners .km-banners__slide > a, .km-banners .km-banners__slide picture { display: block; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; }
.km-banners .km-banners__slide img.km-banners__image { display: block; width: 100%; height: 100%; max-width: none; max-height: none; object-fit: var(--km-banner-fit, contain); border-radius: 0; margin: 0; padding: 0; }
.km-banners .km-banners__controls { display: flex; align-items: center; justify-content: center; gap: 4px; min-height: 44px; padding: 2px 8px; background: #191919; order: 1; }
.km-banners .km-banners__controls button { appearance: none; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 40px; min-height: 40px; padding: 0; margin: 0; border: 0; border-radius: 3px; background: transparent; color: #fff; font: 20px/1 system-ui, sans-serif; cursor: pointer; box-shadow: none; text-decoration: none; }
.km-banners .km-banners__controls button:hover { background: #383838; color: #fff; }
.km-banners .km-banners__controls button:focus-visible, .km-banners .km-banners__slide a:focus-visible { outline: 3px solid #fff; outline-offset: -4px; box-shadow: inset 0 0 0 6px #171717; }
.km-banners .km-banners__dots { display: flex; justify-content: center; flex-wrap: wrap; min-width: 0; }
.km-banners .km-banners__dots button { width: 28px; }
.km-banners .km-banners__dot span { width: 8px; height: 8px; background: #b8b8b8; border-radius: 50%; transition: transform 200ms ease, background 200ms ease; }
.km-banners .km-banners__dot[aria-current="true"] span { background: #fff; box-shadow: 0 0 0 3px var(--km-banner-accent); transform: scale(1.1); }
.km-banners .km-banners__pause { margin-right: auto; font-size: 14px; }
.km-banners .km-banners__next { margin-left: auto; }
.km-banners[data-transition="slide"] { max-width: none; background: transparent; }
.km-banners[data-transition="slide"] .km-banners__viewport { aspect-ratio: auto; }
.km-banners[data-transition="slide"] .km-banners__viewport::before { content: ""; display: block; width: var(--km-banner-card-width); aspect-ratio: var(--km-banner-desktop); margin-inline: auto; }
.km-banners[data-transition="slide"] .km-banners__viewport > .km-banners__slide { width: var(--km-banner-card-width); left: 50%; right: auto; transform: translateX(-50%); }
.km-banners .km-banners__track { position: absolute; inset: 0; display: flex; gap: var(--km-banner-gap); width: 100%; height: 100%; transition: transform 380ms cubic-bezier(.22,.61,.36,1); }
.km-banners .km-banners__track > .km-banners__slide { position: relative; inset: auto; flex: 0 0 var(--km-banner-card-width); height: 100%; opacity: .65; visibility: visible; background: #191919; transition: opacity 380ms ease; }
.km-banners .km-banners__track > .km-banners__slide.is-active { opacity: 1; }
.km-banners .km-banners__track.is-resetting, .km-banners .km-banners__track.is-resetting > .km-banners__slide { transition: none; }
.km-banners[data-transition="slide"] .km-banners__controls { box-sizing: border-box; width: var(--km-banner-card-width); margin-inline: auto; }
@media (max-width: 767px) {
    .km-banners { max-width: none; --km-banner-card-width: 100%; --km-banner-gap: 0px; }
    .km-banners .km-banners__viewport, .km-banners[data-transition="slide"] .km-banners__viewport::before { aspect-ratio: var(--km-banner-mobile); }
    .km-banners[data-transition="slide"] .km-banners__viewport { aspect-ratio: auto; }
}
@media (prefers-reduced-motion: reduce) { .km-banners .km-banners__slide, .km-banners .km-banners__dot span, .km-banners .km-banners__track, .km-banners .km-banners__track > .km-banners__slide { transition: none; } }