.kr-content-slider {
    --kr-slider-primary: var(--kr-color-primary, var(--color-primary, #2d6ea6));
    --kr-slider-text: var(--kr-color-text, #1d1d1f);
    --kr-slider-muted: var(--kr-color-muted, #666);
    --kr-slider-surface: var(--kr-color-surface, #fff);
    --kr-slider-surface-alt: var(--kr-color-surface-alt, #f4f4f4);
    --kr-slider-radius: var(--kr-radius-medium, 16px);
    --kr-slider-gap: 24px;
    --kr-slider-per-view: 3;
    position: relative;
    width: 100%;
    color: var(--kr-slider-text);
}

.kr-content-slider,
.kr-content-slider * {
    box-sizing: border-box;
}

.kr-content-slider__stage {
    position: relative;
    width: 100%;
}

.kr-content-slider__viewport {
    width: 100%;
}

.kr-content-slider--layout-slider .kr-content-slider__viewport {
    overflow: hidden;
    touch-action: pan-y;
}

.kr-content-slider--layout-slider .kr-content-slider__track {
    display: flex;
    gap: var(--kr-slider-gap);
    transform: translate3d(0, 0, 0);
    transition: transform 420ms cubic-bezier(.22,.61,.36,1);
    will-change: transform;
}

.kr-content-slider--layout-slider .kr-content-slider__track.is-immediate {
    transition: none;
}

.kr-content-slider--layout-slider .kr-content-slider__slide {
    flex: 0 0 calc((100% - (var(--kr-slider-gap) * (var(--kr-slider-per-view) - 1))) / var(--kr-slider-per-view));
    min-width: 0;
}

.kr-content-slider--layout-grid .kr-content-slider__viewport {
    overflow: visible;
    touch-action: auto;
}

.kr-content-slider--layout-grid .kr-content-slider__track {
    display: grid;
    grid-template-columns: repeat(var(--kr-grid-columns-desktop, 3), minmax(0, 1fr));
    gap: var(--kr-slider-gap);
    transform: none !important;
    transition: none;
    will-change: auto;
}

.kr-content-slider--layout-grid .kr-content-slider__slide {
    min-width: 0;
}

@media (max-width: 1023px) {
    .kr-content-slider--layout-grid .kr-content-slider__track {
        grid-template-columns: repeat(var(--kr-grid-columns-tablet, 2), minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .kr-content-slider--layout-grid .kr-content-slider__track {
        grid-template-columns: repeat(var(--kr-grid-columns-mobile, 1), minmax(0, 1fr));
    }
}

.kr-slider-card {
    --kr-card-background: var(--kr-slider-surface);
    --kr-card-text: var(--kr-slider-text);
    --kr-card-muted: var(--kr-slider-muted);
    --kr-card-icon: var(--kr-slider-primary);
    height: 100%;
    overflow: hidden;
    color: var(--kr-card-text);
}

.kr-slider-card__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: var(--kr-image-aspect, 16 / 10);
}

.kr-slider-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kr-slider-card__content {
    padding: var(--kr-content-padding, clamp(18px, 2.2vw, 30px));
}

.kr-slider-card__eyebrow {
    margin: 0 0 8px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--kr-slider-primary);
}

.kr-slider-card__title {
    margin: 0;
    color: inherit;
    font: inherit;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    font-weight: 700;
    line-height: 1.2;
}

.kr-slider-card__text {
    margin-top: 14px;
    color: var(--kr-card-muted);
}

.kr-slider-card__text > :first-child { margin-top: 0; }
.kr-slider-card__text > :last-child { margin-bottom: 0; }

.kr-slider-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 10px;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    color: var(--kr-card-muted);
    font-size: .84rem;
    line-height: 1.45;
}

.kr-slider-card__meta-item {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .3em;
    margin: 0 !important;
    padding: 0 !important;
}

.kr-slider-card__meta-item + .kr-slider-card__meta-item::before {
    content: "·";
    margin-right: 5px;
    opacity: .65;
}

.kr-slider-card__meta a {
    color: inherit;
    text-decoration-thickness: .08em;
    text-underline-offset: .16em;
}

.kr-slider-card__meta-label {
    font-weight: 600;
}

.kr-slider-card__meta + .kr-slider-card__title,
.kr-slider-card__title + .kr-slider-card__meta,
.kr-slider-card__text + .kr-slider-card__meta {
    margin-top: 10px;
}

.kr-slider-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    padding: .75em 1.2em;
    border-radius: 999px;
    background: var(--kr-slider-primary);
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    transition: transform 160ms ease, opacity 160ms ease;
}

.kr-slider-card__button:hover,
.kr-slider-card__button:focus-visible {
    color: #fff;
    opacity: .9;
    transform: translateY(-1px);
}

.kr-content-slider--cards .kr-slider-card {
    border-radius: var(--kr-slider-radius);
    background: var(--kr-card-background);
    border: 1px solid color-mix(in srgb, var(--kr-slider-text) 12%, transparent);
}

.kr-content-slider--standard .kr-slider-card__content {
    padding-inline: 0;
}

.kr-content-slider--standard .kr-slider-card__media {
    border-radius: var(--kr-slider-radius);
}

/* Bild-/Text-Verhältnisse für gestapelte Karten.
 * Bei Standard/Cards können Bild und Textbox unabhängig schmaler als die Karte sein. */
.kr-content-slider--standard .kr-slider-card__media,
.kr-content-slider--cards .kr-slider-card__media {
    width: var(--kr-stacked-image-width, 100%);
    max-width: 100%;
    margin-inline: auto;
}

.kr-content-slider--standard .kr-slider-card__content,
.kr-content-slider--cards .kr-slider-card__content {
    width: var(--kr-stacked-text-width, 100%);
    max-width: 100%;
    margin-inline: auto;
}

/* Split-Templates: Bild/Text nebeneinander, builder-unabhängig und pro Karte responsiv. */
.kr-content-slider__slide {
    container-name: kr-content-item;
    container-type: inline-size;
}

.kr-content-slider--image-left .kr-slider-card,
.kr-content-slider--image-right .kr-slider-card {
    display: grid;
    min-height: 280px;
    border: 1px solid color-mix(in srgb, var(--kr-slider-text) 12%, transparent);
    border-radius: var(--kr-slider-radius);
    background: var(--kr-card-background);
}

.kr-content-slider--image-left .kr-slider-card {
    grid-template-columns: minmax(0, var(--kr-split-image-width, 44%)) minmax(0, 1fr);
}

.kr-content-slider--image-right .kr-slider-card {
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--kr-split-image-width, 44%));
}

.kr-content-slider--image-left .kr-slider-card__media,
.kr-content-slider--image-right .kr-slider-card__media {
    width: 100%;
    height: 100%;
    min-height: 280px;
    aspect-ratio: auto;
}

.kr-content-slider--image-left .kr-slider-card__content,
.kr-content-slider--image-right .kr-slider-card__content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.kr-content-slider--image-right .kr-slider-card__content {
    order: 1;
}

.kr-content-slider--image-right .kr-slider-card__media {
    order: 2;
}

.kr-content-slider .kr-slider-card--split.kr-slider-card--no-media {
    grid-template-columns: minmax(0, 1fr);
}

.kr-content-slider .kr-slider-card--split.kr-slider-card--no-media .kr-slider-card__content {
    order: 1;
}

@container kr-content-item (max-width: 560px) {
    .kr-content-slider--image-left .kr-slider-card,
    .kr-content-slider--image-right .kr-slider-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .kr-content-slider--image-left .kr-slider-card__media,
    .kr-content-slider--image-right .kr-slider-card__media {
        min-height: 0;
        aspect-ratio: var(--kr-image-aspect, 16 / 10);
    }

    .kr-content-slider--image-left .kr-slider-card__media {
        order: 1;
    }

    .kr-content-slider--image-left .kr-slider-card__content {
        order: 2;
    }

    .kr-content-slider--image-right .kr-slider-card__content {
        order: 1;
    }

    .kr-content-slider--image-right .kr-slider-card__media {
        order: 2;
    }
}

/* Fallback für Browser ohne Container Queries. */
@media (max-width: 767px) {
    .kr-content-slider--image-left .kr-slider-card,
    .kr-content-slider--image-right .kr-slider-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .kr-content-slider--image-left .kr-slider-card__media,
    .kr-content-slider--image-right .kr-slider-card__media {
        min-height: 0;
        aspect-ratio: var(--kr-image-aspect, 16 / 10);
    }
}


/* Icon Cards: builder-unabhängige Karten ohne Bild. Icons werden als CSS-Maske
 * gerendert, damit eine optionale Iconfarbe sauber auf PNG/WebP/SVG greift. */
.kr-content-slider--icon-cards .kr-slider-card {
    min-height: clamp(360px, 30vw, 500px);
    border-radius: var(--kr-slider-radius);
    background: var(--kr-card-background, var(--kr-slider-surface-alt));
    color: var(--kr-card-text, var(--kr-slider-text));
}

.kr-content-slider--icon-cards .kr-slider-card__content {
    display: flex;
    min-height: 100%;
    height: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--kr-content-padding, clamp(24px, 2.4vw, 32px));
}

.kr-content-slider--icon-cards .kr-slider-card__icon {
    display: block;
    width: clamp(58px, 5vw, 82px);
    aspect-ratio: 1;
    flex: 0 0 auto;
    margin-bottom: clamp(44px, 5vw, 76px);
    color: var(--kr-card-icon, var(--kr-slider-primary));
}

.kr-content-slider--icon-cards .kr-slider-card__icon--mask {
    background: var(--kr-card-icon, var(--kr-slider-primary));
    -webkit-mask-image: var(--kr-card-icon-image);
    mask-image: var(--kr-card-icon-image);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.kr-content-slider--icon-cards .kr-slider-card__icon-svg {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
}

.kr-content-slider--icon-cards .kr-slider-card__eyebrow {
    color: inherit;
    opacity: .72;
}

.kr-content-slider--icon-cards .kr-slider-card__title,
.kr-content-slider--icon-cards .kr-slider-card__title:where(h1,h2,h3,h4,h5,h6,p,div,span) {
    color: inherit !important;
    font-size: clamp(1.25rem, 1.6vw, 1.55rem);
}

.kr-content-slider--icon-cards .kr-slider-card__text,
.kr-content-slider--icon-cards .kr-slider-card__text p,
.kr-content-slider--icon-cards .kr-slider-card__meta,
.kr-content-slider--icon-cards .kr-slider-card__meta a {
    color: inherit !important;
}

.kr-content-slider--icon-cards .kr-slider-card__text {
    margin-top: 12px;
    opacity: .92;
}

.kr-content-slider--icon-cards .kr-slider-card__icon-link {
    display: inline-grid;
    width: 58px;
    height: 58px;
    place-items: center;
    margin-top: auto;
    padding: 0;
    border-radius: 999px;
    background: #fff;
    color: var(--kr-card-text, var(--kr-slider-text));
    text-decoration: none;
    box-shadow: 0 1px 0 rgba(0,0,0,.03);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.kr-content-slider--icon-cards .kr-slider-card__icon-link > span[aria-hidden="true"] {
    font-size: 1.7rem;
    line-height: 1;
    transform: translateY(-1px);
}

.kr-content-slider--icon-cards .kr-slider-card__icon-link:hover,
.kr-content-slider--icon-cards .kr-slider-card__icon-link:focus-visible {
    color: var(--kr-card-text, var(--kr-slider-text));
    transform: translateX(2px);
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
}

.kr-content-slider--icon-cards .kr-slider-card__icon-link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--kr-card-icon, var(--kr-slider-primary)) 45%, transparent);
    outline-offset: 3px;
}

@media (max-width: 767px) {
    .kr-content-slider--icon-cards .kr-slider-card {
        min-height: 340px;
    }
    .kr-content-slider--icon-cards .kr-slider-card__icon {
        margin-bottom: 38px;
    }
}

.kr-content-slider--overlay .kr-slider-card {
    position: relative;
    isolation: isolate;
    display: flex;
    min-height: clamp(360px, 34vw, 460px);
    border-radius: var(--kr-slider-radius);
    background: #242426;
    color: #fff;
}

.kr-content-slider--overlay .kr-slider-card__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    background: #242426;
}

.kr-content-slider--overlay .kr-slider-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.kr-content-slider--overlay .kr-slider-card__media::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.14) 38%, rgba(0,0,0,.78) 78%, rgba(0,0,0,.92) 100%);
}

.kr-content-slider--overlay .kr-slider-card__content {
    position: relative;
    z-index: 2;
    display: flex;
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
    min-height: 100%;
    margin-top: auto;
    padding: var(--kr-content-padding, clamp(24px, 3vw, 36px));
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
}

.kr-content-slider--overlay .kr-slider-card__eyebrow {
    display: inline-flex;
    width: fit-content;
    margin: 0 0 12px;
    padding: .4em .72em;
    border-radius: 999px;
    background: var(--kr-slider-primary);
    color: #fff !important;
    font-size: .72rem;
    line-height: 1;
}

.kr-content-slider--overlay .kr-slider-card__title,
.kr-content-slider--overlay .kr-slider-card__title:where(h2, h3, h4, h5, h6, p) {
    margin: 0;
    color: #fff !important;
    text-shadow: 0 1px 18px rgba(0,0,0,.2);
}

.kr-content-slider--overlay .kr-slider-card__text,
.kr-content-slider--overlay .kr-slider-card__text p,
.kr-content-slider--overlay .kr-slider-card__text li {
    color: rgba(255,255,255,.9) !important;
}

.kr-content-slider--overlay .kr-slider-card__text {
    margin-top: 12px;
}

.kr-content-slider--overlay .kr-slider-card__meta,
.kr-content-slider--overlay .kr-slider-card__meta a {
    color: rgba(255,255,255,.82) !important;
}

.kr-content-slider--overlay .kr-slider-card__text p {
    margin-top: 0;
    margin-bottom: .7em;
}

.kr-content-slider--overlay .kr-slider-card__text p:last-child {
    margin-bottom: 0;
}

.kr-content-slider--overlay .kr-slider-card__button {
    margin-top: 22px;
    color: #fff !important;
}

.kr-content-slider__arrows {
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    pointer-events: none;
}

.kr-content-slider__arrows--top {
    margin-bottom: 14px;
}

.kr-content-slider__arrows--bottom {
    margin-top: 14px;
}

.kr-content-slider__arrows--middle {
    position: absolute;
    inset: 0;
    align-items: center;
    padding-inline: 10px;
}

.kr-content-slider__arrows--split {
    justify-content: space-between;
}

.kr-content-slider__arrows--together-left {
    justify-content: flex-start;
}

.kr-content-slider__arrows--together-center {
    justify-content: center;
}

.kr-content-slider__arrows--together-right {
    justify-content: flex-end;
}

.kr-content-slider__arrow {
    display: grid;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: var(--kr-slider-surface);
    color: var(--kr-slider-text);
    box-shadow: 0 8px 30px rgba(0,0,0,.14);
    cursor: pointer;
    pointer-events: auto;
}

.kr-content-slider__arrow span {
    display: block;
    margin-top: -2px;
    font-size: 2rem;
    line-height: 1;
}

.kr-content-slider__arrow:disabled {
    opacity: .35;
    cursor: default;
}

.kr-content-slider__arrow:focus-visible,
.kr-content-slider__dot:focus-visible,
.kr-slider-card__button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--kr-slider-primary) 45%, transparent);
    outline-offset: 3px;
}

.kr-content-slider__dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
}

.kr-content-slider__dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--kr-slider-text) 25%, transparent);
    cursor: pointer;
    transition: width 160ms ease, background 160ms ease;
}

.kr-content-slider__dot.is-active {
    width: 26px;
    background: var(--kr-slider-primary);
}

.kr-content-slider__empty {
    padding: 12px 16px;
    border: 1px dashed currentColor;
    font-size: .9rem;
}

@media (prefers-reduced-motion: reduce) {
    .kr-content-slider__track,
    .kr-slider-card__button,
    .kr-content-slider__dot {
        transition: none;
    }
}

/* 1.2.0: Semantik, Accessibility und optionale Section-Überschrift. */
.kr-content-slider__heading {
    margin: 0 0 clamp(18px, 2.5vw, 32px);
    color: inherit;
    font: inherit;
    font-size: clamp(1.5rem, 3vw, 2.15rem);
    font-weight: 700;
    line-height: 1.15;
}

.kr-content-slider__track {
    margin: 0;
    padding: 0;
    list-style: none;
}

.kr-content-slider__slide {
    margin: 0;
    padding: 0;
    list-style: none;
}

.kr-content-slider__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 20px;
}

.kr-content-slider__controls .kr-content-slider__dots {
    margin-top: 0;
}

.kr-content-slider__autoplay {
    display: inline-grid;
    width: 34px;
    height: 34px;
    place-items: center;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--kr-slider-text) 18%, transparent);
    border-radius: 999px;
    background: var(--kr-slider-surface);
    color: var(--kr-slider-text);
    cursor: pointer;
}

.kr-content-slider__autoplay-icon {
    display: block;
    font-size: .72rem;
    line-height: 1;
}

.kr-content-slider__autoplay:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--kr-slider-primary) 45%, transparent);
    outline-offset: 3px;
}

.kr-content-slider .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}