.content_slider-layout {
    padding-inline: var(--pk-site-gutter);
    margin-block: var(--global-row-spacing, 0);
    background: var(--pk-white);
    color: var(--pk-grey-blue);
    overflow: clip;
}

.content_slider-layout > .pk-row {
    max-width: none;
}

.content-slider__swiper.swiper,
.content-slider__track.swiper-wrapper {
    width: 100%;
}

.content-slider__swiper.swiper {
    overflow: visible;
}

.content_slider-layout .content-slider__pagination {
    position: static;
    display: flex;
    justify-content: center;
    gap: max(0.375rem, calc(0.375 * var(--su)));
    width: 100%;
    margin-top: max(2rem, calc(2 * var(--su)));
}

.content_slider-layout .content-slider__pagination .swiper-pagination-bullet {
    width: max(0.5rem, calc(0.5 * var(--su)));
    height: max(0.5rem, calc(0.5 * var(--su)));
    margin: 0;
    border: 1px solid var(--pk-grey-blue);
    background: transparent;
    opacity: 0.35;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        opacity 0.2s ease;
}

.content_slider-layout .content-slider__pagination .swiper-pagination-bullet-active {
    background: var(--pk-grey-blue);
    opacity: 1;
}

.content_slider-layout .content-slider__pagination .swiper-pagination-bullet:focus-visible {
    outline: 2px solid var(--pk-red);
    outline-offset: max(0.25rem, calc(0.25 * var(--su)));
}

.content-slider__track.swiper-wrapper {
    align-items: stretch;
}

.content-slider__slide.swiper-slide {
    display: grid;
    align-items: end;
    width: 100%;
    height: auto;
}

.content-slider__content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: max(1rem, calc(1 * var(--su)));
    min-height: max(36rem, calc(36 * var(--su)));
    padding-right: max(4rem, calc(4 * var(--su)));
}

.content-slider__copy,
.content-slider__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.content-slider__copy {
    gap: max(1.5rem, calc(1.5 * var(--su)));
}

.content-slider__body {
    gap: max(1.5rem, calc(1.5 * var(--su)));
}

.content-slider__counter {
    display: inline-flex;
    align-items: center;
    gap: max(0.5rem, calc(0.5 * var(--su)));
    min-height: max(2rem, calc(2 * var(--su)));
    padding: max(0.75rem, calc(0.75 * var(--su)));
    border: 1px solid var(--pk-border-light);
    border-radius: max(0.5rem, calc(0.5 * var(--su)));
    background: var(--pk-surface-muted);
    color: var(--pk-grey-blue);
    font-size: var(--desktop-body-xxs);
    text-transform: uppercase;
}

.content-slider__counter span:last-child {
    color: var(--pk-text-muted-light);
}

.content-slider__counter-dot {
    display: block;
    flex: 0 0 max(0.5rem, calc(0.5 * var(--su)));
    width: max(0.5rem, calc(0.5 * var(--su)));
    height: max(0.5rem, calc(0.5 * var(--su)));
    border-radius: 999px;
    background: var(--pk-red);
}

.content_slider-layout .content-slider__heading {
    margin: 0;
    color: var(--pk-grey-blue);
}

.content-slider__text {
    width: 100%;
    color: var(--pk-grey-blue);
}

.content-slider__text > * {
    margin: 0;
}

.content_slider-layout .content-slider__tags {
    display: flex;
    flex-wrap: wrap;
    gap: max(0.5rem, calc(0.5 * var(--su)));
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.content-slider__tags li {
    display: inline-flex;
    align-items: flex-start;
    gap: max(0.5rem, calc(0.5 * var(--su)));
    min-height: max(3rem, calc(3 * var(--su)));
    padding-block: max(0.75rem, calc(0.75 * var(--su)));
    padding-inline: max(0.75rem, calc(0.75 * var(--su))) max(1.25rem, calc(1.25 * var(--su)));
    border: 1px solid var(--pk-border-light);
    border-radius: max(0.5rem, calc(0.5 * var(--su)));
    color: var(--pk-grey-blue);
    font-size: var(--desktop-body-xs);
    font-weight: var(--pk-heading-font-weight);
    white-space: nowrap;
}

.content-slider__check {
    position: relative;
    display: inline-flex;
    width: max(1.25rem, calc(1.25 * var(--su)));
    height: max(1.25rem, calc(1.25 * var(--su)));
    flex: 0 0 max(1.25rem, calc(1.25 * var(--su)));
}

.content-slider__check::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--pk-grey-blue);
    -webkit-mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.958 13.625 4.5 10.167l.875-.875 2.583 2.583 6.667-6.667.875.875-7.542 7.542Z' fill='%23384154'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.958 13.625 4.5 10.167l.875-.875 2.583 2.583 6.667-6.667.875.875-7.542 7.542Z' fill='%23384154'/%3E%3C/svg%3E") center / contain no-repeat;
}

.content-slider__visual {
    position: relative;
    height: max(36rem, calc(36 * var(--su)));
    overflow: visible;
}

.content-slider__media,
.content-slider__thumb {
    position: absolute;
    margin: 0;
    overflow: hidden;
    background: var(--pk-surface-muted);
    isolation: isolate;
}

.content-slider__media {
    top: 0;
    left: 0;
    z-index: 1;
    width: max(36rem, calc(36 * var(--su)));
    height: max(36rem, calc(36 * var(--su)));
    border-radius: max(1.5rem, calc(1.5 * var(--su))) max(1.5rem, calc(1.5 * var(--su))) 0 max(1.5rem, calc(1.5 * var(--su)));
}

.content-slider__media::after {
    content: "";
    position: absolute;
    right: -2px;
    bottom: -2px;
    width: max(19.25rem, calc(19.25 * var(--su)));
    height: max(6.625rem, calc(6.625 * var(--su)));
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%22308%22%20height%3D%22106%22%20viewBox%3D%220%200%20308%20106%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_2377_1151)%22%3E%3Cpath%20d%3D%22M283.74%2024H103.55C97.31%2024%2091.32%2026.43%2086.84%2030.77L16.25%2099.23C11.88%20103.47%206.07%20105.87%200%20105.99L307.74%20106V0C307.74%2013.26%20297%2024%20283.74%2024Z%22%20fill%3D%22white%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_2377_1151%22%3E%3Crect%20width%3D%22307.74%22%20height%3D%22106%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    pointer-events: none;
    z-index: 1;
}

.content-slider__thumb {
    z-index: 2;
    border-radius: max(1.5rem, calc(1.5 * var(--su)));
}

.content-slider__thumb--left {
    top: 0;
    left: max(-10.3125rem, calc(-10.3125 * var(--su)));
    width: max(8.8125rem, calc(8.8125 * var(--su)));
    height: max(8.8125rem, calc(8.8125 * var(--su)));
}

.content-slider__thumb--right {
    top: max(17.375rem, calc(17.375 * var(--su)));
    left: max(37.5rem, calc(37.5 * var(--su)));
    width: max(13.5rem, calc(13.5 * var(--su)));
    height: max(13.5rem, calc(13.5 * var(--su)));
}

.content_slider-layout .content-slider__image,
.content_slider-layout .content-slider__thumb-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    aspect-ratio: auto;
    object-fit: cover;
}

.content-slider__link {
    position: absolute;
    left: max(22.5rem, calc(22.5 * var(--su)));
    top: max(33.5rem, calc(33.5 * var(--su)));
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: max(0.5rem, calc(0.5 * var(--su)));
    color: var(--pk-grey-blue);
    font-size: var(--desktop-body-xs);
    text-decoration: none;
    transition: color 0.2s ease;
}

.content-slider__link-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max(1.5rem, calc(1.5 * var(--su)));
    height: max(1.5rem, calc(1.5 * var(--su)));
    border: 1px solid var(--pk-border-light);
    border-radius: 999px;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.content-slider__link-icon::before {
    content: "\e5cc";
    font-family: "Material Symbols Outlined";
    font-size: max(1rem, calc(1 * var(--su)));
}

.content-slider__link:hover,
.content-slider__link:focus-visible {
    color: var(--pk-red);
}

.content-slider__link:hover .content-slider__link-icon,
.content-slider__link:focus-visible .content-slider__link-icon {
    border-color: var(--pk-red);
    background: var(--pk-lucht);
}

.content-slider__content,
.content-slider__media,
.content-slider__thumb,
.content-slider__link,
.content-slider__counter,
.content-slider__heading,
.content-slider__text,
.content-slider__tags li {
    will-change: transform, opacity;
}

.content_slider-layout:not(.content-slider--gsap) .content-slider__content,
.content_slider-layout:not(.content-slider--gsap) .content-slider__media,
.content_slider-layout:not(.content-slider--gsap) .content-slider__thumb,
.content_slider-layout:not(.content-slider--gsap) .content-slider__link {
    opacity: 0;
    transform: translateY(max(1rem, calc(1 * var(--su))));
    transition: opacity 0.55s ease, transform 0.55s ease;
}

.content_slider-layout:not(.content-slider--gsap) .content-slider__slide.swiper-slide-active .content-slider__content,
.content_slider-layout:not(.content-slider--gsap) .content-slider__slide.swiper-slide-active .content-slider__media,
.content_slider-layout:not(.content-slider--gsap) .content-slider__slide.swiper-slide-active .content-slider__thumb,
.content_slider-layout:not(.content-slider--gsap) .content-slider__slide.swiper-slide-active .content-slider__link {
    opacity: 1;
    transform: translateY(0);
}

@media only screen and (max-width: 1399px) {
    .content-slider__content {
        min-height: max(32rem, calc(32 * var(--su)));
    }

    .content-slider__visual {
        height: max(32rem, calc(32 * var(--su)));
    }

    .content-slider__media {
        width: max(32rem, calc(32 * var(--su)));
        height: max(32rem, calc(32 * var(--su)));
    }

    .content-slider__media::after {
        width: max(17rem, calc(17 * var(--su)));
        height: max(5.875rem, calc(5.875 * var(--su)));
    }

    .content-slider__thumb--left {
        left: max(-9.5rem, calc(-9.5 * var(--su)));
    }

    .content-slider__thumb--right {
        top: max(15.5rem, calc(15.5 * var(--su)));
        left: max(30.25rem, calc(30.25 * var(--su)));
        width: max(11rem, calc(11 * var(--su)));
        height: max(11rem, calc(11 * var(--su)));
    }

    .content-slider__link {
        left: max(20rem, calc(20 * var(--su)));
        top: max(29.75rem, calc(29.75 * var(--su)));
    }
}

@media only screen and (max-width: 1199px) {
    .content-slider__content {
        min-height: max(30rem, calc(30 * var(--su)));
        padding-right: max(2rem, calc(2 * var(--su)));
    }

    .content-slider__visual {
        height: max(30rem, calc(30 * var(--su)));
    }

    .content-slider__media {
        width: max(30rem, calc(30 * var(--su)));
        height: max(30rem, calc(30 * var(--su)));
    }

    .content-slider__media::after {
        width: max(16rem, calc(16 * var(--su)));
        height: max(5.5rem, calc(5.5 * var(--su)));
    }

    .content-slider__thumb--left {
        left: max(-5rem, calc(-5 * var(--su)));
    }

    .content-slider__thumb--right {
        top: max(16.875rem, calc(16.875 * var(--su)));
        left: max(25rem, calc(25 * var(--su)));
        width: max(9.5rem, calc(9.5 * var(--su)));
        height: max(9.5rem, calc(9.5 * var(--su)));
    }

    .content-slider__link {
        left: max(18rem, calc(18 * var(--su)));
        top: max(28rem, calc(28 * var(--su)));
    }
}

@media only screen and (max-width: 992px) {
    .content_slider-layout > .pk-row {
        padding-block: max(6rem, calc(6 * var(--su)));
        padding-inline: max(2rem, calc(2 * var(--su)));
    }

    .content_slider-layout .content-slider__track.swiper-wrapper,
    .content_slider-layout .content-slider__slide.swiper-slide {
        height: auto !important;
    }

    .content-slider__slide.swiper-slide {
        gap: max(3rem, calc(3 * var(--su)));
        align-items: start;
        grid-template-columns: 1fr;
    }

    .content-slider__content {
        order: 2;
        grid-column: 1 / -1;
        min-height: 0;
        padding-right: 0;
    }

    .content-slider__visual {
        order: 1;
        grid-column: 1 / -1;
        height: max(30rem, calc(30 * var(--su)));
    }

    .content-slider__media {
        left: 50%;
        width: min(100%, max(30rem, calc(30 * var(--su))));
        height: min(calc(100vw - max(4rem, calc(4 * var(--su)))), max(30rem, calc(30 * var(--su))));
        transform: translateX(-50%);
    }

    .content-slider__thumb--left {
        left: 0;
        width: max(7.5rem, calc(7.5 * var(--su)));
        height: max(7.5rem, calc(7.5 * var(--su)));
    }

    .content-slider__thumb--right {
        top: auto;
        right: 0;
        bottom: max(2rem, calc(2 * var(--su)));
        left: auto;
        width: max(9rem, calc(9 * var(--su)));
        height: max(9rem, calc(9 * var(--su)));
    }

    .content-slider__link {
        top: auto;
        right: 0;
        bottom: 0;
        left: auto;
    }

    .content-slider__slide.swiper-slide-active .content-slider__media {
        transform: translateX(-50%);
    }
}

@media only screen and (max-width: 767px) {
    .content_slider-layout > .pk-row {
        padding: 0;
    }

    .content-slider__slide.swiper-slide {
        gap: max(2rem, calc(2 * var(--su)));
    }

    .content-slider__visual {
        height: max(21rem, calc(21 * var(--su)));
    }

    .content-slider__media {
        width: min(100%, max(19.5rem, calc(19.5 * var(--su))));
        height: min(calc(100vw - max(2rem, calc(2 * var(--su)))), max(19.5rem, calc(19.5 * var(--su))));
        border-radius: max(1rem, calc(1 * var(--su))) max(1rem, calc(1 * var(--su))) 0 max(1rem, calc(1 * var(--su)));
    }

    .content-slider__media::after {
        width: max(12rem, calc(12 * var(--su)));
        height: max(4.125rem, calc(4.125 * var(--su)));
    }

    .content-slider__thumb {
        border-radius: max(1rem, calc(1 * var(--su)));
    }

    .content-slider__thumb--left {
        width: max(5.5rem, calc(5.5 * var(--su)));
        height: max(5.5rem, calc(5.5 * var(--su)));
    }

    .content-slider__thumb--right {
        bottom: max(2.5rem, calc(2.5 * var(--su)));
        width: max(6.5rem, calc(6.5 * var(--su)));
        height: max(6.5rem, calc(6.5 * var(--su)));
    }

    .content-slider__tags {
        align-items: flex-start;
    }

    .content-slider__tags li {
        white-space: normal;
    }
}
