/* Farben aus dem Design-System der Seite (Snippet #55): Petrol #518C9C,
   Kontrastwerte wie in Snippet #153 korrigiert (Link #3A6B7A = 5,89:1). */
.mh-mw{max-width:680px;margin:34px auto;padding:24px 26px;
  background:var(--mh-light,#f8fbfc);border:1px solid var(--mh-border,#d0e4ea);
  border-left:4px solid var(--mh-teal,#518C9C);border-radius:var(--mh-radius,14px)}
.mh-mw-titel{margin:0 0 8px;font-family:quicksand,inherit;font-size:18px;font-weight:700;
  color:#3a6b7a;letter-spacing:-.01em}
.mh-mw-text{margin:0 0 16px;font-family:kollektif,inherit;font-size:16px;line-height:1.65;color:#2f3e46}
.mh-mw-knopf{margin:0 0 10px}
/* text-decoration mit !important, weil das Theme Links im Beitragstext generell
   unterstreicht — beim Knopf sah das nach kaputtem Link aus (Screenshot 01.08.). */
.mh-mw p.mh-mw-knopf a{display:inline-block;padding:13px 28px;background:var(--mh-coral,#e8a87c);
  color:#2f3e46;font-family:kollektif,inherit;font-size:15.5px;font-weight:700;
  border-radius:50px;text-decoration:none!important;border-bottom:0!important;
  transition:transform .2s ease,box-shadow .2s ease}
.mh-mw p.mh-mw-knopf a:hover,.mh-mw p.mh-mw-knopf a:focus{text-decoration:none!important;color:#2f3e46}
.mh-mw p.mh-mw-knopf a:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(232,168,124,.42)}
.mh-mw-hinweis{margin:0;font-family:kollektif,inherit;font-size:13px;line-height:1.5;color:#666}
.mh-mw-inline{color:#3a6b7a;text-decoration:underline;text-underline-offset:2px}
.mh-mw-wz{font-size:.8em;vertical-align:super;color:#666;cursor:help;margin-left:1px}
@media(max-width:640px){.mh-mw{padding:20px 18px;margin:26px 0}.mh-mw p.mh-mw-knopf a{display:block;text-align:center}}
/* Hervorgehobener Kasten des Shortcodes mietwagen_hero — Aufbau aus dem Component-Styleguide
   (Block "Affiliate Versicherung"), Farben aus dem Design-System (Snippet #55). */
.mh-mwh{max-width:680px;margin:38px auto;border:1px solid var(--mh-border,#d0e4ea);
  border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(81,140,156,.10)}
.mh-mwh-kopf{position:relative;height:180px}
.mh-mwh-schleier{position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(47,92,105,.86),rgba(81,140,156,.55))}
.mh-mwh-badge{position:absolute;top:14px;left:14px;z-index:2;background:var(--mh-coral,#e8a87c);
  color:#2f3e46;padding:5px 12px;border-radius:3px;font-family:kollektif,inherit;
  font-size:12.5px;font-weight:700;letter-spacing:.05em}
.mh-mwh-kopftext{position:absolute;left:20px;right:20px;bottom:16px;z-index:2;color:#fff}
.mh-mwh-kicker{display:block;font-family:kollektif,inherit;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.06em;opacity:.92;margin-bottom:4px}
.mh-mwh-titel{display:block;font-family:quicksand,inherit;font-size:26px;font-weight:700;
  line-height:1.18;color:#fff}
.mh-mwh-rumpf{padding:20px 24px 24px}
.mh-mwh-pillen{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.mh-mwh-pille{background:var(--mh-light,#f0f7f9);color:#3a6b7a;border:1px solid var(--mh-border,#d0e4ea);
  border-radius:50px;padding:5px 13px;font-family:kollektif,inherit;font-size:13px;font-weight:700}
.mh-mwh-text{margin:0 0 18px;font-family:kollektif,inherit;font-size:16px;line-height:1.65;color:#2f3e46}
.mh-mwh-knopf{margin:0 0 10px}
.mh-mwh p.mh-mwh-knopf a{display:inline-block;padding:14px 30px;background:var(--mh-coral,#e8a87c);
  color:#2f3e46;font-family:kollektif,inherit;font-size:15.5px;font-weight:700;border-radius:50px;
  text-decoration:none!important;border-bottom:0!important;
  transition:transform .2s ease,box-shadow .2s ease}
.mh-mwh p.mh-mwh-knopf a:hover,.mh-mwh p.mh-mwh-knopf a:focus{text-decoration:none!important;color:#2f3e46}
.mh-mwh p.mh-mwh-knopf a:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(232,168,124,.42)}
.mh-mwh-hinweis{margin:0;font-family:kollektif,inherit;font-size:13px;line-height:1.5;color:#666}
@media(max-width:640px){.mh-mwh{margin:28px 0}.mh-mwh-kopf{height:150px}
  .mh-mwh-titel{font-size:21px}.mh-mwh-rumpf{padding:18px}
  .mh-mwh p.mh-mwh-knopf a{display:block;text-align:center}}
@media (max-width: 768px) {
  /* CTA overflow */
  .mh-cta, .mh-cta-box, .mh-summary-box,
  .mh-related-links, .mh-faq-section,
  .mh-stats-row, .mh-table-wrap,
  .mh-in, .mh-author-bio,
  .mh-tc-combined-card, .mh-um-stat-card, .mh-pf-stat,
  .mh-um-cta-inner, .mh-um-cta, .mh-um-equip-grid,
  [class*="cta-box"], [class*="cta-inner"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
  .mh-table-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }

  /* Together-with-Janet box — same width as equipment */
  .mh-tc-combined-card {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Generic CTA headings */
  .mh-cta h2, .mh-cta h3, .mh-cta-box h2, .mh-cta-box h3,
  [class*="cta"] h2, [class*="cta"] h3 {
    text-align: left !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5em !important;
    justify-content: flex-start !important;
  }

  /* End-CTA "Lass uns gemeinsam ..." — mobile layout */
  .mh-um-cta, .mh-um-cta-inner {
    padding: 30px 22px !important;
    text-align: center !important;
  }
  .mh-um-cta-inner h2 {
    font-size: 1.7em !important;
    line-height: 1.25 !important;
    text-align: center !important;
    display: block !important;
    margin: 0.4em 0 !important;
    justify-content: center !important;
  }
  .mh-um-cta-inner h2 span { display: block !important; }
  .mh-um-cta-inner p {
    font-size: 1em !important;
    line-height: 1.55 !important;
    text-align: center !important;
  }
  .mh-um-cta-btns {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    align-items: stretch !important;
  }


  /* Author-box — CENTER Max Haase + circular image */
  .mh-author-bio, .mh-author-bio * { text-align: center !important; }
  .mh-author-bio .mh-ab-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 16px !important;
  }
  .mh-author-bio .mh-ab-imgwrap {
    flex-shrink: 0 !important;
    width: 130px !important;
    height: 130px !important;
    min-width: 130px !important;
    min-height: 130px !important;
    max-width: 130px !important;
    max-height: 130px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    margin: 0 auto !important;
    align-self: center !important;
    position: relative !important;
    aspect-ratio: 1 / 1 !important;
    display: block !important;
  }
  .mh-author-bio .mh-ab-img,
  .mh-author-bio img.mh-ab-img {
    width: 130px !important;
    height: 130px !important;
    min-width: 130px !important;
    min-height: 130px !important;
    max-width: 130px !important;
    max-height: 130px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    display: block !important;
    aspect-ratio: 1 / 1 !important;
  }
  .mh-author-bio .mh-ab-body {
    text-align: center !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  .mh-author-bio h3.mh-ab-name,
  .mh-author-bio .mh-ab-body h3.mh-ab-name,
  .single .entry-content .mh-author-bio h3.mh-ab-name {
    font-size: 1.55em !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0.3em auto !important;
    display: block !important;
  }
  .mh-author-bio .mh-ab-label,
  .mh-author-bio .mh-ab-role,
  .mh-author-bio .mh-ab-text { text-align: center !important; width: 100% !important; }
  .mh-author-bio .mh-ab-stats {
    justify-content: center !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }

  .mh-stats-row, [class*="stats-row"], [class*="stats-grid"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  /* Janet box — match equipment-grid width on mobile */
  html body .mh-um-janet-flex.mh-um-janet-flex,
  div.mh-um-janet-flex {
    width: calc(100% + 48px) !important;
    max-width: calc(100% + 48px) !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 24px 20px !important;
    margin-left: -24px !important;
    margin-right: -24px !important;
    box-sizing: border-box !important;
  }
  .mh-um-janet-flex > * {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* End-CTA wrap: remove full-bleed negative margin on mobile */
  .mh-um-cta-wrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }


  /* Target intermediate wrapper of janet-flex to remove its horizontal padding */
  .mh-um-section > div:has(> .mh-um-janet-flex) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}



@media (max-width: 768px) {
  /* CTA eyebrow: kein Zeilenumbruch, kompakter */
  .mh-um-cta-eyebrow {
    white-space: nowrap !important;
    letter-spacing: 2px !important;
    font-size: 0.66rem !important;
    padding: 6px 14px !important;
    max-width: 90vw !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  /* CTA H2: zentrierter, kein wrap-bruch in Mitte */
  .mh-um-cta-wrap h2 {
    font-size: 1.55rem !important;
    line-height: 1.3 !important;
    padding: 0 8px !important;
    word-break: keep-all !important;
    hyphens: none !important;
  }
  .mh-um-cta-wrap h2 br + span {
    display: inline !important;
  }
  /* CTA Buttons: voll breit, klare Trennung */

  .mh-um-cta-btns {
    gap: 10px !important;
    margin-top: 8px !important;
  }

  /* FAQ Mobile-Polish */
  .mh-faq-item h3 {
    font-size: 0.95em !important;
    padding: 16px 4px !important;
    gap: 8px !important;
    line-height: 1.4 !important;
  }
  .mh-faq-num {
    font-size: 11px !important;  /* 2026-07-30: 0.65em ergab 9,88px, unter der Lesbarkeitsgrenze */
    min-width: 22px !important;
  }
  .mh-faq-toggle {
    width: 24px !important;
    height: 24px !important;
    font-size: 14px !important;
  }
  /* Erste FAQ open-state: Toggle weiterhin sichtbar */
  .mh-faq-item.is-open .mh-faq-toggle,
  .mh-faq-item[data-open="true"] .mh-faq-toggle,
  .mh-faq-item:first-child .mh-faq-toggle {
    transform: rotate(45deg);
    background: var(--mh-teal, #518c9c) !important;
    color: #fff !important;
    border-color: var(--mh-teal, #518c9c) !important;
  }
  /* FAQ-Section padding angleich */
  .mh-faq-section {
    margin: 1.5em 0 !important;
    padding: 0 4px !important;
  }
}



/* Mobile-Scroll: nie touch-events blockieren */
@media (max-width: 768px) {
  html, body {
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: auto !important;
  }
  /* Themify-Animationen drosseln auf Mobile (entlasten Main-Thread) */
  [data-tf-animation], .wow, .tf_lax_done {
    animation-duration: 0.3s !important;
    transition-duration: 0.3s !important;
  }

  /* CTA Buttons: voll-breit edge-to-edge */
  .mh-um-cta-btns {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    padding: 0 8px !important;
  }

}



/* CTA: edge-to-edge auf Mobile (mehrfach-Spezifität gegen Themify-Defaults) */
@media (max-width: 768px) {
  html body .mh-um-cta-wrap.mh-um-cta-wrap {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  html body .mh-um-cta-inner.mh-um-cta-inner {
    padding: 32px 0 !important;
    max-width: 100% !important;
  }
  html body .mh-um-cta-btns.mh-um-cta-btns {
    padding: 0 !important;
    margin: 0 !important;
    gap: 12px !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

}
@media (max-width: 768px) {
  .themify_builder .module_row, .themify_builder_row {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
  [data-tf-animation], .wow:not(.tf_lax_done) {
    opacity: 1 !important;
    visibility: visible !important;
    animation: none !important;
    transform: none !important;
  }
  .tb_animation_on .module_row[data-lazy] {
    min-height: 100px;
  }
}
/* Max-Entscheid 17.08.2026: unter 375 px verschwindet die Unterzeile der
   Klebeleiste, statt abgeschnitten dazustehen. Gemessen war dort in beiden
   Sprachen zu wenig Platz (360 px: englisch -5 px, deutsch -9 px). Ausgewaehlt ueber Aufbau statt ueber die generierten
   Klassennamen, damit ein Neuaufbau im Baukasten die Regel nicht aushebelt.
   Schnitt bei 379 px statt 374: bei 375 px schwankte die Rest-Luft zwischen
   zwei Messungen von 9 px auf 1 px — darauf baut man nichts. */
@media (max-width: 379px) {
  #mk-leiste > div > div:nth-child(2),
  #mk-leiste-m > div > div:nth-child(2) {
    display: none !important;
  }
}
a.mh-filter-card[href="https://ib-staging.direkt-erledigt.de/nl/mietwagen-ausland-fallen-tipps/"] img,a.mh-filter-card[href="https://ib-staging.direkt-erledigt.de/nl/mietwagen-ausland-fallen-tipps//"] img,a.mh-blog-card[href="https://ib-staging.direkt-erledigt.de/nl/mietwagen-ausland-fallen-tipps/"] img,a.mh-blog-card[href="https://ib-staging.direkt-erledigt.de/nl/mietwagen-ausland-fallen-tipps//"] img{object-position:center 8%!important}
@media (max-width: 768px) {
  /* CTA-Wrap full-bleed */
  html body.page-id-2435 .mh-um-cta-wrap,
  html body.page-id-5388 .mh-um-cta-wrap {
    margin-left: -20px !important;
    margin-right: -20px !important;
    border-radius: 0 !important;
    padding: 48px 24px !important;
    max-width: none !important;
    width: calc(100% + 40px) !important;
  }
  /* Buttons: ULTRA-specific (5+ class chain to beat all earlier rules) */
  html body.page-id-2435 .mh-um-cta-wrap .mh-um-cta-btns a.mh-um-cta-primary,
  html body.page-id-2435 .mh-um-cta-wrap .mh-um-cta-btns a.mh-um-cta-ghost,
  html body.page-id-5388 .mh-um-cta-wrap .mh-um-cta-btns a.mh-um-cta-primary,
  html body.page-id-5388 .mh-um-cta-wrap .mh-um-cta-btns a.mh-um-cta-ghost {
    width: auto !important;
    max-width: 240px !important;
    min-width: 0 !important;
    display: inline-block !important;
    padding: 13px 28px !important;
    margin: 6px auto !important;
    font-size: 0.95rem !important;
    box-sizing: border-box !important;
  }
  /* Buttons-Container: stack vertically, centered */
  html body.page-id-2435 .mh-um-cta-wrap .mh-um-cta-btns,
  html body.page-id-5388 .mh-um-cta-wrap .mh-um-cta-btns {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
  }
  /* Section spacing */
  html body.page-id-2435 .mh-um-cta-wrap,
  html body.page-id-2435 .mh-faq-section,
  html body.page-id-2435 .mh-summary-box,
  html body.page-id-2435 .mh-stats-row {
    margin-top: 48px !important;
    margin-bottom: 48px !important;
  }
}
/* 29.09.2026: transform:translateY(20px) ragte aus dem Seiten-Scroller.
   Nur den mobilen CTA-Slide entfernen; Groesse, Abstaende und Texte bleiben. */
@media (max-width: 768px) {
  html body .entry-content .mh-um-cta-wrap.mh-animate { transform: none !important; }
}

/* --- Befund 7 (Max 30.07., 10:54): FAQ-Antworten stehen schief -------------
   Snippet 55 setzt .mh-faq-answer{padding-left:40px} OHNE padding-right.
   Gemessen: Antworttext 63 px von links, 23 px von rechts (Desktop) bzw.
   67/27 in einer 326-px-Spalte (Mobil) = 40 px Schieflage auf JEDEM Artikel.
   Der 40er-Einzug ist gewollt (Antwort steht unter dem Fragetext, neben der
   Nummer) — er braucht nur das Gegenstueck rechts.                            */
html body .mh-faq-answer { padding-right: 40px !important; }

/* --- Befund 8 (Max 30.07.): CTA-Box mischt zentrierte Ueberschrift mit
   linksbuendigem Text ---------------------------------------------------------
   Gemessen in .mh-post-cta-box (900 px, 38 px Innenabstand, 824 px Inhalt):
     H3      text-align:center, 824 px breit
     P       text-align:start, max-width 640 px, buendig links -> 184 px Loch rechts
     Button  buendig links
     Chips   buendig links
   Vier Elemente, zwei Ausrichtungen. Die Ueberschrift kommt auf die gleiche
   linke Kante wie alles andere — eine Kante statt zwei.                        */
html body .mh-post-cta-box > h3,
html body .mh-post-cta-box > h2 { text-align: left !important; }

@media (max-width: 768px) {
  /* 40 px von 326 px Spaltenbreite sind mobil verschenkt: beidseitig knapper */
  html body .mh-faq-answer { padding-left: 16px !important; padding-right: 16px !important; }
}

/* Gemessen: die konkurrierende Regel aus Snippet 55 wird im FOOTER ausgegeben
   (Position ~289k im HTML) und gewinnt daher gegen einen wp_head-Block gleicher
   Spezifitaet. Diese Kopie steht als Letztes im Dokument.                        */
@media (max-width: 768px) {
  html body .mh-um-cta-wrap,
  html body.page-id-2435 .mh-um-cta-wrap,
  html body.page-id-5388 .mh-um-cta-wrap,
  html body.page-id-2619 .mh-um-cta-wrap,
  html body.page-id-2441 .mh-um-cta-wrap {
    width: 100% !important; max-width: 100% !important;
    margin-left: 0 !important; margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}
/* --- P1: Satzbreite — ZURUECKGENOMMEN 30.07. 13:00 auf Max-Entscheid ----------
   Ich hatte den Fliesstext auf 680 px verschmaelert (typografisches Optimum
   60-85 Zeichen statt 125). Max: "der text ist jetzt zu schmal, er muss genauso
   breit sein wie die bilder und alles andere". Damit gilt: EINE Kante fuer ALLES
   auf 1100 px — Text, Boxen, Galerien, Tabellen. Die Regel "eine Textkante" aus
   Runde 4 bleibt inhaltlich gueltig, nur die Zielbreite ist jetzt die volle Spalte.
   Nicht wieder verschmaelern ohne Max' ausdrueckliche Ansage.                    */

/* --- P2: Linkfarbe unter WCAG-Grenze -------------------------------------
   Gemessen: Inline-Links #518C9C auf Weiss = 3,76:1 (noetig 4,5:1),
   auf #F0F7F9 nur 3,47:1. Zusaetzlich fand der Pruefer 3 verschiedene
   Link-Darstellungen im Fliesstext EINES Artikels — die Seite benutzt an
   anderen Stellen laengst #3a6b7a (5,89:1). Also: eine Linkfarbe, die
   dunklere, bereits vorhandene. Das behebt Kontrast UND Link-Zoo zugleich.
   #518C9C bleibt Akzentfarbe fuer grosse Schrift (ab 24 px reicht 3:1).     */
html body .entry-content a:not([class]):not([style*="color"]),
html body .page-content a:not([class]):not([style*="color"]),
html body .mh-faq-answer a:not([style*="color"]),
html body .mh-summary-box a:not([style*="color"]),
html body .mh-info-tip a:not([style*="color"]),
html body .mh-info-warn a:not([style*="color"]),
html body .mh-info-note a:not([style*="color"]),
html body .mh-author-bio a:not([style*="color"]),
html body .mh-table-wrap a:not([style*="color"]) {
  color: #3A6B7A !important;
}
html body .entry-content a:not([class]):not([style*="color"]):hover,
html body .page-content a:not([class]):not([style*="color"]):hover { color: #2F5C69 !important; }

/* --- P2b: Nachtrag 30.07. 15:4x — die Regel oben hat ueberzogen -----------
   Gemessen an /beste-reisekrankenversicherung-langzeitreisen/: der
   Affiliate-Knopf traegt inline background:var(--mh-teal);color:#fff.
   Das !important der P2-Regel schlug die Inline-Farbe und machte aus dem
   weissen Text dunkles Teal auf mittlerem Teal = 1,57:1 — praktisch
   unlesbar, und das ausgerechnet auf dem Geld-Pfad. Darum oben
   :not([style*="color"]): wer seine Schriftfarbe selbst setzt, behaelt sie.
   Zusaetzlich derselbe Ton-Tausch fuer Inline-Styles, die statt der
   Hex-Schreibweise die Variable benutzen — P4 unten greift nur bei #518C9C. */
html body [style*="background:var(--mh-teal)"],
html body [style*="background: var(--mh-teal)"] { background: #42737F !important; }
html body [style*="color:var(--mh-teal)"],
html body [style*="color: var(--mh-teal)"] { color: #3A6B7A !important; }

/* --- P2c: Nachtrag 30.07. 16:2x — zwei Stellen, an denen dunkle Schrift auf
   dunklem Grund landet, beide als Folge einer zu breiten Vererbungsregel.
   (1) Tabellen-Summenzeile: <tr style="background:linear-gradient(teal,dark);
       color:white"> — das <strong> darin holt sich #1A1A2E aus der
       Fliesstext-Regel und steht dann mit 3,71:1 auf dem Verlauf.
   (2) Link in der In-Content-CTA: der Kasten hat einen Teal-Verlauf und weisse
       Schrift, der Link darin bekam aus P2 #3A6B7A = 1,19:1 — praktisch
       unsichtbar. Beide erben jetzt die Farbe ihres Kastens.                  */
html body .entry-content tr[style*="color: white"] strong,
html body .entry-content tr[style*="color:white"] strong,
html body .entry-content tr[style*="color: white"] b,
html body .entry-content tr[style*="color:white"] b,
html body .entry-content tr[style*="color: #fff"] strong,
html body .entry-content tr[style*="color:#fff"] strong { color: inherit !important; }

html body .entry-content .mh-incontent-cta a:not([style*="color"]),
html body .entry-content .mh-cta-primary a:not([style*="color"]),
html body .entry-content .mh-cta-dark a:not([style*="color"]),
html body .entry-content .mh-post-cta-box a:not([style*="color"]),
html body .page-content .mh-incontent-cta a:not([style*="color"]),
html body .page-content .mh-cta-primary a:not([style*="color"]) { color: #ffffff !important; }

/* --- P3: Presse-Logos zu blass -------------------------------------------
   Gemessen auf der Startseite: .mh-press-item = #999 auf Weiss = 2,85:1
   bei 17,6 px ("Die Welt", "Der Spiegel", "SWR", "Antenne Bayern").
   Genau die Vertrauensanker der Seite waren die schwaechsten Elemente.
   #6E6E6E = 5,1:1, bleibt optisch zurueckhaltend.                          */
html body .mh-press-item { color: #6E6E6E !important; }

/* --- P4: weisse Schrift auf Marken-Teal ----------------------------------
   Gemessen auf /zusammenarbeit/: 30+ Partner-Chips als
   <span style="background: #518C9C; color: #fff; font-size: 0.9em"> =
   3,76:1. Die Chips tragen Inline-Styles, daher der Attribut-Selektor.
   #42737F = 5,26:1 gegen Weiss, Farbton bleibt praktisch gleich.           */
html body span[style*="background: #518C9C"],
html body span[style*="background:#518C9C"],
html body span[style*="background: #518c9c"] { background: #42737F !important; }

/* --- P5: Affiliate-Link in DiscoverCars-Rot ------------------------------
   Gemessen: #ED1E24 auf Weiss = 4,36:1, knapp unter der Grenze.
   #C81A1F = 5,8:1 und bleibt als Markenrot erkennbar.                      */
html body a[style*="#ED1E24"], html body a[style*="#ed1e24"],
html body [style*="color: #ED1E24"], html body [style*="color:#ED1E24"] { color: #C81A1F !important; }

/* --- P6: Schutz gegen Bildverzerrung ------------------------------------
   Der PHP-Filter unten ergaenzt width/height an Bildern ohne Masse.
   Ohne height:auto wuerde das bei responsiver Skalierung verzerren.        */
html body .entry-content img,
html body .page-content img { height: auto; }
/* --- P8: Layout-Sprung auf JEDER Seite ------------------------------------
   Gemessen mit PerformanceObserver (layout-shift):
     Reisebericht CLS 0.1043 · Ratgeber CLS 0.1875   (Google-Grenze: 0.10)
   Verursacher laut Observer: HEADER.tf_box + IMG.site-logo-image.
   Das Logo steht als <img width="175"> OHNE height im Markup — der Browser
   reserviert keine Hoehe, der Header waechst beim Laden, die ganze Seite
   rutscht nach unten. Datei ist 800x200 (mit PIL geprueft) = 4:1.
   aspect-ratio reserviert den Platz vor dem Laden, bei jeder Breite.        */
html body img.site-logo-image { aspect-ratio: 4 / 1; height: auto; }

/* --- P9: Tabellenkoepfe weiss auf #518C9C = 3,76:1 -----------------------
   Betrifft jeden Artikel mit Tabelle (Reisebericht 3, Ratgeber 2 ...).
   Gleiche Loesung wie bei den Chips: Grund minimal abdunkeln -> 5,26:1.
   Inline-Styles und Klassen-Varianten beide abgedeckt.                      */
html body .mh-table-wrap th,
html body .mh-table-stripe th,
html body .mh-table-wrap thead tr,
html body [style*="background: #518C9C"],
html body [style*="background:#518C9C"],
html body [style*="background: #518c9c"],
html body [style*="background:#518c9c"] { background: #42737F !important; }

/* --- P10: sekundaerer Text zu blass --------------------------------------
   Gemessen /zusammenarbeit/: #888 auf #F8F9FA = 3,36:1
   ("…und viele weitere!" unter den Partner-Chips). #666 = 5,45:1.          */
html body [style*="color: #888"], html body [style*="color:#888"] { color: #666666 !important; }

/* --- P11: Auszeichnungs-Badge orange -------------------------------------
   Gemessen: #C77B30 auf #FFF3E6 = 3,05:1 bei 14 px
   ("Bekannt aus: Die Welt", "#1 German Travel Influencer").
   #96561A = 5,27:1, bleibt derselbe warme Ton.                             */
html body [style*="color: #C77B30"], html body [style*="color:#C77B30"],
html body [style*="color: #c77b30"], html body [style*="color:#c77b30"] { color: #96561A !important; }

/* --- P12: entfallen mit P1 (Boxen sind wieder auf voller Spaltenbreite) --- */
/* --- P13: der Haupt-CTA war das schlechteste Element der ganzen Seite -----
   Gemessen: weisse Schrift auf Korall #E8A87C = 2,03:1 (noetig 4,5:1).
   Betrifft "Zusammenarbeit anfragen" auf Startseite, Ueber-mich,
   Zusammenarbeit, Presse — also genau den Button, der Geld bringt.
   Zwei Wege durchgerechnet:
     A dunkle Schrift auf unveraendertem Korall -> 5,44:1, Marke bleibt exakt
     B weisse Schrift, Korall abdunkeln -> 5,05:1, aber Korall wird Braun
   Gewaehlt: A. Die Markenfarbe bleibt unangetastet, nur die Schriftfarbe
   wechselt auf das dunkle Blaugrau, das die Seite ohnehin als Textfarbe nutzt.
   Rueckbau = diese eine Regel loeschen.                                    */
html body .mh-btn-primary,
html body .mh-um-cta-primary,
html body a.mh-btn-primary,
html body a.mh-um-cta-primary,
html body .mh-btn-coral {
  color: #2F3E46 !important;
  font-weight: 700 !important;   /* dunkle Schrift auf warmem Grund braucht etwas mehr Gewicht */
}
html body .mh-btn-primary:hover,
html body .mh-um-cta-primary:hover,
html body .mh-btn-coral:hover { color: #1F2A30 !important; }

/* --- P14: Links im Fliesstext dreifach dargestellt ------------------------
   Gemessen auf /ratgeber/: dieselbe Farbe, aber drei Auspraegungen —
   unterstrichen/700, ohne Unterstreichung/400, unterstrichen/400.
   Ein Leser kann so nicht erkennen, was klickbar ist. Eine Form:
   unterstrichen, normales Gewicht (Fettung bleibt dem <strong> ueberlassen). */
html body .entry-content p a:not([class]),
html body .entry-content li a:not([class]),
html body .entry-content td a:not([class]) {
  text-decoration: underline !important;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
@media (min-width: 1000px) {
  html body.single .entry-content > .mh-post-cta-box {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}