.block-image-slider {
    position: relative;
}
.block-section:has(.block-image-slider:first-child)::before {
    display: none; /* remove padding top */
}

.block-image-slider__inner {
    position: relative;
    height: 904px;
    max-height: 100vh;
}
.block-image-slider__inner::before {
    content: '';
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 38%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 95.29%);
    opacity: 0.5;
}

.block-image-slider__inner::after {
    content: '';
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 52.65%, #000000 100%);
}

.block-image-slider__item {
    margin: 0;
}
.block-image-slider__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.block-image-slider__nav {
    position: absolute;
    z-index: 2;
    left: 50%;
    margin-left: -464px;
    width: 928px;
    max-width: 100%;
    bottom: 68px;
    display: flex;
    justify-content: center;
    --custom-theme-slider-nav-indicator-pos: 0;
}
.block-image-slider__nav::before {
    content: '';
    position: absolute;
    height: 125px;
    top: -25px;
    left: calc(116px * var(--custom-theme-slider-nav-indicator-pos));
    border-left: 1px solid;
    transition: left 0.5s linear;
}

.block-image-slider__nav-item {
    flex: 0 0 auto;
    width: 116px;
    aspect-ratio: 116/75;
}
.block-image-slider__nav-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (max-width: 991px) {
    .block-image-slider__inner {
        max-height: 66vh;
    }
    .block-image-slider__nav {
        left: 0;
        bottom: 32px;
        margin-left: 0;
    }
    .block-image-slider__nav-item {
        width: calc(100vw  / 8);
    }
    .block-image-slider__nav::before {
        height: 175%;
        top: -37.5%;
        left: calc(100vw  / 8 * var(--custom-theme-slider-nav-indicator-pos));
    }
}