/* === Mandat-Detail (Legacy Variante B Split) === */
/* === Mandat-Detail (Variante B: Split-Screen) === */
.site-main--full {
    /* Voll-Breite-Container für Detail-Pages, ersetzt .site-main */
    width: 100%;
}

.mandat-detail {
    color: var(--color-text-primary);
    /* Padding-top weil Header fixed ist — Hero beginnt direkt darunter */
    padding-top: 60px;
}
.mandat-detail > *:last-child { margin-bottom: 0; }

/* Hero: Foto links 50%, Content rechts 50% */
.mandat-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    min-height: clamp(560px, calc(100vh - 60px), 880px);
    background: var(--fresh-dark-d);
}
@media (max-width: 820px) {
    .mandat-hero { grid-template-columns: 1fr; min-height: 0; }
    .mandat-hero__photo-wrap { min-height: 0; height: 420px; }
    .mandat-hero__photo { background-position: center 22%; }
}

.mandat-hero__photo-wrap {
    position: relative;
    overflow: visible;
}

.mandat-hero__photo {
    position: absolute;
    inset: 0;
    bottom: -28px;   /* Kerben-Regel: Foto ragt als Dreieck in die Folge-Sektion */
    background-size: cover;
    background-position: center;
    clip-path: polygon(
        0 0, 100% 0,
        100% calc(100% - 28px),
        calc(var(--notch-x, 62%) + 28px) calc(100% - 28px),
        var(--notch-x, 62%) 100%,
        calc(var(--notch-x, 62%) - 28px) calc(100% - 28px),
        0 calc(100% - 28px)
    );
    z-index: 1;
}
.mandat-hero__photo--placeholder {
    background: linear-gradient(135deg, var(--fresh-river-soft), var(--fresh-dark-a));
}

/* Stamp am Foto-Unterrand, halb auf Foto, halb in Content (Bridge) */
.mandat-hero__stamp {
    position: absolute;
    bottom: var(--space-7);
    right: 0;
    transform: translateX(40%);
    z-index: 3;
}
.mandat-hero__stamp .fresh-word--stamp {
    font-size: clamp(2.5rem, 4vw, 4rem);
    padding: 0.5rem 1.2rem 0.6rem;
}

.mandat-hero__deco {
    position: absolute;
    top: var(--space-5);
    left: var(--space-5);
    display: flex;
    gap: 4px;
    z-index: 3;
}

.mandat-hero__content {
    padding: var(--space-7) var(--space-7) var(--space-7) var(--space-9);
    background: var(--fresh-dark-d);
    color: #ffffff;
    overflow-y: auto;
}

.mandat-hero__name {
    font-weight: 800;
    font-size: clamp(2.5rem, 5vw, var(--fs-700));
    line-height: 0.95;
    margin: 0 0 var(--space-2);
    letter-spacing: -0.01em;
}

.mandat-hero__role {
    color: var(--fresh-wind);
    font-weight: 700;
    font-size: var(--fs-200);
    margin: 0 0 var(--space-6);
}

.mandat-hero__section {
    margin-top: var(--space-6);
}

.mandat-hero__section h2 {
    font-weight: 800;
    font-size: var(--fs-400);
    margin: 0 0 var(--space-3);
    color: #ffffff;
}

.mandat-hero__list,
.mandat-hero__contact-list {
    list-style: square;
    padding-left: var(--space-5);
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--fs-300);
    line-height: 1.6;
}
.mandat-hero__list li::marker,
.mandat-hero__contact-list li::marker { color: var(--fresh-wind); }


/* === Stellungnahme-Detail (Legacy) === */
/* === Stellungnahme-Detail === */
.stellungnahme-detail {
    max-width: 720px;
    margin: 0 auto;
}

.stellungnahme-detail__head {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-5);
    border-bottom: 1px solid var(--color-border-subtle);
}

.stellungnahme-detail__author {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    color: inherit;
    text-decoration: none;
}
.stellungnahme-detail__author:hover .stellungnahme-detail__name { color: var(--fresh-rose); }

.stellungnahme-detail__photo {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-md);
    object-fit: cover;
}
.stellungnahme-detail__name {
    display: block;
    font-weight: 800;
    font-size: var(--fs-400);
    line-height: 1.1;
    transition: color 200ms;
}
.stellungnahme-detail__role {
    display: block;
    font-size: var(--fs-100);
    color: var(--fresh-wind);
    font-weight: 700;
    margin-top: 2px;
}
.stellungnahme-detail__date {
    margin-left: auto;
    color: var(--color-text-tertiary);
    font-size: var(--fs-200);
}

.stellungnahme-detail__body {
    font-size: var(--fs-400);
    line-height: 1.55;
}
.stellungnahme-detail__body p:first-child {
    font-size: var(--fs-500);
    color: var(--color-text-secondary);
    line-height: 1.4;
}


/* === Erfahrung-Detail === */
/* === Erfahrung-Detail === */
.erfahrung-detail {
    max-width: 720px;
    margin: var(--space-7) auto;
    text-align: center;
}
.erfahrung-detail__photo {
    width: 200px;
    height: 200px;
    border-radius: var(--radius-md);
    object-fit: cover;
    margin: 0 auto var(--space-5);
    box-shadow: var(--shadow-card);
}
.erfahrung-detail__quote {
    font-weight: 700;
    font-size: var(--fs-600);
    line-height: 1.1;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-5);
}
.erfahrung-detail__meta {
    color: var(--color-text-secondary);
    font-size: var(--fs-300);
    margin: 0;
}


/* === Inverted-Body / Mitmachen-Plakat === */
/* === Inverted-Body (weiß für Mitmachen-Style) === */
.inverted-body {
    background: #ffffff;
    color: var(--fresh-dark-d);
}
.inverted-body strong { color: var(--fresh-dark-d); font-weight: 800; }

/* Mitmachen-Lead */
.mitmachen-lead {
    background: #ffffff;
    padding: var(--space-8) var(--space-6);
}
.mitmachen-lead__inner {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-6);
    align-items: center;
}
.mitmachen-lead__text {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(1.6rem, 3vw, var(--fs-500));
    line-height: 1.2;
    color: var(--fresh-dark-d);
    margin: 0;
}
.mitmachen-lead__triple-tri {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

/* Mitmachen Steps */
.mitmachen-steps {
    background: var(--fresh-dark-d);
    color: #ffffff;
    padding: var(--space-8) var(--space-6);
    position: relative;
    overflow: hidden;
}
.mitmachen-steps::before,
.mitmachen-steps::after {
    content: '';
    position: absolute;
    background: var(--fresh-rose);
    width: 200px;
    height: 200px;
}
.mitmachen-steps::before {
    top: 0; left: 0;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}
.mitmachen-steps::after {
    bottom: 0; right: 0;
    background: var(--fresh-wind);
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

.mitmachen-steps__head {
    max-width: 1100px;
    margin: 0 auto var(--space-7);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    z-index: 1;
}
.mitmachen-steps__eyebrow {
    background: #ffffff;
    color: var(--fresh-dark-d);
    padding: 0.35rem 0.75rem 0.4rem;
    font-weight: 700;
    font-size: var(--fs-200);
    margin-left: var(--space-4);
    margin-bottom: -0.5rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.mitmachen-steps__title { display: inline-block; }
.mitmachen-steps__title .fresh-word--stamp {
    font-size: clamp(2rem, 4vw, var(--fs-600));
    padding: 0.55rem 1.2rem 0.65rem;
}

.mitmachen-steps__grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: var(--space-5);
    align-items: start;
    position: relative;
    z-index: 1;
}
@media (max-width: 860px) {
    .mitmachen-steps__grid { grid-template-columns: 1fr; }
    .mitmachen-step__arrow { transform: rotate(90deg); justify-self: start; margin-left: var(--space-6); }
}

/* Entboxt: Schritte stehen frei, Pfeile verbinden den Prozess */
.mitmachen-step {
    padding: var(--space-4) 0;
    display: block;
    text-decoration: none;
    color: inherit;
    border-radius: var(--radius-md);
    transition: transform 220ms ease, background 220ms ease, box-shadow 220ms ease;
}
.mitmachen-step--link {
    padding: var(--space-4) var(--space-4);
    margin: 0 calc(-1 * var(--space-4));
    cursor: pointer;
}
.mitmachen-step--link:hover {
    background: var(--color-bg-elevated);
    transform: translateY(-3px);
    box-shadow: var(--shadow-card);
}
.mitmachen-step__cta {
    display: inline-block;
    margin-top: var(--space-4);
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.35rem 0.75rem 0.4rem;
    font-weight: 800;
    font-size: var(--fs-200);
    letter-spacing: 0.05em;
    box-shadow: var(--shadow-sticker);
}
.mitmachen-step--link:hover .mitmachen-step__cta { background: var(--fresh-rose-light); }
.mitmachen-step__arrow {
    align-self: center;
    display: flex;
    gap: 4px;
    opacity: 0.9;
}
.mitmachen-step__num {
    font-size: 5rem;
    font-weight: 900;
    line-height: 0.8;
    color: var(--fresh-rose);
    margin-bottom: var(--space-3);
}
.mitmachen-step__title {
    font-weight: 800;
    font-size: var(--fs-500);
    margin: 0 0 var(--space-3);
    color: #ffffff;
}
.mitmachen-step__body {
    font-size: var(--fs-300);
    color: var(--color-text-secondary);
    line-height: 1.5;
    margin: 0;
}

/* Stammtisch-Hinweis */
.mitmachen-stammtisch {
    background: #ffffff;
    padding: var(--space-9) var(--space-6);
    text-align: center;
}
.mitmachen-stammtisch__inner {
    max-width: 720px;
    margin: 0 auto;
}
.mitmachen-stammtisch__eyebrow {
    display: inline-block;
    background: var(--fresh-wind);
    color: #ffffff;
    padding: 0.35rem 0.75rem 0.4rem;
    font-weight: 700;
    font-size: var(--fs-200);
    margin-bottom: var(--space-3);
    --rot: -1.5deg;
    box-shadow: var(--shadow-sticker);
}
.mitmachen-stammtisch__title {
    font-weight: 800;
    font-size: clamp(2rem, 5vw, var(--fs-700));
    line-height: 0.95;
    color: var(--fresh-dark-d);
    margin: 0 0 var(--space-4);
}
.mitmachen-stammtisch__body {
    font-size: var(--fs-400);
    color: var(--fresh-dark-a);
    line-height: 1.5;
    margin: 0 0 var(--space-5);
}
.mitmachen-stammtisch__cta {
    display: inline-block;
    background: var(--fresh-dark-d);
    color: #ffffff;
    padding: 0.6rem 1.2rem 0.7rem;
    text-decoration: none;
    font-weight: 800;
    font-size: var(--fs-300);
    box-shadow: var(--shadow-sticker);
    transition: background 200ms;
}
.mitmachen-stammtisch__cta:hover { background: var(--fresh-rose); }

/* Voices-Section */
.mitmachen-voices {
    background: var(--fresh-dark-d);
    padding: var(--space-9) var(--space-6);
}
.mitmachen-voices__head {
    max-width: 1100px;
    margin: 0 auto var(--space-7);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.mitmachen-voices__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.35rem 0.75rem 0.4rem;
    font-weight: 700;
    font-size: var(--fs-200);
    margin-left: var(--space-4);
    margin-bottom: -0.5rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.mitmachen-voices__title { display: inline-block; }
.mitmachen-voices__title .fresh-word--sticker {
    font-size: clamp(2rem, 4vw, var(--fs-600));
    padding: 0.55rem 1.2rem 0.65rem;
}

.voices-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-5);
}

/* FAQ-Section */
.mitmachen-faq {
    background: #ffffff;
    padding: var(--space-9) var(--space-6);
}
.mitmachen-faq__head {
    max-width: 800px;
    margin: 0 auto var(--space-6);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.mitmachen-faq__eyebrow {
    background: var(--fresh-dark-d);
    color: #ffffff;
    padding: 0.35rem 0.75rem 0.4rem;
    font-weight: 700;
    font-size: var(--fs-200);
    margin-left: var(--space-4);
    margin-bottom: -0.5rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.mitmachen-faq__title { display: inline-block; }
.mitmachen-faq__title .fresh-word--stamp {
    font-size: clamp(2rem, 4vw, var(--fs-600));
    padding: 0.55rem 1.2rem 0.65rem;
}

@media (max-width: 768px) {
    .mitmachen-lead__inner { grid-template-columns: 1fr; }
}


/* === Landing-Page === */
/* === Landing-Page === */
.home-hero {
    position: relative;
    width: 100%;
    height: 88vh;
    min-height: 580px;
    max-height: 880px;
    margin-top: calc(-1 * var(--space-7));  /* bleed bis Viewport-Oberkante */
    overflow: hidden;
    /* Kerbe kommt von der Folge-Sektion (Peek-Stack) — Regel: Kerbe gehört
       zur oberen Sektion, d.h. das sichtbare Dreieck zeigt diese Sektion */
}
.home-hero__photo {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transform: scale(1.05);
}
.home-hero__gradient {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 80% 60% at 50% 40%, rgba(5,10,13,0.05) 0%, rgba(5,10,13,0.55) 100%),
        linear-gradient(to bottom, rgba(5,10,13,0.30) 0%, rgba(5,10,13,0.10) 40%, rgba(5,10,13,0.85) 100%);
}
.home-hero__content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
    padding: 18vh var(--space-6) var(--space-7);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
}
.home-hero__mark {
    width: 88px;
    height: 88px;
    filter: drop-shadow(0 4px 12px rgba(0,0,0,0.5));
}
.home-hero__claim {
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.02em;
    margin: 0;
    color: #ffffff;
    text-shadow: 0 4px 22px rgba(0,0,0,0.55);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.home-hero__claim-line {
    display: inline-block;
    padding: 0.05em 0.6rem 0.15em;
}
.home-hero__claim-line--1 {
    background: rgba(5,10,13,0.7);
    font-size: clamp(2.4rem, 6vw, 4.6rem);
}
.home-hero__claim-line--2 {
    background: var(--fresh-rose);
    font-size: clamp(2.8rem, 8vw, 6rem);
    transform: rotate(-1.2deg);
}
.home-hero__sub {
    font-size: var(--fs-400);
    color: rgba(255,255,255,0.88);
    margin: 0;
    letter-spacing: 0.04em;
    text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.home-hero__deco { display: flex; gap: 12px; margin-top: var(--space-3); }

/* „Du willst..." Pfade */
.home-paths {
    max-width: 1200px;
    margin: var(--space-9) auto var(--space-8);
    padding: 0 var(--space-6);
}
.home-paths__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: var(--space-6);
}
.home-paths__eyebrow {
    background: var(--fresh-river-mid);
    color: #ffffff;
    padding: 0.25rem 0.6rem 0.3rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
    margin-left: var(--space-3);
    margin-bottom: -0.4rem;
    position: relative;
    z-index: 2;
}
.home-paths__title {
    background: #ffffff;
    color: var(--fresh-dark-d);
    padding: 0.4rem 1rem 0.5rem;
    margin: 0;
    font-size: clamp(2rem, 5vw, 3.4rem);
    box-shadow: var(--shadow-sticker);
    display: inline-block;
}
.home-paths__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-5);
    margin-top: var(--space-6);
}
/* Plakat-Panels: Vollfarbe statt Card, 45°-Schnittecke als Markengeometrie */
.home-path {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-6);
    text-decoration: none;
    position: relative;
    min-height: 260px;
    border-radius: 0;
    /* 45°-Ecke oben rechts abgeschnitten (Logo-Dreieck) */
    clip-path: polygon(0 0, calc(100% - 56px) 0, 100% 56px, 100% 100%, 0 100%);
    transition: transform 220ms ease, filter 220ms ease;
}
.home-path--rose  { background: var(--fresh-rose);  color: #ffffff; }
.home-path--wind  { background: var(--fresh-wind);  color: var(--fresh-dark-d); }
.home-path--river { background: var(--fresh-river); color: #ffffff; }
/* mittleres Panel: Schnitt unten links — bewusste Asymmetrie */
.home-path--wind {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 56px 100%, 0 calc(100% - 56px));
}
.home-path:hover {
    transform: translateY(-4px);
    filter: brightness(1.06);
}
.home-path__num {
    font-size: var(--fs-700);
    font-weight: 800;
    line-height: 0.9;
    color: currentColor;
    opacity: 0.34;
    letter-spacing: -0.02em;
}
.home-path__title {
    color: currentColor;
    font-size: var(--fs-500);
    font-weight: 800;
    margin: 0;
    line-height: 1.05;
}
.home-path__body {
    color: currentColor;
    opacity: 0.82;
    margin: 0;
    line-height: 1.5;
    flex: 1;
    font-weight: 600;
}
.home-path__cta {
    color: currentColor;
    font-size: var(--fs-300);
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-top: auto;
}

/* Aktuelles Grid (Vorhaben/Erfolg/Stellungnahme) */
.home-aktuell-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-5);
}

/* Stimmen-Strip auf Home: nur 3, optisch klar als Vorschau */
.home-stimmen-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

/* Footer-CTA */
.home-cta {
    background:
        linear-gradient(135deg, rgba(229,0,70,0.05), rgba(54,201,197,0.05)),
        var(--color-bg-section-c);
    padding: var(--space-9) var(--space-6);
    margin-top: 0;
    position: relative;
    overflow: hidden;
    /* 45°-Kerbe oben mittig — Logo-Geometrie als Sektionsübergang */
    clip-path: polygon(0 0, calc(50% - 48px) 0, 50% 48px, calc(50% + 48px) 0, 100% 0, 100% 100%, 0 100%);
}
.home-cta__inner {
    position: relative;
    z-index: 1;
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
}
.home-cta__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.25rem 0.7rem 0.3rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.home-cta__title {
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-weight: 800;
    margin: 0;
    line-height: 1.05;
    color: #ffffff;
}
.home-cta__sub {
    color: var(--color-text-secondary);
    font-size: var(--fs-400);
    margin: 0;
    max-width: 620px;
}
.home-cta .kontakt-channels__list {
    max-width: 720px;
    margin-top: var(--space-3);
    width: 100%;
}

@media (max-width: 768px) {
    .home-hero { height: 78vh; min-height: 460px; }
    .home-hero__content { padding-top: 12vh; }
    .home-hero__mark { width: 64px; height: 64px; }
}


/* === Vorhaben-Detail A + B === */
/* === Vorhaben-Detail Variante A — Editorial Long-Read === */
.vorhaben-detail { padding: 0; }
.vorhaben-a-hero {
    position: relative;
    width: 100%;
    height: 60vh;
    min-height: 380px;
    max-height: 600px;
    margin-top: calc(-1 * var(--space-7));
    overflow: visible;
}
.vorhaben-a-hero__photo {
    position: absolute; inset: 0;
    bottom: -28px;   /* Kerben-Regel: Foto ragt als Dreieck in den Content */
    background-size: cover;
    background-position: center;
    background-color: var(--fresh-river);
    clip-path: polygon(
        0 0, 100% 0,
        100% calc(100% - 28px),
        calc(var(--notch-x, 30%) + 28px) calc(100% - 28px),
        var(--notch-x, 30%) 100%,
        calc(var(--notch-x, 30%) - 28px) calc(100% - 28px),
        0 calc(100% - 28px)
    );
}
.vorhaben-a-hero__photo--placeholder { background: linear-gradient(135deg, var(--fresh-river-soft), var(--fresh-dark-a)); }
.vorhaben-a-hero__gradient {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, rgba(5,10,13,0.30) 0%, rgba(5,10,13,0.05) 35%, rgba(5,10,13,0.6) 100%);
}
.vorhaben-a-hero__bridge {
    position: absolute;
    left: max(var(--space-6), 50% - 600px + var(--space-6));
    bottom: 0;
    transform: translateY(40%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: calc(100% - var(--space-7));
}
.vorhaben-a-hero__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    margin-left: 0.6rem;
    margin-bottom: -0.4rem;
    --rot: -2deg;
    box-shadow: var(--shadow-sticker);
    position: relative;
    z-index: 4;
}
.vorhaben-a-hero__title {
    background: #ffffff;
    color: var(--fresh-dark-d);
    padding: 0.55rem 1.1rem 0.7rem;
    font-size: clamp(1.6rem, 4.5vw, 3rem);
    font-weight: 800;
    line-height: 1.05;
    box-shadow: var(--shadow-sticker);
    max-width: 100%;
    margin: 0;
    --rot: -1deg;
    transform: rotate(var(--rot));
    transform-origin: left center;
}

/* Status-Track unter Hero — große Pfeile */
.vorhaben-a-track-wrap {
    max-width: 1100px;
    margin: var(--space-7) auto var(--space-6);
    padding: 0 var(--space-6);
}
.vorhaben-a-track {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 6px;
}
.vorhaben-a-track__step {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: var(--space-2) var(--space-3) var(--space-2) 0;
    flex: 1 1 0;
    min-width: 160px;
}
.vorhaben-a-track__tri.tri--arrow-right.tri--md { width: 16px; height: 32px; }
.vorhaben-a-track__step--done .vorhaben-a-track__tri    { color: #ffffff; }
.vorhaben-a-track__step--future .vorhaben-a-track__tri  { color: rgba(255,255,255,0.18); }
.vorhaben-a-track__step--current.vorhaben-a-track__step--accent-rose  .vorhaben-a-track__tri { color: var(--fresh-rose); }
.vorhaben-a-track__step--current.vorhaben-a-track__step--accent-wind  .vorhaben-a-track__tri { color: var(--fresh-wind); }
.vorhaben-a-track__step--current.vorhaben-a-track__step--accent-river .vorhaben-a-track__tri { color: var(--fresh-river-light); }
.vorhaben-a-track__label {
    font-size: var(--fs-200);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.vorhaben-a-track__step--done .vorhaben-a-track__label    { color: var(--color-text-secondary); }
.vorhaben-a-track__step--future .vorhaben-a-track__label  { color: var(--color-text-tertiary); }
.vorhaben-a-track__step--current .vorhaben-a-track__label { color: #ffffff; font-size: var(--fs-300); }

/* 2-Spalter Body + Sticky Side */
.vorhaben-a-layout {
    max-width: 1100px;
    margin: var(--space-7) auto var(--space-9);
    padding: 0 var(--space-6);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: var(--space-7);
    align-items: start;
}
.vorhaben-a-body { font-size: var(--fs-400); line-height: 1.65; }
.vorhaben-a-body h2 { font-size: var(--fs-500); margin: var(--space-6) 0 var(--space-3); }
.vorhaben-a-body h3 { font-size: var(--fs-400); margin: var(--space-5) 0 var(--space-2); }
.vorhaben-a-body p { margin: 0 0 var(--space-4); }
.vorhaben-a-side {
    position: sticky;
    top: var(--space-9);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}
.vorhaben-a-side__block {
    background: var(--color-bg-surface);
    border-left: 3px solid var(--fresh-rose);
    padding: var(--space-3) var(--space-4);
}
.vorhaben-a-side__label {
    display: block;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    color: var(--fresh-river-light);
    margin: 0 0 var(--space-2);
}
.vorhaben-a-side__lead { color: #ffffff; font-size: var(--fs-300); line-height: 1.45; margin: 0; }
.vorhaben-a-side__list { list-style: square; padding-left: var(--space-4); margin: 0; color: var(--color-text-secondary); }
.vorhaben-a-side__tags { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.vorhaben-a-side__tags a {
    color: var(--fresh-wind);
    text-decoration: none;
    font-size: var(--fs-200);
    font-weight: 600;
}
.vorhaben-a-side__date { color: var(--color-text-secondary); font-size: var(--fs-300); }

@media (max-width: 900px) {
    .vorhaben-a-layout { grid-template-columns: 1fr; }
    .vorhaben-a-side { position: static; }
}

/* === Vorhaben-Detail Variante B — Tape-Reel === */
.vorhaben-b-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 60vh;
    margin-top: calc(-1 * var(--space-7));
}
.vorhaben-b-hero__photo { position: relative; overflow: hidden; background: var(--fresh-river); }
.vorhaben-b-hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vorhaben-b-hero__placeholder { background: linear-gradient(135deg, var(--fresh-river-soft), var(--fresh-dark-a)); width: 100%; height: 100%; }
.vorhaben-b-hero__text {
    padding: var(--space-9) var(--space-6) var(--space-7);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--space-4);
    background: var(--color-bg-section-b);
}
.vorhaben-b-hero__eyebrow {
    align-self: flex-start;
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.vorhaben-b-hero__title {
    margin: 0;
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 800;
    line-height: 1.0;
    color: #ffffff;
    letter-spacing: -0.02em;
}
.vorhaben-b-hero__desc { font-size: var(--fs-400); color: var(--color-text-secondary); margin: 0; }
.vorhaben-b-hero__meta { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.vorhaben-b-hero__chip {
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.85);
    padding: 0.25rem 0.6rem;
    border-radius: var(--radius-sm);
    font-size: var(--fs-100);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.vorhaben-b-hero__topic { color: var(--fresh-wind); text-decoration: none; font-size: var(--fs-200); font-weight: 600; }

.vorhaben-b-body {
    max-width: 720px;
    margin: var(--space-8) auto var(--space-8);
    padding: 0 var(--space-6) var(--space-9);
}
.vorhaben-b-body__inner { font-size: var(--fs-400); line-height: 1.65; }
.vorhaben-b-body__inner h2 { font-size: var(--fs-500); margin: var(--space-6) 0 var(--space-3); }
.vorhaben-b-body__inner h3 { font-size: var(--fs-400); margin: var(--space-5) 0 var(--space-2); }

/* Sticky Status-Footer-Bar */
.vorhaben-b-statusbar {
    position: sticky;
    bottom: 0;
    z-index: 80;
    background: rgba(10,17,20,0.94);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--color-border-glass);
    padding: var(--space-3) var(--space-4);
}
.vorhaben-b-statusbar__inner {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: var(--space-4);
    flex-wrap: wrap;
}
.vorhaben-b-statusbar__label { color: var(--fresh-river-light); font-size: var(--fs-100); letter-spacing: 0.08em; }
.vorhaben-b-statusbar__track {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
}
.vorhaben-b-statusbar__step {
    font-size: var(--fs-200);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0.2rem 0.55rem 0.3rem;
    border-radius: 2px;
}
.vorhaben-b-statusbar__step--done    { color: rgba(255,255,255,0.4); }
.vorhaben-b-statusbar__step--future  { color: rgba(255,255,255,0.25); }
.vorhaben-b-statusbar__step--current { color: #ffffff; background: var(--fresh-rose); }
.vorhaben-b-statusbar__step--current { color: #ffffff; background: var(--fresh-river-mid); }

@media (max-width: 768px) {
    .vorhaben-b-hero { grid-template-columns: 1fr; }
    .vorhaben-b-hero__photo { min-height: 240px; }
}


/* === Stellungnahme-Detail A + B === */
/* === Stellungnahme-Detail Variante A — Op-Ed === */
.stellungnahme-detail { padding: 0; }
.stellungnahme-a {
    max-width: 680px;
    margin: var(--space-7) auto var(--space-9);
    padding: 0 var(--space-6);
}
.stellungnahme-a__head { margin-bottom: var(--space-6); display: flex; flex-direction: column; gap: var(--space-3); }
.stellungnahme-a__eyebrow {
    align-self: flex-start;
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.stellungnahme-a__title {
    font-size: clamp(2rem, 5vw, 3.4rem);
    font-weight: 800;
    line-height: 1.05;
    margin: 0;
    color: #ffffff;
}
.stellungnahme-a__lead {
    font-size: var(--fs-400);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
}
.stellungnahme-a__byline {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    border-top: 1px solid var(--color-border-subtle);
    border-bottom: 1px solid var(--color-border-subtle);
    padding: var(--space-3) 0;
    margin-top: var(--space-3);
    flex-wrap: wrap;
}
.stellungnahme-a__author {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    text-decoration: none;
    color: inherit;
}
.stellungnahme-a__author-photo {
    width: 52px; height: 52px;
    object-fit: cover;
    object-position: center top;
    border-radius: 50%;
    background: var(--fresh-river-mid);
}
.stellungnahme-a__author-photo--placeholder { display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.75); font-size: var(--fs-400); }
.stellungnahme-a__author-text { display: flex; flex-direction: column; }
.stellungnahme-a__author-name { font-weight: 800; font-size: var(--fs-300); color: #ffffff; }
.stellungnahme-a__author-role { font-size: var(--fs-100); letter-spacing: 0.06em; color: var(--fresh-river-light); }
.stellungnahme-a__date { color: var(--color-text-tertiary); font-size: var(--fs-200); margin-left: auto; }

.stellungnahme-a__body { font-size: var(--fs-400); line-height: 1.7; }
.stellungnahme-a__body h2 { font-size: var(--fs-500); margin: var(--space-6) 0 var(--space-3); color: #ffffff; }
.stellungnahme-a__body h3 { font-size: var(--fs-400); margin: var(--space-5) 0 var(--space-2); color: #ffffff; }
.stellungnahme-a__body p { margin: 0 0 var(--space-4); color: var(--color-text-secondary); }
.stellungnahme-a__body strong { color: #ffffff; }
.stellungnahme-a__related { margin-top: var(--space-8); }
.stellungnahme-a__related-eyebrow {
    background: var(--fresh-wind);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    --rot: -2deg;
    display: inline-block;
}

/* === Stellungnahme-Detail Variante B — Split === */
.stellungnahme-b {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: var(--space-7);
    max-width: 1200px;
    margin: var(--space-7) auto var(--space-9);
    padding: 0 var(--space-6);
    align-items: start;
}
.stellungnahme-b__side {
    position: sticky;
    top: var(--space-8);
}
.stellungnahme-b__side-inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    background: var(--color-bg-surface);
    padding: var(--space-5);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border-subtle);
}
.stellungnahme-b__photo {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center top;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--fresh-river-soft), var(--fresh-river));
}
.stellungnahme-b__photo--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.55);
    font-size: 3rem;
    font-weight: 800;
}
.stellungnahme-b__author-name { font-size: var(--fs-400); font-weight: 800; color: #ffffff; }
.stellungnahme-b__author-role { font-size: var(--fs-100); letter-spacing: 0.06em; color: var(--fresh-river-light); }
.stellungnahme-b__divider { display: flex; gap: 4px; align-items: center; }
.stellungnahme-b__date { color: var(--color-text-secondary); font-size: var(--fs-200); }
.stellungnahme-b__topics { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.stellungnahme-b__topics a { color: var(--fresh-wind); text-decoration: none; font-size: var(--fs-200); font-weight: 600; }
.stellungnahme-b__share-label { font-size: var(--fs-100); color: var(--fresh-river-light); letter-spacing: 0.08em; margin-top: var(--space-2); }
.stellungnahme-b__share { list-style: none; padding: 0; margin: 0; display: flex; gap: 8px; }

.stellungnahme-b__main { max-width: 720px; min-width: 0; }
.stellungnahme-b__head { margin-bottom: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.stellungnahme-b__eyebrow {
    align-self: flex-start;
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
}
.stellungnahme-b__title {
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-weight: 800;
    line-height: 1.0;
    margin: 0;
    color: #ffffff;
    letter-spacing: -0.02em;
}
.stellungnahme-b__lead {
    font-size: var(--fs-400);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.5;
    padding-left: var(--space-4);
    border-left: 3px solid var(--fresh-rose);
}
.stellungnahme-b__body { font-size: var(--fs-400); line-height: 1.7; }
.stellungnahme-b__body h2 { font-size: var(--fs-500); margin: var(--space-6) 0 var(--space-3); color: #ffffff; }
.stellungnahme-b__body p { margin: 0 0 var(--space-4); color: var(--color-text-secondary); }
.stellungnahme-b__body strong { color: #ffffff; }
.stellungnahme-b__related { margin-top: var(--space-7); }
.stellungnahme-b__related-label { display: block; font-size: var(--fs-100); color: var(--fresh-river-light); letter-spacing: 0.08em; margin-bottom: var(--space-3); }

@media (max-width: 900px) {
    .stellungnahme-b { grid-template-columns: 1fr; }
    .stellungnahme-b__side { position: static; }
}


/* === Mandat-Detail Fullhero === */
/* === Mandat-Detailseite: Foto-Hero bis Top, Themen mit Icons, dezentes Zitat === */
.mandat-detail-main { padding: 0; }
.mandat-detail { color: #ffffff; }

.mandat-fullhero {
    position: relative;
    width: 100%;
    height: 76vh;
    min-height: 480px;
    max-height: 820px;
    margin-top: calc(-1 * var(--space-7));  /* eats site-main top padding so photo bleeds to viewport edge */
    overflow: visible;
}
.mandat-fullhero__photo {
    position: absolute;
    inset: 0;
    background-color: var(--fresh-river);
    background-image: linear-gradient(135deg, var(--fresh-river-soft), var(--fresh-dark-a));
    background-size: cover;
    background-position: center 30%;
    background-repeat: no-repeat;
}
.mandat-fullhero__photo--placeholder {
    background: linear-gradient(135deg, var(--fresh-river-mid), var(--fresh-dark-c));
}
.mandat-fullhero__gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(5,10,13,0.55) 0%,
        rgba(5,10,13,0.10) 25%,
        rgba(5,10,13,0.10) 65%,
        rgba(5,10,13,0.85) 100%
    );
    pointer-events: none;
}
.mandat-fullhero__sticker-bridge {
    position: absolute;
    left: max(var(--space-6), 50% - 600px + var(--space-6));
    bottom: 0;
    transform: translateY(40%);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    z-index: 4;
    max-width: calc(100% - var(--space-7));
}
.mandat-fullhero__firstname-sticker {
    background: var(--fresh-river-mid);
    color: #ffffff;
    padding: 0.3rem 0.7rem 0.36rem;
    font-weight: 700;
    font-size: var(--fs-300);
    letter-spacing: 0.02em;
    margin-left: 0.6rem;
    margin-bottom: -0.4rem;
    --rot: -2deg;
    z-index: 4;
    box-shadow: var(--shadow-sticker);
}
.mandat-fullhero__lastname-sticker {
    background: #ffffff;
    color: var(--fresh-dark-d);
    padding: 0.6rem 1.2rem 0.7rem;
    font-weight: 800;
    font-size: clamp(2.4rem, 6vw, 4.6rem);
    text-transform: uppercase;
    line-height: 1;
    --rot: -1.5deg;
    z-index: 3;
    box-shadow: var(--shadow-sticker);
}
.mandat-fullhero__role {
    margin-top: var(--space-3);
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.3rem 0.7rem 0.35rem;
    font-size: var(--fs-200);
    letter-spacing: 0.06em;
    box-shadow: var(--shadow-sticker);
    align-self: flex-start;
}

@media (max-width: 768px) {
    .mandat-fullhero { height: 62vh; min-height: 360px; }
    .mandat-fullhero__sticker-bridge { left: var(--space-4); right: var(--space-4); max-width: calc(100% - var(--space-6)); }
}

/* Themen-Section auf der Detail-Page — full-bleed für die Flächen-Bänder,
   nur der Header bleibt im Content-Maß */
.mandat-themen-section {
    margin: 0;
}
.mandat-themen-section__head {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 var(--space-6);
}
.mandat-themen-section__head { margin-bottom: var(--space-6); display: flex; flex-direction: column; align-items: flex-start; }
.mandat-themen-section__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    padding: 0.22rem 0.6rem 0.28rem;
    font-size: var(--fs-100);
    letter-spacing: 0.06em;
    margin-left: var(--space-3);
    margin-bottom: -0.4rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
    position: relative;
    z-index: 2;
}
.mandat-themen-section__title { display: inline-block; }
.mandat-themen-section__title .fresh-word--sticker {
    font-size: clamp(2rem, 4.5vw, 3.4rem);
    padding: 0.5rem 1rem 0.6rem;
}

.mandat-themen-list { display: flex; flex-direction: column; gap: 0; }

/* ===== Variante "flaechen" (Default): 2 horizontale Flächen je Band,
   schmal (Icon) / breit (Text) alternierend — Echo der alten Website.
   Band-Farbe via --band (aus Frontmatter bg), Icon-Fläche automatisch
   dunkler abgesetzt. Kerbe wandert mit der Icon-Seite. ===== */
.mandat-thema {
    display: grid;
    grid-template-columns: 38fr 62fr;
    min-height: clamp(320px, 46vh, 520px);
    position: relative;
    background: var(--band, var(--fresh-dark-c));
    --notch-x: 20%;
}
.mandat-thema--reverse { grid-template-columns: 62fr 38fr; --notch-x: 80%; }
.mandat-thema--reverse .mandat-thema__visual { order: 2; }

/* Kerben-Regel: das Band ragt in SEINER Farbe als Dreieck ins nächste —
   die Kerbe gehört zur oberen Sektion. Position folgt der Icon-Seite. */
.mandat-thema::after {
    content: '';
    position: absolute;
    top: 100%;
    left: calc(var(--notch-x, 20%) - 28px);
    border-left: 28px solid transparent;
    border-right: 28px solid transparent;
    /* Kerbe sitzt unter der Icon-Fläche, die um 22% abgedunkelt ist —
       Dreieck bekommt denselben Shade, nicht die reine Band-Farbe */
    border-top: 28px solid color-mix(in srgb, var(--band, var(--fresh-dark-c)) 78%, black);
    z-index: 2;
    pointer-events: none;
}

.mandat-thema__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-7) var(--space-6);
}
/* Icon-Fläche: gleiche Band-Farbe, dunkler abgesetzt (2-Flächen-Look) */
.mandat-thema__visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.22);
}
.mandat-thema__visual img {
    position: relative;
    width: min(260px, 60%);
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(0,0,0,0.3));
    transform-origin: bottom center;
    transition: transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.mandat-thema:hover .mandat-thema__visual img,
.mandat-thema.is-scrollhover .mandat-thema__visual img { transform: scale(1.12) translateY(-3%); }

.mandat-thema__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: var(--space-8) clamp(var(--space-6), 6vw, var(--space-9));
    max-width: 720px;
}
.mandat-thema__title { font-size: clamp(1.8rem, 3.5vw, var(--fs-600)); font-weight: 800; margin: 0 0 var(--space-4); line-height: 1; }
.mandat-thema__body  { color: rgba(255,255,255,0.78); line-height: 1.65; }
.mandat-thema__body p { margin: 0 0 var(--space-2); }
.mandat-thema__body ul { list-style: square; padding-left: var(--space-5); }

/* ===== Variante "szenen": eine Szene pro Thema, zentriert, Gradient,
   Kerbe wandernd — Landing-Page-Ästhetik ===== */
.mandat-themen-list--szenen .mandat-thema,
.mandat-themen-list--szenen .mandat-thema--reverse {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: clamp(420px, 62vh, 640px);
    background: linear-gradient(165deg, var(--band, var(--fresh-dark-c)) 0%, var(--fresh-dark-omega) 130%);
}
.mandat-themen-list--szenen .mandat-thema--reverse {
    background: linear-gradient(15deg, var(--band, var(--fresh-dark-c)) 0%, var(--fresh-dark-omega) 130%);
}
.mandat-themen-list--szenen .mandat-thema__visual { padding: 0 0 var(--space-4); order: 0; }
.mandat-themen-list--szenen .mandat-thema__visual::before { display: none; }
.mandat-themen-list--szenen .mandat-thema__visual img { width: min(200px, 40vw); }
.mandat-themen-list--szenen .mandat-thema__text {
    padding: 0 var(--space-6) var(--space-8);
    max-width: 640px;
    align-items: center;
}

@media (max-width: 640px) {
    .mandat-thema, .mandat-thema--reverse { grid-template-columns: 1fr; }
    .mandat-thema__visual { max-width: 120px; }
    .mandat-thema--reverse .mandat-thema__visual { order: 0; }
}

/* Zitat dezent + spielerisch — wie eine Notiz am Rand */
.mandat-quote-aside {
    max-width: 540px;
    margin: var(--space-7) auto var(--space-7) calc(var(--space-7) + 12vw);
    position: relative;
    padding: var(--space-4) var(--space-5);
    background: var(--color-bg-elevated);
    border-left: 4px solid var(--fresh-wind);
    transform: rotate(-0.8deg);
    box-shadow: 0 4px 14px rgba(0,0,0,0.25);
}
.mandat-quote-aside__mark {
    position: absolute;
    top: -22px;
    left: -8px;
    font-size: 3.6rem;
    font-weight: 900;
    line-height: 1;
    color: var(--fresh-wind);
}
.mandat-quote-aside__text {
    margin: 0;
    padding: 0;
    font-size: var(--fs-400);
    font-style: italic;
    color: #ffffff;
    line-height: 1.35;
    font-weight: 600;
}
.mandat-quote-aside__attr {
    display: block;
    margin-top: var(--space-2);
    font-size: var(--fs-200);
    color: var(--fresh-river-light);
    letter-spacing: 0.03em;
}
@media (max-width: 768px) { .mandat-quote-aside { margin-left: var(--space-5); margin-right: var(--space-5); } }

/* Kontakt-Icons als runde Quadrate (wiederverwendet site-footer__social-link) */
.mandat-contact-section {
    max-width: 1100px;
    margin: var(--space-7) auto var(--space-9);
    padding: 0 var(--space-6);
}
.mandat-contact-icons {
    list-style: none;
    padding: 0;
    margin: var(--space-3) 0 0;
    display: flex;
    gap: var(--space-3);
    flex-wrap: wrap;
}
.mandat-contact-icons .site-footer__social-link {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-md);
}


/* === Unterstützen — editorial Look (PayPal/IBAN Diptychon, Förder-Sticker, Mithelfen-Liste, Quittung-Strips) === */

/* Diptychon-Grid */
.spenden-diptychon {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: var(--space-6);
}

/* Card: dunkles Surface, große Nummer, fresh.{wort}-ähnlicher Titel */
.spenden-card {
    position: relative;
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border-subtle);
    padding: var(--space-7) var(--space-6) var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    transition: background 200ms ease, border-color 200ms ease;
}
.spenden-card:hover { border-color: var(--fresh-river-mid); }

.spenden-card__num {
    position: absolute;
    top: var(--space-4);
    right: var(--space-5);
    font-size: clamp(3rem, 6vw, 5rem);
    font-weight: 800;
    color: var(--fresh-river-mid);
    opacity: 0.55;
    line-height: 0.85;
    letter-spacing: -0.02em;
    pointer-events: none;
}
.spenden-card__title {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -0.01em;
}
.spenden-card__hint {
    margin: 0;
    font-size: var(--fs-300);
    color: var(--color-text-secondary);
    line-height: 1.5;
    max-width: 38ch;
}

/* CTA — kompakter, editorial, mit Arrow-Triangle */
.spenden-cta {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: var(--space-3);
    padding: 0.85rem 1.4rem 0.95rem;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--fs-400);
    letter-spacing: 0.02em;
    text-decoration: none;
    color: #ffffff;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
    transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
}
.spenden-cta::after {
    content: '';
    width: 11px;
    height: 18px;
    background: currentColor;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    transition: transform 220ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spenden-cta:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0, 0, 0, 0.45); }
.spenden-cta:hover::after { transform: translateX(4px); }
.spenden-cta--rose { background: var(--fresh-rose); }
.spenden-cta--rose:hover { background: var(--fresh-rose-light); }
.spenden-cta--wind { background: var(--fresh-wind); }
.spenden-cta--wind:hover { background: var(--fresh-wind-light); }

/* IBAN-Display — die Nummer wird zur Headline */
.iban-display {
    margin: var(--space-4) 0 var(--space-3);
    display: grid;
    gap: var(--space-4);
}
.iban-display__row { display: grid; gap: 6px; }
.iban-display__label {
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    color: var(--fresh-river-light);
    margin: 0;
}
.iban-display__value-wrap {
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}
.iban-display__value {
    color: #ffffff;
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    user-select: all;
}
.iban-display__value--small { font-size: var(--fs-400); letter-spacing: 0.05em; }
.iban-display__meta {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--fs-300);
}

/* Copy-Button als Icon-Button (kein Text-Sticker mehr) */
.iban-copy {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.06);
    border: 0;
    color: rgba(255, 255, 255, 0.65);
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease;
    border-radius: 3px;
}
.iban-copy:hover { background: var(--fresh-wind); color: #ffffff; }
.iban-copy.is-copied { background: var(--fresh-wind); color: #ffffff; }
.iban-copy.is-copied::after {
    content: '✓ kopiert';
    margin-left: 8px;
    font-family: var(--font-display);
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.iban-copy.is-copied { width: auto; padding: 0 0.7rem; }

/* Förder-Block: Preis-Sticker neben Body */
.foerder-block {
    display: grid;
    grid-template-columns: minmax(180px, 220px) 1fr;
    gap: var(--space-7);
    align-items: start;
    margin-top: var(--space-4);
}
.foerder-block__price {
    position: relative;
    padding: var(--space-5) var(--space-5) var(--space-4);
    background: var(--fresh-wind);
    color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    transform: rotate(-2deg);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}
.foerder-block__price::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 80px;
    height: 80px;
    background: var(--fresh-rose);
    clip-path: polygon(100% 0, 100% 100%, 0 0);
    opacity: 0.85;
}
.foerder-block__from   { font-size: var(--fs-200); letter-spacing: 0.12em; opacity: 0.85; line-height: 1; }
.foerder-block__amount { font-size: clamp(3.2rem, 8vw, 5rem); font-weight: 800; line-height: 0.9; letter-spacing: -0.02em; }
.foerder-block__period { font-size: var(--fs-300); letter-spacing: 0.08em; line-height: 1.1; opacity: 0.9; }

.foerder-block__lead { font-size: var(--fs-400); color: #ffffff; margin: 0 0 var(--space-4); line-height: 1.45; }
.foerder-block__perks {
    list-style: square;
    padding-left: var(--space-5);
    margin: 0 0 var(--space-5);
    color: var(--color-text-secondary);
    line-height: 1.6;
}
.foerder-block__perks li::marker { color: var(--fresh-rose); }

@media (max-width: 700px) {
    .foerder-block { grid-template-columns: 1fr; gap: var(--space-5); }
    .foerder-block__price { align-self: flex-start; max-width: 240px; }
}

/* Mithelfen — Editorial Numbered List, keine Cards */
.mithelfen-list {
    list-style: none;
    padding: 0;
    margin: var(--space-3) 0 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-7) var(--space-7);
}
.mithelfen-item {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: var(--space-4);
    align-items: start;
    padding-bottom: var(--space-5);
    border-bottom: 1px solid var(--color-border-subtle);
}
.mithelfen-item__num {
    font-size: clamp(2.8rem, 5vw, 4.2rem);
    font-weight: 800;
    line-height: 0.85;
    color: var(--fresh-rose);
    letter-spacing: -0.02em;
}
.mithelfen-item:nth-child(2) .mithelfen-item__num { color: var(--fresh-wind); }
.mithelfen-item:nth-child(3) .mithelfen-item__num { color: var(--fresh-river-light); }
.mithelfen-item:nth-child(4) .mithelfen-item__num { color: var(--fresh-rose); }
.mithelfen-item__title {
    margin: 0 0 var(--space-2);
    font-size: var(--fs-500);
    font-weight: 800;
    color: #ffffff;
    line-height: 1.05;
    letter-spacing: -0.005em;
}
.mithelfen-item__text p { margin: 0; color: var(--color-text-secondary); font-size: var(--fs-300); line-height: 1.55; max-width: 42ch; }

@media (max-width: 800px) {
    .mithelfen-list { grid-template-columns: 1fr; gap: var(--space-5); }
}

/* Quittung — Info-Strips */
.quittung-intro {
    font-size: var(--fs-400);
    color: var(--color-text-secondary);
    max-width: 56ch;
    margin: 0 0 var(--space-6);
    line-height: 1.55;
}
.quittung-rules {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--space-5);
    margin-bottom: var(--space-6);
}
.quittung-rule {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: var(--space-3);
    align-items: start;
    padding: var(--space-4) var(--space-5) var(--space-5) 0;
    border-top: 1px solid var(--color-border-subtle);
}
.quittung-rule__marker { padding-top: 6px; }
.quittung-rule__title { margin: 0 0 var(--space-1); font-size: var(--fs-400); font-weight: 800; color: #ffffff; line-height: 1.1; }
.quittung-rule p { margin: 0; color: var(--color-text-secondary); font-size: var(--fs-300); line-height: 1.55; }
.quittung-outro { color: var(--color-text-secondary); font-size: var(--fs-300); margin: 0; }
.quittung-outro a { color: var(--fresh-wind); text-decoration: underline; }


/* === Themen-Cloud (Standalone-Page) === */
/* === Themen Cloud === */
.themen-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin: var(--space-6) 0;
}

.themen-cloud__item {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-2);
    background: var(--color-bg-elevated);
    padding: 0.6rem 1.1rem 0.7rem;
    border-radius: var(--radius-sm);
    text-decoration: none;
    color: var(--color-text-primary);
    border: 1px solid var(--color-border-subtle);
    transition: background 200ms, transform 200ms;
}

.themen-cloud__item:hover {
    background: var(--fresh-rose);
    color: var(--color-text-on-rose);
}

.themen-cloud__name {
    font-weight: 800;
    font-size: var(--fs-400);
    letter-spacing: -0.01em;
}

.themen-cloud__count {
    font-size: var(--fs-200);
    color: var(--color-text-tertiary);
    font-weight: 600;
}
.themen-cloud__item:hover .themen-cloud__count {
    color: var(--color-text-on-rose);
    opacity: 0.8;
}

.themen-filter-header {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    flex-wrap: wrap;
    margin-bottom: var(--space-6);
}

.themen-filter-eyebrow {
    background: var(--color-accent-primary);
    color: var(--color-text-on-rose);
    padding: 0.3rem 0.7rem 0.35rem;
    border-radius: var(--radius-sm);
    font-weight: 700;
    font-size: var(--fs-200);
}

.themen-filter-title {
    font-weight: 800;
    font-size: var(--fs-500);
    margin: 0;
    background: #ffffff;
    color: var(--fresh-dark-d);
    padding: 0.35rem 0.9rem 0.45rem;
    box-shadow: var(--shadow-sticker);
}

.themen-filter-clear {
    color: var(--color-text-secondary);
    text-decoration: none;
    font-size: var(--fs-200);
    margin-left: auto;
    font-weight: 600;
}
.themen-filter-clear:hover { color: var(--fresh-rose); }

.themen-empty {
    color: var(--color-text-tertiary);
    font-size: var(--fs-300);
    margin: var(--space-6) 0;
}

.generic-card {
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-md);
    overflow: hidden;
}
.generic-card a {
    display: block;
    padding: var(--space-4);
    color: inherit;
    text-decoration: none;
}
.generic-card h3 { margin: 0 0 var(--space-2); font-weight: 800; }
.generic-card p { margin: 0; color: var(--color-text-secondary); font-size: var(--fs-200); }
.generic-card:hover { background: var(--color-bg-elevated); }


/* === Unterstützen: Transparenz / Kosten === */
.kosten-hero { margin-bottom: var(--space-6); }
.kosten-hero__stat {
    display: flex;
    align-items: baseline;
    gap: var(--space-5);
    flex-wrap: wrap;
}
.kosten-hero__amount {
    font-weight: 800;
    font-size: clamp(3.5rem, 7vw, var(--fs-700));
    line-height: 0.9;
    color: var(--fresh-wind);
    letter-spacing: -0.01em;
}
.kosten-hero__label {
    max-width: 460px;
    color: var(--color-text-secondary);
    line-height: 1.5;
}
.kosten-hero__label strong { color: #ffffff; }
.kosten-intro { color: var(--color-text-secondary); margin: 0 0 var(--space-5); }

.kosten-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-5);
}
.kosten-item { position: relative; padding-top: 1.3rem; }
.kosten-item__amount {
    position: absolute;
    top: 0; left: 0;
    background: var(--fresh-rose);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-400);
    padding: 0.25rem 0.8rem 0.35rem;
    box-shadow: var(--shadow-sticker);
    z-index: 1;
    --rot: -2deg;
}
.kosten-item--wind .kosten-item__amount { background: var(--fresh-wind); color: var(--fresh-dark-d); }
.kosten-item--river .kosten-item__amount { background: var(--fresh-river); }
.kosten-item__box {
    background: var(--color-bg-surface);
    padding: 2.4rem 1.3rem 1.3rem;
    min-height: 140px;
}
.kosten-item__title { font-weight: 800; font-size: var(--fs-400); margin: 0 0 var(--space-2); }
.kosten-item__body { color: var(--color-text-secondary); font-size: var(--fs-200); margin: 0; line-height: 1.5; }

.kosten-pledge {
    margin: var(--space-6) 0 0;
    padding-left: var(--space-5);
    list-style: square;
    color: var(--color-text-secondary);
    line-height: 1.7;
}
.kosten-pledge li::marker { color: var(--fresh-wind); }

/* === Entscheidungsphase: Varianten-Label === */
.variant-tag {
    display: inline-block;
    background: var(--fresh-wind);
    color: var(--fresh-dark-d);
    font-weight: 800;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    padding: 0.25rem 0.6rem 0.3rem;
    margin: var(--space-8) 0 var(--space-4);
}
.variant-tag:first-of-type { margin-top: var(--space-6); }

/* === Pfade Variante A1: Diagonale Bahnen === */
.pfad-bahnen { display: flex; flex-direction: column; gap: 10px; }
.pfad-bahn {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding: 1.5rem 2.5rem;
    text-decoration: none;
    transform: skewY(-1.2deg);
    transition: transform 200ms ease, filter 200ms ease;
}
.pfad-bahn > * { transform: skewY(1.2deg); }
.pfad-bahn:hover { transform: skewY(-1.2deg) translateX(8px); filter: brightness(1.07); }
.pfad-bahn--rose  { background: var(--fresh-rose);  color: #ffffff; }
/* Wind einen halben Shade dunkler, damit weißer Text funktioniert (User-Wunsch) */
.pfad-bahn--wind  { background: var(--fresh-wind-dark-a); color: #ffffff; }
.pfad-bahn--river { background: var(--fresh-river); color: #ffffff; }
.pfad-bahn__num { font-weight: 800; font-size: 3rem; opacity: 0.35; line-height: 1; }
.pfad-bahn__text { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.pfad-bahn__title { font-weight: 800; font-size: var(--fs-500); line-height: 1; }
.pfad-bahn__sub { opacity: 0.82; font-weight: 600; font-size: var(--fs-200); }
.pfad-bahn__tri { color: currentColor; flex-shrink: 0; }



/* === Unterstützen: Transparenz / Kosten === */
.kosten-hero { margin-bottom: var(--space-6); }
.kosten-hero__stat {
    display: flex;
    align-items: baseline;
    gap: var(--space-5);
    flex-wrap: wrap;
}
.kosten-hero__amount {
    font-weight: 800;
    font-size: clamp(3.5rem, 7vw, var(--fs-700));
    line-height: 0.9;
    color: var(--fresh-wind);
    letter-spacing: -0.01em;
}
.kosten-hero__label {
    max-width: 460px;
    color: var(--color-text-secondary);
    line-height: 1.5;
}
.kosten-hero__label strong { color: #ffffff; }
.kosten-intro { color: var(--color-text-secondary); margin: 0 0 var(--space-5); }

.kosten-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-5);
}
.kosten-item { position: relative; padding-top: 1.3rem; }
.kosten-item__amount {
    position: absolute;
    top: 0; left: 0;
    background: var(--fresh-rose);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-400);
    padding: 0.25rem 0.8rem 0.35rem;
    box-shadow: var(--shadow-sticker);
    z-index: 1;
    --rot: -2deg;
}
.kosten-item--wind .kosten-item__amount { background: var(--fresh-wind); color: var(--fresh-dark-d); }
.kosten-item--river .kosten-item__amount { background: var(--fresh-river); }
.kosten-item__box {
    background: var(--color-bg-surface);
    padding: 2.4rem 1.3rem 1.3rem;
    min-height: 140px;
}
.kosten-item__title { font-weight: 800; font-size: var(--fs-400); margin: 0 0 var(--space-2); }
.kosten-item__body { color: var(--color-text-secondary); font-size: var(--fs-200); margin: 0; line-height: 1.5; }

.kosten-pledge {
    margin: var(--space-6) 0 0;
    padding-left: var(--space-5);
    list-style: square;
    color: var(--color-text-secondary);
    line-height: 1.7;
}
.kosten-pledge li::marker { color: var(--fresh-wind); }

/* === Entscheidungsphase: Varianten-Label === */
.variant-tag {
    display: inline-block;
    background: var(--fresh-wind);
    color: var(--fresh-dark-d);
    font-weight: 800;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    padding: 0.25rem 0.6rem 0.3rem;
    margin: var(--space-8) 0 var(--space-4);
}
.variant-tag:first-of-type { margin-top: var(--space-6); }

/* === Pfade Variante A1: Diagonale Bahnen === */
.pfad-bahnen { display: flex; flex-direction: column; gap: 10px; }
.pfad-bahn {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding: 1.5rem 2.5rem;
    text-decoration: none;
    transform: skewY(-1.2deg);
    transition: transform 200ms ease, filter 200ms ease;
}
.pfad-bahn > * { transform: skewY(1.2deg); }
.pfad-bahn:hover { transform: skewY(-1.2deg) translateX(8px); filter: brightness(1.07); }
.pfad-bahn--rose  { background: var(--fresh-rose);  color: #ffffff; }
/* Wind einen halben Shade dunkler, damit weißer Text funktioniert (User-Wunsch) */
.pfad-bahn--wind  { background: var(--fresh-wind-dark-a); color: #ffffff; }
.pfad-bahn--river { background: var(--fresh-river); color: #ffffff; }
.pfad-bahn__num { font-weight: 800; font-size: 3rem; opacity: 0.35; line-height: 1; }
.pfad-bahn__text { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.pfad-bahn__title { font-weight: 800; font-size: var(--fs-500); line-height: 1; }
.pfad-bahn__sub { opacity: 0.82; font-weight: 600; font-size: var(--fs-200); }
.pfad-bahn__tri { color: currentColor; flex-shrink: 0; }



/* === Home-Stack: Sections stapeln beim Scrollen (Prototyp sticky-stack) ===
   Jede Section bleibt mit wachsendem Offset kleben; am Ende ist von jeder
   ein Streifen inkl. Kerben-Oberkante sichtbar. Nur Desktop — auf Mobile
   sind die Sections höher als der Viewport, dort normaler Fluss. */
@media (min-width: 900px) {
    .home-stack > section,
    .home-stack > .photo-divider {
        position: sticky;
    }
    /* Hero scrollt normal weg; Peeks beginnen erst UNTER der Navbar (60px),
       damit keine Section komplett hinter ihr verschwindet */
    .home-stack > *:nth-child(1) { position: static; }
    .home-stack > *:nth-child(2) { top: 64px;  --notch-x: 22%; }
    .home-stack > *:nth-child(3) { top: 98px;  --notch-x: 64%; }
    .home-stack > *:nth-child(4) { top: 132px; --notch-x: 38%; }
    .home-stack > *:nth-child(5) { top: 166px; --notch-x: 80%; }
    .home-stack > *:nth-child(6) { top: 200px; --notch-x: 30%; }
    .home-stack > *:nth-child(7) { top: 234px; --notch-x: 58%; }
    .home-stack > *:nth-child(8) { top: 268px; --notch-x: 74%; }

    /* Kerbe an der Oberkante aller Folge-Sections */
    .home-stack > *:nth-child(n+2) {
        clip-path: polygon(
            0 0,
            calc(var(--notch-x, 50%) - 28px) 0,
            var(--notch-x, 50%) 28px,
            calc(var(--notch-x, 50%) + 28px) 0,
            100% 0, 100% 100%, 0 100%
        );
    }
    /* home-cta hat bereits eine eigene Kerbe — Oberkanten-Kerbe ersetzt sie */
    .home-stack > .home-cta { clip-path: polygon(
        0 0,
        calc(var(--notch-x, 50%) - 28px) 0,
        var(--notch-x, 50%) 28px,
        calc(var(--notch-x, 50%) + 28px) 0,
        100% 0, 100% 100%, 0 100%
    ); }

    /* Szene-Gefühl: Sections füllen den Viewport großzügig, Inhalt zentriert */
    .home-stack > section:not(.home-hero) {
        min-height: 88vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

/* Subtile Gradienten statt flacher Flächen (Prototyp-Ästhetik) — alle Viewports */
.home-stack .home-paths {
    max-width: none;
    margin: 0;
    padding: var(--space-8) var(--space-6);
    background: linear-gradient(165deg, var(--fresh-dark-d) 0%, var(--fresh-dark-c) 55%, var(--fresh-dark-b) 100%);
}
.home-stack .home-paths > * {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.home-stack .home-paths__head { margin-bottom: var(--space-6); }
.home-stack > .home-bilanz-wrap {
    background: linear-gradient(200deg, var(--fresh-dark-omega) 0%, var(--fresh-dark-d) 60%, #14232b 100%);
}
.home-stack > .politik-section--a {
    background: linear-gradient(160deg, var(--fresh-dark-c) 0%, var(--fresh-dark-d) 70%);
}
.home-stack > .politik-section--c {
    background: linear-gradient(15deg, var(--fresh-dark-d) 0%, var(--fresh-dark-b) 100%);
}
.home-stack > .politik-section--b {
    background: linear-gradient(185deg, var(--fresh-dark-d) 0%, var(--fresh-dark-omega) 100%);
}

/* === Stellungnahme „Statement" — Flächen-Band-Kopf === */
.stmt { padding-bottom: var(--space-8); }
.stmt__band {
    display: grid;
    grid-template-columns: 34fr 66fr;
    min-height: clamp(300px, 44vh, 480px);
    background: var(--fresh-dark-c);
    margin-top: 60px;   /* fixe Navbar */
    position: relative;
    /* Kerben-Regel: Band ragt als Dreieck in den Body */
    padding-bottom: 0;
}
.stmt__band::after {
    content: '';
    position: absolute;
    top: 100%;
    left: calc(24% - 28px);
    border-left: 28px solid transparent;
    border-right: 28px solid transparent;
    border-top: 28px solid var(--fresh-dark-c);
}
.stmt__author-panel {
    background: rgba(0, 0, 0, 0.22);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    padding: var(--space-7) var(--space-5);
    text-align: center;
}
.stmt__author { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); text-decoration: none; color: inherit; }
.stmt__author-frame {
    display: block;
    width: min(150px, 60%);
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sticker);
}
.stmt__author-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.stmt__author-name {
    background: #ffffff;
    color: var(--fresh-dark-d);
    font-weight: 800;
    font-size: var(--fs-300);
    padding: 0.25rem 0.7rem 0.3rem;
    box-shadow: var(--shadow-sticker);
    --rot: -1.5deg;
}
.stmt__author-role { font-size: var(--fs-100); color: var(--fresh-wind); font-weight: 700; }
.stmt__date { color: var(--color-text-tertiary); font-size: var(--fs-200); }

.stmt__title-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: var(--space-8) clamp(var(--space-6), 6vw, var(--space-9));
}
.stmt__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    padding: 0.25rem 0.7rem 0.3rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
    margin-bottom: var(--space-4);
}
.stmt__title {
    font-weight: 800;
    font-size: clamp(2rem, 4.5vw, var(--fs-600));
    line-height: 1.02;
    margin: 0;
}
.stmt__lead { color: var(--color-text-secondary); font-size: var(--fs-400); line-height: 1.4; margin: var(--space-4) 0 0; max-width: 640px; }
.stmt__topics { list-style: none; display: flex; gap: var(--space-3); padding: 0; margin: var(--space-4) 0 0; }
.stmt__topics a { color: var(--fresh-wind); text-decoration: none; font-weight: 600; font-size: var(--fs-200); }

.stmt__body {
    max-width: 720px;
    margin: var(--space-8) auto 0;
    padding: 0 var(--space-6);
    font-size: var(--fs-300);
    line-height: 1.7;
}
.stmt__body > p:first-child {
    font-size: var(--fs-400);
    line-height: 1.45;
    color: var(--color-text-secondary);
}
.stmt__extras { max-width: 720px; margin: var(--space-7) auto 0; padding: 0 var(--space-6); }
.stmt__related-eyebrow {
    display: inline-block;
    background: var(--fresh-river-mid);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-100);
    padding: 0.25rem 0.7rem 0.3rem;
    box-shadow: var(--shadow-sticker);
    --rot: -1.5deg;
    margin-bottom: var(--space-4);
}
.stmt__related-grid { display: grid; grid-template-columns: minmax(0, 420px); }

@media (max-width: 820px) {
    .stmt__band { grid-template-columns: 1fr; }
    .stmt__author-panel { padding: var(--space-6) var(--space-5); }
}

/* === Content-Bilder & Zitate (global für Stellungnahmen/Vorhaben/Themen) === */
.page-content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
    margin: var(--space-5) 0;
    display: block;
}
.page-content figure { margin: var(--space-5) 0; }
.page-content figure img { margin: 0; }
.page-content figcaption { font-size: var(--fs-100); color: var(--color-text-tertiary); margin-top: var(--space-2); font-style: italic; }
/* Blockquote: zeilenweise weiße Sticker statt großem Block */
.page-content blockquote {
    margin: var(--space-6) 0;
    transform: rotate(-0.8deg);
    line-height: 1.35;
}
.page-content blockquote p {
    display: inline;
    margin: 0;
    background: #ffffff;
    color: var(--fresh-dark-d);
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--fs-400);
    padding: 0.15em 0.45em 0.2em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    box-shadow: var(--shadow-sticker);
}


/* === Mandat: weiße fresh.{nick}-Bridge — hängt ins Hero-Foto === */
.mandat-bridge {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 0;
}
.mandat-bridge__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateY(-62%);
}
.mandat-bridge__eyebrow {
    background: var(--fresh-rose);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-100);
    letter-spacing: 0.08em;
    padding: 0.25rem 0.7rem 0.3rem;
    box-shadow: var(--shadow-sticker);
    --rot: -2deg;
    margin-bottom: -0.55em;   /* klebt an der Sticker-Oberkante */
    position: relative;
    z-index: 1;
    margin-right: 30%;
}
.mandat-bridge__word {
    background: #ffffff;
    color: var(--fresh-dark-d);
    font-weight: 800;
    font-size: clamp(2.4rem, 4.5vw, 3.8rem);
    padding: 0.4rem 1.1rem 0.5rem;
    box-shadow: var(--shadow-sticker);
    --rot: -1.2deg;
}
.mandat-bridge__nick { color: var(--fresh-rose); }

/* Kontakt-Icons in der Hero-Spalte */
.mandat-contact-icons--hero {
    list-style: none;
    display: flex;
    gap: var(--space-3);
    padding: 0;
    margin: 0;
}

/* Zitat klein, weiß, getiltet am Ende der Hero-Infos */
/* Zitat: jede Zeile ihr eigener weißer Sticker (box-decoration-break) */
.mandat-hero__quote {
    margin: var(--space-6) 0 0;
    max-width: 440px;
    /* Zeilen-Sticker stoßen aneinander: 1em Text + 0.42em Padding */
    line-height: 1.42;
}
.mandat-hero__quote > span {
    display: inline;
    background: #ffffff;
    color: var(--fresh-dark-d);
    font-weight: 700;
    font-size: var(--fs-300);
    padding: 0.18em 0.5em 0.24em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    box-shadow: var(--shadow-sticker);
}


/* Mobile: Bänder 1-spaltig und seamless — Icon ohne eigene Fläche,
   ragt in die darüberliegende Sektion hinein (wiederkehrendes Pop-out) */
@media (max-width: 820px) {
    .mandat-thema,
    .mandat-thema--reverse {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }
    .mandat-thema__visual { order: 0; padding: 0; }
    .mandat-thema__visual::before { display: none; }   /* kein dunkler Shade */
    .mandat-thema__visual img {
        width: min(150px, 42vw);
        display: block;
        margin: -55px auto 0;    /* zentriert, ragt in die obere Sektion */
        position: relative;
        z-index: 3;
    }
    /* erstes Band: nicht in den Hero/Bridge-Bereich ragen */
    .mandat-thema:first-child .mandat-thema__visual img { margin-top: var(--space-4); }
    /* Bridge kompakter, damit sie nicht ins Hero-Zitat läuft */
    .mandat-bridge__inner { transform: translateY(-42%); }
    .mandat-hero__content { padding-bottom: var(--space-8); }
    .mandat-thema__text {
        padding: var(--space-4) var(--space-6) var(--space-7);
        max-width: none;
    }
    /* Kerbe mittig, da 1-spaltig keine Icon-Seite mehr existiert */
    .mandat-thema { --notch-x: 50%; }
    .mandat-thema--reverse { --notch-x: 50%; }
}


@media (max-width: 760px) {
    .pfad-bahn { padding: 1.2rem 1.1rem; gap: var(--space-4); transform: skewY(-1.2deg); }
    .pfad-bahn__num { font-size: 2.2rem; }
    .pfad-bahn__tri { width: 12px; height: 24px; }
}


/* === Mobile Scroll-Interaktionen (aktiv via .sh-on, siehe scrollhover.js) === */
@media (max-width: 760px) {
    /* Bahnen: staggered Slide-in beim ersten Sichtbarwerden */
    .sh-on .pfad-bahn {
        opacity: 0;
        transform: skewY(-1.2deg) translateX(-28px);
        transition: transform 480ms cubic-bezier(0.22, 0.9, 0.3, 1), opacity 480ms ease;
    }
    .sh-on .pfad-bahn:nth-child(2) { transition-delay: 90ms; }
    .sh-on .pfad-bahn:nth-child(3) { transition-delay: 180ms; }
    .sh-on .pfad-bahn.is-in { opacity: 1; transform: skewY(-1.2deg); }
    /* Scroll-Hover: Bahn in der Mitte schiebt sich nach rechts */
    .sh-on .pfad-bahn.is-in.is-scrollhover { transform: skewY(-1.2deg) translateX(8px); }

    /* Mandats-Card in der Mitte: Sticker-Akzent wie Desktop-Hover */
    .phase-card--mandat.is-scrollhover { transform: translateY(-3px); box-shadow: var(--shadow-card); }
    .phase-card--mandat.is-scrollhover .phase-card__name-sticker {
        background: var(--fresh-rose);
        color: #ffffff;
    }
}

/* Sticky-CTA (Mitmachen): erscheint nach etwas Scroll, verschwindet am Formular */
.sticky-cta {
    position: fixed;
    right: var(--space-4);
    bottom: var(--space-4);
    z-index: 90;
    background: var(--fresh-rose);
    color: #ffffff;
    font-weight: 800;
    font-size: var(--fs-200);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.6rem 0.9rem 0.65rem;
    box-shadow: var(--shadow-card);
    transform: translateY(90px) rotate(-1.5deg);
    transition: transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
.sticky-cta.is-visible { transform: translateY(0) rotate(-1.5deg); }
@media (min-width: 761px) { .sticky-cta { display: none; } }