/* =========================================================
   PURE YOU CARE
   SINGLE MITARBEITER
========================================================= */


/* =========================================================
   GRUNDLAYOUT
========================================================= */

.pyc-mitarbeiter-single {
    overflow: hidden;
    background: #ffffff;
}

.pyc-mitarbeiter-single .container {
    width: min(
        var(--max-width),
        calc(100% - 40px)
    );
    margin-inline: auto;
}


/* =========================================================
   HEROBILD
========================================================= */

.pyc-mitarbeiter-cover {
    position: relative;

    width: 100%;

    /*
     * Das Herobild ist 2048 × 877 px.
     * Mit exakt diesem Seitenverhältnis wird auf Desktop
     * praktisch nichts vom Bild abgeschnitten.
     */
    aspect-ratio: 2048 / 877;

    min-height: 0;
    max-height: none;

    overflow: hidden;

    background: var(--aqua-mist);
}

.pyc-mitarbeiter-cover__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;
}


/* =========================================================
   HERO-VERLAUF
   Wird pro Mitarbeiter über ACF gesteuert.
========================================================= */

.pyc-mitarbeiter-cover::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;
}


/* Dunkel links → transparent rechts */
.pyc-mitarbeiter-cover--verlauf-links_rechts::after {
    background:
        linear-gradient(
            90deg,
            rgba(10, 44, 51, 0.82) 0%,
            rgba(10, 44, 51, 0.68) 24%,
            rgba(10, 44, 51, 0.40) 43%,
            rgba(10, 44, 51, 0.10) 63%,
            rgba(10, 44, 51, 0) 78%
        );
}


/* Dunkel rechts → transparent links */
.pyc-mitarbeiter-cover--verlauf-rechts_links::after {
    background:
        linear-gradient(
            270deg,
            rgba(10, 44, 51, 0.82) 0%,
            rgba(10, 44, 51, 0.68) 24%,
            rgba(10, 44, 51, 0.40) 43%,
            rgba(10, 44, 51, 0.10) 63%,
            rgba(10, 44, 51, 0) 78%
        );
}


/* Text links im Herobild. */
.pyc-mitarbeiter-cover__overlay {
    position: absolute;
    inset: 0;

    z-index: 2;

    display: flex;
    align-items: flex-end;

    padding-bottom:
        clamp(
            2.25rem,
            5vw,
            4.75rem
        );

    pointer-events: none;
}

.pyc-mitarbeiter-cover__overlay .container {
    width: min(
        var(--max-width),
        calc(100% - 40px)
    );
}

.pyc-mitarbeiter-cover__content {
    width: min(100%, 720px);
}


/* Textposition links */
.pyc-mitarbeiter-cover--text-links
.pyc-mitarbeiter-cover__content {
    margin-right: auto;
    margin-left: 0;

    text-align: left;
}


/* Textposition rechts */
.pyc-mitarbeiter-cover--text-rechts
.pyc-mitarbeiter-cover__content {
    margin-right: 0;
    margin-left: auto;

    text-align: right;
}

.pyc-mitarbeiter-cover__eyebrow {
    display: block;

    margin-bottom: 0.55rem;

    color: rgba(255, 255, 255, 0.82);

    font-size: 0.82rem;
    font-weight: 700;

    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: 0.18em;
}

.pyc-mitarbeiter-cover__title {
    max-width: 760px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            3.5rem,
            6.7vw,
            6.6rem
        );

    line-height: 0.93;
    letter-spacing: -0.02em;
}

.pyc-mitarbeiter-cover__role {
    margin:
        0.8rem
        0
        0;

    color: var(--warm-amber);

    font-size:
        clamp(
            0.9rem,
            1.4vw,
            1.08rem
        );

    font-weight: 700;
    line-height: 1.25;

    text-transform: uppercase;
    letter-spacing: 0.12em;
}


/* =========================================================
   PROFIL
========================================================= */

.pyc-mitarbeiter-hero {
    position: relative;
    padding:
        clamp(4rem, 7vw, 7rem)
        0;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(195, 228, 233, 0.92),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #f7fbfc 0%,
            #edf7f8 52%,
            #ffffff 100%
        );
}

.pyc-mitarbeiter-hero::after {
    content: "";
    position: absolute;
    right: -140px;
    bottom: -180px;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    border: 1px solid rgba(7, 155, 171, 0.12);
    pointer-events: none;
}

.pyc-mitarbeiter-hero__grid {
    display: grid;
    grid-template-columns:
        minmax(280px, 0.76fr)
        minmax(0, 1.24fr);
    align-items: center;
    gap: clamp(3rem, 7vw, 7rem);
}

.pyc-mitarbeiter-hero__visual {
    position: relative;
    max-width: 430px;
}

.pyc-mitarbeiter-hero__visual::before {
    content: "";
    position: absolute;
    top: 24px;
    left: -24px;
    width: 72%;
    height: 92%;
    background: var(--aqua-mist);
    z-index: 0;
}

.pyc-mitarbeiter-hero__photo {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            rgba(7, 155, 171, 0.28)
        );
    box-shadow:
        0 24px 60px
        rgba(10, 44, 51, 0.12);
}

.pyc-mitarbeiter-hero__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.pyc-mitarbeiter-hero__placeholder {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            var(--pure-teal)
        );
}

.pyc-mitarbeiter-hero__placeholder span {
    font-family: var(--font-headline);
    font-size: clamp(4rem, 9vw, 7rem);
    color: #ffffff;
}

.pyc-mitarbeiter-hero__content {
    position: relative;
    z-index: 2;
    max-width: 720px;
}

.pyc-mitarbeiter-hero h1 {
    margin:
        0
        0
        1rem;

    font-size:
        clamp(
            3.4rem,
            7vw,
            6.5rem
        );

    line-height: 0.92;
    letter-spacing: -0.02em;
    color: var(--cyan-navy);
}

.pyc-mitarbeiter-hero__role {
    margin: 0;

    color: var(--warm-amber);

    font-size:
        clamp(
            0.9rem,
            1.5vw,
            1.08rem
        );

    line-height: 1.35;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.pyc-mitarbeiter-hero__line {
    width: 64px;
    height: 4px;
    margin: 1.75rem 0;
    background: var(--pure-teal);
}

.pyc-mitarbeiter-hero__locations {
    display: grid;
    gap: 0.8rem;
}

.pyc-mitarbeiter-hero__meta-label {
    color: var(--slate-gray);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}


.pyc-mitarbeiter-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    margin-top: 2rem;
}


/* =========================================================
   ÜBER / PERSÖNLICH
========================================================= */

.pyc-mitarbeiter-about {
    padding:
        clamp(4rem, 7vw, 7rem)
        0;

    background: #ffffff;
}

.pyc-mitarbeiter-about__grid {
    display: grid;

    grid-template-columns:
        minmax(230px, 0.7fr)
        minmax(0, 1.3fr);

    gap:
        clamp(
            3rem,
            8vw,
            7rem
        );

    align-items: start;
}

.pyc-mitarbeiter-about__heading {
    position: relative;
}

.pyc-mitarbeiter-about__heading h2 {
    max-width: 420px;
    margin: 0;
    color: var(--deep-teal);

    font-size:
        clamp(
            2.6rem,
            4.7vw,
            4.3rem
        );

    line-height: 0.98;
}

.pyc-mitarbeiter-about__text {
    max-width: 760px;

    color: var(--cyan-navy);

    font-size:
        clamp(
            1.03rem,
            1.25vw,
            1.16rem
        );

    line-height: 1.8;
}

.pyc-mitarbeiter-about__text > *:last-child {
    margin-bottom: 0;
}

.pyc-mitarbeiter-about__text h2,
.pyc-mitarbeiter-about__text h3,
.pyc-mitarbeiter-about__text h4 {
    margin-top: 1.7em;
}

.pyc-mitarbeiter-about__text a {
    text-decoration: underline;
    text-underline-offset: 3px;
}


/* =========================================================
   LEISTUNGEN
========================================================= */

.pyc-mitarbeiter-services {
    padding:
        clamp(4rem, 7vw, 7rem)
        0;

    background:
        linear-gradient(
            180deg,
            #f6fbfc 0%,
            #edf7f8 100%
        );
}

.pyc-mitarbeiter-services .section-header {
    max-width: 760px;
    margin-bottom: 3rem;
}

.pyc-mitarbeiter-services__grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 1.35rem;
}

.pyc-mitarbeiter-service-card {
    min-height: 245px;

    display: flex;
    flex-direction: column;

    padding:
        clamp(
            1.4rem,
            2.2vw,
            2rem
        );

    color: var(--cyan-navy);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.pyc-mitarbeiter-service-card:hover {
    transform: translateY(-4px);

    border-color:
        rgba(7, 155, 171, 0.34);

    box-shadow:
        0 20px 46px
        rgba(10, 44, 51, 0.10);
}

.pyc-mitarbeiter-service-card__eyebrow {
    display: block;
    margin-bottom: 0.8rem;

    color: var(--slate-gray);

    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.pyc-mitarbeiter-service-card h3 {
    margin: 0 0 0.8rem;
    color: var(--deep-teal);
}

.pyc-mitarbeiter-service-card p {
    margin: 0 0 1.4rem;
    color: var(--slate-gray);
    line-height: 1.65;
}

.pyc-mitarbeiter-service-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;

    margin-top: auto;

    color: var(--pure-teal);

    font-weight: 700;

    transition:
        gap 0.2s ease,
        color 0.2s ease;
}

.pyc-mitarbeiter-service-card:hover
.pyc-mitarbeiter-service-card__link {
    gap: 0.7rem;
    color: var(--deep-teal);
}


/* =========================================================
   ABSCHLUSS CTA
========================================================= */

.pyc-mitarbeiter-cta {
    padding:
        clamp(3.5rem, 6vw, 5rem)
        0;

    background: var(--deep-teal);
}

.pyc-mitarbeiter-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.pyc-mitarbeiter-cta__content {
    max-width: 720px;
}

.pyc-mitarbeiter-cta__eyebrow {
    display: block;
    margin-bottom: 0.45rem;

    color:
        rgba(
            255,
            255,
            255,
            0.68
        );

    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.pyc-mitarbeiter-cta h2 {
    margin: 0 0 0.6rem;
    color: #ffffff;

    font-size:
        clamp(
            2.35rem,
            4.2vw,
            4rem
        );

    line-height: 0.98;
}

.pyc-mitarbeiter-cta p {
    margin: 0;
    color:
        rgba(
            255,
            255,
            255,
            0.82
        );

    font-size: 1.02rem;
}

.pyc-mitarbeiter-cta__button {
    flex: 0 0 auto;
    white-space: nowrap;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 980px) {

    .pyc-mitarbeiter-hero__grid {
        grid-template-columns:
            minmax(250px, 0.8fr)
            minmax(0, 1.2fr);

        gap: 3rem;
    }

    .pyc-mitarbeiter-services__grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }
}


@media (max-width: 760px) {

    .pyc-mitarbeiter-cover {
        /*
         * Auch mobil möglichst viel vom Originalbild zeigen.
         * Das Original-Seitenverhältnis bleibt erhalten.
         */
        aspect-ratio: 2048 / 877;
        min-height: 0;
        max-height: none;
    }

    .pyc-mitarbeiter-cover--verlauf-links_rechts::after {
        background:
            linear-gradient(
                90deg,
                rgba(10, 44, 51, 0.84) 0%,
                rgba(10, 44, 51, 0.66) 42%,
                rgba(10, 44, 51, 0.18) 78%,
                rgba(10, 44, 51, 0) 100%
            );
    }

    .pyc-mitarbeiter-cover--verlauf-rechts_links::after {
        background:
            linear-gradient(
                270deg,
                rgba(10, 44, 51, 0.84) 0%,
                rgba(10, 44, 51, 0.66) 42%,
                rgba(10, 44, 51, 0.18) 78%,
                rgba(10, 44, 51, 0) 100%
            );
    }

    .pyc-mitarbeiter-cover__overlay {
        padding-bottom:
            clamp(
                1.35rem,
                5vw,
                2rem
            );
    }

    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__content {
        margin-left: auto;
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__content {
        margin-right: auto;
    }

    .pyc-mitarbeiter-cover__title {
        max-width: 90%;

        font-size:
            clamp(
                2.8rem,
                12vw,
                4.6rem
            );
    }

    .pyc-mitarbeiter-cover__eyebrow {
        font-size: 0.72rem;
    }

    .pyc-mitarbeiter-cover__role {
        margin-top: 0.55rem;
        font-size: 0.82rem;
    }

    .pyc-mitarbeiter-hero {
        padding:
            3.25rem
            0
            4rem;
    }

    .pyc-mitarbeiter-hero__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .pyc-mitarbeiter-hero__visual {
        width: min(100%, 390px);
        margin-inline: auto;
    }

    .pyc-mitarbeiter-hero__visual::before {
        left: -14px;
        top: 14px;
    }

    .pyc-mitarbeiter-hero__content {
        max-width: none;
    }

    .pyc-mitarbeiter-hero h1 {
        font-size:
            clamp(
                3.1rem,
                15vw,
                5rem
            );
    }

    .pyc-mitarbeiter-about__grid {
        grid-template-columns: 1fr;
        gap: 1.7rem;
    }

    .pyc-mitarbeiter-about__heading h2 {
        max-width: none;
    }

    .pyc-mitarbeiter-cta__inner {
        align-items: flex-start;
        flex-direction: column;
    }
}


@media (max-width: 580px) {

    .pyc-mitarbeiter-single .container {
        width: min(
            var(--max-width),
            calc(100% - 30px)
        );
    }

    .pyc-mitarbeiter-hero__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pyc-mitarbeiter-hero__actions .btn-primary,
    .pyc-mitarbeiter-hero__actions .btn-secondary {
        width: 100%;
    }

    .pyc-mitarbeiter-services__grid {
        grid-template-columns: 1fr;
    }

    .pyc-mitarbeiter-service-card {
        min-height: 0;
    }

    .pyc-mitarbeiter-cta__button {
        width: 100%;
    }
}


/* =========================================================
   STANDORTKARTE – EXAKT WIE SINGLE-LEISTUNG
   Regeln aus css/single-leistung.css übernommen.
========================================================= */

.pyc-mitarbeiter-single .pyc-leistung-standort-card {
    display: flex;
    flex-direction: column;

    min-height: 180px;

    color: inherit;
    text-decoration: none;
}

.pyc-mitarbeiter-single .pyc-leistung-standort-card:hover {
    color: inherit;
}


/* =========================================================
   STANDORTKARTEN – TITELBILD
========================================================= */

.pyc-mitarbeiter-single .pyc-leistung-standort-card {
    padding: 0;
    overflow: hidden;
}

.pyc-mitarbeiter-single .pyc-leistung-standort-card__image {
    width: 100%;

    aspect-ratio: 16 / 9;

    height: auto;
    overflow: hidden;

    background: var(--aqua-mist);
}

.pyc-mitarbeiter-single .pyc-leistung-standort-card__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;

    transition:
        transform
        0.35s
        ease;
}

.pyc-mitarbeiter-single .pyc-leistung-standort-card:hover
.pyc-leistung-standort-card__image img {
    transform: scale(1.035);
}

.pyc-mitarbeiter-single .pyc-leistung-standort-card__content {
    display: flex;
    flex-direction: column;

    flex: 0 0 auto;

    padding:
        1.2rem
        1.4rem
        1.1rem;
}


/* =========================================================
   STANDORTGRID
   Auf der Leistungsseite sind es 3 Spalten im 1200-px-Container.
   Dadurch ist eine Karte dort ca. 384 px breit.
   Auf der Mitarbeiterseite halten wir genau diese Kartenbreite.
========================================================= */

.pyc-mitarbeiter-single
.services-grid.pyc-leistung-standort-grid {
    grid-template-columns:
        minmax(
            0,
            calc(
                (
                    var(--max-width) - 3rem
                )
                / 3
            )
        )
        !important;

    justify-content: start;
    align-items: start;
}


/* =========================================================
   EXAKTE KARTEN-FIXES AUS SINGLE-LEISTUNG
========================================================= */

.pyc-mitarbeiter-single
.services-grid.pyc-leistung-standort-grid
.pyc-leistung-standort-card {
    border-radius: 0;
}

.pyc-mitarbeiter-single
.service-card.pyc-leistung-standort-card {
    padding: 0 !important;

    overflow: hidden;
    border-radius: 0;

    align-self: start;
}

.pyc-mitarbeiter-single
.service-card.pyc-leistung-standort-card
.pyc-leistung-standort-card__image {
    width: 100%;

    margin: 0;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    flex: 0 0 auto;
}

.pyc-mitarbeiter-single
.service-card.pyc-leistung-standort-card
.pyc-leistung-standort-card__image img {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;

    object-fit: cover;
    object-position: center center;
}

.pyc-mitarbeiter-single
.service-card.pyc-leistung-standort-card
.pyc-leistung-standort-card__content {
    padding:
        1.2rem
        1.4rem
        1.1rem;
}

.pyc-mitarbeiter-single
.pyc-leistung-standort-card h3 {
    margin-bottom: 0;
}


/* =========================================================
   RESPONSIVE STANDORTKARTE
========================================================= */

@media (max-width: 700px) {

    .pyc-mitarbeiter-single
    .services-grid.pyc-leistung-standort-grid {
        grid-template-columns:
            minmax(
                0,
                min(
                    100%,
                    calc(
                        (
                            var(--max-width) - 3rem
                        )
                        / 3
                    )
                )
            )
            !important;
    }
}


@media (max-width: 520px) {

    .pyc-mitarbeiter-single
    .services-grid.pyc-leistung-standort-grid {
        grid-template-columns:
            minmax(0, 1fr)
            !important;
    }
}

/* =========================================================
   MOBILE HERO – TEXT UNTER DEM BILD
   Auf Mobilgeräten:
   - kein Verlauf
   - Text immer links
   - Eyebrow grau
   - Name als H1 in Deep Teal
   - Funktion/Aufgabe in Warm Amber
========================================================= */

@media (max-width: 760px) {

    .pyc-mitarbeiter-cover {
        display: block;

        aspect-ratio: auto;
        min-height: 0;
        max-height: none;

        overflow: visible;

        background: #ffffff;
    }


    /* Bild vollständig als eigener Bereich anzeigen. */
    .pyc-mitarbeiter-cover__image {
        display: block;

        width: 100%;
        height: auto;

        aspect-ratio: 2048 / 877;

        object-fit: cover;
        object-position: center center;
    }


    /* Auf Mobilgeräten kein Verlauf über dem Bild. */
    .pyc-mitarbeiter-cover::after,
    .pyc-mitarbeiter-cover--verlauf-links_rechts::after,
    .pyc-mitarbeiter-cover--verlauf-rechts_links::after {
        content: none;
        display: none;
        background: none;
    }


    /* Textblock unter das Bild setzen. */
    .pyc-mitarbeiter-cover__overlay {
        position: static;
        inset: auto;

        display: block;

        padding:
            1.35rem
            0
            1.6rem;

        background: #ffffff;

        pointer-events: auto;
    }


    .pyc-mitarbeiter-cover__overlay .container {
        width: min(
            var(--max-width),
            calc(100% - 30px)
        );
    }


    /* ACF-Textposition wird mobil bewusst ignoriert. */
    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__content,
    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__content {
        width: 100%;
        max-width: none;

        margin: 0;

        text-align: left;
    }


    /* Eyebrow in Grau. */
    .pyc-mitarbeiter-cover__eyebrow {
        display: block;
        margin-bottom: 0.5rem;

        font-size: 0.8rem;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 0.2em;

        color: var(--slate-gray);
    }


    /* Name als normale H1-Farbe unter dem Bild. */
    .pyc-mitarbeiter-cover__title {
        max-width: none;

        margin: 0;

        color: var(--deep-teal);

        font-size:
            clamp(
                2.8rem,
                13vw,
                4.4rem
            );

        line-height: 0.95;
        letter-spacing: 0.004em;
    }


    /* Funktion / Aufgabe unter dem Namen. */
    .pyc-mitarbeiter-cover__role {
        margin:
            0.65rem
            0
            0;

        color: var(--warm-amber);

        font-size: 0.86rem;
        font-weight: 700;

        line-height: 1.3;

        text-align: left;

        text-transform: uppercase;
        letter-spacing: 0.12em;
    }

}

/* =========================================================
   PERSÖNLICHE FRAGEN – MODERN / EDITORIAL
   Bewusst keine klassischen Karten:
   klare Linien, viel Weißraum, PYC-Farben.
========================================================= */

.pyc-mitarbeiter-questions {
    position: relative;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            var(--cloud) 100%
        );
}

.pyc-mitarbeiter-questions .pyc-mitarbeiter-about__grid {
    grid-template-columns:
        minmax(230px, 0.62fr)
        minmax(0, 1.38fr);

    gap:
        clamp(
            3rem,
            8vw,
            7rem
        );
}


/* Linker Bereich bleibt beim Scrollen ruhig sichtbar. */
.pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading {
    position: sticky;
    top: 120px;

    padding-left: 1.15rem;
}

.pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading::before {
    content: "";

    position: absolute;
    top: 0.15rem;
    bottom: 0.1rem;
    left: 0;

    width: 3px;

    background:
        linear-gradient(
            180deg,
            var(--pure-teal) 0%,
            var(--aqua-mist) 100%
        );
}

.pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading h2 {
    max-width: 360px;
}


/* Fragenliste */
.pyc-mitarbeiter-questions__list {
    max-width: 790px;

    counter-reset: pyc-question;

    border-top:
        1px solid
        rgba(10, 44, 51, 0.14);
}


/* Einzelne Frage */
.pyc-mitarbeiter-question {
    position: relative;

    display: grid;

    grid-template-columns:
        3.4rem
        minmax(0, 1fr);

    column-gap: 1.1rem;

    padding:
        clamp(1.55rem, 2.6vw, 2.15rem)
        0;

    border-bottom:
        1px solid
        rgba(10, 44, 51, 0.14);

    counter-increment: pyc-question;

    transition:
        padding-left 0.22s ease,
        background-color 0.22s ease;
}


/* Kleine Nummer als grafisches Element */
.pyc-mitarbeiter-question::before {
    content:
        counter(pyc-question, decimal-leading-zero);

    grid-column: 1;
    grid-row: 1 / span 2;

    padding-top: 0.15rem;

    color: var(--warm-amber);

    font-family: var(--font-headline);
    font-size: 1.35rem;
    line-height: 1;

    letter-spacing: 0.04em;
}


/* Frage bewusst nicht wie ein klassisches H3 behandeln. */
.pyc-mitarbeiter-question__title {
    grid-column: 2;

    margin:
        0
        0
        0.55rem;

    color: var(--deep-teal);

    font-family: var(--font-body);

    font-size:
        clamp(
            1.08rem,
            1.45vw,
            1.28rem
        );

    font-weight: 650;

    line-height: 1.35;

    text-transform: none;
    letter-spacing: -0.01em;
}


/* Antwort */
.pyc-mitarbeiter-question__answer {
    grid-column: 2;

    max-width: 700px;

    color: var(--cyan-navy);

    font-size:
        clamp(
            1rem,
            1.18vw,
            1.1rem
        );

    line-height: 1.72;
}

.pyc-mitarbeiter-question__answer p {
    margin: 0;
}

.pyc-mitarbeiter-question__answer p + p {
    margin-top: 0.8rem;
}


/* Sehr dezente Interaktion auf Geräten mit Maus. */
@media (hover: hover) and (pointer: fine) {

    .pyc-mitarbeiter-question:hover {
        padding-left: 0.8rem;

        background:
            linear-gradient(
                90deg,
                rgba(195, 228, 233, 0.22) 0%,
                rgba(195, 228, 233, 0) 72%
            );
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 760px) {

    .pyc-mitarbeiter-questions .pyc-mitarbeiter-about__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading {
        position: static;
        top: auto;

        padding-left: 0;
    }

    .pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading::before {
        display: none;
    }

    .pyc-mitarbeiter-questions .pyc-mitarbeiter-about__heading h2 {
        max-width: none;
    }

    .pyc-mitarbeiter-question {
        grid-template-columns:
            2.55rem
            minmax(0, 1fr);

        column-gap: 0.8rem;

        padding:
            1.35rem
            0;
    }

    .pyc-mitarbeiter-question::before {
        font-size: 1.12rem;
    }

    .pyc-mitarbeiter-question__title {
        margin-bottom: 0.45rem;

        font-size: 1.05rem;
    }

    .pyc-mitarbeiter-question__answer {
        font-size: 1rem;
        line-height: 1.65;
    }

}


/* =========================================================
   MITARBEITER – LAYOUT UPDATE
   Hero: Text und Standorte gegenüberliegend.
   Fragenblock: Portrait in der linken Editorial-Spalte.
========================================================= */


/* =========================================================
   HERO – GEMEINSAMES LAYOUT
========================================================= */

.pyc-mitarbeiter-cover__overlay {
    pointer-events: none;
}

.pyc-mitarbeiter-cover__layout {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(340px, 0.92fr);

    align-items: end;

    gap:
        clamp(
            2rem,
            5vw,
            5rem
        );

    width: 100%;
}


/* Text links -> Standorte rechts */
.pyc-mitarbeiter-cover--text-links
.pyc-mitarbeiter-cover__content {
    grid-column: 1;
    grid-row: 1;

    justify-self: start;

    margin: 0;
    text-align: left;
}

.pyc-mitarbeiter-cover--text-links
.pyc-mitarbeiter-cover__locations {
    grid-column: 2;
    grid-row: 1;

    justify-self: end;
}


/* Text rechts -> Standorte links */
.pyc-mitarbeiter-cover--text-rechts
.pyc-mitarbeiter-cover__content {
    grid-column: 2;
    grid-row: 1;

    justify-self: end;

    margin: 0;
    text-align: right;
}

.pyc-mitarbeiter-cover--text-rechts
.pyc-mitarbeiter-cover__locations {
    grid-column: 1;
    grid-row: 1;

    justify-self: start;
}


.pyc-mitarbeiter-cover__content {
    width: min(100%, 620px);
}


.pyc-mitarbeiter-cover--text-rechts
.pyc-mitarbeiter-cover__actions {
    justify-content: flex-end;
}


/* Buttons müssen trotz Overlay klickbar bleiben. */
.pyc-mitarbeiter-cover__actions,
.pyc-mitarbeiter-cover__locations {
    pointer-events: auto;
}

.pyc-mitarbeiter-cover__actions {
    display: flex;
    flex-wrap: wrap;

    gap: 0.7rem;

    margin-top: 1.35rem;
}


/* =========================================================
   HERO – STANDORTKARTEN
========================================================= */

.pyc-mitarbeiter-cover__locations {
    width: min(100%, 620px);
}

.pyc-mitarbeiter-cover__locations-label {
    display: block;

    margin-bottom: 0.65rem;

    color: rgba(255, 255, 255, 0.82);

    font-size: 0.76rem;
    font-weight: 400;

    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: 0.18em;
}

.pyc-mitarbeiter-cover__location-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);

    gap: 0.85rem;
}

.pyc-mitarbeiter-cover__location-grid--2,
.pyc-mitarbeiter-cover__location-grid:has(
    .pyc-mitarbeiter-cover__location-card:nth-child(2)
) {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );
}

.pyc-mitarbeiter-cover__location-card {
    display: flex;
    flex-direction: column;

    min-width: 0;

    overflow: hidden;

    color: inherit;
    text-decoration: none;

    background:
        rgba(
            255,
            255,
            255,
            0.94
        );

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.38
        );

    border-radius: 0;

    box-shadow:
        0 14px 34px
        rgba(
            10,
            44,
            51,
            0.16
        );

    backdrop-filter: blur(8px);

    transition:
        transform 0.24s ease,
        box-shadow 0.24s ease;
}

.pyc-mitarbeiter-cover__location-card:hover {
    color: inherit;

    transform: translateY(-3px);

    box-shadow:
        0 18px 42px
        rgba(
            10,
            44,
            51,
            0.22
        );
}

.pyc-mitarbeiter-cover__location-image {
    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: var(--aqua-mist);
}

.pyc-mitarbeiter-cover__location-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;

    transition:
        transform
        0.35s
        ease;
}

.pyc-mitarbeiter-cover__location-card:hover
.pyc-mitarbeiter-cover__location-image img {
    transform: scale(1.035);
}

.pyc-mitarbeiter-cover__location-content {
    padding:
        0.95rem
        1rem
        1rem;
}

.pyc-mitarbeiter-cover__location-eyebrow {
    display: block;

    margin-bottom: 0.3rem;

    color: var(--pure-teal);

    font-size: 0.68rem;
    font-weight: 400;

    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.pyc-mitarbeiter-cover__location-content h3 {
    margin: 0;

    color: var(--cyan-navy);

    font-size:
        clamp(
            1.25rem,
            1.8vw,
            1.65rem
        );

    line-height: 1;
}


/* =========================================================
   FALLBACK OHNE HEROBILD
========================================================= */

.pyc-mitarbeiter-simple-intro {
    padding:
        clamp(4rem, 7vw, 7rem)
        0;

    background:
        linear-gradient(
            135deg,
            var(--cloud),
            #ffffff
        );
}

.pyc-mitarbeiter-simple-intro h1 {
    margin:
        0
        0
        0.8rem;

    color: var(--cyan-navy);
}

.pyc-mitarbeiter-simple-intro__role {
    margin: 0;

    color: var(--warm-amber);

    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.pyc-mitarbeiter-simple-intro__locations {
    width: min(100%, 620px);

    margin-top: 2rem;
}

.pyc-mitarbeiter-simple-intro__label {
    display: block;

    margin-bottom: 0.65rem;

    color: var(--slate-gray);

    font-size: 0.8rem;

    text-transform: uppercase;
    letter-spacing: 0.2em;
}


/* =========================================================
   FRAGENBLOCK – PORTRAIT LINKS
========================================================= */

.pyc-mitarbeiter-questions .pyc-mitarbeiter-about__grid {
    grid-template-columns:
        minmax(280px, 0.72fr)
        minmax(0, 1.28fr);

    align-items: start;
}

.pyc-mitarbeiter-questions__profile {
    position: sticky;
    top: 110px;

    min-width: 0;
}

.pyc-mitarbeiter-questions
.pyc-mitarbeiter-about__heading {
    position: relative;
    top: auto;

    padding-left: 1.15rem;
}

.pyc-mitarbeiter-questions__portrait-wrap {
    position: relative;

    width: min(100%, 350px);

    margin-top: 2rem;
    margin-left: 1.15rem;
}

.pyc-mitarbeiter-questions__portrait-wrap::before {
    content: "";

    position: absolute;

    top: 18px;
    left: -18px;

    width: 72%;
    height: 92%;

    background: var(--aqua-mist);
}

.pyc-mitarbeiter-questions__portrait {
    position: relative;
    z-index: 1;

    width: 100%;

    aspect-ratio: 4 / 5;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            rgba(7, 155, 171, 0.28)
        );

    box-shadow:
        0 22px 54px
        rgba(
            10,
            44,
            51,
            0.12
        );
}

.pyc-mitarbeiter-questions__portrait-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center top;
}

.pyc-mitarbeiter-questions__portrait-placeholder {
    display: grid;
    place-items: center;

    width: 100%;
    height: 100%;

    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            var(--pure-teal)
        );
}

.pyc-mitarbeiter-questions__portrait-placeholder span {
    color: #ffffff;

    font-family: var(--font-headline);

    font-size:
        clamp(
            4rem,
            8vw,
            6rem
        );
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) and (min-width: 761px) {

    .pyc-mitarbeiter-cover__layout {
        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(300px, 1.1fr);

        gap: 2rem;
    }

    .pyc-mitarbeiter-cover__location-content {
        padding:
            0.8rem
            0.85rem
            0.9rem;
    }

    .pyc-mitarbeiter-cover__location-content h3 {
        font-size: 1.2rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 760px) {

    /*
     * Das Hero-Bild bleibt wie bereits gewünscht ohne Verlauf.
     * Text und Standorte stehen darunter auf weißem Grund.
     */
    .pyc-mitarbeiter-cover__layout {
        display: flex;
        flex-direction: column;

        gap: 1.75rem;
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__content,
    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__content {
        order: 1;

        width: 100%;

        justify-self: auto;

        margin: 0;

        text-align: left;
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__locations,
    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__locations {
        order: 2;

        width: 100%;

        justify-self: auto;
    }

    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__actions {
        justify-content: flex-start;
    }

    .pyc-mitarbeiter-cover__locations-label {
        color: var(--slate-gray);

        font-size: 0.8rem;
        letter-spacing: 0.2em;
    }

    .pyc-mitarbeiter-cover__location-card {
        background: #ffffff;

        border:
            1px solid
            rgba(
                10,
                44,
                51,
                0.10
            );

        box-shadow:
            0 12px 28px
            rgba(
                10,
                44,
                51,
                0.08
            );

        backdrop-filter: none;
    }

    .pyc-mitarbeiter-questions .pyc-mitarbeiter-about__grid {
        grid-template-columns: 1fr;
        gap: 2.4rem;
    }

    .pyc-mitarbeiter-questions__profile {
        position: static;
        top: auto;
    }

    .pyc-mitarbeiter-questions
    .pyc-mitarbeiter-about__heading {
        padding-left: 0;
    }

    .pyc-mitarbeiter-questions
    .pyc-mitarbeiter-about__heading::before {
        display: none;
    }

    .pyc-mitarbeiter-questions__portrait-wrap {
        width: min(82%, 320px);

        margin:
            1.5rem
            0
            0
            18px;
    }

}


@media (max-width: 520px) {

    .pyc-mitarbeiter-cover__location-grid,
    .pyc-mitarbeiter-cover__location-grid--2,
    .pyc-mitarbeiter-cover__location-grid:has(
        .pyc-mitarbeiter-cover__location-card:nth-child(2)
    ) {
        grid-template-columns: minmax(0, 1fr);
    }

}


/* =========================================================
   HERO – STANDORTKARTEN KOMPAKTER
   Überschreibt die vorherigen Größen.
========================================================= */

@media (min-width: 761px) {

    .pyc-mitarbeiter-cover__locations {
        width: auto;
        max-width: 520px;
    }

    .pyc-mitarbeiter-cover__location-grid {
        grid-template-columns: 250px;
        justify-content: start;
    }

    .pyc-mitarbeiter-cover__location-grid--2,
    .pyc-mitarbeiter-cover__location-grid:has(
        .pyc-mitarbeiter-cover__location-card:nth-child(2)
    ) {
        grid-template-columns:
            repeat(
                2,
                245px
            );
    }

    .pyc-mitarbeiter-cover__location-card {
        width: 100%;
        max-width: 250px;
    }

    .pyc-mitarbeiter-cover__location-image {
        aspect-ratio: 16 / 7.5;
    }

    .pyc-mitarbeiter-cover__location-content {
        padding:
            0.72rem
            0.82rem
            0.78rem;
    }

    .pyc-mitarbeiter-cover__location-eyebrow {
        margin-bottom: 0.2rem;

        font-size: 0.62rem;
        letter-spacing: 0.14em;
    }

    .pyc-mitarbeiter-cover__location-content h3 {
        font-size: 1.15rem;
        line-height: 1.05;
    }

}


/* Mobil ebenfalls etwas flacher, aber weiterhin gut bedienbar. */
@media (max-width: 760px) {

    .pyc-mitarbeiter-cover__location-image {
        aspect-ratio: 16 / 7.5;
    }

    .pyc-mitarbeiter-cover__location-content {
        padding:
            0.78rem
            0.9rem
            0.85rem;
    }

    .pyc-mitarbeiter-cover__location-content h3 {
        font-size: 1.15rem;
    }

}


/* =========================================================
   HERO – STANDORTE DIREKT UNTER DER FUNKTION
   Reihenfolge:
   Eyebrow → Name → Funktion → Standort(e) → Buttons
   Die ACF-Ausrichtung links/rechts bleibt erhalten.
========================================================= */

@media (min-width: 761px) {

    /*
     * Der Hero behält zwei mögliche Seiten.
     * Es gibt aber nur noch eine belegte Content-Spalte.
     */
    .pyc-mitarbeiter-cover__layout {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr);
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__content {
        grid-column: 1;
        grid-row: 1;

        justify-self: start;

        width: min(100%, 560px);

        text-align: left;
    }

    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__content {
        grid-column: 2;
        grid-row: 1;

        justify-self: end;

        width: min(100%, 560px);

        text-align: right;
    }


    /* Standortblock sitzt jetzt innerhalb der Content-Spalte. */
    .pyc-mitarbeiter-cover__content
    .pyc-mitarbeiter-cover__locations {
        width: 100%;
        max-width: 520px;

        margin-top: 1.2rem;
    }


    /* Links ausgerichteter Hero */
    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__locations {
        margin-right: auto;
        margin-left: 0;
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__location-grid {
        justify-content: start;
    }

    .pyc-mitarbeiter-cover--text-links
    .pyc-mitarbeiter-cover__locations-label {
        text-align: left;
    }


    /* Rechts ausgerichteter Hero */
    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__locations {
        margin-right: 0;
        margin-left: auto;
    }

    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__location-grid {
        justify-content: end;
    }

    .pyc-mitarbeiter-cover--text-rechts
    .pyc-mitarbeiter-cover__locations-label {
        text-align: right;
    }


    /*
     * Ein Standort: kompakt.
     * Zwei Standorte: nebeneinander.
     */
    .pyc-mitarbeiter-cover__location-grid {
        grid-template-columns: 250px;
    }

    .pyc-mitarbeiter-cover__location-grid--2,
    .pyc-mitarbeiter-cover__location-grid:has(
        .pyc-mitarbeiter-cover__location-card:nth-child(2)
    ) {
        grid-template-columns:
            repeat(
                2,
                245px
            );
    }


    /* Buttons folgen mit etwas Luft direkt unter den Standorten. */
    .pyc-mitarbeiter-cover__actions {
        margin-top: 1.15rem;
    }

}


/* Mobil bleibt alles bewusst links unter dem Bild. */
@media (max-width: 760px) {

    .pyc-mitarbeiter-cover__content
    .pyc-mitarbeiter-cover__locations {
        width: 100%;

        margin-top: 1.15rem;
    }

    .pyc-mitarbeiter-cover__locations-label {
        text-align: left;
    }

    .pyc-mitarbeiter-cover__location-grid {
        justify-content: start;
    }

}


/* =========================================================
   ABSCHLUSS CTA – ZUFÄLLIGE TEAMMITGLIEDER
========================================================= */

.pyc-mitarbeiter-cta__inner {
    display: grid;

    grid-template-columns:
        minmax(250px, 0.72fr)
        minmax(0, 1.58fr);

    align-items: end;

    gap:
        clamp(
            2.5rem,
            6vw,
            6rem
        );
}


.pyc-mitarbeiter-cta__left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    gap: 1.5rem;
}


.pyc-mitarbeiter-cta__content {
    max-width: 430px;
}


.pyc-mitarbeiter-cta__button {
    flex: none;
}


/* =========================================================
   TEAM-GRID
========================================================= */

.pyc-mitarbeiter-cta__team {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    align-items: start;

    gap:
        clamp(
            0.8rem,
            1.4vw,
            1.2rem
        );
}


.pyc-mitarbeiter-cta-card {
    min-width: 0;

    color: #ffffff;
    text-decoration: none;
}


.pyc-mitarbeiter-cta-card:hover {
    color: #ffffff;
}


/* Portrait */
.pyc-mitarbeiter-cta-card__media {
    position: relative;

    width: 100%;
    aspect-ratio: 4 / 5;

    overflow: hidden;

    background: var(--aqua-mist);
}


.pyc-mitarbeiter-cta-card__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center top;

    transition:
        transform 0.35s ease;
}


.pyc-mitarbeiter-cta-card:hover
.pyc-mitarbeiter-cta-card__image {
    transform: scale(1.035);
}


/* Name + Funktion */
.pyc-mitarbeiter-cta-card__content {
    padding-top: 0.8rem;
}


.pyc-mitarbeiter-cta-card__name {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            1.15rem,
            1.7vw,
            1.5rem
        );

    line-height: 1;

    transition:
        color 0.2s ease;
}


.pyc-mitarbeiter-cta-card:hover
.pyc-mitarbeiter-cta-card__name {
    color: var(--aqua-mist);
}


.pyc-mitarbeiter-cta-card__role {
    margin:
        0.35rem
        0
        0;

    color: var(--warm-amber);

    font-size: 0.74rem;
    font-weight: 700;

    line-height: 1.25;

    text-transform: uppercase;
    letter-spacing: 0.08em;
}


/*
 * hidden muss auch bei möglichen globalen
 * Link-/Grid-Regeln zuverlässig funktionieren.
 */
.pyc-mitarbeiter-cta-card[hidden] {
    display: none !important;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1000px) {

    .pyc-mitarbeiter-cta__inner {
        grid-template-columns:
            minmax(220px, 0.65fr)
            minmax(0, 1.35fr);

        gap: 2.5rem;
    }

    .pyc-mitarbeiter-cta__team {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            1.4rem
            1rem;
    }

}


@media (max-width: 760px) {

    .pyc-mitarbeiter-cta__inner {
        grid-template-columns: 1fr;

        align-items: start;

        gap: 2.5rem;
    }

    .pyc-mitarbeiter-cta__left {
        width: 100%;
    }

    .pyc-mitarbeiter-cta__content {
        max-width: 620px;
    }

    .pyc-mitarbeiter-cta__team {
        width: 100%;

        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            1.5rem
            1rem;
    }

}


@media (max-width: 420px) {

    .pyc-mitarbeiter-cta__team {
        gap:
            1.35rem
            0.75rem;
    }

    .pyc-mitarbeiter-cta-card__role {
        font-size: 0.68rem;
    }

}


/* =========================================================
   RANDOM TEAM – EXAKTES KARTENDESIGN DES TEAM-ARCHIVS
   Verwendet bewusst die vorhandenen .pyc-team-card Klassen.
========================================================= */

.pyc-mitarbeiter-cta__team .pyc-team-card {
    position: relative;

    width: 100%;

    /*
     * Optik kommt aus dem globalen Team-Archiv-Design:
     * weiße Karte, 4:5-Portrait, Teal-Linie,
     * Name in Headline-Font, Rolle in Warm Amber.
     */
}


/* Ganze Mitarbeiterkarte führt zum Profil. */
.pyc-mitarbeiter-cta__profile-link {
    position: absolute;
    inset: 0;

    z-index: 4;

    display: block;
}


/*
 * Standort-Badges liegen über dem Profil-Link
 * und bleiben separat anklickbar.
 */
.pyc-mitarbeiter-cta__team
.pyc-team-card__locations {
    z-index: 6;
}


/* Text und Bild brauchen keine eigene Klick-Ebene. */
.pyc-mitarbeiter-cta__team
.pyc-team-card__media,
.pyc-mitarbeiter-cta__team
.pyc-team-card__content {
    position: relative;
    z-index: 1;
}


/* Zufallsauswahl: nicht gewählte Karten wirklich ausblenden. */
.pyc-mitarbeiter-cta__team
.pyc-team-card[hidden] {
    display: none !important;
}


/*
 * Das Grid bleibt rechts im CTA mit vier Karten,
 * nur die Karten selbst sind nun identisch zum Team-Archiv.
 */
@media (min-width: 1001px) {

    .pyc-mitarbeiter-cta__team {
        grid-template-columns:
            repeat(
                4,
                minmax(0, 1fr)
            );

        gap: 1.35rem;
    }

}


@media (max-width: 1000px) {

    .pyc-mitarbeiter-cta__team {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap: 1.35rem;
    }

}


/* =========================================================
   RANDOM TEAM – UNTERE WEISSE BOX IMMER GLEICH HOCH
========================================================= */

.pyc-mitarbeiter-cta__team
.pyc-team-card__content {
    box-sizing: border-box;

    height: 84px;
    min-height: 84px;
    max-height: 84px;

    overflow: hidden;
}


/* Namen dürfen höchstens zwei Zeilen belegen. */
.pyc-mitarbeiter-cta__team
.pyc-team-card__name {
    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


/* Funktion bleibt kompakt innerhalb derselben festen Box. */
.pyc-mitarbeiter-cta__team
.pyc-team-card__role {
    overflow: hidden;

    white-space: nowrap;
    text-overflow: ellipsis;
}


/* =========================================================
   RANDOM TEAM – KEINE STANDORT-BADGES IM HOVER
   Nur im Bereich "Menschen, die dich weiterbringen".
========================================================= */

.pyc-mitarbeiter-cta__team
.pyc-team-card__locations {
    display: none !important;
}


/* =========================================================
   PROFIL-TABS
   Über [Vorname] / Behandlungsschwerpunkte / Standorte
========================================================= */

.pyc-mitarbeiter-profile-tabs {
    padding:
        clamp(3.5rem, 6vw, 6.5rem)
        0;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            var(--cloud) 100%
        );
}


/* =========================================================
   TAB-LEISTE
========================================================= */

.pyc-mitarbeiter-profile-tabs__nav {
    display: flex;
    align-items: flex-end;

    gap:
        clamp(
            1.8rem,
            4vw,
            4.5rem
        );

    width: 100%;

    margin-bottom:
        clamp(
            2.5rem,
            5vw,
            4.5rem
        );

    overflow-x: auto;
    overflow-y: hidden;

    border-bottom:
        1px solid
        rgba(
            107,
            114,
            128,
            0.42
        );

    scrollbar-width: none;
}

.pyc-mitarbeiter-profile-tabs__nav::-webkit-scrollbar {
    display: none;
}


.pyc-mitarbeiter-profile-tabs__tab {
    position: relative;

    flex: 0 0 auto;

    margin: 0;

    padding:
        0
        1rem
        1.15rem;

    border: 0;

    background: transparent;

    color: var(--cyan-navy);

    font-family: var(--font-headline);
    font-size:
        clamp(
            1rem,
            1.45vw,
            1.2rem
        );

    font-weight: 400;
    line-height: 1;

    text-transform: uppercase;
    letter-spacing: 0.035em;

    cursor: pointer;

    opacity: 0.62;

    transition:
        color 0.22s ease,
        opacity 0.22s ease;
}


.pyc-mitarbeiter-profile-tabs__tab:first-child {
    padding-left: 1rem;
}


.pyc-mitarbeiter-profile-tabs__tab::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: -1px;
    left: 0;

    height: 4px;

    background: var(--pure-teal);

    transform: scaleX(0);
    transform-origin: left center;

    transition:
        transform
        0.28s
        ease;
}


.pyc-mitarbeiter-profile-tabs__tab:hover,
.pyc-mitarbeiter-profile-tabs__tab:focus-visible,
.pyc-mitarbeiter-profile-tabs__tab.is-active {
    color: var(--cyan-navy);
    opacity: 1;
}


.pyc-mitarbeiter-profile-tabs__tab.is-active::after {
    transform: scaleX(1);
}


.pyc-mitarbeiter-profile-tabs__tab:focus-visible {
    outline:
        2px solid
        var(--pure-teal);

    outline-offset: -4px;
}


/* =========================================================
   FOTO LINKS / INHALT RECHTS
========================================================= */

.pyc-mitarbeiter-profile-tabs__layout {
    display: grid;

    grid-template-columns:
        minmax(260px, 0.62fr)
        minmax(0, 1.38fr);

    align-items: start;

    gap:
        clamp(
            3rem,
            7vw,
            7rem
        );
}


.pyc-mitarbeiter-profile-tabs__portrait-column {
    min-width: 0;
}


.pyc-mitarbeiter-profile-tabs__portrait-wrap {
    position: sticky;
    top: 110px;

    width: min(100%, 350px);

    margin-left: 18px;
}


.pyc-mitarbeiter-profile-tabs__portrait-wrap::before {
    content: "";

    position: absolute;

    top: 18px;
    left: -18px;

    width: 72%;
    height: 92%;

    background: var(--aqua-mist);
}


.pyc-mitarbeiter-profile-tabs__portrait {
    position: relative;
    z-index: 1;

    width: 100%;

    aspect-ratio: 4 / 5;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            rgba(7, 155, 171, 0.28)
        );

    box-shadow:
        0 22px 54px
        rgba(
            10,
            44,
            51,
            0.12
        );
}


.pyc-mitarbeiter-profile-tabs__portrait-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center top;
}


.pyc-mitarbeiter-profile-tabs__portrait-placeholder {
    display: grid;
    place-items: center;

    width: 100%;
    height: 100%;

    background:
        linear-gradient(
            145deg,
            var(--aqua-mist),
            var(--pure-teal)
        );
}


.pyc-mitarbeiter-profile-tabs__portrait-placeholder span {
    color: #ffffff;

    font-family: var(--font-headline);

    font-size:
        clamp(
            4rem,
            8vw,
            6rem
        );
}


/* =========================================================
   PANELS
========================================================= */

.pyc-mitarbeiter-profile-tabs__panels {
    min-width: 0;
}


.pyc-mitarbeiter-profile-tabs__panel[hidden] {
    display: none !important;
}


.pyc-mitarbeiter-profile-tabs__panel.is-active {
    animation:
        pyc-profile-tab-fade
        0.34s
        ease
        both;
}


@keyframes pyc-profile-tab-fade {

    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


.pyc-mitarbeiter-profile-tabs__panel-header {
    margin-bottom:
        clamp(
            1.5rem,
            3vw,
            2.4rem
        );
}


.pyc-mitarbeiter-profile-tabs__panel-header h2 {
    max-width: 760px;

    margin-bottom: 0;
}


/* =========================================================
   ÜBER – FRAGEN
========================================================= */

.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-questions__list {
    max-width: 820px;

    counter-reset: pyc-question;

    border-top:
        1px solid
        rgba(
            10,
            44,
            51,
            0.14
        );
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question {
    position: relative;

    display: grid;

    grid-template-columns:
        3.4rem
        minmax(0, 1fr);

    column-gap: 1.1rem;

    padding:
        clamp(
            1.45rem,
            2.4vw,
            2rem
        )
        0;

    border-bottom:
        1px solid
        rgba(
            10,
            44,
            51,
            0.14
        );

    counter-increment: pyc-question;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question::before {
    content:
        counter(
            pyc-question,
            decimal-leading-zero
        );

    grid-column: 1;
    grid-row: 1 / span 2;

    padding-top: 0.15rem;

    color: var(--warm-amber);

    font-family: var(--font-headline);
    font-size: 1.35rem;
    line-height: 1;

    letter-spacing: 0.04em;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__title {
    grid-column: 2;

    margin:
        0
        0
        0.55rem;

    color: var(--deep-teal);

    font-family: var(--font-body);

    font-size:
        clamp(
            1.08rem,
            1.45vw,
            1.28rem
        );

    font-weight: 650;
    line-height: 1.35;

    text-transform: none;
    letter-spacing: -0.01em;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer {
    grid-column: 2;

    max-width: 700px;

    color: var(--cyan-navy);

    font-size:
        clamp(
            1rem,
            1.18vw,
            1.1rem
        );

    line-height: 1.72;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer p {
    margin: 0;
}


.pyc-mitarbeiter-profile-tabs__bio {
    max-width: 760px;

    font-size: 1.08rem;
    line-height: 1.75;
}


/* =========================================================
   BEHANDLUNGSSCHWERPUNKTE
========================================================= */

.pyc-mitarbeiter-profile-tabs__services {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 1.35rem;
}


/* =========================================================
   STANDORTE
========================================================= */

.pyc-mitarbeiter-profile-tabs__locations {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    align-items: start;

    gap: 1.35rem;

    max-width: 820px;
}


.pyc-mitarbeiter-profile-tabs__location-card {
    align-self: start;

    padding: 0 !important;

    overflow: hidden;

    border-radius: 0;
}


.pyc-mitarbeiter-profile-tabs__location-card
.pyc-leistung-standort-card__image {
    width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: var(--aqua-mist);
}


.pyc-mitarbeiter-profile-tabs__location-card
.pyc-leistung-standort-card__image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;

    transition:
        transform
        0.35s
        ease;
}


.pyc-mitarbeiter-profile-tabs__location-card:hover
.pyc-leistung-standort-card__image img {
    transform: scale(1.035);
}


.pyc-mitarbeiter-profile-tabs__location-card
.pyc-leistung-standort-card__content {
    padding:
        1.2rem
        1.4rem
        1.1rem;
}


.pyc-mitarbeiter-profile-tabs__location-card
.pyc-leistung-standort-card__content h3 {
    margin-bottom: 0;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .pyc-mitarbeiter-profile-tabs__layout {
        grid-template-columns:
            minmax(220px, 0.52fr)
            minmax(0, 1.48fr);

        gap: 2.5rem;
    }

    .pyc-mitarbeiter-profile-tabs__services,
    .pyc-mitarbeiter-profile-tabs__locations {
        grid-template-columns:
            minmax(0, 1fr);
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 760px) {

    .pyc-mitarbeiter-profile-tabs {
        padding:
            3rem
            0
            4rem;
    }


    .pyc-mitarbeiter-profile-tabs__nav {
        gap: 1.6rem;

        margin-bottom: 2.2rem;
    }


    .pyc-mitarbeiter-profile-tabs__tab {
        padding:
            0
            0
            0.9rem;

        font-size: 1rem;
    }


    .pyc-mitarbeiter-profile-tabs__layout {
        grid-template-columns: 1fr;

        gap: 2.4rem;
    }


    .pyc-mitarbeiter-profile-tabs__portrait-wrap {
        position: relative;
        top: auto;

        width: min(82%, 320px);

        margin:
            0
            0
            0
            18px;
    }


    .pyc-mitarbeiter-profile-tabs__panel-header {
        margin-bottom: 1.4rem;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question {
        grid-template-columns:
            2.55rem
            minmax(0, 1fr);

        column-gap: 0.8rem;

        padding:
            1.3rem
            0;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question::before {
        font-size: 1.12rem;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question__title {
        font-size: 1.05rem;
    }


    .pyc-mitarbeiter-profile-tabs__services,
    .pyc-mitarbeiter-profile-tabs__locations {
        grid-template-columns:
            minmax(0, 1fr);
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .pyc-mitarbeiter-profile-tabs__panel.is-active {
        animation: none;
    }

}


/* =========================================================
   PROFIL-TABS – BREITERES DESKTOP-LAYOUT
   Portrait bleibt gleich groß.
   Tabs + Informationsbereich beginnen rechts neben dem Bild.
========================================================= */

@media (min-width: 901px) {

    .pyc-mitarbeiter-profile-tabs > .container {
        width: min(
            1440px,
            calc(100% - 48px)
        );

        max-width: 1440px;

        display: grid;

        grid-template-columns:
            350px
            minmax(0, 1fr);

        grid-template-rows:
            auto
            auto;

        column-gap:
            clamp(
                3.5rem,
                5vw,
                5.5rem
            );

        align-items: start;
    }


    /*
     * Die bisherige Layout-Hülle wird aufgelöst,
     * damit Portrait, Tabs und Inhalt direkt im
     * gemeinsamen Grid platziert werden können.
     */
    .pyc-mitarbeiter-profile-tabs__layout {
        display: contents;
    }


    /* Portrait links – Größe bleibt wie bisher. */
    .pyc-mitarbeiter-profile-tabs__portrait-column {
        grid-column: 1;
        grid-row: 1 / span 2;

        width: 350px;
        min-width: 350px;
    }


    .pyc-mitarbeiter-profile-tabs__portrait-wrap {
        width: 350px;
        max-width: 350px;

        margin-left: 18px;
    }


    /* Tabs starten exakt rechts neben dem Portrait. */
    .pyc-mitarbeiter-profile-tabs__nav {
        grid-column: 2;
        grid-row: 1;

        width: 100%;

        margin:
            0
            0
            clamp(
                2.2rem,
                3vw,
                3.2rem
            );

        justify-content: flex-start;
    }


    /* Wechselnder Informationsbereich wird deutlich breiter. */
    .pyc-mitarbeiter-profile-tabs__panels {
        grid-column: 2;
        grid-row: 2;

        width: 100%;
        max-width: none;
    }


    .pyc-mitarbeiter-profile-tabs__panel {
        width: 100%;
        max-width: none;
    }


    .pyc-mitarbeiter-profile-tabs__panel-header h2,
    .pyc-mitarbeiter-profile-tabs__bio,
    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-questions__list {
        max-width: 100%;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question__answer {
        max-width: 900px;
    }


    /* Schwerpunkte dürfen die zusätzliche Breite besser nutzen. */
    .pyc-mitarbeiter-profile-tabs__services {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        width: 100%;
        max-width: none;
    }


    /* Standortkarten ebenfalls über die volle Informationsbreite. */
    .pyc-mitarbeiter-profile-tabs__locations {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        width: 100%;
        max-width: none;
    }

}


/* =========================================================
   TABLET
   Hier bleibt das bisherige responsive Verhalten erhalten.
========================================================= */

@media (max-width: 900px) {

    .pyc-mitarbeiter-profile-tabs > .container {
        display: block;
    }

    .pyc-mitarbeiter-profile-tabs__layout {
        display: grid;
    }

}


/* =========================================================
   PROFIL-TABS – STANDORTKARTEN KOMPAKTER
========================================================= */

@media (min-width: 901px) {

    .pyc-mitarbeiter-profile-tabs__locations {
        grid-template-columns:
            repeat(
                2,
                280px
            );

        justify-content: start;

        gap: 1rem;

        max-width: none;
    }


    .pyc-mitarbeiter-profile-tabs__location-card {
        width: 280px;
        max-width: 280px;
    }


    .pyc-mitarbeiter-profile-tabs__location-card
    .pyc-leistung-standort-card__image {
        aspect-ratio: 16 / 8;
    }


    .pyc-mitarbeiter-profile-tabs__location-card
    .pyc-leistung-standort-card__content {
        padding:
            0.9rem
            1rem
            0.9rem;
    }


    .pyc-mitarbeiter-profile-tabs__location-card
    .standort-eyebrow {
        margin-bottom: 0.35rem;
        font-size: 0.72rem;
    }


    .pyc-mitarbeiter-profile-tabs__location-card
    h3 {
        font-size: 1.3rem;
        line-height: 1.05;
    }

}


/* Tablet etwas kompakter */
@media (max-width: 900px) and (min-width: 521px) {

    .pyc-mitarbeiter-profile-tabs__locations {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap: 1rem;
    }

    .pyc-mitarbeiter-profile-tabs__location-card
    .pyc-leistung-standort-card__content {
        padding:
            0.9rem
            1rem;
    }

}


/* =========================================================
   PROFIL-TABS – LEISTUNGSKARTEN WIE AUF SINGLE-STANDORT
   Desktop: 4 Karten nebeneinander
========================================================= */

.pyc-mitarbeiter-profile-tabs__services.services-grid--standort {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 1.4rem;

    width: 100%;
}


/* Exaktes Kartenprinzip der Standortseite */
.pyc-mitarbeiter-profile-tabs__services.services-grid--standort
.service-card {
    position: relative;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    height: 100%;

    padding: 1.6rem 1.2rem;

    overflow: hidden;

    text-align: center;

    background: #ffffff;

    border:
        1px solid
        rgba(
            229,
            231,
            235,
            0.8
        );

    border-radius: var(--radius-lg);

    box-shadow: var(--shadow-soft);

    color: inherit;
    text-decoration: none;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


.pyc-mitarbeiter-profile-tabs__services.services-grid--standort
.service-card:hover {
    transform: translateY(-3px);
}


/* Rundes Leistungsbild */
.pyc-mitarbeiter-profile-tabs__services.services-grid--standort
.service-icon {
    width: 68px;
    height: 68px;

    margin-bottom: 0.85rem;

    display: flex;

    align-items: center;
    justify-content: center;

    overflow: hidden;

    border-radius: 50%;

    background:
        rgba(
            195,
            228,
            233,
            0.25
        );
}


.pyc-mitarbeiter-profile-tabs__services.services-grid--standort
.service-icon img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* Titel wie auf der Standortseite */
.pyc-mitarbeiter-profile-tabs__services.services-grid--standort
.service-card h3 {
    margin: 0;

    color: var(--cyan-navy);

    font-family: var(--font-body);

    font-size: 1rem;
    font-weight: 650;
    line-height: 1.25;

    text-transform: none;
    letter-spacing: normal;
}


/* =========================================================
   LEISTUNGSKARTEN – RESPONSIVE
========================================================= */

@media (max-width: 1100px) {

    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 760px) {

    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap: 0.9rem;
    }


    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort
    .service-card {
        padding:
            1.2rem
            0.8rem;
    }


    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort
    .service-icon {
        width: 55px;
        height: 55px;
    }


    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort
    .service-card h3 {
        font-size: 0.9rem;
    }

}


@media (max-width: 420px) {

    .pyc-mitarbeiter-profile-tabs__services.services-grid--standort {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


/* =========================================================
   ÜBER – FRAGEN ALS KLARE PYC-BOXEN
   Desktop: 3 Boxen nebeneinander / 2 Reihen
   Keine abgerundeten Ecken.
========================================================= */

.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-questions__list {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 1.25rem;

    width: 100%;
    max-width: none;

    border-top: 0;

    counter-reset: none;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 270px;

    padding:
        1.45rem
        1.4rem
        1.25rem;

    border:
        1px solid
        rgba(
            10,
            44,
            51,
            0.12
        );

    border-radius: 0;

    background: #ffffff;

    box-shadow:
        0 14px 34px
        rgba(
            10,
            44,
            51,
            0.055
        );

    counter-increment: none;

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease;
}


/* Kleine klare Teal-Linie statt Nummerierung. */
.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 54px;
    height: 4px;

    padding: 0;

    background: var(--pure-teal);

    color: transparent;
}


@media (hover: hover) and (pointer: fine) {

    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question:hover {
        transform: translateY(-3px);

        border-color:
            rgba(
                7,
                155,
                171,
                0.28
            );

        box-shadow:
            0 18px 42px
            rgba(
                10,
                44,
                51,
                0.09
            );
    }

}


/* =========================================================
   FRAGE
========================================================= */

.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__title {
    display: block;

    min-height: 3.95em;

    margin:
        0
        0
        1rem;

    padding: 0;

    color: var(--deep-teal);

    font-family: var(--font-body);

    font-size:
        clamp(
            1rem,
            1.05vw,
            1.13rem
        );

    font-weight: 650;
    line-height: 1.32;

    text-transform: none;
    letter-spacing: -0.01em;
}


/* =========================================================
   ANTWORT – MAXIMAL 4 ZEILEN IN DER VORSCHAU
========================================================= */

.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer {
    display: block;

    width: 100%;
    max-width: none;

    margin: 0;

    color: var(--cyan-navy);

    font-size: 0.98rem;
    line-height: 1.55;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer p {
    margin: 0;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer p + p {
    margin-top: 0.7rem;
}


.pyc-mitarbeiter-profile-tabs
.pyc-mitarbeiter-question__answer.is-collapsed {
    display: -webkit-box;

    overflow: hidden;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;

    line-clamp: 4;
}


/* =========================================================
   MEHR ANZEIGEN
========================================================= */

.pyc-mitarbeiter-question__action {
    min-height: 1.55rem;

    margin-top: auto;
    padding-top: 1rem;
}


.pyc-mitarbeiter-question__toggle {
    display: inline-flex;

    align-items: center;

    margin: 0;
    padding: 0;

    border: 0;

    background: transparent;

    color: var(--pure-teal);

    font-family: var(--font-body);
    font-size: 0.82rem;
    font-weight: 700;

    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: 0.08em;

    cursor: pointer;

    transition:
        color 0.2s ease;
}


.pyc-mitarbeiter-question__toggle::after {
    content: "→";

    margin-left: 0.4rem;

    transition:
        transform 0.2s ease;
}


.pyc-mitarbeiter-question__toggle[aria-expanded="true"]::after {
    transform: rotate(-90deg);
}


.pyc-mitarbeiter-question__toggle:hover,
.pyc-mitarbeiter-question__toggle:focus-visible {
    color: var(--deep-teal);
}


.pyc-mitarbeiter-question__toggle:focus-visible {
    outline:
        2px solid
        var(--pure-teal);

    outline-offset: 4px;
}


.pyc-mitarbeiter-question__toggle[hidden] {
    display: none !important;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1180px) {

    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-questions__list {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 760px) {

    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-questions__list {
        grid-template-columns:
            minmax(0, 1fr);

        gap: 1rem;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question {
        min-height: 0;

        padding:
            1.3rem
            1.2rem
            1.1rem;
    }


    .pyc-mitarbeiter-profile-tabs
    .pyc-mitarbeiter-question__title {
        min-height: 0;

        margin-bottom: 0.8rem;

        font-size: 1.04rem;
    }

}


/* =========================================================
   OHNE HEROBILD – NAME WIE IM HERO
   Gleiche Größe + gleicher Umbruch, aber Cyan Navy.
========================================================= */

.pyc-mitarbeiter-simple-intro
.pyc-mitarbeiter-simple-intro__title {
    color: var(--cyan-navy);
}


/* Auch mobil Cyan Navy beibehalten. */
@media (max-width: 760px) {

    .pyc-mitarbeiter-simple-intro
    .pyc-mitarbeiter-simple-intro__title {
        color: var(--cyan-navy);
    }

}