.ce_text h4 {
    color: #861d33 !important;
    font-weight: bold !important;
}

.headlinered h1,
.headlinered h2 {
    color: #861d33 !important;
}

.ce_iconbox.redheadline h3.headline {
    color: #861d33 !important;
    font-weight: bold !important;
    font-size: 1.25em !important;
    padding-bottom: 15px !important;
}

.ce_iconbox.redheadline.icon3 h3.headline {
    letter-spacing: 0 !important;
}

/* ============================================================
   ce_teambox mit Klasse .chgteam - Hover zeigt zweites Bild
   Backend: pro Person eigene Klasse vergeben (chgteam-<name>)
   ============================================================ */
.chgteam .image .overlay { display: none !important; }
.chgteam .image a { position: relative; display: block; }
.chgteam .image a::after {
    content: '';
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}
.chgteam .image a:hover::after { opacity: 1; }

/* Hover-Bilder pro Person (Bilder in files/cto_layout/teamfotos/ ablegen) */
.chgteam-annette .image a::after { background-image: url('/files/cto_layout/teamfotos/a_on.jpg'); }
.chgteam-kristin .image a::after { background-image: url('/files/cto_layout/teamfotos/ak_on.jpg'); }
.chgteam-martin  .image a::after { background-image: url('/files/cto_layout/teamfotos/mf_on.jpg'); }


nav.mobile_horizontal ul ul,
nav.mobile_vertical ul ul {
    z-index: 9999 !important;
    position: relative;
}

nav.mobile_horizontal,
nav.mobile_vertical {
    position: relative;
    z-index: 9999 !important;
}

.ce_video_background {
    height: 800px !important;
    position: relative;
    z-index: 1;
}

.ce_video_background video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}





.ctabtn a {
    background-color: #861d33 !important;
    color: white !important;
    border: 2px solid #861d33 !important;
    transition: transform 0.3s ease !important;
    opacity: 1 !important;
}

.ctabtn a:hover,
.ctabtn a:focus,
.ctabtn a:active {
    background-color: #861d33 !important;
    color: white !important;
    border: 2px solid #861d33 !important;
    transform: scale(1.10) !important;
    opacity: 1 !important;
    filter: none !important;
}






.blacked {
    font-weight: bold !important;
    color: white !important;
    background-color: black !important;
    padding: 2px 8px !important;
    display: block !important;
    text-transform: uppercase !important;
    text-align: center !important;
    width: fit-content !important;
    margin: 0 auto !important;
}




.nlinput{
font-weight:bold;
}

.nlsubmit{
    font-weight: bold;
    background-color: #861d33;
    color: #FFFFFF;
    cursor: pointer !important;
    transition: font-size 0.3s ease !important;
}

.nlsubmit:hover {
    font-size: 1.1em !important;
}

.nlsubmit:active,
.nlsubmit:focus,
.nlsubmit:visited {
    background-color: #861d33 !important;
    color: #FFFFFF !important;
}





.ce_iconbox a[href^="mailto:"] {
    text-decoration: none !important;
}

.ce_iconbox a[href^="mailto:"]:hover {
    text-decoration: underline !important;
}



.vlist a {
    text-transform: uppercase !important;
    opacity: 1 !important;
}

.vlist a:hover {
    text-decoration: underline !important;
    opacity: 1 !important;
}



footer h4 {
    font-weight: bold !important;
    color: white !important;
    background-color: black !important;
    padding: 0px 5px !important;
    display: inline-block !important;
text-transform:uppercase !important;
}

footer .ce_text h4 {
    color: white !important;
}

/* Footer-Links bei Hover rot + unterstrichen (Favoriten-Spalte und
 * Kontakt-Mailadresse). -webkit-text-fill-color muss mit gesetzt
 * werden, weil das Theme es setzt und andernfalls die color-Aenderung
 * optisch ueberschreibt. */
#footer .ce_text.fett ul a:hover,
#footer .ce_text.fett ul a:focus,
#footer a[href^="mailto:"]:hover,
#footer a[href^="mailto:"]:focus {
    color: #861d33 !important;
    -webkit-text-fill-color: #861d33 !important;
    text-decoration: underline !important;
}

/* Footer breiter und mehr Luft zwischen Spalten (Header bleibt 1240) */
/* Stacking-Context anheben, damit Parallax-Sektion darueber keine
 * Klicks auf Footer-Links abfaengt. (#wrapper hat z-index:10, Footer
 * muss darueber liegen.) */
#footer {
    position: relative !important;
    z-index: 100 !important;
}
#footer .inside {
    max-width: 1440px !important;
}
#footer .autogrid_row {
    margin-left: -25px !important;
    margin-right: -25px !important;
}
#footer .column.col_3 {
    padding-left: 25px !important;
    padding-right: 25px !important;
}
@media (max-width: 991px) {
    #footer .autogrid_row {
        margin-left: -15px !important;
        margin-right: -15px !important;
    }
    #footer .column.col_3 {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}
/* Kontakt-Spalte (2.) mehr Abstand zur Newsletter-Spalte, damit sie nicht
 * zu nah anklebt. Nur Desktop - Mobile stapelt ohnehin untereinander. */
@media (min-width: 992px) {
    #footer .autogrid_row > .column.col_3:nth-child(2) {
        padding-left: 75px !important;
    }
}



/* source-sans-3-200 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/source-sans-3-v18-latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-300 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/source-sans-3-v18-latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-3-v18-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-700 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/source-sans-3-v18-latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-800 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/source-sans-3-v18-latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




.mitarbeiter img {
    transition: transform 0.3s ease-in-out;
}

.mitarbeiter img:hover {
    transform: scale(1.1);
}



.teaseme {
    filter: grayscale(100%);
    width: 80%;
    transition: transform 0.3s ease, filter 0.3s ease;
}

.teaseme:hover {
    filter: grayscale(0%);
    transform: scale(1.25);
}


/* ============================================================
   Projektfinder (ext_projektfinder.php)
   ============================================================ */
.pf-wrap { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }

.pf-header { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,.06); padding: 28px 32px 20px; margin: 0 24px 20px; }
.pf-title { font-size: 22px; font-weight: 700; color: #222; margin: 0 0 4px; }
.pf-subtitle { font-size: 15px; color: #555; margin: 0 0 18px; }

.pf-row { display: flex; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.pf-search { flex: 1; min-width: 180px; padding: 12px 16px; border: 2px solid #eee; border-radius: 8px; font-size: 15px; font-family: inherit; background: #fafafa; color: #333; transition: border-color 0.2s, background 0.2s; }
.pf-search:focus { border-color: #861d33; background: #fff; outline: none; }
.pf-search::placeholder { color: #bbb; }

.pf-location { background: #fdf7f0; border: 1px solid #f0e4d0; border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; }
.pf-location-label { font-size: 15px; color: #861d33; font-weight: 700; display: flex; align-items: center; gap: 8px; margin: 0 0 8px; }
.pf-location-label svg { flex-shrink: 0; }
.pf-location-input-wrap { position: relative; }
.pf-wrap input.pf-location-input,
.pf-wrap input.pf-location-input:focus,
.pf-wrap input.pf-location-input:hover,
.pf-wrap input.pf-location-input:active { width: 100% !important; padding: 12px 16px !important; margin: 0 !important; border: 2px solid #eee !important; border-radius: 8px !important; font-size: 15px !important; font-family: inherit !important; color: #333 !important; box-sizing: border-box !important; text-indent: 0 !important; text-align: left !important; display: block !important; position: static !important; left: auto !important; right: auto !important; transform: none !important; box-shadow: none !important; }
.pf-wrap input.pf-location-input { background: #fafafa !important; transition: border-color 0.2s, background 0.2s !important; outline: none !important; }
.pf-wrap input.pf-location-input:focus { border-color: #861d33 !important; background: #fff !important; outline: none !important; }
.pf-wrap input.pf-location-input::placeholder { color: #333 !important; opacity: 1 !important; }
.pf-wrap input.pf-location-input::-webkit-contacts-auto-fill-button,
.pf-wrap input.pf-location-input::-webkit-credentials-auto-fill-button { visibility: hidden; display: none !important; pointer-events: none; position: absolute; right: 0; }
.pf-wrap input.pf-location-input::-webkit-search-cancel-button,
.pf-wrap input.pf-location-input::-webkit-search-decoration { -webkit-appearance: none; display: none; }
.pf-autocomplete { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #eee; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,0.12); margin-top: 4px; max-height: 260px; overflow-y: auto; z-index: 1000; display: none; }
.pf-autocomplete.open { display: block; }
.pf-ac-item { padding: 10px 16px; cursor: pointer; border-bottom: 1px solid #f5f5f5; transition: background 0.15s; }
.pf-ac-item:last-child { border-bottom: none; }
.pf-ac-item:hover, .pf-ac-item.active { background: #fdf0f2; }
.pf-ac-name { font-weight: 600; color: #861d33; font-size: 15px; line-height: 1.3; }
.pf-ac-meta { font-size: 13px; color: #333; margin-top: 2px; }
.pf-ac-empty { padding: 14px; text-align: center; color: #cccccc; font-size: 15px; }
.pf-location-chip { display: flex; align-items: center; gap: 10px; background: #861d33; color: #fff; padding: 10px 8px 10px 16px; border-radius: 8px; font-size: 15px; font-weight: 500; }
.pf-chip-icon { flex-shrink: 0; }
.pf-chip-text { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-chip-clear { background: rgba(255,255,255,0.2); border: none; color: #fff; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center; padding: 0; flex-shrink: 0; transition: background 0.15s; }
.pf-chip-clear:hover { background: rgba(255,255,255,0.4); }

.pf-select { flex: 1; min-width: 140px; padding: 12px 14px; border: 2px solid #eee; border-radius: 8px; font-size: 15px; font-family: inherit; background: #fafafa; color: #333; cursor: pointer; transition: border-color 0.2s; }
.pf-select:focus { border-color: #861d33; outline: none; }

.pf-status { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding-top: 14px; border-top: 1px solid #f0f0f0; }
.pf-count { font-size: 15px; color: #555; flex: 1; }
.pf-count strong { color: #861d33; font-size: 17px; }
.pf-reset { padding: 5px 14px; background: #861d33; color: #fff; border: none; border-radius: 6px; font-size: 12px; font-weight: 600; cursor: pointer; font-family: inherit; transition: background 0.2s; }
.pf-reset:hover { background: #6b1629; }

.pf-toggle { display: flex; border: 2px solid #eee; border-radius: 8px; overflow: hidden; }
.pf-toggle-btn { padding: 6px 18px; border: none; background: #fafafa; color: #cccccc; font-size: 12px; font-weight: 600; cursor: pointer; font-family: inherit; transition: all 0.2s; letter-spacing: 0.3px; text-transform: uppercase; }
.pf-toggle-btn.active { background: #861d33; color: #fff; }
.pf-toggle-btn:hover:not(.active) { background: #f0f0f0; color: #555; }

.pf-map { width: 100%; height: 620px; border-radius: 14px; overflow: hidden; box-shadow: 0 2px 16px rgba(0,0,0,.06); }

.leaflet-popup-content-wrapper { border-radius: 10px !important; box-shadow: 0 4px 20px rgba(0,0,0,.18) !important; }
.leaflet-popup-content { margin: 16px 18px !important; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; min-width: 220px; }
.pf-popup-name { font-size: 16px; font-weight: 700; color: #861d33; margin-bottom: 6px; line-height: 1.3; }
.pf-popup-addr { font-size: 14px; color: #222; line-height: 1.5; }
.pf-popup-kat { font-size: 13px; color: #555; margin-top: 8px; padding-top: 8px; border-top: 1px solid #e0e0e0; line-height: 1.4; }
.pf-popup-dist { font-size: 13px; color: #b8871f; font-weight: 700; margin-top: 4px; }
.leaflet-popup-content a { font-size: 14px !important; font-weight: 700 !important; }

@keyframes pf-drop {
    0% { transform: translateY(-20px) scale(0.5); opacity: 0; }
    60% { transform: translateY(3px) scale(1.05); opacity: 1; }
    80% { transform: translateY(-1px) scale(0.98); }
    100% { transform: translateY(0) scale(1); opacity: 1; }
}
.pf-marker { animation: pf-drop 0.4s ease-out forwards; opacity: 0; }
.pf-marker svg .pin-body { transition: fill 0.2s; }
.pf-marker:hover svg .pin-body { fill: #D4A24D; }

.pf-list { background: #fff; border-radius: 14px; box-shadow: 0 2px 20px rgba(0,0,0,.06); margin: 0 24px 70px; }
.pf-list-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.pf-list-grid .pf-list-item { border-right: 1px solid #ddd; }
.pf-list-grid .pf-list-item:nth-child(2n) { border-right: none; }
.pf-pagination { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 16px 20px; border-top: 1px solid #f0f0f0; }
.pf-page-btn { padding: 6px 12px; border: 1px solid #eee; border-radius: 6px; background: #fff; color: #666; font-size: 13px; cursor: pointer; font-family: inherit; transition: all 0.2s; }
.pf-page-btn:hover { background: #f5f5f5; }
.pf-page-btn.active { background: #861d33; color: #fff; border-color: #861d33; }
.pf-page-btn:disabled { opacity: 0.3; cursor: default; }
.pf-page-info { font-size: 12px; color: #cccccc; margin: 0 8px; }
@media (max-width: 700px) { .pf-list-grid { grid-template-columns: 1fr; } }
.pf-list-sort { padding: 8px 20px; background: #fafafa; border-bottom: 1px solid #f0f0f0; display: flex; gap: 4px; }
.pf-sort-btn { padding: 5px 14px; border: none; background: transparent; color: #cccccc; font-size: 12px; font-weight: 600; cursor: pointer; font-family: inherit; border-radius: 6px; transition: all 0.2s; }
.pf-sort-btn.active { background: #861d33; color: #fff; }
.pf-sort-btn:hover:not(.active) { background: #eee; color: #555; }
.pf-list-item { display: flex; align-items: center; gap: 16px; padding: 14px 20px; background: #fff; border-bottom: 1px solid #ddd; transition: background 0.15s; cursor: default; }
.pf-list-item:hover { background: #fdf0f2; }
.pf-list-num { font-size: 11px; color: #ccc; font-weight: 700; min-width: 28px; }
.pf-list-info { flex: 1; }
.pf-list-name { font-weight: 700; color: #861d33; font-size: 16px; line-height: 1.3; margin-bottom: 8px; }
.pf-list-addr { font-size: 14px; color: #444; margin: 0; line-height: 1.2; }
.pf-list-kat { font-size: 13px; color: #666; margin: 0; line-height: 1.2; }
.pf-list-dist { font-size: 14px; color: #D4A24D; font-weight: 700; white-space: nowrap; min-width: 55px; text-align: right; }
.pf-list-empty { padding: 40px 20px; text-align: center; color: #ccc; font-size: 14px; background: #fff; border-radius: 14px; }


/* ============================================================
   Projekt-Details: Social-Media-Icons (ext_projekt_details.php)
   ============================================================ */
.pf-socials-label { font-weight: bold; margin: 14px 0 6px; }
.pf-socials { display: flex; gap: 18px; margin: 0 0 20px; align-items: center; }
.pf-social { color: #000; transition: color 0.2s ease, transform 0.2s ease; display: inline-flex; align-items: center; justify-content: center; text-decoration: none !important; line-height: 0; }
.pf-social:hover { transform: translateY(-2px); text-decoration: none !important; }
.pf-social svg { width: 28px; height: 28px; display: block; }
.pf-social-web:hover { color: #861d33; }
.pf-social-fb:hover  { color: #1877F2; }
.pf-social-ig:hover  { color: #E4405F; }
.pf-social-x:hover   { color: #1DA1F2; }


/* ============================================================
   Neu dabei... Block (ext_neueprojekte.php)
   ============================================================ */
.pf-neue-heading { color: #861d33; }
.pf-neue-row + .pf-neue-row { margin-top: 70px; }
.pf-neue-row .image_container { width: 100%; aspect-ratio: 1000 / 560; overflow: hidden; margin: 0; }
.pf-neue-row .image_container a { display: block; width: 100%; height: 100%; }
.pf-neue-row .image_container img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: center; display: block; max-width: none; transition: transform 0.6s ease; }
.pf-neue-row .image_container:hover img { transform: scale(1.06); }


/* ============================================================
   Buergermeister-Button: Hover schwarz statt rot
   ============================================================ */
/* Gilt fuer ALLE optisch gleichen gerundeten Outline-Buttons
   (btn-accent-outline + btn-radius-20), nicht nur .buergermeisterbtn.
   Eckige Buttons (border-radius-0) sind bewusst ausgenommen.
   Hover: Text/Rahmen schwarz + fliederfarbener Hintergrund (wie Termine). */
.btn-accent-outline.btn-radius-20:hover a,
.btn-accent-outline.btn-radius-20 a:hover {
    color: #000 !important;
    border-color: #000 !important;
    background: #f5edf5 !important;
}

.pf-optional { font-weight: normal; color: #777; font-size: 0.9em; }


/* ============================================================
   Projektfinder Startseiten-Variante (ext_projektfinder_start.php)
   ============================================================ */
.pf-wrap-start { max-width: 900px; margin-left: auto !important; margin-right: 35px !important; overflow: visible !important; position: relative; z-index: 50; }
@media (min-width: 1240px) {
    .pf-wrap-start { max-width: 565px !important; margin-right: calc(615px - 50vw) !important; }
}
.pf-wrap-start .pf-header,
.pf-wrap-start .pf-start-form,
.pf-wrap-start .pf-row,
.pf-wrap-start .pf-location,
.pf-wrap-start .pf-location-input-wrap { overflow: visible !important; }
.pf-wrap-start .pf-header { padding-bottom: 28px; }
.pf-wrap-start .pf-start-form { display: block; }
.pf-wrap-start .pf-autocomplete { z-index: 9999; max-height: 360px; }
.ce_text:has(.pf-wrap-start),
.ce_text.block:has(.pf-wrap-start) { overflow: visible !important; }

/* Theme-Override: input:hover + input:focus schrumpfen die Border auf 1px → Layout-Sprung */
.pf-wrap .pf-search,
.pf-wrap .pf-select,
.pf-wrap .pf-location-input {
    border-width: 2px !important;
    border-style: solid !important;
    border-radius: 8px !important;
}
.pf-wrap .pf-search,
.pf-wrap .pf-select,
.pf-wrap .pf-location-input { border-color: #eee !important; }
.pf-wrap .pf-search:hover,
.pf-wrap .pf-select:hover,
.pf-wrap .pf-location-input:hover { border-color: #ccc !important; }
.pf-wrap .pf-search:focus,
.pf-wrap .pf-select:focus,
.pf-wrap .pf-location-input:focus,
.pf-wrap .pf-search:focus:hover,
.pf-wrap .pf-select:focus:hover,
.pf-wrap .pf-location-input:focus:hover { border-color: #861d33 !important; }


/* ============================================================
   rechtslinks: Abstand links/rechts
   ============================================================ */
.rechtslinks { padding-left: 30px !important; padding-right: 30px !important; }
.pf-submit-row { display: flex; justify-content: center; margin-top: 18px; }
.pf-submit-btn {
    background: #861d33;
    color: #fff;
    border: 2px solid #861d33;
    padding: 12px 32px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    border-radius: 0;
}
.pf-submit-btn:hover,
.pf-submit-btn:focus {
    background: #000;
    border-color: #000;
    color: #fff;
    outline: none;
}

/* ============================================================
   Animierte Iconboxen
   Erfordert: customize.js (SVG-Inject)
   und Klasse icon1..icon8 auf der jeweiligen Iconbox.
   ============================================================ */

.ce_iconbox svg {
    overflow: visible;
}

.ce_iconbox .part {
    transform-box: fill-box;
    transform-origin: center;
}

/* Icon 01 - Landesinitiative */
.ce_iconbox.icon1:hover .p-body-l { animation: i1-bl 0.75s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon1:hover .p-body-r { animation: i1-br 0.75s cubic-bezier(0.34, 1.4, 0.64, 1) 0.05s both; }
.ce_iconbox.icon1:hover .p-head-l { animation: i1-hl 0.65s cubic-bezier(0.34, 1.4, 0.64, 1) 0.18s both; }
.ce_iconbox.icon1:hover .p-head-r { animation: i1-hr 0.65s cubic-bezier(0.34, 1.4, 0.64, 1) 0.22s both; }
.ce_iconbox.icon1:hover .p-heart  { animation: i1-ht 0.55s cubic-bezier(0.34, 1.6, 0.64, 1) 0.4s  both; }
@keyframes i1-bl { from { transform: translate(-70px, 30px) rotate(-18deg) scale(0.6); opacity: 0; } }
@keyframes i1-br { from { transform: translate( 70px, 30px) rotate( 18deg) scale(0.6); opacity: 0; } }
@keyframes i1-hl { from { transform: translate(-55px,-55px) scale(0.3); opacity: 0; } }
@keyframes i1-hr { from { transform: translate( 55px,-55px) scale(0.3); opacity: 0; } }
@keyframes i1-ht { from { transform: translate(   0,-70px) scale(0);   opacity: 0; } }

/* Icon 02 - Unsere Projekte */
.ce_iconbox.icon2:hover .p-card-back  { animation: i2-cb 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon2:hover .p-card-mid   { animation: i2-cm 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0.12s both; }
.ce_iconbox.icon2:hover .p-card-front { animation: i2-cf 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0.24s both; }
@keyframes i2-cb { from { transform: translate(-90px, 0) rotate(-28deg) scale(0.6); opacity: 0; } }
@keyframes i2-cm { from { transform: translate(   0,70px) scale(0.6); opacity: 0; } }
@keyframes i2-cf { from { transform: translate( 90px, 0) rotate( 28deg) scale(0.6); opacity: 0; } }

/* Icon 03 - Buergermeister/innen */
.ce_iconbox.icon3:hover .p-bg     { animation: i3-bg 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon3:hover .p-body   { animation: i3-bd 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0.1s  both; }
.ce_iconbox.icon3:hover .p-head   { animation: i3-hd 0.6s cubic-bezier(0.34, 1.4, 0.64, 1) 0.2s  both; }
.ce_iconbox.icon3:hover .p-chain  { animation: i3-ch 0.5s cubic-bezier(0.34, 1.6, 0.64, 1) 0.32s both; }
.ce_iconbox.icon3:hover .p-podium { animation: i3-pd 0.65s cubic-bezier(0.34, 1.45, 0.64, 1) 0.42s both; }
@keyframes i3-bg { from { transform: translate(0,-40px) scale(0.7); opacity: 0; } }
@keyframes i3-bd { from { transform: translate(0, 70px) scale(0.6); opacity: 0; } }
@keyframes i3-hd { from { transform: translate(0,-50px) scale(0.3); opacity: 0; } }
@keyframes i3-ch { from { transform: scale(0);                      opacity: 0; } }
@keyframes i3-pd { from { transform: translate(0, 40px) scale(0.7); opacity: 0; } }

/* Icon 04 - Unterstuetzung & Beratung */
.ce_iconbox.icon4:hover .p-bubble { animation: i4-bb 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon4:hover .p-gear-1 { animation: i4-g1 1.4s cubic-bezier(0.22, 0.7, 0.3, 1)  0.15s both; }
.ce_iconbox.icon4:hover .p-gear-2 { animation: i4-g2 1.4s cubic-bezier(0.22, 0.7, 0.3, 1)  0.35s both; }
@keyframes i4-bb { from { transform: scale(0.2); opacity: 0; } }
@keyframes i4-g1 { from { transform: translate(-26px,-22px) scale(0.2) rotate(-720deg); opacity: 0; } }
@keyframes i4-g2 { from { transform: translate( 26px,-22px) scale(0.2) rotate( 720deg); opacity: 0; } }

/* Icon 05 - Landesweiter Austausch */
.ce_iconbox.icon5:hover .p-fig-l { animation: i5-fl 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon5:hover .p-fig-r { animation: i5-fr 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0.15s both; }
@keyframes i5-fl { from { transform: translateX(-200px) scale(0.6); opacity: 0; } }
@keyframes i5-fr { from { transform: translateX( 200px) scale(0.6); opacity: 0; } }

/* Icon 06 - Initiative ergreifen (Flamme) */
.ce_iconbox.icon6:hover .p-flame { animation: i6-fl 0.8s cubic-bezier(0.34, 1.4, 0.64, 1) 0s   both; }
.ce_iconbox.icon6:hover .p-inner { animation: i6-in 0.55s cubic-bezier(0.34, 1.6, 0.64, 1) 0.3s both; }
@keyframes i6-fl { from { transform: translate(0, 60px) scale(0.3); opacity: 0; } }
@keyframes i6-in { from { transform: translate(0, 30px) scale(0);   opacity: 0; } }

/* Icon 07 - Neue Wege gehen (Strasse) */
.ce_iconbox.icon7:hover .p-road1 { animation: i7-r1 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon7:hover .p-road2 { animation: i7-r2 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) 0.18s both; }
@keyframes i7-r1 { from { transform: translate(-30px, 40px) scale(0.4); opacity: 0; } }
@keyframes i7-r2 { from { transform: translate( 30px, 40px) scale(0.4); opacity: 0; } }

/* Icon 08 - Nachbarschaften gestalten (Dorf-Szene) */
.ce_iconbox.icon8:hover .p-ground  { animation: i8-gd 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0s    both; }
.ce_iconbox.icon8:hover .p-house-m { animation: i8-hm 0.6s cubic-bezier(0.34, 1.4, 0.64, 1) 0.12s both; }
.ce_iconbox.icon8:hover .p-house-l { animation: i8-hl 0.6s cubic-bezier(0.34, 1.4, 0.64, 1) 0.22s both; }
.ce_iconbox.icon8:hover .p-house-r { animation: i8-hr 0.6s cubic-bezier(0.34, 1.4, 0.64, 1) 0.28s both; }
.ce_iconbox.icon8:hover .p-tree-l  { animation: i8-tl 0.5s cubic-bezier(0.34, 1.5, 0.64, 1) 0.42s both; }
.ce_iconbox.icon8:hover .p-tree-r  { animation: i8-tr 0.5s cubic-bezier(0.34, 1.5, 0.64, 1) 0.48s both; }
.ce_iconbox.icon8:hover .p-sun     { animation: i8-sn 0.5s cubic-bezier(0.34, 1.7, 0.64, 1) 0.6s  both; }
.ce_iconbox.icon8:hover .p-cloud   { animation: i8-cl 0.6s cubic-bezier(0.34, 1.4, 0.64, 1) 0.65s both; }
@keyframes i8-gd { from { transform: scaleX(0);                      opacity: 0; } }
@keyframes i8-hm { from { transform: translate(0, 50px) scale(0.5);  opacity: 0; } }
@keyframes i8-hl { from { transform: translate(0, 50px) scale(0.5);  opacity: 0; } }
@keyframes i8-hr { from { transform: translate(0, 50px) scale(0.5);  opacity: 0; } }
@keyframes i8-tl { from { transform: translate(0, 30px) scale(0);    opacity: 0; } }
@keyframes i8-tr { from { transform: translate(0, 30px) scale(0);    opacity: 0; } }
@keyframes i8-sn { from { transform: scale(0);                       opacity: 0; } }
@keyframes i8-cl { from { transform: translate(-40px, 0) scale(0.5); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    .ce_iconbox:hover .part { animation: none; }
}


/* ============================================================
   News-Teaser (newslist_v2): Datum ueber Headline, Headline rot,
   Hover-Underline auf Headline und Weiterlesen-Link.
   ============================================================ */
.newslist-v2 .info {
    margin-bottom: 0;
    line-height: 1.2;
}
.newslist-v2 .news-date-v2 {
    color: #000 !important;
}
.newslist-v2 .h4 {
    margin-top: 0;
    line-height: 1.2;
}
.newslist-v2 .h4 a,
.newslist-v2 .h4 {
    color: #861d33 !important;
    text-decoration: none;
}
.newslist-v2 .h4 a:hover {
    text-decoration: underline !important;
}
.newslist-v2 p.link a:hover,
.newslist-v2 .link a:hover {
    text-decoration: underline !important;
}

/* Silbentrennung im News-Bereich + auf den News-Detail-Seiten (page_3079 + page_3077).
   Wichtig: das Theme setzt global "a { hyphens: none; }" - wir muessen mit !important
   gegensteuern und Headlines + ihre Links explizit ansprechen.
   hyphenate-limit-chars: minimum 6 Zeichen Wort, mind. 3 vor + 2 nach Trennung. */
.newslist-v2 .h4,
.newslist-v2 .h4 a,
.newslist-v2 .teaser-v2,
.newslist-v2 .teaser-v2 p,
.newslist-v2 .subheadline-v2,
.newslist-v2 .link a,
body.page_3079 .ce_text,
body.page_3079 .ce_text p,
body.page_3079 .ce_text li,
body.page_3079 .ce_text a,
body.page_3079 .ce_headline,
body.page_3079 .ce_headline a,
body.page_3079 article,
body.page_3079 article p,
body.page_3079 article a,
body.page_3077 .ce_text,
body.page_3077 .ce_text p,
body.page_3077 .ce_text li,
body.page_3077 .ce_text a,
body.page_3077 .ce_headline,
body.page_3077 .ce_headline a,
body.page_3077 article,
body.page_3077 article p,
body.page_3077 article a {
    -webkit-hyphens: auto !important;
    -ms-hyphens: auto !important;
    hyphens: auto !important;
    -webkit-hyphenate-limit-chars: 6 3 2;
    -ms-hyphenate-limit-chars: 6 3 2;
    hyphenate-limit-chars: 6 3 2;
    word-break: normal;
    overflow-wrap: break-word;
}

/* Blocksatz fuer News-Body und Teaser-Text - nur ab Tablet/Desktop, auf Mobile
   waeren die Spalten zu schmal und Blocksatz wuerde wieder Luecken reissen. */
@media (min-width: 768px) {
    .newslist-v2 .teaser-v2,
    .newslist-v2 .teaser-v2 p,
    body.page_3079 .ce_text p,
    body.page_3079 article p,
    body.page_3077 .ce_text p,
    body.page_3077 article p {
        text-align: justify;
    }
}

/* News-Detail (newsreader): graue Datums-Box raus, Datum schlicht ueber Headline,
   Format wie im Teaser ("28. Juni 2025"), Kalender-Icon weg, Datum fett in Bodytext-Groesse. */
.newsreader .info {
    background: none !important;
    padding: 0 !important;
    margin-bottom: 2px !important;
    font-size: 1em !important;
    line-height: 1.2;
}
.newsreader .info .date {
    color: #000 !important;
    margin-right: 0;
    font-weight: 700;
}
.newsreader .info .date:before {
    content: none !important;
}
@media only screen and (max-width: 767px) {
    .newsreader .info {
        padding: 0 !important;
    }
}

/* News-Teaser (presse, aktuelle-informationen): smoother Hover-Zoom */
.newslist-v2 .news-image-v2 .image_container { overflow: hidden; }
.newslist-v2 .news-image-v2 img {
    display: block;
    transform: scale(1);
    transform-origin: center center;
    transition: transform 600ms cubic-bezier(.4, 0, .2, 1);
    will-change: transform;
    backface-visibility: hidden;
}
.newslist-v2 .news-image-v2:hover img {
    transform: scale(1.07);
    transition: transform 1100ms cubic-bezier(.16, 1, .3, 1);
}

/* Eventliste & Eventreader: Ort komplett ausblenden,
   Titel-Hover unterstrichen, Datum schwarz und nie umbrechen */
.mod_eventlist .event .location,
.mod_eventlist_v2 .event .location,
.mod_eventreader .info .location {
    display: none !important;
}
/* Trennlinien zwischen Events */
.mod_eventlist_v2 .event {
    border-top: 1px solid #cccccc !important;
}

/* Header-Row "DATUM | VERANSTALTUNG | UHRZEIT" in Brand-Rot.
   Spezifität: .event.event-header (gechained, 4 Klassen) — schlaegt die
   .event .date 'schwarz'-Regel oben, die nur 3 Klassen hat. */
.mod_eventlist_v2 .event-header,
.mod_eventlist_v2 .event-header:hover {
    background: transparent !important;
    text-transform: uppercase;
}
.mod_eventlist_v2 .event.event-header .date,
.mod_eventlist_v2 .event.event-header .title,
.mod_eventlist_v2 .event.event-header .time {
    color: var(--accentColor) !important;
    font-size: 1.3rem !important;
    font-weight: bold !important;
}
.mod_eventlist_v2 .event.event-header .date,
.mod_eventlist_v2 .event.event-header .title {
    text-align: left !important;
}
/* UHRZEIT-Header und Wert-Time BEIDE linksbuendig.
   Damit beginnen "UHRZEIT" und "<icon>16:00..." an exakt derselben x-Position. */
.mod_eventlist_v2 .event .time {
    text-align: left !important;
}

/* Zeilenabstand bei mehrzeiligen Eventtiteln reduzieren
   (Theme setzt line-height: 2.5rem auf .event, das ist innerhalb des Titels zu hoch) */
.mod_eventlist_v2 .event {
    line-height: 1.5 !important;
    padding: 12px 5px !important;
}
/* Hover-Hintergrund fliederfarben statt Theme-Grau (Kopfzeile ausgenommen) */
.mod_eventlist_v2 .event:not(.event-header):hover {
    background: #f5edf5 !important;
}
.mod_eventlist_v2 .event:last-of-type {
    border-bottom: 1px solid #cccccc !important;
}
.mod_eventlist_v2 .date {
    border-right: 2px solid #cccccc !important;
}
.mod_eventlist_v2 .location {
    border-left: 2px solid #cccccc !important;
}

.mod_eventlist .event .title a,
.mod_eventlist_v2 .event .title a {
    color: #000 !important;
    text-decoration: none !important;
}
.mod_eventlist .event .title a:hover,
.mod_eventlist_v2 .event .title a:hover {
    color: var(--accentColor) !important;
    text-decoration: underline !important;
}
.mod_eventlist .event .date,
.mod_eventlist_v2 .event .date {
    color: #000 !important;
    white-space: nowrap !important;
    padding-right: 22px !important;
}
/* Detail: Info-Block (graues Datum oben rechts) ausblenden,
   Bild links neben den Body-Text floaten, Title in Brand-Rot */
.mod_eventreader .info {
    display: none !important;
}
.mod_eventreader .event > .title.h2 {
    color: var(--accentColor) !important;
}
.mod_eventreader .event {
    overflow: hidden; /* BFC: faengt Floats zuverlaessig ab */
}
.mod_eventreader .event > .ce_text {
    overflow: hidden; /* h3 + p fliessen sauber neben das Bild */
}
.mod_eventreader .event > figure.image_container {
    float: left;
    width: 35%;
    max-width: 340px;
    margin: 4px 24px 12px 0;
    padding: 0;
    border: 1px solid #c8c8c8;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 10px 22px -8px rgba(0, 0, 0, 0.28), 0 3px 6px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}
.mod_eventreader .event > figure.image_container img {
    width: 100%;
    height: auto;
    display: block;
}
@media (max-width: 600px) {
    .mod_eventreader .event > figure.image_container {
        float: none;
        max-width: 100%;
        width: 100%;
        margin: 0 0 16px 0;
    }
}

/* ==========================================================================
   ce_headerimage_custom — fuer ext_projekte_header.php (PHP-Custom-Header).
   Gescopt ueber Extra-Klasse, damit andere ce_headerimage-Elemente nicht
   beeinflusst werden. Werte = 1:1 aus customelements/ce_headerimage.css.
   ========================================================================== */
.ce_headerimage.ce_headerimage_custom {
    padding: 0;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.ce_headerimage.ce_headerimage_custom.height_small   { height: 250px; }
.ce_headerimage.ce_headerimage_custom.height_medium  { height: 350px; }
.ce_headerimage.ce_headerimage_custom.height_large   { height: 450px; }
.ce_headerimage.ce_headerimage_custom.height_xlarge  { height: 600px; }
.ce_headerimage.ce_headerimage_custom.height_xxlarge { height: 750px; }
.ce_headerimage.ce_headerimage_custom.bg_center_center { background-position: center center; }
.ce_headerimage.ce_headerimage_custom.bg_center_top    { background-position: center top; }
.ce_headerimage.ce_headerimage_custom.bg_center_bottom { background-position: center bottom; }
/* Default-Bild header_projekte2.jpg: Schild "HALLO NACHBAR" liegt unten,
   bei reduzierter Hoehe nicht mittig sondern unten ausrichten. */
.ce_headerimage.ce_headerimage_custom.ce_headerimage_custom_default { background-position: center bottom; }

/* Projekt-Detailseite: Projektname als Headline rot (Akzentfarbe) */
.pf-projektname { color: var(--accentColor); }

/* Pagination innerhalb von ce_text-Wrapper: Bullets entfernen
   (.ce_text ul li hat list-style:disc, ueberschreibt .pagination li). */
.ce_text .pagination ul,
.ce_text .pagination ul li {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

/* Projekt-Detailseite: Galerie aus upload_bild2/3/4 mit Lightbox-Trigger */
.pf-galerie {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 20px 0 30px;
}
.pf-galerie a {
    display: block;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #cfcfcf;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.pf-galerie img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.pf-galerie a:hover img { transform: scale(1.05); }
@media (max-width: 767px) {
    .pf-galerie { grid-template-columns: 1fr; gap: 10px; }
    .pf-galerie img { height: 230px; }
}

@media only screen and (max-width: 767px) {
    .ce_headerimage.ce_headerimage_custom {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .ce_headerimage.ce_headerimage_custom.height_small   { height: 180px; }
    .ce_headerimage.ce_headerimage_custom.height_medium  { height: 200px; }
    .ce_headerimage.ce_headerimage_custom.height_large   { height: 250px; }
    .ce_headerimage.ce_headerimage_custom.height_xlarge  { height: 350px; }
    .ce_headerimage.ce_headerimage_custom.height_xxlarge { height: 400px; }
}

/* ============================================================
   Interessenbekundungsbogen Ortsbürgermeister:innen
   (Template ext_buergermeisterinnen_interessensbekundungsbogen)
   ============================================================ */
/* Abschnittsüberschriften */
.bm-section {
    margin: 30px 0 10px;
    padding-bottom: 5px;
    border-bottom: 2px solid #861d33;
    color: #861d33;
}
.bm-section:first-of-type { margin-top: 20px; }

/* Bedingte Felder (werden per JS ein-/ausgeblendet) */
.bm-cond { display: none; }
.bm-cond.open { display: block; }
.bm-cond-inline { margin-top: 8px; }
.bm-sublabel { font-size: 0.85em; }
.bm-legend-hint { font-weight: normal; font-size: 0.85em; opacity: 0.75; }

/* Datenschutz-/Hinweistext */
.bm-hinweis { font-size: 0.8em; color: #888; margin-top: 10px; }

/* Absenden-Button rechtsbündig */
.bm-submit-wrap { margin-top: 20px; text-align: right; }
.bm-submit-wrap .submit { font-size: 1.1em; }

/* Erfolgsmeldung nach dem Absenden */
.bm-erfolg {
    background: #f4f9f4;
    border: 2px solid #27ae60;
    border-radius: 8px;
    padding: 24px 28px;
    margin: 20px 0;
}
.bm-erfolg h3 { color: #27ae60; margin-bottom: 10px; }

/* Übermittlungs-Overlay */
.bm-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,.6);
    z-index: 99999;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    backdrop-filter: blur(3px);
}
.bm-overlay.active { display: flex; }
.bm-spinner {
    width: 56px; height: 56px;
    border: 4px solid rgba(255,255,255,.2);
    border-top: 4px solid #861d33;
    border-radius: 50%;
    animation: bmspin 0.8s linear infinite;
}
@keyframes bmspin { to { transform: rotate(360deg); } }
.bm-overlay-text { color: #fff; font-size: 1.1em; margin-top: 18px; letter-spacing: 0.5px; }

/* Datenschutz-Einwilligung: einzelne Checkbox sauber ausrichten
   (Theme macht span=flex + mandatory=flex, das bricht das Layout um) */
.bm-datenschutz fieldset { border: none; padding: 0; }
.bm-datenschutz fieldset > span { display: flex; align-items: flex-start; gap: 12px; }
.bm-datenschutz input.checkbox { flex: 0 0 auto; width: 20px; height: 20px; margin: 2px 0 0 0; float: none; }
.bm-datenschutz label { flex: 1 1 auto; display: block; margin: 0; line-height: 1.4; }

/* News-Liste: title-Text des Bildes zusätzlich als sichtbare Bildunterschrift
   unter dem Foto (title-Attribut bleibt am Bild-Link erhalten) */
.newslist-v2 .news-image-caption-v2 {
    margin-top: 8px;
    font-size: 0.82em;
    line-height: 1.4;
    color: rgb(120,120,120);
    font-style: italic;
}
.bm-datenschutz label .mandatory { display: inline; position: static; float: none; margin: 0 0 0 2px; }

/* ===== Startseite "Aktuelles": News als 3-spaltiges Kachel-Raster ===== */
.mod_newslist.aktuelles-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.mod_newslist.aktuelles-grid .newslist-v2.item {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    transition: box-shadow .2s ease, transform .2s ease;
    margin: 0;
    height: 100%;
}
.mod_newslist.aktuelles-grid .newslist-v2.item:hover { box-shadow: 0 8px 20px rgba(0,0,0,0.10); transform: translateY(-2px); }
.mod_newslist.aktuelles-grid .newslist-v2 .news-image-v2 { margin: 0; }
.mod_newslist.aktuelles-grid .newslist-v2 .image_container { margin: 0 !important; float: none !important; }
.mod_newslist.aktuelles-grid .newslist-v2 .image_container img { width: 100%; height: auto; display: block; }
.mod_newslist.aktuelles-grid .newslist-v2 .news-image-caption-v2 { display: none; } /* Bildunterschrift im Teaser ausblenden (wie alte Startseite) */
.mod_newslist.aktuelles-grid .newslist-v2 .news-content-v2 { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1 1 auto; }
.mod_newslist.aktuelles-grid .newslist-v2 .news-date-v2 { font-size: 0.8em; color: #878786; }
.mod_newslist.aktuelles-grid .newslist-v2 .h4 { margin: 6px 0 10px; font-size: 1.375em; line-height: 1.25; }
.mod_newslist.aktuelles-grid .newslist-v2 .h4 a { color: inherit; }
.mod_newslist.aktuelles-grid .newslist-v2 .teaser-v2 { font-size: 1em; line-height: 1.6; }
.mod_newslist.aktuelles-grid .newslist-v2 p.link { margin: auto 0 0; padding-top: 12px; }
@media (max-width: 991px) { .mod_newslist.aktuelles-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .mod_newslist.aktuelles-grid { grid-template-columns: 1fr; } }

/* Lightbox (Colorbox): Bildunterschrift nicht ueber das Bild legen.
   Das Theme positioniert #cboxTitle mit top:-20px ueber dem Bild; bei
   mehrzeiligen Titeln ragt der Text ins Bild ("graetscht rein").
   Die Bildunterschrift steht ohnehin als figcaption unter dem Bild im
   Artikel -> in der Lightbox ausblenden. */
#cboxTitle { display: none !important; }


/* === Subheadline-Kontrast: helles Grau (#b4b4b4 / rgb 180) -> Mittelgrau (#6f6f6f) ===
   Anlass unterstuetzung-beratung: .subheadline war zu hell (Kontrast ~1,9:1).
   Global angehoben; die hellen color-white-Varianten (auf dunklem Grund)
   bleiben unberuehrt, da spezifischer. */
body .ce_text_image_bar .subheadline,
body .newslist-v5 .subheadline,
body .single-subheadline {
    color: #6f6f6f;
}

/* === KI-Kennzeichnung KI-generierter Inhalte (EU AI Act Art. 50) ===========
   Chip "Mit KI erstellt". Bild-/Video-basiert selektiert -> greift auf jeder
   Seite mit dem jeweiligen KI-Element. Responsive-sicher, stoert keine Klicks.
   ========================================================================== */

/* -- Gruppe A: Flaechen mit Inline-Background (Header, Bildbaender, Imagebox) -- */
.ce_headerimage[style*="header/header_projekte2.jpg"],
.ce_headerimage[style*="header/buergermeisterinnen_header.jpg"],
.ce_headerimage[style*="header/header_lebo2.jpg"],
.ce_headerimage[style*="header/header_mitmachen_im_netzwerk.jpg"],
.ce_headerimage[style*="header/header_presse2.jpg"],
.ce_headerimage[style*="header/partner.jpg"],
.ce_bgimage:has(.ce_bgimage-image[style*="header/background_ueberuns3.jpg"]),
.ce_bgimage:has(.ce_bgimage-image[style*="bilder-unterstuetzung-beratung/header_unterstuetzung-beratung.jpg"]),
.ce_bgimage:has(.ce_bgimage-image[style*="cto_layout/bbg3.jpg"]),
.imagebox[style*="bilder-unterstuetzung-beratung/04.jpg"],
.imagebox[style*="bilder-unterstuetzung-beratung/05.jpg"],
/* -- Gruppe B: Inhaltsbilder als <img> in figure.image_container -- */
.image_container:has(img[src*="_arbeitshilfen/ah2.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/ahh_01.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/ahh_02.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/dd_01.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/dd_02.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/flyer_linn.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/flyn.jpg"]),
.image_container:has(img[src*="_arbeitshilfen/leboneu.jpg"]),
.image_container:has(img[src*="img/lb02.jpg"]){
  position:relative;
}
.ce_headerimage[style*="header/header_projekte2.jpg"]::after,
.ce_headerimage[style*="header/buergermeisterinnen_header.jpg"]::after,
.ce_headerimage[style*="header/header_lebo2.jpg"]::after,
.ce_headerimage[style*="header/header_mitmachen_im_netzwerk.jpg"]::after,
.ce_headerimage[style*="header/header_presse2.jpg"]::after,
.ce_headerimage[style*="header/partner.jpg"]::after,
.ce_bgimage:has(.ce_bgimage-image[style*="header/background_ueberuns3.jpg"])::after,
.ce_bgimage:has(.ce_bgimage-image[style*="bilder-unterstuetzung-beratung/header_unterstuetzung-beratung.jpg"])::after,
.ce_bgimage:has(.ce_bgimage-image[style*="cto_layout/bbg3.jpg"])::after,
.imagebox[style*="bilder-unterstuetzung-beratung/04.jpg"]::after,
.imagebox[style*="bilder-unterstuetzung-beratung/05.jpg"]::after,
.image_container:has(img[src*="_arbeitshilfen/ah2.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/ahh_01.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/ahh_02.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/dd_01.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/dd_02.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/flyer_linn.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/flyn.jpg"])::after,
.image_container:has(img[src*="_arbeitshilfen/leboneu.jpg"])::after,
.image_container:has(img[src*="img/lb02.jpg"])::after{
  content:"Mit KI erstellt";
  position:absolute;
  right:clamp(8px,1.4vw,20px);
  bottom:clamp(8px,1.4vw,20px);
  z-index:20;
  padding:5px 11px;
  font-size:clamp(11px,1.1vw,13px);
  font-weight:600; line-height:1; white-space:nowrap;
  color:#111; background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.12); border-radius:8px;
  box-shadow:0 1px 4px rgba(0,0,0,.28);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  pointer-events:none; visibility:visible; overflow:visible; width:auto; height:auto;
}

/* -- Gruppe C: Video (Chip OBEN, damit Steuerleiste frei bleibt) -- */
.ce_player:has(source[src*="video_v4.mp4"]){ position:relative; }
.ce_player:has(source[src*="video_v4.mp4"])::after{
  content:"Video mit KI erstellt";
  position:absolute;
  right:clamp(8px,1.4vw,20px);
  bottom:calc(clamp(8px,1.4vw,20px) + 20px);
  z-index:20;
  padding:5px 11px;
  font-size:clamp(11px,1.1vw,13px);
  font-weight:600; line-height:1; white-space:nowrap;
  color:#111; background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.12); border-radius:8px;
  box-shadow:0 1px 4px rgba(0,0,0,.28);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  pointer-events:none; visibility:visible; overflow:visible; width:auto; height:auto;
}

/* === Galerie-Bildunterschrift: nur in der Lightbox, nicht auf dem Grid-Thumbnail ===
   Anlass projekt-des-monats (AG_Mensch1 "Jung trifft alt"): Die in der Dateiverwaltung
   gepflegte Bildunterschrift soll pro Galeriebild NUR in der Lightbox erscheinen,
   nicht als Overlay auf dem Vorschaubild im Raster. */
.ce_gallery .flex-gallery figure.image_container > .caption { display: none !important; }

/* Lightbox-Caption (#cboxCaption wird per Theme-JS aus dem .caption-Geschwister erzeugt):
   feste, immer sichtbare Leiste am unteren Bildrand - auch bei hohen Hochkant-Bildern,
   die sonst die Box ueber den Sichtbereich schieben. */
#cboxCaption {
  position: fixed !important;
  left: 0 !important; right: 0 !important; bottom: 0 !important;
  width: auto !important; max-width: 900px !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  padding: 12px 18px !important;
  background: rgba(0,0,0,.82) !important;
  color: #fff !important;
  font-size: 14px !important; line-height: 1.45 !important;
  text-align: center !important;
  z-index: 100000 !important;
}