/* ME.A – Customizer CSS, rev. 19 (kompakt, 03.09.2026)
   Kurzgehalten, weil das Customizer-Feld bei rund 12'900
   Zeichen abschneidet. Nichts weiter hier eintragen, ohne
   vorher die Laenge zu pruefen.
   rev. 19: .mea-hebel doppelte Klasse, sonst gewinnt
   Sektion 3 mit padding-left:0. */

/* 1. HEADER & FLUCHTLINIE */
.site-header.grid-container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background-color: #fff !important;
}
.site-header .inside-header.grid-container {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.site-header .inside-header,
.separate-containers .inside-article {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.site-branding .site-description {
  text-align: center !important;
}

/* 2. SPRACHUMSCHALTER (Polylang) */
.main-navigation .lang-item {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  list-style: none !important;
}
.main-navigation .lang-item::before,
.main-navigation .lang-item::marker {
  content: none !important;
  display: none !important;
}

/* 3. INHALTSBREITE – Spaltenformel 1092px.
   ACHTUNG: Spezifitaet 0,0,3,3. Regeln, die padding oder
   width fuer einzelne Bloecke abweichend setzen, brauchen
   eine doppelte Klasse, sonst gewinnt diese hier. */
body .site-main .entry-content > *:not(.alignfull):not(ul):not(ol) {
  max-width: 1092px !important;
  width: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-indent: 0 !important;
}
body .site-main .entry-content > ul,
body .site-main .entry-content > ol {
  max-width: 1092px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.4em !important;
  padding-right: 0 !important;
}

/* 4. INNENSEITEN – TEXTRHYTHMUS */
.site-main .entry-content > h2 {
  margin-top: 72px;
  margin-bottom: 24px;
}
.entry-content > h2:last-of-type {
  margin-top: 80px;
  padding-top: 40px;
  border-top: 1px solid #e5e7ea;
}
body .site-main .entry-content > p.mea-lead {
  font-size: 19px;
  line-height: 1.6;
  color: #5a5e66;
}
body .site-main .entry-content > p.mea-kicker {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #1a56a0;
  margin-top: 72px !important;
  margin-bottom: 0 !important;
}
.site-main .entry-content > p.mea-kicker + h2 {
  margin-top: 8px !important;
}
body .site-main .entry-content > p.mea-hebel.mea-hebel {
  border: 1px solid #e5e7ea;
  border-radius: 4px;
  padding: 20px 24px !important;
  margin-bottom: 12px;
}
body .site-main .entry-content > p.mea-querverweis {
  font-size: 15px;
  color: #5a5e66;
  border-top: 1px solid #e5e7ea;
  padding-top: 24px !important;
  margin-top: 0 !important;
}

/* 5. SPALTEN & KARTEN */
.site-main .entry-content > .wp-block-columns .wp-block-column {
  background-color: #f5f6f7;
  border-radius: 4px;
  padding: 28px 24px;
}
.site-main .entry-content > .wp-block-columns {
  gap: 24px;
}
.site-main .entry-content .wp-block-column h3 {
  margin-top: 0;
  margin-bottom: 8px;
}

/* 6. PORTRAETS */
.entry-content img.mea-portrait,
.entry-content .mea-portrait img {
  max-width: 180px !important;
  width: 180px !important;
  height: auto !important;
  border-radius: 4px;
  display: block;
  margin-top: 24px !important;
}
.entry-content .mea-profilbild img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}
.entry-content .mea-portrait + h3,
.entry-content .mea-profilbild + h3 {
  font-size: 17px !important;
  font-weight: 600;
  margin-top: 16px !important;
  margin-bottom: 4px !important;
}
.entry-content .mea-portrait + h3 + p,
.entry-content .mea-profilbild + h3 + p {
  font-size: 15px;
  color: #5a5e66;
  margin-top: 0 !important;
}

/* 7. UEBER-MICH */
.site-main .entry-content > .wp-block-columns.mea-profil > .wp-block-column {
  background: none;
  border-radius: 0;
  padding: 0;
}
.entry-content .mea-profil p.mea-kpi {
  font-size: 26px;
  font-weight: 600;
  color: #1a56a0;
  margin-bottom: 0;
}
.entry-content .mea-profil p.mea-kpi + p {
  font-size: 15px;
  color: #5a5e66;
  margin-top: 2px;
}

/* 8. HIDDEN CHAMPIONS */
.entry-content figure.mea-mosaik {
  margin-top: 16px !important;
  margin-bottom: 56px !important;
}
.entry-content .mea-logos {
  display: flex;
  gap: 32px;
  align-items: center;
  margin-top: 32px;
}
.entry-content .mea-logos img {
  max-height: 64px;
  width: auto;
}

/* 9. FREMD-EMBEDS */
.entry-content > iframe {
  width: 100% !important;
  max-width: 660px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  margin-bottom: 40px !important;
  display: block !important;
}

/* 10. BUTTONS & FORMULAR */
.entry-content .wp-block-button__link,
.wpforms-form button[type="submit"] {
  background-color: #1a56a0 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 12px 24px !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}
.entry-content .wp-block-buttons {
  margin-top: 48px !important;
}
body .site-main .entry-content > .wp-block-buttons {
  margin-bottom: 56px !important;
}

/* 11. FOOTER */
.mea-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.mea-footer-links {
  order: 1;
}
.mea-footer-copy {
  order: 2;
}

/* 12. COMPLIANZ-RECHTSDOKUMENTE */
body .entry-content #cmplz-document,
body .entry-content .cmplz-document {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 13. ALIGNFULL-SEKTIONEN. Hero verwaltet das Child-Theme. */
.entry-content .mea-section.alignfull > * {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}

/* 14. DESKTOP & TABLET ab 601px */
@media (min-width: 601px) {
  .mea-hero-row {
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  .mea-hero-text {
    flex: 1 1 auto;
    max-width: none;
  }
  .mea-hero-logo {
    margin: 0 0 0 auto !important;
  }
  .mea-hero-logo img {
    width: clamp(160px, 18vw, 240px) !important;
  }
}

/* 15. MOBIL bis 768px. Trennung nur ab 16 Zeichen. */
@media (max-width: 768px) {
  .main-navigation .main-nav > ul {
    display: block;
  }
  .site-header .inside-header {
    flex-wrap: wrap;
  }
  .entry-content h1,
  .entry-title {
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: auto;
    -webkit-hyphens: auto;
    -webkit-hyphenate-limit-before: 8;
    -webkit-hyphenate-limit-after: 8;
    hyphenate-limit-chars: 16 8 8;
  }
  .mea-hero .mea-hero-text .wp-block-buttons {
    margin-bottom: 48px !important;
  }
}

/* 16. MOBIL bis 600px – Wordmark auf 24px-Linie */
@media (max-width: 600px) {
  body .site-header .site-branding,
  body .site-header .main-title,
  body .site-header .main-title a,
  body .site-header .site-description {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    left: 0 !important;
    transform: none !important;
  }
  body .site-header .inside-header {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* 17. TABLET 601–1140px – Wortmarke linksbuendig */
@media (min-width: 601px) and (max-width: 1140px) {
  body .site-header .inside-header {
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    row-gap: 6px !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  body .site-header .site-branding {
    flex: 0 1 auto !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
    transform: none !important;
    left: 0 !important;
  }
  body .site-header .site-branding .main-title {
    text-align: left !important;
    margin-left: 0 !important;
  }
}

/* 18. HERO – vertikales Padding */
.entry-content .mea-hero .mea-hero-row {
  padding-top: clamp(40px, 8vh, 72px) !important;
  padding-bottom: clamp(40px, 8vh, 72px) !important;
}

/* 19. KARTEN-TITEL – Silbentrennung */
.entry-content .wp-block-column h3,
.entry-content .mea-card h3,
.entry-content .mea-card .wp-block-heading {
  overflow-wrap: break-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -webkit-hyphenate-limit-before: 8;
  -webkit-hyphenate-limit-after: 8;
  hyphenate-limit-chars: 16 8 8;
}

/* 20. NEWSLETTER-UEBERSICHT [mea_newsletters] */
.mea-newsletter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin: 32px 0;
}
.mea-newsletter-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid #e3e6ea;
}
.mea-newsletter-card__image {
  display: block;
}
.mea-newsletter-card__image img {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
}
.mea-newsletter-card__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 24px;
}
.mea-newsletter-card__date {
  margin: 0 0 10px;
  color: #6b7280;
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.mea-newsletter-card__title {
  margin: 0 0 14px;
  font-size: 1.35rem;
  line-height: 1.25;
}
.mea-newsletter-card__title a {
  color: inherit;
  text-decoration: none;
}
.mea-newsletter-card__title a:hover {
  color: #1f5fae;
}
.mea-newsletter-card__excerpt {
  margin: 0 0 18px;
}
.mea-newsletter-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 22px;
}
.mea-newsletter-card__tag {
  padding: 4px 8px;
  background: #f1f3f5;
  color: #4b5563;
  font-size: 0.78rem;
  line-height: 1.3;
}
.mea-newsletter-card .wp-element-button {
  align-self: flex-start;
  margin-top: auto;
}
@media (max-width: 900px) {
  .mea-newsletter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .mea-newsletter-grid {
    grid-template-columns: 1fr;
  }
}
.single-post article.category-newsletter .entry-header .byline {
  display: none !important;
}

/* 21. PODCAST-PLAYER [mea_podcast]
   780px = 200 Cover + 24 Abstand + 556 Liste.
   Dreifache Klasse schlaegt die Spezifitaet von Sektion 3. */
body .site-main .entry-content > .mea-podcast.mea-podcast.mea-podcast {
  display: flex !important;
  gap: 24px;
  align-items: flex-start;
  width: 780px !important;
  max-width: 100% !important;
  margin: 32px auto 48px 0 !important;
}
.mea-podcast .mea-podcast-aside {
  flex: 0 0 200px;
}
.mea-podcast .mea-podcast-cover {
  display: block;
  width: 200px;
  height: auto;
  border-radius: 6px;
}
.mea-podcast .mea-podcast-count {
  margin: 12px 0 0;
  font-size: 13px;
  color: #5a5e66;
}
.mea-podcast .mea-podcast-list {
  flex: 1;
  min-width: 0;
  max-height: 420px;
  overflow-y: auto;
  border: 1px solid #e5e7ea;
  border-radius: 6px;
}
.mea-podcast .mea-episode {
  border-bottom: 1px solid #e5e7ea;
}
.mea-podcast .mea-episode:last-child {
  border-bottom: none;
}
.mea-podcast .mea-episode-toggle {
  display: flex !important;
  gap: 12px;
  align-items: flex-start;
  width: 100%;
  padding: 12px 14px !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: left;
  cursor: pointer;
}
.mea-podcast .mea-episode-toggle:hover {
  background-color: #f5f6f7 !important;
}
.mea-podcast .mea-episode-play {
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  margin-top: 2px;
  border-radius: 50%;
  background: #1a56a0;
  position: relative;
}
.mea-podcast .mea-episode-play::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 8px;
  border-color: transparent transparent transparent #fff;
}
.mea-podcast .mea-episode-toggle[aria-expanded="true"] .mea-episode-play::after {
  top: 8px;
  left: 9px;
  width: 8px;
  height: 10px;
  border-width: 0 3px;
  border-color: #fff;
}
.mea-podcast .mea-episode-info {
  display: block;
  min-width: 0;
}
.mea-podcast .mea-episode-title {
  display: block;
  margin-bottom: 3px;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #15171b;
}
.mea-podcast .mea-episode-meta {
  display: block;
  font-size: 12px;
  font-weight: 400;
  color: #5a5e66;
}
.mea-podcast .mea-episode-player {
  padding: 0 14px 12px;
}
.mea-podcast .mea-episode-player audio {
  display: block;
  width: 100%;
}
@media (max-width: 768px) {
  body .site-main .entry-content > .mea-podcast.mea-podcast.mea-podcast {
    flex-direction: column;
    gap: 20px;
    width: 100% !important;
  }
  .mea-podcast .mea-podcast-aside {
    flex: none;
  }
  .mea-podcast .mea-podcast-list {
    width: 100%;
    max-height: 360px;
  }
}
