.banner {
    position: relative
}
.banner::before {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    z-index: -10;
    width: 54%;
    --tw-bg-opacity: 1;
    background-color: rgb(221 225 230 / var(--tw-bg-opacity, 1))
}
@media (min-width: 1024px) {
    .banner::before {
        --tw-content: "";
        content: var(--tw-content)
    }
}

.banner__image img,
.banner__image video,
.banner__image iframe {
    aspect-ratio: 7/4;
    height: auto;
    width: 100%;
    object-fit: cover
}

@media (min-width: 1024px) {
    .banner__image img,
.banner__image video,
.banner__image iframe {
        max-width: 700px
    }
}