/* Koordinierungsstelle Demokratie – Theme
 * Kopf/Fuß: Orange als Akzent; Hauptbereich: ausschließlich Schwarz auf Weiß
 * mit einem hellen Grün (#85c441) als Akzent für Überschriften, Links und
 * Breadcrumbs. Kein Grau, kein Violett, kein Gelb.
 */

/* Alle Web-Schriften werden ausschliesslich lokal ausgeliefert; es wird nichts extern
 * (Google Fonts, Brevo-CDN, etc.) nachgeladen. Die woff2-Dateien liegen in assets/fonts/.
 * - Inter 400/700: Haupt-/Fliesstext, Navigation, Buttons, UI.
 * - Arvo 700: H1 und H1-aehnliche Ueberschriften (z. B. Newsletter-Overlay-Titel). */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Arvo";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/arvo-bold.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Logo / Akzentfarben (Kopfzeile / Fußzeile) */
  --accent-violet: #815ea0;
  --accent-orange: #f9b001;
  --accent-yellow: #feed01;
  /* Einziger Akzent im Hauptbereich: Hellgrün */
  --accent-main: #85c441;
  /* Semantik (bestehende Klassen nutzen weiterhin --bluemedian etc.) */
  --bluemedian: var(--accent-violet);
  --bluedark: #000000;
  --blueaccent: var(--accent-orange);
  --text: #000000;
  --text-muted: #000000;
  /* „Letterbox"-Rand, falls Teaserbilder auf Vorgabegröße eingepasst werden: WEISS */
  --bg-soft: #ffffff;
  --bg-softer: #ffffff;
  --white: #ffffff;
  /* Im Hauptbereich bewusst minimal: keine grauen Kanten */
  --border: rgba(0, 0, 0, 0.12);
  --max: 80rem;
  /* Grüne Trennlinie oberhalb Orange + oranger Abschlussstreifen unten: gleiche Höhe. */
  --kdmh-main-end-line-h: 27px;
  /* Einheitliche Basis-Schriftgröße: 17 px (auf rem-Basis 16 px),
   * wird im gesamten Main-Bereich, in der Navigation und im Footer gespiegelt. */
  --font-base: 1.0625rem;
  /* Optional für Komponenten, die die Navi visuell stärker setzen sollen (Hauptleiste nutzt --font-base). */
  --font-nav-desktop: 1.1875rem;
  --font-display: "Arvo", Georgia, "Times New Roman", serif;
  /* Für spätere Startseiten-Sektionen: Orange auf Gelb */
  --section-yellow-bg: var(--accent-yellow);
  /* Navigation: per Custom CSS / Injektion überschreibbar */
  --header-z: 200;
  --header-overlay-z: 250;
  --header-icon-size: 2.75rem;
  --header-icon-inner: 1.25rem;
  --header-partner-icon-inner: 1.75rem;
  --header-nav-bg: var(--accent-orange);
  --header-nav-pill-pad-x: 1rem;
  --header-nav-pill-pad-y: 0.45rem;
  --header-tools-gap: 0.7rem;
  /* Höhe Logo: per CSS skalierbar (klein/Portrait: --brand-logo-height-mobile; Desktop: --brand-logo-height).
   * Werte sind bewusst groß gewählt, damit das Haupt- und Partner-/Bündnislogo präsent bleiben. */
  --brand-logo-height-mobile: 5.5rem;
  --brand-logo-height: 11rem;
  /* Sticky-Offset für Anker (kann mit Injection erhöht werden) */
  --scroll-pad-top: 6rem;
  /* Kein grauer Rand mehr links/rechts vom Content */
  --site-shell-bg: #ffffff;
  --footer-newsletter-pad-y: 3rem;
}

/* Dunkelmodus: ausschließlich #fff auf #000 – keine Akzentfarben im Layout.
 * Wir biegen alle Akzentfarben auf Weiß, so dass Text/Rahmen überall weiß werden.
 * Flächen, die vorher mit Akzent eingefärbt waren (Buttons, Headerbänder, Abschlussleiste
 * etc.), werden unten per Regel explizit auf Schwarz zurückgezogen, damit nirgends Weiß-
 * auf-Weiß entsteht und der Modus durchgängig „weiße Schrift auf schwarzem Grund" bleibt.
 */
html[data-theme="dark"] {
  color-scheme: dark;
  --text: #ffffff;
  --text-muted: #ffffff;
  --white: #000000;
  --bg-soft: #000000;
  --bg-softer: #000000;
  --border: #ffffff;
  --site-shell-bg: #000000;
  --bluedark: #ffffff;
  --bluemedian: #ffffff;
  --blueaccent: #ffffff;
  --accent-violet: #ffffff;
  --accent-orange: #ffffff;
  --accent-yellow: #ffffff;
  --accent-main: #ffffff;
  --section-yellow-bg: #000000;
  --header-nav-bg: #000000;
}

html[data-theme="dark"] body {
  background: #000000;
  color: #ffffff;
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .header-top,
html[data-theme="dark"] .header-nav-strip,
html[data-theme="dark"] .nav-mobile {
  background: #000000;
  border-color: #ffffff;
}

html[data-theme="dark"] .cta-band,
html[data-theme="dark"] .cta-band p,
html[data-theme="dark"] .cta-band h2 {
  background: #000000;
  color: #ffffff;
}

html[data-theme="dark"] .cta-band {
  background-image: none;
}

html[data-theme="dark"] .site-footer-newsletter {
  background: #000000;
  color: #ffffff;
}

html[data-theme="dark"] .site-footer-newsletter__eyebrow,
html[data-theme="dark"] .site-footer-newsletter__title,
html[data-theme="dark"] .site-footer-newsletter__text {
  color: #ffffff;
}

/* Dunkelmodus: Footer-CTA ebenfalls komplett statisch (kein Hover-Effekt). */
html[data-theme="dark"] .site-footer-newsletter__btn,
html[data-theme="dark"] .site-footer-newsletter__btn:hover,
html[data-theme="dark"] .site-footer-newsletter__btn:focus,
html[data-theme="dark"] .site-footer-newsletter__btn:focus-visible,
html[data-theme="dark"] .site-footer-newsletter__btn:active {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
  box-shadow: none;
}

html[data-theme="dark"] .site-footer-newsletter__btn:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

html[data-theme="dark"] .site-main-end-rule,
html[data-theme="dark"] .site-footer-endcap {
  background: #ffffff;
}

html[data-theme="dark"] .footer-copy-line {
  border-top-color: #ffffff;
  color: #ffffff;
}

html[data-theme="dark"] .footer-legal-nav a {
  color: #ffffff;
}

html[data-theme="dark"] .breadcrumb__sep {
  color: #ffffff;
  opacity: 1;
}

html[data-theme="dark"] .breadcrumb a {
  color: #ffffff;
}

/* Aktueller, nicht klickbarer Breadcrumb-Teil: ebenfalls Weiß. */
html[data-theme="dark"] .breadcrumb__current {
  color: #ffffff;
}

/* Header-Icons im Dunkelmodus: alles #fff auf #000, weißer Rahmen zur Abhebung */
html[data-theme="dark"] .header-icon,
html[data-theme="dark"] .header-icon--service,
html[data-theme="dark"] .header-icon--contact {
  background: #000000;
  color: #ffffff;
  box-shadow: 0 0 0 1px #ffffff inset;
}

html[data-theme="dark"] .header-icon:hover,
html[data-theme="dark"] .header-icon:focus-visible {
  background: #ffffff;
  color: #000000;
  box-shadow: 0 0 0 1px #ffffff inset;
}

html[data-theme="dark"] .header-icon--partner-bare,
html[data-theme="dark"] .header-icon--partner-bare:hover,
html[data-theme="dark"] .header-icon--partner-bare:focus-visible {
  background: transparent;
  box-shadow: none;
}

/* Tooltips Dunkel: weiß auf schwarz, weißer Rahmen */
@media (min-width: 900px) {
  html[data-theme="dark"] .header-tools__service .header-icon-popover,
  html[data-theme="dark"] .header-tools__contact .header-icon-popover {
    background: #000000;
    color: #ffffff;
    border-color: #ffffff;
    box-shadow: 0 8px 24px rgba(255, 255, 255, 0.15);
  }

  html[data-theme="dark"] .header-tools__service .header-icon-popover::before,
  html[data-theme="dark"] .header-tools__contact .header-icon-popover::before {
    border-color: transparent transparent #000000 transparent;
  }
}

/* Dunkelmodus Hauptnavigation: weiße Links OHNE Unterstreichung.
 * Aktive Seite bleibt als weiße Pille mit schwarzer Schrift markiert. */
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item > a,
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item > a:hover,
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item > a:focus,
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item > a:active {
  color: #ffffff;
  background: transparent;
  text-decoration: none;
}

html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item > a:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item.current-menu-item > a,
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item.current-menu-ancestor > a,
html[data-theme="dark"] .nav-primary-bar .menu--primary-bar > .menu-item.current_page_item > a {
  background: #ffffff;
  color: #000000;
  text-decoration: none;
}

html[data-theme="dark"] .nav-primary-bar .sub-menu {
  background: #000000;
  border-color: #ffffff;
}

html[data-theme="dark"] .nav-primary-bar .sub-menu .menu-item > a {
  color: #ffffff;
  background: #000000;
  text-decoration: none;
}

html[data-theme="dark"] .nav-primary-bar .sub-menu .menu-item > a:hover,
html[data-theme="dark"] .nav-primary-bar .sub-menu .menu-item > a:focus-visible {
  background: #ffffff;
  color: #000000;
  text-decoration: none;
}

html[data-theme="dark"] .nav-mobile .menu--mobile > .menu-item > a,
html[data-theme="dark"] .nav-mobile .sub-menu a {
  color: #ffffff;
  text-decoration: none;
}

html[data-theme="dark"] .nav-mobile .menu--mobile > .menu-item.current-menu-item > a,
html[data-theme="dark"] .nav-mobile .menu--mobile > .menu-item.current-menu-ancestor > a,
html[data-theme="dark"] .nav-mobile .menu--mobile > .menu-item.current_page_item > a {
  color: #ffffff;
  text-decoration: none;
}

html[data-theme="dark"] .nav-mobile {
  background:
    linear-gradient(var(--accent-orange), var(--accent-orange)) left 100% / 100% var(--kdmh-main-end-line-h, 27px) no-repeat,
    #000000;
}

html[data-theme="dark"] .nav-burger {
  color: #ffffff;
}

html[data-theme="dark"] .kdmh-search-overlay__panel {
  background: #000000;
  border-color: #ffffff;
}

html[data-theme="dark"] .kdmh-search-overlay__title,
html[data-theme="dark"] .kdmh-search-overlay__input,
html[data-theme="dark"] .kdmh-search-overlay__close,
html[data-theme="dark"] .kdmh-search-overlay__icon {
  color: #ffffff;
}

html[data-theme="dark"] .kdmh-search-overlay__input {
  background: #000000;
  border-color: #ffffff;
}

html[data-theme="dark"] .kdmh-search-overlay__submit {
  background: #ffffff;
  color: #000000;
}

html[data-theme="dark"] .kdmh-search-overlay__submit:hover,
html[data-theme="dark"] .kdmh-search-overlay__submit:focus-visible {
  background: #000000;
  color: #ffffff;
  box-shadow: 0 0 0 2px #ffffff inset;
}

/* Dunkelmodus: Flächen, die im Light-Mode mit Orange/Gelb/Violett gefüllt sind,
 * explizit auf Schwarz ziehen (sonst würden sie durch die Variablen-Umbiegung weiß). */
html[data-theme="dark"] .brand-mark,
html[data-theme="dark"] .hero-visual,
html[data-theme="dark"] .site-shell > .front-team,
html[data-theme="dark"] .section-bg-yellow {
  background: #000000;
  background-image: none;
}

html[data-theme="dark"] .btn-on-dark,
html[data-theme="dark"] .kdmh-search-overlay__submit {
  background: #ffffff;
  color: #000000;
  box-shadow: none;
}

html[data-theme="dark"] .btn-on-dark:hover,
html[data-theme="dark"] .btn-on-dark:focus-visible {
  background: #000000;
  color: #ffffff;
  box-shadow: 0 0 0 2px #ffffff inset;
}

/* Haupt-Buttons (.btn-primary + Weiterlesen) im Dunkelmodus: schwarz mit weißem Rahmen und weißer Schrift – Hover kehrt um. */
html[data-theme="dark"] .btn-primary {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
  box-shadow: none;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus-visible {
  background: #ffffff;
  color: #000000;
  box-shadow: none;
}

/* Tag-Pills im Beitrag: im Dunkelmodus schwarz mit weißer Schrift */
html[data-theme="dark"] .entry-tags a {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
}

html[data-theme="dark"] .entry-tags a:hover,
html[data-theme="dark"] .entry-tags a:focus-visible {
  background: #ffffff;
  color: #000000;
}

html[data-theme="dark"] .team-card .avatar,
html[data-theme="dark"] .front-team .team-card .avatar {
  border-color: #ffffff;
}

html[data-theme="dark"] .cta-band .eyebrow,
html[data-theme="dark"] .eyebrow {
  color: #ffffff;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--scroll-pad-top);
}

body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: var(--font-base);
  line-height: 1.55;
  color: var(--text);
  background: var(--site-shell-bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  background: none;
}

.site-header {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: var(--header-z);
  isolation: isolate;
}

body.admin-bar .site-header {
  top: 32px;
}

@media screen and (max-width: 782px) {
  body.admin-bar .site-header {
    top: 46px;
  }
}

.header-top {
  background: var(--white);
}

.header-inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0.75rem 1.25rem;
}

.header-inner--top {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.75rem;
}

.header-brand-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-align: left;
  flex: 1 1 auto;
  min-width: 0;
}

.brand--logo {
  max-width: 100%;
}

.brand__image {
  display: block;
  height: var(--brand-logo-height-mobile);
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

@media (min-width: 900px) {
  .brand__image {
    height: var(--brand-logo-height);
  }
}

.brand-mark {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-orange), var(--accent-yellow));
  flex-shrink: 0;
}

.brand-text {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--bluedark);
  letter-spacing: 0.02em;
}

.brand-text small {
  display: block;
  font-weight: 400;
  color: var(--accent-orange);
  letter-spacing: 0;
}

.header-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 0.9rem;
  column-gap: var(--header-tools-gap);
  width: 100%;
  min-height: 0;
  padding: 0.15rem 0;
}

.header-tools__service,
.header-tools__contact {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--header-tools-gap);
  min-height: var(--header-icon-size);
}

.header-tools__partner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.header-tools__partner .header-icon-slot {
  display: flex;
  justify-content: center;
  min-width: 0;
}

/* Portrait / Mobile (bis 899 px): eine Icon-Zeile unter dem Logo — Newsletter,
 * E-Mail, Facebook, Instagram, Dunkelmodus. Kein Bündnislogo (steht in der Fußzeile),
 * keine Suche; Desktop-Dunkelmodus + Service-Spalte ausgeblendet. */
@media (max-width: 899px) {
  .header-tools__partner {
    display: none !important;
  }

  .header-tools__service {
    display: none !important;
  }

  .header-tools {
    row-gap: 1rem;
    justify-content: center;
    column-gap: 1rem;
  }

  .header-tools__contact {
    order: 1;
    flex: 1 0 100%;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.1rem;
    padding: 0.15rem 0.15rem 0;
  }

  .header-tools__contact .header-icon {
    width: 3rem;
    height: 3rem;
    min-width: 3rem;
    min-height: 3rem;
  }

  .header-tools__contact .header-icon svg {
    width: 1.45rem;
    height: 1.45rem;
  }
}

.header-icon-slot {
  position: relative;
}

.header-icon {
  flex: 0 0 auto;
  width: var(--header-icon-size);
  height: var(--header-icon-size);
  min-width: var(--header-icon-size);
  min-height: var(--header-icon-size);
  border-radius: 50%;
  background: var(--accent-orange);
  color: #000000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.header-icon svg {
  flex-shrink: 0;
  width: var(--header-icon-inner);
  height: var(--header-icon-inner);
}

/* Service-Icons (Suche, Dunkelmodus): schwarzer Kreis, weißes Icon – abgesetzt von den restlichen */
.header-icon--service {
  background: #000000;
  color: #ffffff;
}

/* Kein Schatten beim Hover (Wunsch: einheitlich ohne „box-shadow"-Effekt). */
.header-icon--service:hover,
.header-icon--service:focus-visible {
  box-shadow: none;
}

.header-icon__sun {
  display: none;
}

html[data-theme="dark"] .header-icon[data-darkmode-trigger] .header-icon__moon {
  display: none;
}

html[data-theme="dark"] .header-icon[data-darkmode-trigger] .header-icon__sun {
  display: block;
}

/* Header-Icons allgemein: Hover ohne Schatten. Feedback erfolgt über
 * Fokus-Outline + leichten Farb-/Transform-Übergang. */
.header-icon:hover,
.header-icon:focus-visible {
  box-shadow: none;
  outline: none;
}

.header-icon:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 2px;
}

.header-icon--social svg {
  display: block;
}

.header-icon--partner {
  padding: 0.25rem;
  overflow: hidden;
}

/* Volles Partnerlogo (Farbe); Injektion: --header-partner-icon-inner anpassen */
.header-icon--partner img {
  width: var(--header-partner-icon-inner);
  height: var(--header-partner-icon-inner);
  max-width: none;
  max-height: none;
  object-fit: contain;
}

/* Partnerlogo rechts: ohne orangenen Kreis, freistehend */
.header-icon--partner-bare {
  background: transparent;
  border-radius: 0.375rem;
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
}

.header-icon--partner-bare:hover,
.header-icon--partner-bare:focus-visible {
  box-shadow: none;
}

.header-icon--partner-bare:focus-visible {
  outline: 2px solid var(--accent-orange);
  outline-offset: 3px;
}

/* Bündnislogo: synchron skaliert mit dem Hauptlogo (deutlich präsent auf Desktop + Mobile). */
.header-icon--partner-bare img {
  width: auto;
  height: auto;
  max-width: 19rem;
  max-height: 6rem;
  object-fit: contain;
}

@media (max-width: 899px) {
  .header-tools__partner .header-icon--partner-bare img {
    max-width: min(100%, 12.5rem);
    max-height: 4.25rem;
  }
}

@media (max-width: 480px) {
  .header-tools__partner .header-icon--partner-bare img {
    max-width: min(100%, 10.5rem);
    max-height: 3.6rem;
  }
}

@media (min-width: 900px) {
  .header-icon--partner-bare img {
    max-width: 26rem;
    max-height: 8.25rem;
  }
}

.header-icon-popover {
  position: absolute;
  left: 50%;
  top: calc(100% + 0.5rem);
  transform: translateX(-50%) translateY(4px);
  min-width: 11rem;
  max-width: 16rem;
  padding: 0.5rem 0.65rem;
  font-size: 0.8125rem;
  line-height: 1.35;
  color: var(--text);
  background: var(--white);
  border: 2px solid #ffffff;
  border-radius: 0.375rem;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
  z-index: calc(var(--header-z) + 20);
}

.header-icon-popover::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -7px;
  border-width: 0 7px 8px 7px;
  border-style: solid;
  border-color: transparent transparent var(--white) transparent;
  filter: drop-shadow(0 -1px 0 var(--border));
}

/* Tooltip nur bei Hover (Mauszeiger drüber) – ausdrücklich NICHT bei :focus-within,
 * sonst bleibt der Hinweis nach dem Klick sichtbar. */
@media (hover: hover) {
  .header-icon-slot:hover .header-icon-popover {
    opacity: 1;
    visibility: visible;
    pointer-events: none;
    transform: translateX(-50%) translateY(0);
  }
}

@media (max-width: 899px) {
  .header-icon-popover {
    display: none;
  }
}

.header-nav-strip {
  display: none;
  background: transparent;
  border-top: 0;
}

.nav-primary-bar .menu--primary-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.15rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

.nav-primary-bar .menu--primary-bar > .menu-item {
  position: relative;
}

/* Desktop-Navigation: klassisch neben dem Logo, schwarz im Ruhezustand,
 * orange beim Hover/Fokus. Keine Pille, keine separate Farbleiste. */
/* Kein vw in der Schriftgröße: sonst wächst die Typo mit der Bildschirmbreite und wirkt
 * beim Wechsel Mobil → Desktop (ab 900 px) bzw. auf schmalen Desktop-Viewports zu groß.
 * Feste rem-Größe = gleiche Lesegröße wie Mobilmenü (--font-base), unabhängig von der Breite. */
.nav-primary-bar .menu--primary-bar > .menu-item > a {
  display: inline-block;
  padding: 0.35rem 0;
  border-radius: 0;
  font-size: var(--font-base);
  font-weight: 600;
  color: #000000;
  background: transparent;
  border: 0;
  text-decoration: none;
  transition: color 0.15s ease;
  white-space: nowrap;
}

.nav-primary-bar .menu--primary-bar > .menu-item > a:hover,
.nav-primary-bar .menu--primary-bar > .menu-item > a:focus,
.nav-primary-bar .menu--primary-bar > .menu-item > a:active {
  background: transparent;
  color: var(--accent-orange);
  text-decoration: none;
}

.nav-primary-bar .menu--primary-bar > .menu-item > a:focus-visible {
  outline: 2px solid #000000;
  outline-offset: 2px;
}

/* Aktive Seite bleibt dezent markiert, ohne die ruhige Desktop-Zeile aufzubrechen. */
.nav-primary-bar .menu--primary-bar > .menu-item.current-menu-item > a,
.nav-primary-bar .menu--primary-bar > .menu-item.current-menu-ancestor > a,
.nav-primary-bar .menu--primary-bar > .menu-item.current_page_item > a {
  background: transparent;
  color: var(--accent-orange);
  text-decoration: none;
}

/* Desktop-Untermenü: schließt direkt an die Hauptnavi an (kein Luftspalt),
 * damit die Maus beim Wechsel vom Haupt-Item ins Untermenü den Hover-State
 * NICHT verliert. Schwarze Schrift auf weißem Grund, orange Hover-Markierung. */
.nav-primary-bar .sub-menu {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 0.35rem);
  min-width: 12rem;
  margin: 0;
  padding: 0.35rem 0;
  list-style: none;
  background: #ffffff;
  border: 1px solid var(--border);
  border-radius: 0.375rem;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  z-index: calc(var(--header-z) + 10);
}

/* Unsichtbare „Brücke" am oberen Rand des Untermenüs: füllt den optischen
 * Luftraum zur Hauptnavi auf, damit der Hover nicht abbricht, wenn der
 * Mauszeiger vom Hauptpunkt ins Untermenü wandert. */
.nav-primary-bar .sub-menu::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -0.45rem;
  height: 0.45rem;
  background: transparent;
}

.nav-primary-bar .menu-item:hover > .sub-menu,
.nav-primary-bar .menu-item:focus-within > .sub-menu {
  display: block;
}

.nav-primary-bar .sub-menu .menu-item > a {
  display: block;
  padding: 0.55rem 1rem;
  font-size: var(--font-base);
  font-weight: 500;
  color: #000000;
  background: #ffffff;
  border-radius: 0;
}

.nav-primary-bar .sub-menu .menu-item > a:hover,
.nav-primary-bar .sub-menu .menu-item > a:focus-visible {
  /* Weißer Hintergrund bleibt beim Überfahren erhalten; Hover-Erkennbarkeit
   * erfolgt allein über den Unterstrich + leichte Farbvertiefung der Schrift. */
  background: #ffffff;
  color: #000000;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}

.nav-burger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0.5rem;
  border-radius: 0.375rem;
  color: var(--bluedark);
  flex-shrink: 0;
}

.nav-burger span {
  display: block;
  height: 2px;
  background: currentColor;
  border-radius: 1px;
  transition: transform 0.2s, opacity 0.2s;
}

.nav-burger[aria-expanded="true"] span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.nav-burger[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
}

.nav-burger[aria-expanded="true"] span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.nav-mobile {
  display: none;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0 1.25rem 1rem;
  padding-bottom: calc(0.35rem + env(safe-area-inset-bottom, 0px) + var(--kdmh-main-end-line-h, 27px));
  border-bottom: none;
  background:
    linear-gradient(var(--accent-orange), var(--accent-orange)) left 100% / 100% var(--kdmh-main-end-line-h, 27px) no-repeat,
    var(--white);
  max-height: min(75vh, 28rem);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.nav-mobile.is-open {
  display: flex;
}

.nav-mobile .menu--mobile {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Mobile-Navigation: feine orange Trennlinien zwischen Punkten, Links ohne
 * Unterstreichung; die aktive Seite wird nur per Fettdruck markiert. */
.nav-mobile .menu--mobile > .menu-item {
  border-top: 1px solid rgba(249, 176, 1, 0.45);
}

.nav-mobile .menu--mobile > .menu-item:first-child {
  border-top: none;
}

.nav-mobile .menu--mobile > .menu-item > a {
  display: block;
  text-align: left;
  padding: 0.85rem 0;
  font-size: var(--font-base);
  font-weight: 600;
  color: var(--accent-orange);
  background: transparent;
  border-bottom: none;
  text-decoration: none;
  transition: none !important;
}

.nav-mobile .menu--mobile > .menu-item > a:hover,
.nav-mobile .menu--mobile > .menu-item > a:focus,
.nav-mobile .menu--mobile > .menu-item > a:active {
  color: var(--accent-orange) !important;
  background: transparent !important;
  text-decoration: none !important;
  transform: none !important;
  box-shadow: none !important;
}

.nav-mobile .menu--mobile > .menu-item > a:focus-visible {
  outline: 2px solid var(--accent-orange);
  outline-offset: 2px;
}

.nav-mobile .menu--mobile > .menu-item.current-menu-item > a,
.nav-mobile .menu--mobile > .menu-item.current-menu-ancestor > a,
.nav-mobile .menu--mobile > .menu-item.current_page_item > a {
  color: var(--accent-orange);
  font-weight: 700;
}

.nav-mobile .menu--mobile > .menu-item.menu-item-has-children > a {
  padding-bottom: 0.3rem;
}

.nav-mobile .sub-menu {
  list-style: none;
  margin: 0 0 0.15rem;
  padding: 0 0 0 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.nav-mobile .sub-menu a {
  display: block;
  padding: 0.35rem 0;
  font-size: var(--font-base);
  font-weight: 700;
  color: var(--accent-orange);
  background: transparent;
  border-bottom: none;
  text-decoration: none;
  transition: none !important;
}

/* Untermenü-Kennzeichnung über Prefix statt Unterstreichung. */
.nav-mobile .sub-menu a::before {
  content: "\203A\00A0";
  font-weight: 700;
}

.nav-mobile .sub-menu a:hover,
.nav-mobile .sub-menu a:focus,
.nav-mobile .sub-menu a:active {
  color: var(--accent-orange) !important;
  background: transparent !important;
  text-decoration: none !important;
  transform: none !important;
  box-shadow: none !important;
}

.nav-mobile .sub-menu a:focus-visible {
  outline: 2px solid var(--accent-orange);
  outline-offset: 2px;
}

/* Offenes Mobilmenü: Hintergrund nicht mitscrollen; Seiteninhalt ausblenden */
@media (max-width: 899px) {
  body.kdmh-mobile-nav-open {
    overflow: hidden;
  }

  body.kdmh-mobile-nav-open .site-shell {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
  }
}

@media (min-width: 900px) {
  .header-icon-slot--darkmode-mobile {
    display: none !important;
  }

  body.kdmh-mobile-nav-open {
    overflow: auto;
  }

  :root {
    --brand-logo-height: clamp(5.2rem, 6.8vw, 6.35rem);
    --header-icon-size: 2.75rem;
    --header-icon-inner: 1.35rem;
    --header-tools-gap: 0.55rem;
  }

  .header-inner--top {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(0.85rem, 1.6vw, 1.5rem);
    padding: 0.75rem 1.5rem;
  }

  .header-brand-line {
    width: auto;
    flex: 0 0 auto;
    min-width: 0;
  }

  .brand--logo {
    flex: 0 0 auto;
  }

  .brand__image {
    height: var(--brand-logo-height);
  }

  .brand-mark {
    width: 2.85rem;
    height: 2.85rem;
  }

  .brand-text {
    font-size: 0.9375rem;
  }

  .nav-burger {
    display: none;
  }

  .header-nav-strip {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
  }

  .header-tools {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    align-items: center;
    justify-content: end;
    width: auto;
    max-width: none;
    margin-left: 0;
    row-gap: 0.35rem;
    column-gap: 0.9rem;
  }

  .header-tools__service {
    grid-column: 2;
    grid-row: 1 / span 2;
    flex-direction: column;
    gap: 0.5rem;
    margin-right: 0;
    align-self: center;
  }

  .header-tools__contact {
    grid-column: 1;
    grid-row: 2;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 0.45rem;
  }

  .header-tools__partner {
    grid-column: 1;
    grid-row: 1;
    width: auto;
    justify-content: center;
  }

  .header-icon--partner-bare img {
    max-width: clamp(9.75rem, 14.8vw, 12.75rem);
    max-height: 3.85rem;
  }

  .header-tools__service .header-icon,
  .header-tools__contact .header-icon {
    width: var(--header-icon-size);
    height: var(--header-icon-size);
    min-width: var(--header-icon-size);
    min-height: var(--header-icon-size);
  }

  .header-tools__service .header-icon svg,
  .header-tools__contact .header-icon svg {
    width: var(--header-icon-inner);
    height: var(--header-icon-inner);
  }

  /* Service-Tooltips (Suche/Dunkelmodus): weiße Schrift auf Schwarz, weiß umrandet,
   * damit der Hinweis im kompakten Desktop-Header kontrastreich bleibt. */
  .header-tools__service .header-icon-popover {
    color: #ffffff;
    background: #000000;
    border: 2px solid #ffffff;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.35;
    padding: 0.65rem 0.9rem;
    min-width: 10rem;
    text-align: center;
    box-shadow: none;
  }

  .header-tools__service .header-icon-popover::before {
    border-color: transparent transparent #000000 transparent;
    filter: drop-shadow(0 -1px 0 #ffffff);
  }

  /* Kontakt-Tooltips (Newsletter, Mail, Social): schwarze Schrift auf Orange,
   * weiß umrandet für klaren Kontrast im Desktop-Header, kein Schatten.
   * Schriftgröße ca. 17 px (2 px größer als zuvor), gleiche Größe wie Service-Tooltip. */
  .header-tools__contact .header-icon-popover {
    color: #000000;
    background: var(--accent-orange);
    border: 2px solid #ffffff;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.35;
    padding: 0.65rem 0.9rem;
    min-width: 10rem;
    text-align: center;
    box-shadow: none;
  }

  .header-tools__contact .header-icon-popover::before {
    border-color: transparent transparent var(--accent-orange) transparent;
    filter: drop-shadow(0 -1px 0 #ffffff);
  }

  .nav-mobile {
    display: none !important;
  }
}

/* Eigene Overlays (z. B. Suche per Script): höher als Header */
.kdmh-overlay {
  z-index: var(--header-overlay-z);
}

body.kdmh-search-open {
  overflow: hidden;
}

.kdmh-search-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem 2rem;
  box-sizing: border-box;
}

.kdmh-search-overlay[hidden] {
  display: none !important;
}

.kdmh-search-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 20, 20, 0.55);
  cursor: pointer;
}

.kdmh-search-overlay__panel {
  position: relative;
  width: min(100%, 44rem);
  margin-top: min(12vh, 6rem);
  padding: 1.5rem 1.5rem 1.75rem;
  background: var(--white);
  border-radius: 0.5rem;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.2);
  border: 1px solid var(--border);
}

.kdmh-search-overlay__title {
  margin: 0 0 1rem;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bluedark);
}

.kdmh-search-overlay__row {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
  min-height: 3.5rem;
}

.kdmh-search-overlay__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  color: var(--accent-violet);
}

.kdmh-search-overlay__icon svg {
  display: block;
}

.kdmh-search-overlay__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.85rem 1rem;
  font-size: clamp(1.0625rem, 2.5vw, 1.25rem);
  border: 2px solid var(--border);
  border-radius: 0.375rem;
  color: var(--text);
  background: var(--white);
}

.kdmh-search-overlay__input:focus {
  outline: none;
  border-color: var(--accent-violet);
  box-shadow: 0 0 0 3px rgba(129, 94, 160, 0.25);
}

.kdmh-search-overlay__submit {
  flex: 0 0 auto;
  align-self: stretch;
  padding: 0 1.35rem;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--bluedark);
  background: var(--accent-orange);
  border-radius: 0.375rem;
  transition: background 0.15s ease, color 0.15s ease;
}

.kdmh-search-overlay__submit:hover,
.kdmh-search-overlay__submit:focus-visible {
  background: var(--accent-violet);
  color: #ffffff;
  outline: none;
}

.kdmh-search-overlay__close {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  line-height: 1;
  color: var(--text-muted);
  background: transparent;
  border-radius: 0.25rem;
  cursor: pointer;
}

.kdmh-search-overlay__close:hover,
.kdmh-search-overlay__close:focus-visible {
  color: var(--bluedark);
  background: var(--bg-soft);
  outline: none;
}

@media (max-width: 520px) {
  .kdmh-search-overlay__row {
    flex-wrap: wrap;
  }

  .kdmh-search-overlay__icon {
    width: 2.5rem;
  }

  .kdmh-search-overlay__submit {
    flex: 1 1 100%;
    padding: 0.85rem 1rem;
  }
}

.hero {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 20rem;
}

@media (min-width: 768px) {
  .hero {
    grid-template-columns: 1fr 1fr;
    min-height: 22rem;
  }
}

.hero-visual {
  min-height: 16rem;
  background: linear-gradient(160deg, #4a3560 0%, var(--accent-violet) 45%, #c28800 100%);
}

.hero-visual img {
  width: 100%;
  height: 100%;
  min-height: 16rem;
  object-fit: cover;
}

.hero-content {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--white);
}

@media (min-width: 768px) {
  .hero-content {
    padding: 3rem 2.5rem;
  }
}

.eyebrow {
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--bluemedian);
  margin-bottom: 1rem;
}

.hero h1 {
  margin: 0 0 1.5rem;
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--bluedark);
}

/* Primärer „Weiterlesen"-Button (Aktuelles/Startseite/Main):
 * Schriftgröße = Umgebung (keine feste Pixelgröße), kein Schatten. */
.btn-primary {
  display: inline-block;
  align-self: flex-start;
  background: #ffffff;
  color: #000000;
  border: 2px solid #000000;
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: none;
  transition: background 0.2s, color 0.2s;
}

.btn-primary:hover,
.btn-primary:focus-visible {
  background: #000000;
  color: #ffffff;
  box-shadow: none;
  outline: none;
}

.section {
  padding: 3.5rem 1.5rem;
}

.section-inner {
  max-width: var(--max);
  margin: 0 auto;
}

.section-tint {
  background: var(--bg-soft);
}

.section-tint-strong {
  background: var(--bg-softer);
}

.two-col {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 768px) {
  .two-col {
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
  }
}

.section h2 {
  margin: 0 0 1rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--bluedark);
}

.section p {
  margin: 0 0 1rem;
  font-size: 1em;
  color: var(--text-muted);
  line-height: 1.65;
}

.center-intro {
  text-align: center;
  max-width: 36rem;
  margin: 0 auto 3rem;
}

.center-intro h2 {
  font-size: 1.75rem;
}

.team-grid {
  display: grid;
  gap: 2.75rem;
  max-width: 42rem;
  margin: 0 auto;
}

@media (min-width: 640px) {
  .team-grid {
    grid-template-columns: 1fr 1fr;
    gap: 3.75rem 4rem;
  }
}

.team-card {
  text-align: center;
}

.team-card .avatar {
  width: 15.5rem;
  height: 15.5rem;
  margin: 0 auto 1rem;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--accent-violet);
}

.team-card h3 {
  margin: 0 0 0.5rem;
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--bluedark);
}

.team-card p {
  margin: 0;
  font-size: 0.9375rem;
}

.cards-3 {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 900px) {
  .cards-3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

.offer-card {
  background: var(--white);
  border-radius: 0.5rem;
  padding: 2rem;
  box-shadow: 0 1px 3px rgba(129, 94, 160, 0.08);
  border: 2px solid var(--accent-orange);
  transition: box-shadow 0.2s, border-color 0.2s;
}

.offer-card:hover {
  box-shadow: 0 8px 24px rgba(129, 94, 160, 0.14);
  border-color: var(--accent-orange);
}

.offer-card h3 {
  margin: 0 0 0.75rem;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bluedark);
}

.offer-card p {
  margin: 0;
  font-size: 1em;
}

.diagram-wrap {
  max-width: 48rem;
  margin: 0 auto;
  text-align: center;
}

.diagram-wrap h2 {
  margin: 0 0 2.5rem;
  font-size: 1.5rem;
  color: var(--bluedark);
}

.diagram-wrap svg {
  width: 16rem;
  height: 16rem;
  margin: 0 auto 1rem;
}

.diagram-wrap .fine-print {
  font-size: 0.8125rem;
  color: var(--text-muted);
  max-width: 36rem;
  margin: 1rem auto 0;
  line-height: 1.5;
}

.cta-band {
  background: linear-gradient(135deg, #4a3560 0%, var(--accent-violet) 100%);
  color: #ffffff;
  padding: 3.5rem 1.5rem;
  text-align: center;
  scroll-margin-top: 5rem;
}

.cta-band .eyebrow {
  color: var(--accent-orange);
}

.cta-band h2 {
  margin: 0.5rem 0 1rem;
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 700;
  color: #ffffff;
}

.cta-band p {
  color: rgba(255, 255, 255, 0.88);
  font-size: 1em;
  max-width: 32rem;
  margin: 0 auto 1.75rem;
}

.btn-on-dark {
  display: inline-block;
  background: var(--accent-orange);
  color: var(--bluedark);
  padding: 0.75rem 1.75rem;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  transition: background 0.2s, color 0.2s;
}

.btn-on-dark:hover {
  background: var(--accent-yellow);
  color: var(--bluedark);
}

/* —— Hauptbereich: grauer Full-Width-Rand, weiße Content-Spalte —— */
.site-shell {
  background: var(--site-shell-bg);
  width: 100%;
}

.site-shell__inner--main {
  max-width: var(--max);
  margin: 0 auto;
  padding: 1.25rem 1.25rem 3rem;
  background: var(--white);
  box-sizing: border-box;
}

@media (min-width: 900px) {
  .site-shell__inner--main {
    padding: 1.75rem 1.75rem 3.5rem;
  }
}

.breadcrumb {
  margin: 0 0 1.25rem;
  padding-bottom: 0;
  border-bottom: none;
}

body.single .breadcrumb {
  margin-bottom: 2rem;
}

.breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0.35rem 0.65rem;
  font-size: 0.875rem;
  line-height: 1.4;
}

.breadcrumb__item {
  margin: 0;
}

.breadcrumb__sep {
  margin: 0;
  color: #000000;
  user-select: none;
  font-weight: 300;
  opacity: 0.55;
}

.breadcrumb a {
  color: var(--accent-main);
  text-decoration: none;
  font-weight: 400;
}

.breadcrumb a:hover,
.breadcrumb a:focus-visible {
  text-decoration: underline;
  outline: none;
}

.breadcrumb__current {
  color: #000000;
  font-weight: 400;
}

.page-main {
  padding: 0;
  margin: 0;
}

.page-main .section-inner {
  max-width: none;
  margin: 0;
}

/* H1, H2 und H3 nutzen alle die grüne Akzentfarbe (#85c441).
 * Im Dunkelmodus werden sie separat auf Weiß gestellt (siehe Dark-Mode-Block). */
.site-main h1,
.site-main .entry-header h1,
.site-main h2,
.site-main h3 {
  color: var(--accent-main);
}

.site-main h1,
.site-main .entry-header h1 {
  margin: 0 0 1.5rem;
  font-family: var(--font-display);
  /* H1 noch einen Tick größer, bleibt aber flüssig skalierend. */
  font-size: clamp(1.9rem, 4.4vw, 2.7rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

/* Die Aktuelles-Übersicht (Liste) nutzt dieselbe H1-Klasse wie normale Seiten,
 * soll aber NICHT den erweiterten Abstand darunter bekommen (kompakte Liste). */
.site-main .aktuelles-feed h1,
.site-main .page-main .aktuelles-feed h1 {
  margin-bottom: 1rem;
}

/* H2/H3: normale Content-Schrift (Inter) in Schwarz, deutlich kleiner als
 * zuvor – sie treten damit bewusst hinter die H1 (Arvo) zurück. */
.site-main h2 {
  font-family: inherit;
  font-size: clamp(1.25rem, 2.2vw, 1.5rem);
  font-weight: 700;
  line-height: 1.3;
}

.site-main h3 {
  font-family: inherit;
  font-size: clamp(1.1rem, 1.8vw, 1.25rem);
  font-weight: 700;
  line-height: 1.35;
}

.site-main h1 a,
.site-main h2 a,
.site-main h3 a {
  color: var(--accent-main);
  text-decoration: none;
}

.site-main h1 a:hover,
.site-main h2 a:hover,
.site-main h3 a:hover,
.site-main h1 a:focus-visible,
.site-main h2 a:focus-visible,
.site-main h3 a:focus-visible {
  color: var(--accent-main);
  text-decoration: underline;
}

/* Fließtext-Überschriften: Abstand vor h2 (nach anderem Block, nicht Seiten-h1); h3 unter h2 enger; h3 mit Linie */
.site-main .page-content * + h2,
.site-main .entry-content * + h2 {
  margin-top: 2rem;
}

/* Teaser-Karten (Aktuelles, Publikationen): Jahr/Datum steht direkt über dem Titel –
 * die allgemeine *+h2-Regel darf hier keinen großen margin-top setzen (höhere Spezifität). */
.site-main .page-content .aktuelles-card .aktuelles-card__title,
.site-main .entry-content .aktuelles-card .aktuelles-card__title {
  margin-top: 0;
}

.site-main .page-content h2 + h3,
.site-main .entry-content h2 + h3 {
  margin-top: 0.85rem;
}

/* H3 im Fließtext: grüne Akzentfarbe; der grüne Unterstrich bleibt als
 * dezente Akzent-Linie erhalten. */
.site-main .page-content h3,
.site-main .entry-content h3 {
  font-weight: 700;
  color: var(--accent-main);
  display: inline-block;
  border-bottom: 2px solid var(--accent-main);
  padding-bottom: 0.4rem;
  margin-top: 1.15rem;
  margin-bottom: 1rem;
  line-height: 1.35;
}

.site-main .page-content h3:first-child,
.site-main .entry-content h3:first-child {
  margin-top: 0;
}

html[data-theme="dark"] .site-main .page-content h3,
html[data-theme="dark"] .site-main .entry-content h3 {
  color: var(--text);
  border-bottom-color: var(--text);
}

.page-main .lead {
  font-size: 1.0625rem;
  color: var(--text-muted);
  max-width: 40rem;
}

.site-main .page-content a,
.site-main .entry-content a {
  color: var(--accent-main);
  text-decoration: none;
  font-weight: 600;
}

.site-main .page-content a:hover,
.site-main .entry-content a:hover,
.site-main .page-content a:focus-visible,
.site-main .entry-content a:focus-visible {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.site-main .page-content h3 a,
.site-main .entry-content h3 a {
  color: var(--accent-main);
  font-weight: 700;
}

.site-main .page-content h3 a:hover,
.site-main .entry-content h3 a:hover,
.site-main .page-content h3 a:focus-visible,
.site-main .entry-content h3 a:focus-visible {
  color: var(--accent-main);
  text-decoration: underline;
}

html[data-theme="dark"] .site-main .page-content h3 a,
html[data-theme="dark"] .site-main .entry-content h3 a {
  color: var(--text);
}

html[data-theme="dark"] .site-main .page-content h3 a:hover,
html[data-theme="dark"] .site-main .entry-content h3 a:hover,
html[data-theme="dark"] .site-main .page-content h3 a:focus-visible,
html[data-theme="dark"] .site-main .entry-content h3 a:focus-visible {
  color: var(--text);
}

/* Fließtext: Block-Buttons wie „Weiterlesen“ – schwarzer Rahmen, weißer Hintergrund, schwarze Schrift
 * – Schriftgröße erbt Umgebung, kein Schatten (Wunsch „gleiche Schriftgröße wie alles drumherum"). */
.site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.site-main .page-content a.btn-primary,
.site-main .entry-content a.btn-primary {
  display: inline-block;
  background: #ffffff;
  color: #000000;
  border: 2px solid #000000;
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  box-shadow: none;
  transition: background 0.2s, color 0.2s;
}

.site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.site-main .page-content a.btn-primary:hover,
.site-main .entry-content a.btn-primary:hover,
.site-main .page-content a.btn-primary:focus-visible,
.site-main .entry-content a.btn-primary:focus-visible {
  background: #000000;
  color: #ffffff;
  text-decoration: none;
  outline: none;
}

html[data-theme="dark"] .site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
html[data-theme="dark"] .site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
html[data-theme="dark"] .site-main .page-content a.btn-primary,
html[data-theme="dark"] .site-main .entry-content a.btn-primary {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
}

html[data-theme="dark"] .site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
html[data-theme="dark"] .site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
html[data-theme="dark"] .site-main .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
html[data-theme="dark"] .site-main .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
html[data-theme="dark"] .site-main .page-content a.btn-primary:hover,
html[data-theme="dark"] .site-main .entry-content a.btn-primary:hover,
html[data-theme="dark"] .site-main .page-content a.btn-primary:focus-visible,
html[data-theme="dark"] .site-main .entry-content a.btn-primary:focus-visible {
  background: #ffffff;
  color: #000000;
}

.site-main .page-content a::before,
.site-main .page-content a::after,
.site-main .entry-content a::before,
.site-main .entry-content a::after {
  content: none !important;
}

/* —— Trennlinie grün, volle Breite, vor erster oranger Sektion (Newsletter) ——
 * Dicke = oranger Abschlussstreifen unten (--kdmh-main-end-line-h). */
.site-main-end-rule {
  width: 100%;
  height: var(--kdmh-main-end-line-h, 27px);
  min-height: var(--kdmh-main-end-line-h, 27px);
  background: var(--accent-main);
  flex-shrink: 0;
  box-sizing: border-box;
}

/* —— Footer: Newsletter (orange), Logos + Rechtliches, Abschlusslinie —— */
.site-footer-newsletter {
  width: 100%;
  background: var(--accent-orange);
  color: #000000;
  padding: var(--footer-newsletter-pad-y) 1.25rem;
  text-align: center;
}

.site-footer-newsletter__inner {
  max-width: var(--max);
  margin: 0 auto;
}

@media (min-width: 900px) {
  .site-footer-newsletter {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.site-footer-newsletter__eyebrow {
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #000000;
  margin: 0 0 0.5rem;
}

.site-footer-newsletter__title {
  margin: 0 0 1rem;
  font-size: clamp(1.5rem, 3vw, 1.875rem);
  font-weight: 700;
  color: #000000;
}

.site-footer-newsletter__text {
  margin: 0 auto 1.75rem;
  max-width: 32rem;
  font-size: 1rem;
  color: #000000;
  line-height: 1.55;
}

/* Footer-CTA „JETZT ANMELDEN": orange Schrift auf Schwarz, KEIN Hover-Effekt
 * (optisch statisch, um die Ruhe des Newsletter-Streifens zu wahren). */
.site-footer-newsletter__btn {
  display: inline-block;
  background: #000000;
  color: var(--accent-orange);
  padding: 0.75rem 1.75rem;
  border-radius: 9999px;
  font-size: var(--font-base);
  font-weight: 700;
  letter-spacing: 0.03em;
  cursor: pointer;
  border: 2px solid #000000;
  box-shadow: none;
  transition: none;
}

.site-footer-newsletter__btn:hover,
.site-footer-newsletter__btn:focus,
.site-footer-newsletter__btn:focus-visible,
.site-footer-newsletter__btn:active {
  background: #000000;
  color: var(--accent-orange);
  border-color: #000000;
  box-shadow: none;
}

.site-footer-newsletter__btn:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

.site-shell__inner--footer-partners {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--white);
  box-sizing: border-box;
}

.site-footer-partners__inner {
  max-width: var(--max);
  margin: 0 auto;
  padding: 2rem 1.25rem 2.5rem;
  box-sizing: border-box;
}

@media (min-width: 900px) {
  .site-footer-partners__inner {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.footer-partners-block {
  display: grid;
  gap: 2rem;
  align-items: end;
}

@media (min-width: 768px) {
  .footer-partners-block {
    grid-template-columns: 1fr auto;
    gap: 2rem 3rem;
    align-items: end;
  }
}

.footer-partners-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 2rem 2.5rem;
}

/* Bündnislogo nur mobil in der Fußzeile (im Header ab 900 px sichtbar). */
@media (min-width: 900px) {
  .footer-partner-unit--buendnis-mobile {
    display: none !important;
  }
}

.footer-partner-link--buendnis {
  display: inline-block;
  line-height: 0;
}

.footer-partner-link--buendnis img {
  max-width: min(100%, 16rem);
  height: auto;
}

.footer-partner-unit {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: 30rem;
}

.footer-partner-label {
  font-size: var(--font-base);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #000000;
}

.footer-partner-unit img {
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: 8.75rem;
  object-fit: contain;
}

.footer-legal-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  justify-content: flex-end;
}

@media (min-width: 768px) {
  .footer-legal-nav {
    align-items: flex-end;
    text-align: right;
  }
}

/* Footer-Rechtsnavigation: dauerhaft unterstrichene orange Links, ABSOLUT
 * KEIN verändernder Hover-Effekt. !important + transition:none stellen
 * sicher, dass weder Theme-Basis-Regeln noch potenziell injizierte Styles
 * dort eine Farb- oder Dekorations-Umfärbung auslösen können. */
.footer-legal-nav a {
  color: var(--accent-orange);
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
  font-size: var(--font-base);
  font-weight: 600;
  transition: none !important;
}

.footer-legal-nav a:hover,
.footer-legal-nav a:focus,
.footer-legal-nav a:active {
  color: var(--accent-orange) !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 3px !important;
  transform: none !important;
  box-shadow: none !important;
}

.footer-legal-nav a:focus-visible {
  outline: 2px solid var(--accent-orange);
  outline-offset: 2px;
}

/* Copyright-Hinweis direkt in der Rechts-Nav (unter Impressum/Datenschutz),
 * um vertikalen Platz im Footer zu sparen. KEIN Trennstrich mehr oberhalb. */
.footer-legal-nav__copy {
  display: block;
  margin-top: 0.55rem;
  padding-top: 0;
  border-top: 0;
  font-size: var(--font-base);
  color: #000000;
  line-height: 1.35;
}

html[data-theme="dark"] .footer-legal-nav__copy {
  color: #ffffff;
  border-top: 0;
}

.site-footer-endcap {
  width: 100%;
  height: var(--kdmh-main-end-line-h, 27px);
  min-height: var(--kdmh-main-end-line-h, 27px);
  background: var(--accent-orange);
  flex-shrink: 0;
  box-sizing: border-box;
}

.news-preview {
  padding-top: 2rem;
  padding-bottom: 3rem;
}

.news-preview-grid {
  display: grid;
  gap: 1.25rem;
}

@media (min-width: 768px) {
  .news-preview-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.news-preview-card {
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 0.5rem;
  padding: 1.25rem 1.5rem;
  box-shadow: none;
}

.news-preview-card .meta {
  font-size: 0.8125rem;
  color: #000000;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin-bottom: 0.5rem;
}

.news-preview-card h3 {
  margin: 0 0 0.5rem;
  font-size: 1.0625rem;
  color: var(--accent-main);
}

.news-preview-card p {
  margin: 0;
  font-size: 0.9375rem;
  color: #000000;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Verborgener Newsletter-Overlay-Heading („Newsletter-Anmeldung").
 * Auch wenn per .sr-only nur für Screenreader sichtbar: Schrift ist auf
 * Arvo Bold gesetzt, damit das Element bei jeder späteren Sichtbarmachung
 * sofort typografisch zur H1 passt. */
#kdmh-newsletter-overlay-heading {
  font-family: var(--font-display), "Arvo", Georgia, serif !important;
  font-weight: 700 !important;
}

.page-content {
  max-width: 48rem;
}

@media (min-width: 900px) {
  .page-content {
    max-width: none;
  }
}

.page-content > *:first-child {
  margin-top: 0;
}

/* Link-Stile für Fließtext: siehe .site-main .page-content a oben */

.page-content ul,
.page-content ol {
  padding-left: 1.6rem;
  color: #000000;
}

.page-content li {
  padding-left: 0.2rem;
}

/* Listen neben dem schwebenden Beitragsbild bleiben als eigener Textblock rechts
 * vom Bild; die Marker rutschen dadurch nicht in den Bild-/Randbereich. */
.entry-single .entry-content ul,
.entry-single .entry-content ol {
  display: flow-root;
}

html[data-theme="dark"] .page-content ul,
html[data-theme="dark"] .page-content ol {
  color: var(--text);
}

.page-content img {
  border-radius: 0.375rem;
}

/* Perspektivisch: gelbe Sektionsfläche (Orange/Violett als Akzente über .eyebrow, Links, Buttons) */
.section-bg-yellow {
  background: var(--accent-yellow);
}

/* —— Aktuelles: Infinite-Scroll-Karten —— */
.aktuelles-main .aktuelles-header {
  margin-bottom: 1.5rem;
}

.aktuelles-feed {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.aktuelles-card {
  display: grid;
  gap: 1.25rem;
  padding: 1.25rem;
  border: 2px solid var(--accent-main);
  border-radius: 0.5rem;
  background: var(--white);
  box-shadow: none;
}

@media (min-width: 640px) {
  .aktuelles-card {
    grid-template-columns: minmax(11rem, 22rem) 1fr;
    align-items: start;
    gap: 1.5rem;
    padding: 1.5rem;
  }

  /* Suchergebnis-Karten haben kein Beitragsbild – daher einspaltig
   * darstellen, damit keine leere Bildspalte entsteht. */
  .aktuelles-card--no-media {
    grid-template-columns: 1fr;
  }

  /* Aktuelles ohne Beitragsbild: wie Karten mit Bild — gleicher grüner Rand,
   * links leeres Weißfeld (Bildspalte), Typo rechts davon linksbündig. */
  .aktuelles-main .aktuelles-card--no-media {
    grid-template-columns: minmax(11rem, 22rem) 1fr;
    align-items: start;
    gap: 1.5rem;
  }

  .aktuelles-main .aktuelles-card--no-media .aktuelles-card__body {
    grid-column: 2;
  }
}

.aktuelles-card__media-link {
  display: block;
  text-decoration: none;
  border-radius: 0.375rem;
  overflow: hidden;
  outline-offset: 2px;
}

/* Aktuelles-Karten: Bild wird in 'medium'-Größe gelesen (siehe PHP) und in
 * der Spaltenbreite dargestellt; KEIN festes Seitenverhältnis – die
 * natürliche Höhe wird ohne weißen Rand oben/unten übernommen. */
.aktuelles-card__figure {
  margin: 0;
  position: relative;
  width: 100%;
  background: transparent;
  border-radius: 0.375rem;
  overflow: hidden;
}

.aktuelles-card__img {
  width: 100%;
  height: auto;
  display: block;
}

.aktuelles-card__placeholder {
  display: block;
  width: 100%;
  min-height: 8rem;
  background: #ffffff;
  border: 1px dashed rgba(0, 0, 0, 0.12);
}

.aktuelles-card__date {
  display: block;
  font-size: var(--font-base);
  color: #000000;
  margin-bottom: 0.35rem;
}

.aktuelles-card__title {
  margin: 0 0 0.75rem;
  /* Teaser-Überschriften unter Aktuelles: deutlich größer als der Fließtext,
   * identisch zur Startseiten-Teaser-Größe (einheitliche Typografie). */
  font-size: clamp(1.6rem, 3.1vw, 2rem);
  font-weight: 700;
  line-height: 1.3;
}

.aktuelles-card__excerpt {
  color: #000000;
  font-size: var(--font-base);
  line-height: 1.6;
  margin-bottom: 1rem;
}

.aktuelles-card__excerpt p {
  margin: 0 0 0.5rem;
}

.aktuelles-io-wrap {
  padding-top: 0.5rem;
  padding-bottom: 2rem;
}

.aktuelles-scroll-sentinel {
  height: 1px;
  pointer-events: none;
}

.aktuelles-status {
  font-size: 0.875rem;
  color: var(--text-muted);
  margin: 0.5rem 0 0;
  min-height: 1.25rem;
}

.aktuelles-empty {
  color: var(--text-muted);
}

/* Suchergebnisse: Paginierung im Stil der Main-Buttons (schwarz-weiß, grüner Akzent) */
.kdmh-search-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.5rem;
}

.kdmh-search-pagination__item a,
.kdmh-search-pagination__item span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 0.4rem 0.85rem;
  border: 2px solid #000000;
  background: #ffffff;
  color: #000000;
  font-weight: 700;
  line-height: 1.2;
  border-radius: 0.375rem;
  text-decoration: none;
}

.kdmh-search-pagination__item span.current {
  background: #000000;
  color: #ffffff;
}

.kdmh-search-pagination__item a:hover,
.kdmh-search-pagination__item a:focus {
  background: #000000;
  color: var(--accent-main);
  text-decoration: none;
  outline: none;
}

html[data-theme="dark"] .kdmh-search-pagination__item a,
html[data-theme="dark"] .kdmh-search-pagination__item span {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
}

html[data-theme="dark"] .kdmh-search-pagination__item span.current {
  background: #ffffff;
  color: #000000;
}

/* —— Einzelbeitrag: Teaserbild & Tags —— */
.entry-single {
  display: flow-root;
}

.entry-single .entry-header {
  margin-bottom: 1.25rem;
}

.entry-single .entry-date {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  color: #000000;
  margin-bottom: 1.65rem;
}

.entry-single .entry-date__icon {
  display: inline-flex;
  flex-shrink: 0;
  color: #000000;
}

.entry-single .entry-date__icon svg {
  display: block;
  width: 1.1rem;
  height: 1.1rem;
}

html[data-theme="dark"] .entry-single .entry-date,
html[data-theme="dark"] .entry-single .entry-date__icon {
  color: var(--text);
}

/* Einzelbeitrag: Beitragsbild als 'medium'. Die Figure begrenzt sich selbst
 * auf ihre natürliche Bildbreite, damit rechts nie ein weißer „Container-
 * Rand" entsteht. Das Bild selbst füllt die Figure (width:100 %) aus. */
.entry-single .entry-featured {
  margin: 0 0 1.25rem;
  width: auto;
  max-width: 100%;
  background: transparent;
  overflow: visible;
}

/* Klick-Link (Lightbox-Auslöser) verhält sich wie ein Block und erbt die
 * Breite der Figure. Dadurch kann das Bild auf die volle Figure-Breite
 * skalieren – die Figure selbst legt die prozentuale Maximalbreite fest. */
.entry-single .entry-featured__lightbox {
  display: block;
  width: 100%;
  line-height: 0;
  color: inherit;
  text-decoration: none;
  cursor: zoom-in;
}

.entry-single .entry-featured__lightbox:focus-visible {
  outline: 2px solid var(--accent-main);
  outline-offset: 3px;
}

.entry-single .entry-featured__img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  border-radius: 0.375rem;
}

/* Tablet (ab 768 px): Bild schwebt links im Textfluss, ~48 % der Spaltenbreite,
 * mit deutlichem rechten Abstand zum Fließtext. */
@media (min-width: 768px) {
  .entry-single .entry-featured {
    float: left;
    display: block;
    width: 48%;
    max-width: 48%;
    margin: 0.15rem 1.5rem 1rem 0;
    shape-outside: none;
  }
}

/* Desktop (ab 1024 px): bewusster Kompromiss auf 45 % Breite. Bild bleibt
 * im Textfluss links stehen, rechts entsteht durch den rechten Außenabstand
 * ein klarer weißer Rand zum Absatz. Nie über 100 % hinaus. */
@media (min-width: 1024px) {
  .entry-single .entry-featured {
    float: left;
    display: block;
    width: 45%;
    max-width: 45%;
    margin: 0.15rem 1.75rem 1rem 0;
    shape-outside: none;
  }
}

/* Mobile: Bild steht als Block über dem Text, volle Inhaltsbreite. */
@media (max-width: 767px) {
  .entry-single .entry-featured {
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 0 0 1rem 0;
  }
}

/* Der erste Absatz nach dem schwebenden Bild darf nicht direkt in den
 * rechten Rand des Bildes hineinrutschen – ausreichend vertikaler Atem. */
.entry-single .entry-content > *:first-child {
  margin-top: 0;
}

/* Footer/nachfolgende Block-Elemente im Einzelbeitrag müssen den Float
 * beenden, damit sie nicht neben das Bild rutschen. */
.entry-single .entry-footer,
.entry-single .post-navigation,
.entry-single .comments-area {
  clear: both;
}

/* Lightbox (Beitragsbild Vollansicht) */
.kdmh-lightbox {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
  box-sizing: border-box;
}

.kdmh-lightbox[hidden] {
  display: none !important;
}

.kdmh-lightbox__backdrop {
  position: absolute;
  inset: 0;
  appearance: none;
  -webkit-appearance: none;
  background: rgba(0, 0, 0, 0.88);
  cursor: pointer;
  border: none;
  padding: 0;
}

.kdmh-lightbox__frame {
  position: relative;
  z-index: 1;
  max-width: min(96vw, 100%);
  max-height: 92vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kdmh-lightbox__img {
  display: block;
  max-width: 100%;
  max-height: min(88vh, 92vh);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 0.375rem;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
}

.kdmh-lightbox__close {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  z-index: 2;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  line-height: 1;
  color: #ffffff;
  background: rgba(20, 20, 20, 0.65);
  border: none;
  border-radius: 0.35rem;
  cursor: pointer;
}

.kdmh-lightbox__close:hover,
.kdmh-lightbox__close:focus-visible {
  background: rgba(0, 0, 0, 0.85);
  outline: none;
}

body.kdmh-lightbox-open {
  overflow: hidden;
}

.entry-tags-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem 0.75rem;
  margin: 0 0 1.5rem;
  max-width: 48rem;
}

.entry-tags-icon {
  color: #000000;
  flex-shrink: 0;
  margin-top: 0.15rem;
}

.entry-tags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.entry-tags a {
  display: inline-block;
  padding: 0.25rem 0.65rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  background: #ffffff;
  color: #000000;
  border: 1px solid #000000;
  transition: border-color 0.2s, background 0.2s, color 0.2s;
}

.entry-tags a:hover,
.entry-tags a:focus-visible {
  background: #000000;
  color: #ffffff;
  border-color: #000000;
  outline: none;
}

/* —— Startseite (site-main--front = front-page.php; kein Verlassen auf body.front-page) —— */
body:has(.site-main--front) .site-shell__inner--main {
  padding-top: 2rem;
}

/* Vorlauf-Banner klebt direkt unter der Navigation (aufhellen des oberen Innenraums ohne Abstand). */
body:has(.site-main--front .front-intro-band) .site-shell__inner--main {
  padding-top: 0;
}

.front-news {
  padding-top: 0.5rem;
  padding-bottom: 2rem;
}

/* Kein zusätzliches horizontales Inset: .site-shell__inner--main liefert den Rand; Karten haben eigenen Rahmen */
.site-main--front .section.front-news {
  padding: 2.75rem 0 2.5rem;
}

.site-main--front .front-news .section-inner {
  border: none;
  padding: 0;
  box-sizing: border-box;
}

/* Rubrik unter dem Vorlauf: an Seiten-/Beitrags-H1 angelehnt, eine Stufe dezenter, zentriert. */
.site-main--front .front-news__heading {
  margin: 0 0 1.5rem;
  padding: 0;
  border: none;
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 3.5vw, 2.25rem);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: 0;
  color: var(--accent-main);
  text-align: center;
}

html[data-theme="dark"] .site-main--front .front-news__heading {
  color: var(--text);
}

.front-news-layout {
  display: grid;
  gap: 1.5rem;
}

.front-news-layout--mixed {
  row-gap: 2.35rem;
  column-gap: 1.5rem;
}

.front-news-layout--single {
  max-width: 42rem;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .front-news-layout--two {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }
}

.front-news-layout--uniform {
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .front-news-layout--uniform {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Gemischt (1+3): Minderheitsformat oben in Split-Optik,
 * darunter drei Karten des Mehrheitsformats im Raster. */
.front-news-layout--mixed {
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .front-news-layout--mixed {
    grid-template-columns: repeat(3, 1fr);
  }
}

.front-news-layout--mixed .front-news-slot--wide {
  grid-column: 1 / -1;
}

.front-news-card {
  background: var(--white);
  border: 2px solid var(--accent-main);
  border-radius: 0.5rem;
  padding: 1.25rem;
  box-shadow: none;
  height: 100%;
  box-sizing: border-box;
}

.front-news-card--stack .front-news-card__figure {
  margin: 0 0 1rem;
  position: relative;
  width: 100%;
  background: #ffffff;
  border-radius: 0.375rem;
  overflow: hidden;
}

.front-news-card--stack .front-news-card__figure.is-landscape {
  aspect-ratio: 3 / 2;
}

.front-news-card--stack .front-news-card__figure.is-portrait {
  aspect-ratio: 210 / 297;
}

.front-news-card--stack .front-news-card__img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.front-news-card--stack .front-news-card__figure.is-portrait .front-news-card__img {
  object-fit: contain;
}

.front-news-card__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 10rem;
  background: #ffffff;
  border: 1px dashed rgba(0, 0, 0, 0.12);
}

.front-news-card__media-link {
  display: block;
  text-decoration: none;
  border-radius: 0.375rem;
}

.front-news-card__date {
  display: block;
  font-size: 0.875rem;
  color: var(--text-muted);
  margin-bottom: 0.35rem;
}

.front-news-card__title {
  margin: 0 0 0.65rem;
  /* Teaser-Überschriften auf der Startseite – identisch groß wie die Titel
   * in der Aktuelles-Infinite-Scroll-Liste, damit Quer- und Hochformat-
   * Beiträge visuell gleich stark wirken. */
  font-size: clamp(1.6rem, 3.1vw, 2rem);
  font-weight: 700;
  line-height: 1.25;
}

.front-news-card__excerpt {
  color: #000000;
  font-size: var(--font-base);
  line-height: 1.55;
  margin-bottom: 1rem;
}

.front-news-card__excerpt p {
  margin: 0 0 0.5rem;
}

.front-news-card--split {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 640px) {
  .front-news-card--split {
    flex-direction: row;
    align-items: stretch;
    gap: 1.25rem;
  }

  .front-news-card--split .front-news-card__media-link--split {
    flex: 0 0 auto;
    align-self: flex-start;
    width: 42%;
    max-width: 20rem;
  }

  .front-news-card--split.is-landscape .front-news-card__media-link--split {
    width: 48%;
    max-width: 24rem;
  }

  .front-news-card--split .front-news-card__body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
  }

  /* „Weiterlesen"-Button steht unmittelbar unter dem Exzerpt, NICHT an der
   * Karten-Baseline. (Früher: margin-top: auto; das ließ den Button an den
   * unteren Rand „wandern" und riss eine Lücke zum Text auf.) */
  .front-news-card--split .front-news-card__readmore {
    margin-top: 0;
    align-self: flex-start;
  }
}

.front-news-card--split .front-news-card__figure--split {
  margin: 0;
  width: 100%;
  background: #ffffff;
  border-radius: 0.375rem;
  overflow: hidden;
}

.front-news-card--split .front-news-card__figure--split.is-landscape {
  aspect-ratio: 3 / 2;
}

.front-news-card--split .front-news-card__figure--split.is-portrait {
  aspect-ratio: 210 / 297;
}

.front-news-card--split .front-news-card__img {
  width: 100%;
  height: 100%;
  display: block;
}

.front-news-card--split.is-landscape .front-news-card__img {
  object-fit: cover;
}

.front-news-card--split.is-portrait .front-news-card__img {
  object-fit: contain;
}

.front-news-empty {
  color: var(--text-muted);
}

/*
 * Startseite: Team, Ziele, Angebote – direkt unter .site-shell (wie Fußzeile):
 * Fläche volle Breite, Inhalt in .section-inner mit --max + seitlichem Innenabstand.
 */
.site-shell > .front-team {
  width: 100%;
  background: var(--accent-yellow);
  padding: 1.75rem 0 3rem;
  box-sizing: border-box;
}

/* Wie der graue Seitenrand: volle Breite, Inhalt bleibt in .section-inner */
.site-shell > .front-goals.section {
  padding: 3.5rem 0;
  background: var(--site-shell-bg);
}

.site-shell > .front-offers.section {
  padding: 3.5rem 0 3rem;
  background: var(--white);
}

.site-shell > .front-team .front-team__inner,
.site-shell > .front-goals .section-inner,
.site-shell > .front-offers .section-inner {
  max-width: var(--max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  box-sizing: border-box;
}

@media (min-width: 900px) {
  .site-shell > .front-team .front-team__inner,
  .site-shell > .front-goals .section-inner,
  .site-shell > .front-offers .section-inner {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.front-team__intro.center-intro {
  margin: 0 auto 2.5rem;
}

.front-team__title {
  margin: 0 0 1rem;
  color: #000000;
}

.front-team__intro .front-team__lead {
  margin: 0;
  font-size: 1em;
  line-height: 1.65;
  color: #000000;
  text-align: center;
}

.front-team .team-card h3 {
  color: #000000;
}

.front-team .team-card p {
  color: #000000;
}

.front-team .team-card .avatar {
  border: 8px solid var(--accent-orange);
}

.front-team .team-card a.mail-protected {
  color: #000000;
  font-weight: 400;
}

a.mail-protected {
  font-weight: 400;
}

.front-news-slot {
  min-width: 0;
}

@media (min-width: 900px) {
  .front-news-layout--uniform .front-news-slot,
  .front-news-layout--mixed .front-news-slot:not(.front-news-slot--wide) {
    display: flex;
  }

  .front-news-layout--uniform .front-news-card--stack,
  .front-news-layout--mixed .front-news-slot:not(.front-news-slot--wide) .front-news-card--stack {
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  .front-news-layout--uniform .front-news-card--stack .front-news-card__body,
  .front-news-layout--mixed .front-news-slot:not(.front-news-slot--wide) .front-news-card--stack .front-news-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  /* „Weiterlesen"-Button schließt direkt an das Exzerpt an, auch in den
   * Stack-Karten (Grid). Kein „margin-top: auto" mehr – dadurch bleibt die
   * Lücke zwischen Textende und Button minimal. */
  .front-news-layout--uniform .front-news-card--stack .front-news-card__readmore,
  .front-news-layout--mixed .front-news-slot:not(.front-news-slot--wide) .front-news-card--stack .front-news-card__readmore {
    margin-top: 0;
    align-self: flex-start;
  }
}

.front-goals h2,
.front-offers h2 {
  color: #000000;
}

html[data-theme="dark"] .front-goals h2,
html[data-theme="dark"] .front-offers h2,
html[data-theme="dark"] .front-team__title,
html[data-theme="dark"] .front-team__intro .front-team__lead,
html[data-theme="dark"] .front-team .team-card h3,
html[data-theme="dark"] .front-team .team-card p,
html[data-theme="dark"] .front-team .team-card a.mail-protected {
  color: var(--text);
}

html[data-theme="dark"] .site-main h1,
html[data-theme="dark"] .site-main h2,
html[data-theme="dark"] .site-main h3,
html[data-theme="dark"] .site-main .entry-header h1 {
  color: var(--text);
}

html[data-theme="dark"] .site-main h1 a,
html[data-theme="dark"] .site-main h2 a,
html[data-theme="dark"] .site-main h3 a {
  color: var(--text);
}

html[data-theme="dark"] .site-main h1 a:hover,
html[data-theme="dark"] .site-main h2 a:hover,
html[data-theme="dark"] .site-main h3 a:hover,
html[data-theme="dark"] .site-main h1 a:focus-visible,
html[data-theme="dark"] .site-main h2 a:focus-visible,
html[data-theme="dark"] .site-main h3 a:focus-visible {
  color: var(--text);
}

/* —— Startseite: Vorlauf (Page-Content) — Vollpixel orange wie Footer-Newsletter,
 * grüne Abschlusslinie wie `.site-main-end-rule` vor dem Newsletter —— */
.front-intro-band {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: var(--accent-orange);
  color: #000000;
  box-sizing: border-box;
}

.front-intro-band__pad {
  padding-top: 2rem;
  padding-bottom: 1.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  box-sizing: border-box;
}

@media (min-width: 900px) {
  .front-intro-band__pad {
    padding-top: 2.25rem;
    padding-bottom: 1.35rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}

.front-intro-band .front-intro-band__end-rule {
  display: block;
  margin: 0;
}

/* —— Startseite: Intro-Text-Spalte, zentriert —— */
.front-intro {
  max-width: 48rem;
  margin: 0.5rem auto 2.25rem;
  text-align: center;
}

.site-main--front .front-intro-band .front-intro {
  margin-top: 0;
  margin-bottom: 0;
}

.front-intro > * {
  text-align: center;
}

.front-intro h1,
.front-intro h2,
.front-intro h3 {
  display: block;
  text-align: center;
  border-bottom: none;
  padding-bottom: 0;
}

/* Vorlauf: H2 im Duktus von Seiten-/Beitrags-H1, eine Nuance zurückhaltender */
.site-main--front .front-intro-band .front-intro.page-content h2 {
  margin: 0 0 1rem;
  color: #000000;
  font-family: var(--font-display);
  font-size: clamp(1.72rem, 3.9vw, 2.45rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

.site-main--front .front-intro-band .front-intro.page-content {
  color: #000000;
}

/* Links im Fließtext: schwarz, fett, unterstrichen (nicht Button-Link) */
.site-main--front .front-intro-band .front-intro.page-content a:not(.wp-block-button__link) {
  color: #000000;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.site-main--front .front-intro-band .front-intro.page-content a:not(.wp-block-button__link):hover,
.site-main--front .front-intro-band .front-intro.page-content a:not(.wp-block-button__link):focus-visible {
  color: #000000;
  text-decoration: underline;
  outline: none;
}

/* Schlussbutton: wie „JETZT ANMELDEN“ im Footer — schwarz, orange Schrift, Pill, ohne Hover-Wechsel */
.site-main--front .front-intro-band .wp-block-buttons {
  justify-content: center;
}

.site-main--front .front-intro-band .wp-block-buttons.is-vertical {
  align-items: center;
}

.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link {
  display: inline-block;
  background: #000000;
  color: var(--accent-orange);
  padding: 0.75rem 1.75rem;
  border-radius: 9999px;
  font-size: var(--font-base);
  font-weight: 700;
  letter-spacing: 0.03em;
  border: 2px solid #000000;
  box-shadow: none;
  transition: none;
  text-decoration: none;
}

.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:active,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link:hover,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link:focus,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link:focus-visible,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link:active {
  background: #000000;
  color: var(--accent-orange);
  border-color: #000000;
  box-shadow: none;
  text-decoration: none;
}

.site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

html[data-theme="dark"] .front-intro-band {
  background: #000000;
  color: #ffffff;
}

html[data-theme="dark"] .site-main--front .front-intro-band .front-intro.page-content,
html[data-theme="dark"] .site-main--front .front-intro-band .front-intro.page-content h2 {
  color: #ffffff;
}

html[data-theme="dark"] .site-main--front .front-intro-band .front-intro.page-content a:not(.wp-block-button__link) {
  color: #ffffff;
}

html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link,
html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button.is-style-fill .wp-block-button__link,
html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
html[data-theme="dark"] .site-main--front .front-intro-band .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
  background: #000000;
  color: #ffffff;
  border-color: #ffffff;
}

@media (min-width: 900px) {
  .front-intro {
    margin-bottom: 2.75rem;
  }

  .site-main--front .front-intro-band .front-intro {
    margin-bottom: 0;
  }
}

/* —— News-Preview-Karten (nicht aktiv genutzt, aber vorhanden): Grau/Violett raus —— */
.news-preview-card {
  background: var(--white);
  border: 1px solid #000000;
  border-radius: 0.5rem;
  padding: 1.25rem 1.5rem;
  box-shadow: none;
}

.news-preview-card .meta {
  color: #000000;
}

.news-preview-card h3 {
  color: var(--accent-main);
}

.news-preview-card p {
  color: #000000;
}

/* —— Aktuelles/Single: Datum- und Exzerpt-Farben wirklich schwarz (kein Grau) —— */
.aktuelles-card__date,
.aktuelles-card__excerpt,
.front-news-card__date,
.front-news-card__excerpt {
  color: #000000;
}

.aktuelles-empty,
.front-news-empty {
  color: #000000;
}

/* —— Suche-Overlay: Violett-Reste raus, Akzent wird Grün (dezenter Outline) —— */
.kdmh-search-overlay__icon {
  color: #000000;
}

.kdmh-search-overlay__input {
  border: 2px solid #000000;
}

.kdmh-search-overlay__input:focus {
  outline: none;
  border-color: var(--accent-main);
  box-shadow: 0 0 0 3px rgba(133, 196, 65, 0.25);
}

.kdmh-search-overlay__submit {
  background: #ffffff;
  color: #000000;
  border: 2px solid #000000;
}

.kdmh-search-overlay__submit:hover,
.kdmh-search-overlay__submit:focus-visible {
  background: #000000;
  color: #ffffff;
  outline: none;
}

.kdmh-search-overlay__close {
  color: #000000;
}

.kdmh-search-overlay__close:hover,
.kdmh-search-overlay__close:focus-visible {
  color: #ffffff;
  background: #000000;
  outline: none;
}

/* —— Footer-Copyline im Hellmodus: bewusst schwarz, nicht grau —— */
.footer-copy-line {
  color: #000000;
}

.footer-partner-label {
  color: #000000;
}

/* —— Page-Lead: schwarz (statt Grau) —— */
.page-main .lead {
  color: #000000;
}

/* —— Fließtext-Listen: schwarz —— */
.page-content ul,
.page-content ol {
  color: #000000;
}

/* —— Site-Header-Unterkante: nicht mehr grau —— */
.site-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* —— Page-Main: pauschal schwarze Schrift, kein Grau mehr —— */
.site-main,
.site-main p,
.site-main li,
.site-main dd,
.site-main dt,
.site-main figcaption,
.site-main blockquote {
  color: #000000;
}

html[data-theme="dark"] .site-main,
html[data-theme="dark"] .site-main p,
html[data-theme="dark"] .site-main li,
html[data-theme="dark"] .site-main dd,
html[data-theme="dark"] .site-main dt,
html[data-theme="dark"] .site-main figcaption,
html[data-theme="dark"] .site-main blockquote,
html[data-theme="dark"] .aktuelles-card__date,
html[data-theme="dark"] .aktuelles-card__excerpt,
html[data-theme="dark"] .front-news-card__date,
html[data-theme="dark"] .front-news-card__excerpt,
html[data-theme="dark"] .aktuelles-empty,
html[data-theme="dark"] .front-news-empty,
html[data-theme="dark"] .news-preview-card .meta,
html[data-theme="dark"] .news-preview-card p,
html[data-theme="dark"] .footer-copy-line,
html[data-theme="dark"] .footer-partner-label,
html[data-theme="dark"] .page-main .lead,
html[data-theme="dark"] .entry-tags a {
  color: var(--text);
}

html[data-theme="dark"] .aktuelles-card,
html[data-theme="dark"] .front-news-card {
  border-color: var(--text);
  background: #000000;
}

html[data-theme="dark"] .aktuelles-card__figure,
html[data-theme="dark"] .front-news-card__figure,
html[data-theme="dark"] .front-news-card--split .front-news-card__figure--split,
html[data-theme="dark"] .aktuelles-card__placeholder,
html[data-theme="dark"] .front-news-card__placeholder {
  background: #000000;
  border-color: var(--text);
}

html[data-theme="dark"] .news-preview-card {
  background: #000000;
  border-color: var(--text);
}

html[data-theme="dark"] .news-preview-card h3 {
  color: var(--text);
}

html[data-theme="dark"] .entry-tags a {
  background: #000000;
  border-color: var(--text);
}

html[data-theme="dark"] .entry-tags a:hover,
html[data-theme="dark"] .entry-tags a:focus-visible {
  background: var(--text);
  color: #000000;
}

/* Keine dicke Header-Kante im Dunkelmodus (nur weißer Hairline-Rand) */
html[data-theme="dark"] .site-header {
  border-bottom-color: var(--text);
}

/* ===== Publikationen-Widget (Layout wie Teaser „Aktuelles") =================
 * Karten: .aktuelles-card, vertikale Liste, Infinite-Scroll-Status.
 * ==================================================================== */
.kdmh-publications-widget {
  margin: 2.25rem 0 2rem;
}

.widget-title,
.kdmh-publications-widget .widget-title {
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.2vw, 1.6rem);
  font-weight: 700;
  color: var(--accent-main);
  margin: 0 0 1rem;
}

/* Liste: identischer Abstand wie „Aktuelles"-Feed. */
.kdmh-publications__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.kdmh-publications-accordion {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.kdmh-publications-panel {
  border: 1px solid var(--border, rgba(0, 0, 0, 0.12));
  border-radius: 0.35rem;
  background: var(--surface, #fff);
}

.kdmh-publications-panel__heading {
  margin: 0;
}

.kdmh-publications-panel__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  margin: 0;
  padding: 0.9rem 1rem;
  border: 0;
  background: transparent;
  color: var(--accent-main);
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.kdmh-publications-panel__trigger:hover,
.kdmh-publications-panel__trigger:focus-visible {
  outline: none;
  background: rgba(0, 0, 0, 0.03);
}

.kdmh-publications-panel__icon {
  flex: 0 0 auto;
  width: 0.75rem;
  height: 0.75rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.kdmh-publications-panel.is-open .kdmh-publications-panel__icon {
  transform: rotate(-135deg);
}

.kdmh-publications-panel__content {
  padding: 0 1rem 1rem;
}

.kdmh-publications-panel__content[hidden] {
  display: none !important;
}

html[data-theme="dark"] .kdmh-publications-panel {
  border-color: var(--text);
  background: transparent;
}

html[data-theme="dark"] .kdmh-publications-panel__trigger:hover,
html[data-theme="dark"] .kdmh-publications-panel__trigger:focus-visible {
  background: rgba(255, 255, 255, 0.06);
}

/* Publikationen: Jahr → Titel → Text → Button mit klarem, gleichmäßigem Rhythmus
 * (ohne Margin-Kollaps zwischen Blöcken; ohne Kurztext etwas mehr Luft vor Download). */
.kdmh-publication-card .aktuelles-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  min-width: 0;
}

.kdmh-publication-card .aktuelles-card__date {
  margin: 0 0 0.35rem;
}

.kdmh-publication-card .aktuelles-card__title {
  margin: 0 0 0.75rem;
}

.kdmh-publication-card .aktuelles-card__excerpt {
  margin: 0 0 1rem;
  width: 100%;
}

.kdmh-publication-card .aktuelles-card__body:not(:has(.aktuelles-card__excerpt)) .aktuelles-card__title {
  margin-bottom: 1rem;
}

.kdmh-publication-card .aktuelles-card__readmore.btn-primary {
  margin-top: 0;
  align-self: flex-start;
}

/* Download-Zeile: Größe etwas dezent im Button. */
.kdmh-publication-dl__size {
  font-weight: 400;
  white-space: nowrap;
}

/* Infinite-Scroll-Steuerung (an „Aktuelles" angeglichen) */
.kdmh-publications-io-wrap {
  padding-top: 0.5rem;
  padding-bottom: 2rem;
}

.kdmh-publications__sentinel {
  height: 1px;
  pointer-events: none;
}

.kdmh-publications__status {
  font-size: 0.875rem;
  color: var(--text-muted);
  margin: 0.5rem 0 0;
  min-height: 1.25rem;
}

html[data-theme="dark"] .kdmh-publications__status {
  color: var(--text);
}

/* ===== Newsletter-Overlay (Brevo-Formular) ===========================
 * Dieselbe Mechanik wie das Such-Overlay. Schriftart & Farben werden an
 * das Theme angepasst: weißer Panel-Hintergrund, schwarze Schrift,
 * orange Akzente für den Button (analog Footer-Newsletter), grüner
 * Fokus-Ring. Im Dunkelmodus weiß auf schwarz, keine Akzentfarben.
 * ==================================================================== */
body.kdmh-newsletter-open {
  overflow: hidden;
}

.kdmh-newsletter-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem 2rem;
  box-sizing: border-box;
  overflow-y: auto;
}

.kdmh-newsletter-overlay[hidden] {
  display: none !important;
}

.kdmh-newsletter-overlay__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 20, 20, 0.55);
  cursor: pointer;
  border: none;
  padding: 0;
}

.kdmh-newsletter-overlay__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 38rem);
  margin-top: min(8vh, 4rem);
  margin-bottom: 2rem;
  padding: 1.5rem 0 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #ffffff;
  border-radius: 0.5rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
}

/* Formular-Inhalt mit Seiten-/Unterabstand; unten schließen grün + orange wie auf der Seite. */
.kdmh-newsletter-overlay__panel .kdmh-newsletter-form-wrap {
  padding: 0 1.25rem 1.5rem;
  box-sizing: border-box;
}

.kdmh-nl-panel-endstripes {
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.kdmh-newsletter-overlay__close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  line-height: 1;
  color: #000000;
  background: transparent;
  border: none;
  border-radius: 0.25rem;
  cursor: pointer;
  z-index: 2;
}

.kdmh-newsletter-overlay__close:hover,
.kdmh-newsletter-overlay__close:focus-visible {
  color: #ffffff;
  background: #000000;
  outline: none;
}

/* ----- Brevo-Form-Overrides: Seiten-Schrift & Theme-Farben ------------ */
.kdmh-newsletter-form-wrap .sib-form {
  padding: 0 !important;
  background: transparent !important;
  font-family: inherit !important;
}

.kdmh-newsletter-form-wrap .sib-form-container {
  max-width: 100% !important;
}

.kdmh-newsletter-form-wrap #sib-container {
  background: transparent !important;
  border: none !important;
  max-width: 100% !important;
  padding: 0 !important;
  direction: ltr;
}

.kdmh-newsletter-form-wrap #sib-form,
.kdmh-newsletter-form-wrap #sib-form *,
.kdmh-newsletter-form-wrap .sib-form-block,
.kdmh-newsletter-form-wrap .entry__label,
.kdmh-newsletter-form-wrap .entry__specification,
.kdmh-newsletter-form-wrap .entry__error,
.kdmh-newsletter-form-wrap .sib-form-message-panel,
.kdmh-newsletter-form-wrap .sib-form-message-panel__inner-text,
.kdmh-newsletter-form-wrap .sib-form-block__button {
  font-family: inherit !important;
}

.kdmh-newsletter-form-wrap .sib-image-form-block img {
  max-width: 100%;
  height: auto !important;
  border-radius: 0.375rem;
}

/* Overlay-Titel „Demokratie-Newsletter": identische Schrift wie H1 (Arvo 700).
 * font-family wird auf Wrapper, <p> UND alle Kind-Elemente (*) erzwungen –
 * so kann weder Brevo-CSS noch später injiziertes JS die Schrift überschreiben.
 * Hohe Spezifität (html body ...) + !important + Inline-Style im Markup. */
html body .kdmh-newsletter-form-wrap .kdmh-nl-title,
html body .kdmh-newsletter-form-wrap .kdmh-nl-title *,
html body .kdmh-newsletter-form-wrap .kdmh-nl-title p,
html body .kdmh-newsletter-form-wrap .sib-form-block.kdmh-nl-title,
html body .kdmh-newsletter-form-wrap .sib-form-block.kdmh-nl-title p,
html body .kdmh-newsletter-form-wrap .sib-form-block.kdmh-nl-title * {
  font-family: "Arvo", var(--font-display), Georgia, serif !important;
  font-weight: 700 !important;
}

html body .kdmh-newsletter-form-wrap .kdmh-nl-title,
html body .kdmh-newsletter-form-wrap .kdmh-nl-title p {
  /* Identische Größe wie H1 – Titel liest sich als vollwertige Überschrift. */
  font-size: clamp(1.9rem, 4.4vw, 2.7rem) !important;
  line-height: 1.2 !important;
  color: var(--accent-main) !important;
  background: transparent !important;
  text-align: left !important;
  letter-spacing: 0 !important;
}

html body .kdmh-newsletter-form-wrap .kdmh-nl-title p {
  margin: 0;
}

.kdmh-newsletter-form-wrap .kdmh-nl-intro,
.kdmh-newsletter-form-wrap .kdmh-nl-intro p {
  font-size: var(--font-base) !important;
  color: #000000 !important;
  background: transparent !important;
  line-height: 1.55;
}

.kdmh-newsletter-form-wrap .kdmh-nl-label {
  display: block;
  font-size: var(--font-base) !important;
  font-weight: 700 !important;
  color: #000000 !important;
  text-align: left !important;
  margin-bottom: 0.5rem;
}

.kdmh-newsletter-form-wrap .kdmh-nl-hint {
  display: block;
  font-size: var(--font-base) !important;
  color: #000000 !important;
  margin-top: 0.4rem;
}

.kdmh-newsletter-form-wrap .entry__field {
  display: flex;
  margin-top: 0.25rem;
}

.kdmh-newsletter-form-wrap #EMAIL,
.kdmh-newsletter-form-wrap .entry__field .input {
  display: block;
  width: 100%;
  padding: 0.75rem 0.9rem !important;
  font-size: var(--font-base) !important;
  color: #000000 !important;
  background: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 0.375rem !important;
  font-family: inherit !important;
  box-shadow: none !important;
}

.kdmh-newsletter-form-wrap #EMAIL::placeholder,
.kdmh-newsletter-form-wrap .entry__field .input::placeholder {
  color: rgba(0, 0, 0, 0.45) !important;
  font-family: inherit !important;
}

.kdmh-newsletter-form-wrap #EMAIL:focus,
.kdmh-newsletter-form-wrap .entry__field .input:focus {
  outline: none !important;
  border-color: var(--accent-main) !important;
  box-shadow: 0 0 0 3px rgba(133, 196, 65, 0.25) !important;
}

/* Newsletter-Overlay-Submit „ANMELDEN": identisch zum Main-Content-Button
 * (schwarze Schrift, weißer Hintergrund, schwarze Umrandung). Hover invertiert
 * wie gewohnt auf Schwarz/Weiß. Kein Schatten in beiden Zuständen. */
.kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  padding: 0.75rem 1.75rem !important;
  font-size: var(--font-base) !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em;
  color: #000000 !important;
  background: #ffffff !important;
  border: 2px solid #000000 !important;
  border-radius: 9999px !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit:hover,
.kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit:focus-visible {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: #000000 !important;
  box-shadow: none !important;
  outline: none;
}

.kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit .icon {
  width: 1.1rem;
  height: 1.1rem;
  fill: currentColor;
}

.kdmh-newsletter-form-wrap .sib-hide-loader-icon {
  display: none;
}

.kdmh-newsletter-form-wrap .sib-form-message-panel {
  max-width: 100% !important;
  margin: 0 0 0.75rem !important;
}

/* Anti-Spam-Feld unsichtbar halten (Brevo nutzt .input--hidden nicht zwingend) */
.kdmh-newsletter-form-wrap .input--hidden {
  position: absolute !important;
  left: -10000px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ----- Dunkelmodus ----------------------------------- */
html[data-theme="dark"] .kdmh-newsletter-overlay__panel {
  background: #000000;
  border-color: #ffffff;
}

html[data-theme="dark"] .kdmh-newsletter-overlay__close {
  color: #ffffff;
}

html[data-theme="dark"] .kdmh-newsletter-overlay__close:hover,
html[data-theme="dark"] .kdmh-newsletter-overlay__close:focus-visible {
  color: #000000;
  background: #ffffff;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap .kdmh-nl-title,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .kdmh-nl-intro,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .kdmh-nl-intro p,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .kdmh-nl-label,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .kdmh-nl-hint {
  color: #ffffff !important;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap #EMAIL,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .entry__field .input {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap #EMAIL::placeholder,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .entry__field .input::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap #EMAIL:focus,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .entry__field .input:focus {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25) !important;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit {
  color: #ffffff !important;
  background: #000000 !important;
  border-color: #ffffff !important;
}

html[data-theme="dark"] .kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit:hover,
html[data-theme="dark"] .kdmh-newsletter-form-wrap .sib-form-block__button.kdmh-nl-submit:focus-visible {
  color: #000000 !important;
  background: #ffffff !important;
}