.ts-banner-slider {
    --h2--margin-bottom: clamp(16px, calc(22vw*var(--size-modifier)), 22px);
    --h2--font-size: clamp(26px, calc(50vw*var(--size-modifier)), 50px);
    --is-action-list--margin-top: 0;
    --link--color: var(--wp--preset--color--primary);
    --swiper-pagination-bullet-inactive-opacity: 1;
    --swiper-pagination-bullet-opacity: 1;
    --link--text-decoration: none;

    margin-top: clamp(80px, calc(150vw*var(--size-modifier)), 150px);
    margin-bottom: clamp(120px, calc(270vw*var(--size-modifier)), 270px);

    /* wave fixes start */
    background:
        linear-gradient(#f8f3e9, #f8f3e9),
        linear-gradient(black, black);
    background-position: center center;
    background-size: 100% 100%, calc(100% - 40px) calc(100% - 40px);
    background-repeat: no-repeat;
    /* wave fixes end */
}

.ts-banner-slider__wrapper {
    max-width: var(--wp--custom--width--default);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--wp--custom--gap--page-padding);
    padding-right: var(--wp--custom--gap--page-padding);

    position: relative;
}

.ts-banner-slider__image {
    aspect-ratio: var(--wp--preset--aspect-ratio--hero-desktop);
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
}

.ts-banner-slider__content {
    position: absolute;
    top: clamp(40px, calc(100vw*var(--size-modifier)), 100px);
    left: 50%;
    z-index: 1;
    color: var(--wp--preset--color--contrast);
    max-width: 500px;
    text-align: center;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

.ts-banner-slider__title {
    text-wrap: balance;
}

.ts-banner-slider__action-item a {
    color: var(--wp--preset--color--contrast);
}

.ts-banner-slider__action-link {
    font-family: var(--wp--preset--font-family--alt-font);
    text-transform: uppercase;
}

.ts-banner-slider__button-next {
    background-image: url('data:image/svg+xml,<svg width="82" height="48" viewBox="0 0 82 48" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_16_2026)"><mask id="mask0_16_2026" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="-10" y="0" width="116" height="48"><path d="M105.871 0H-10V47.723H105.871V0Z" fill="white"/></mask><g mask="url(%23mask0_16_2026)"><path d="M7.68262 23.8618H74.0176" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/><path d="M76.8708 23.861C71.8685 23.861 67.0712 21.8739 63.534 18.3367C59.9969 14.7996 58.0098 10.0022 58.0098 5" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/><path d="M58.0098 42.7228C58.0098 37.7206 59.9969 32.9232 63.534 29.3861C67.0712 25.849 71.8685 23.8618 76.8708 23.8618" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/></g></g><defs><clipPath id="clip0_16_2026"><rect width="82" height="48" fill="white"/></clipPath></defs></svg>');
    height: 40px;
    width: 82px;
    right: 40px;
}

.ts-banner-slider__button-prev {
    background-image: url('data:image/svg+xml,<svg width="82" height="48" viewBox="0 0 82 48" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_16_2060)"><mask id="mask0_16_2060" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="-24" y="0" width="116" height="48"><path d="M-23.871 48L92 48L92 0.277L-23.871 0.27699L-23.871 48Z" fill="white"/></mask><g mask="url(%23mask0_16_2060)"><path d="M74.3174 24.1382L7.98238 24.1382" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/><path d="M5.12924 24.139C10.1315 24.139 14.9289 26.1261 18.466 29.6633C22.0031 33.2004 23.9902 37.9978 23.9902 43" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/><path d="M23.9902 5.27718C23.9902 10.2794 22.0031 15.0768 18.466 18.6139C14.9288 22.151 10.1315 24.1382 5.12923 24.1382" stroke="%23F8F3E9" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/></g></g><defs><clipPath id="clip0_16_2060"><rect width="82" height="48" fill="white" transform="translate(82 48) rotate(-180)"/></clipPath></defs></svg>');
    height: 40px;
    width: 82px;
    left: 40px;
}

.ts-banner-slider__pagination {
    bottom: 40px !important;
}

.ts-banner-slider .swiper-pagination-bullet-active {
    --swiper-pagination-color: var(--wp--preset--color--contrast);
}

.is-nice-bordered {
    border-bottom: 1px solid var(--wp--preset--color--contrast);
}

@media(max-width:768px) {
    .ts-banner-slider {
        --h2--margin-top: 30px;
    }


    .ts-banner-slider__button-next,
    .ts-banner-slider__button-prev {
        display: none;
    }

    .ts-banner-slider__content {
        position: initial;
        transform: none;
        top: unset;
        left: unset;
        max-width: 300px;
        color: var(--wp--preset--color--primary);
    }

    .ts-banner-slider__action-item a {
        color: var(--wp--preset--color--primary);
    }

    .is-nice-bordered {
        border-bottom: 1px solid var(--wp--preset--color--primary);
    }


    .ts-banner-slider__pagination {
        position: initial;
        margin-top: 20px;
    }

    .ts-banner-slider .swiper-pagination-bullet-active {
        --swiper-pagination-color: var(--wp--preset--color--secondary);
    }
}

.ts-banner-slider__media-item::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    pointer-events: none;
}