.site-hero,
.hero-banner {
    height: min(31.25vw, 600px);
}

.site-hero {
    width: 100%;
}

.site-hero .swiper-wrapper,
.site-hero .swiper-slide,
.site-hero picture,
.site-hero a,
.site-hero img {
    height: 100%;
}

.site-hero img,
.hero-banner {
    display: block;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.hero-banner {
    position: relative;
    left: 50%;
    width: 100vw;
    max-width: none;
    transform: translateX(-50%);
}

@media (max-width: 575px) {
    .site-hero,
    .hero-banner {
        height: 50vw;
    }
}