.beyond-banner-slider {
    position: relative;
    padding-top: 0;
    margin-top: 0;
    width: 100%;
    background: var(--beyond-ui-white);
}
.beyond-banner-slider .banner-slide {
    display: block;
}
.beyond-banner-slider [hidden] {
    display: none !important;
}
.beyond-banner-slider .banner-slide img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}
.beyond-banner-slider .banner-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px;
    background: var(--beyond-ui-white);
}
.beyond-banner-slider .banner-controls button {
    border: 1px solid var(--beyond-ui-border);
    border-radius: 8px;
    min-width: 34px;
    min-height: 34px;
    background: var(--beyond-ui-white);
    color: var(--beyond-ui-ink);
    cursor: pointer;
}
.beyond-banner-slider .banner-dots {
    display: flex;
    gap: 8px;
}
.beyond-banner-slider .banner-dots button {
    min-width: 10px;
    min-height: 10px;
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 50%;
    background: var(--beyond-ui-border);
}
.beyond-banner-slider .banner-dots button[aria-pressed="true"] {
    background: var(--beyond-ui-primary);
}
.beyond-banner-slider :focus-visible {
    outline: 3px solid var(--beyond-ui-primary);
    outline-offset: 3px;
}
@media (max-width: 760px) {
    .beyond-banner-slider .banner-controls {
        gap: 8px;
        padding: 5px;
    }
    .beyond-banner-slider .banner-slide img {
        min-height: 0;
    }
}

.beyond-banner-slider .banner-slide picture {
    display: block;
    width: 100%;
}