.o-slider-a {
    --pagination-adjustment: 45px;
    --next-adjustment: -12px;
    --prev-adjustment: -12px;

    padding-top: 2.8rem;
    padding-bottom: 1rem;

    @media (width > 768px) {
        padding-top: 4.5rem;
        padding-bottom: 1rem;
    }

    @media (width > 1024px) {
        --next-adjustment: -90px;
        --prev-adjustment: -90px;
    }

    & .a-heading {
        color: var(--color-red);
        font-size: clamp(var(--title-xxl), 2.25rem + 3vw, var(--title-xxxl));
        text-align: center;

        @media (width >1024px) {
            margin-bottom: .6em;
        }
    }

    & .container {
        max-width: 500px;

        @media (width > 768px) {
            max-width: 650px;
        }

        @media (width > 1024px) {
            max-width: 758px;
        }
    }

    & .swiper-pagination-bullet-active {
        background: var(--color-red);
    }

    & .swiper-pagination-bullet {
        width: 0.625rem;
        height: 0.625rem;
    }

    & .swiper-next,
    & .swiper-prev {
        position: absolute;
        width: 2.75rem;
        height: 2.75rem;
        background: #000;
        border-radius: 50%;
        z-index: 50;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        top: 50%;
        transform: translateY(-50%);
        transform: translateY(calc(-50% - calc(var(--pagination-adjustment)/2)));
        transition: all 0.3s ease;
        /* stylelint-disable-next-line length-zero-no-unit */
        box-shadow: 0px 0px 6px 0px rgb(0 0 0 / 20%);

        & svg {
            left: 0;
            right: 0;
            transition: all 0.3s ease;
            position: relative;
        }

        &:focus,
        &:hover {
            /* box-shadow: 0 2px 12px 7px rgb(0 0 0 / 20%); */
            background-color: var(--color-red);
            scale: 1.04;
        }
    }

    /* stylelint-disable-next-line no-descending-specificity */
    & .swiper-next {
        right: var(--next-adjustment);

        &:hover,
        &:focus {
            & svg {
                right: -2px;
            }
        }
    }

    /* stylelint-disable-next-line no-descending-specificity */
    & .swiper-prev {
        left: var(--prev-adjustment);

        &:hover,
        &:focus {
            & svg {
                left: -2px;
            }
        }
    }
}

.o-slider-a__slides-wrap {
    @media (width <=768px) {
        padding-left: unset;
        padding-right: unset;
    }
}

.o-slider-a__items {
    margin-bottom: var(--pagination-adjustment);
}

.o-slider-a__repeater {
    max-width: 59.875rem;
    margin-left: auto;
    margin-right: auto;
}

.o-slider-a__slide-heading {
    font-size: clamp(var(--title-md), 2.125rem + 0.5vw, var(--title-lg));
    margin-bottom: .5em;

    @media (width > 768px) {
        margin-bottom: 1.6rem;
    }
}

.o-slider-a__item-image {
    height: 350px;

    @media (width > 768px) {
        height: 426px;
    }
}

.o-slider-a__slide-details {
    margin-top: 1rem;
}

.o-slider-a__slide-heading,
.o-slider-a__slide-details {
    transition: all 0.3s;
}

.o-slider-a__navigation .swiper-next.swiper-button-disabled,
.o-slider-a__navigation .swiper-prev.swiper-button-disabled {
    display: none;
}