/* Intro geteilt: Maße in vw nach Vorlage (1920px breit) */
:where(.intro-split) {
    --intro-split-aside-bg: var(--color-lightgreen-footer);
    --intro-split-main-bg: var(--color-mint);
    --intro-split-color: var(--color-primary);
    --intro-split-aside-width: 38.2%;
    --intro-split-min-height: 39.3vw;
    --intro-split-image-size: 26.35vw;
    --intro-split-image-left: 14.06vw;
    --intro-split-image-top: 2.3vw;
    --intro-split-claim-left: 3.96vw;
    --intro-split-claim-bottom: 3.33vw;
    --intro-split-padding: 3.54vw 6.8vw 3.33vw 4.8vw;
    --intro-split-signature-size: clamp(13px, 1.198vw, 23px);
}

.intro-split {
    display: flex;
    min-height: var(--intro-split-min-height);
    color: var(--intro-split-color);
}

.intro-split__aside {
    position: relative;
    flex: 0 0 var(--intro-split-aside-width);
    background: var(--intro-split-aside-bg);
}

.intro-split__media {
    position: absolute;
    z-index: 1;
    top: var(--intro-split-image-top);
    left: var(--intro-split-image-left);
    width: var(--intro-split-image-size);
    aspect-ratio: 1;
    margin: 0;
    overflow: hidden;
    border-radius: 50%;
}

.intro-split__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.intro-split__claim {
    position: absolute;
    z-index: 2;
    left: var(--intro-split-claim-left);
    bottom: var(--intro-split-claim-bottom);
    margin: 0;
}

.intro-split__main {
    flex: 1 1 auto;
    padding: var(--intro-split-padding);
    background: var(--intro-split-main-bg);
}

.intro-split__text {
    font-size: var(--font-size-txt-xl);
}

.intro-split__text p {
    color: inherit;
}

.intro-split__text strong {
    font-weight: var(--font-weight-txt-bold);
}

.intro-split__text p + p {
    margin-top: 1.56em;
}

.intro-split__signature {
    margin: 2em 0 0;
    color: inherit;
    font-size: var(--intro-split-signature-size);
    font-weight: var(--font-weight-txt-bold);
    letter-spacing: 0.055em;
}

/* Mobil: Text oben, Bildfläche darunter (Vorlage 360 Einheiten breit) */
@media (max-width: 599px) {
    .intro-split {
        flex-direction: column-reverse;
        min-height: 0;
    }

    .intro-split__aside {
        flex: 0 0 auto;
        height: 70vw;
    }

    .intro-split__media {
        top: 2.8vw;
        left: auto;
        right: 11.7vw;
        width: 47.5vw;
    }

    .intro-split__claim {
        left: 8.3vw;
        bottom: 7.8vw;
    }

    .intro-split__main {
        padding: 9.7vw 8.3vw 8.9vw;
    }
}