/* Medienreife 3.0 — Tablet und Handy.
   Die Seiten tragen ihr Layout als Inline-Style. Diese Datei überschreibt es gezielt
   (!important) über die Schreibweise, in der der Browser die Styles ablegt
   ("grid-template-columns: repeat(3, 1fr)"). Im Theme per wp_enqueue_style eingebunden.
   Stufen: ≤1100 Tablet quer · ≤900 Tablet hochkant · ≤600 Handy. */

/* ---------- Navigation: Burger und Sprachumschalter (alle Breiten) ---------- */
.mr-lang{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:980px;background:rgba(0,0,0,0.05)}
.mr-lang button,.mr-lang a{all:unset;cursor:pointer;font:500 11.5px/1 'Inter',system-ui,sans-serif;letter-spacing:.3px;color:#6e6e73;padding:6px 9px;border-radius:980px;transition:background .2s,color .2s}
.mr-lang [aria-current="true"]{background:#fff;color:#1d1d1f;box-shadow:0 1px 4px rgba(0,0,0,0.12)}
.mr-lang a:focus-visible{outline:2px solid #0071e3;outline-offset:2px}
.mr-mob-panel{display:none}
.mr-mob-panel:not(.is-open){display:none!important}

/* ---------- Sektionshöhe (alle Breiten) ----------
   Jede Sektion füllt mindestens 80 % der Bildschirmhöhe, Hero und Abschlussband 85 %,
   Inhalt vertikal zentriert. Ausnahmen: schmale Logoleiste, Artikelseiten (Lesefluss).
   svh statt vh, wo verfügbar: keine Sprünge durch die einklappende Adressleiste am Handy. */
section[data-screen-label]:not([data-screen-label*="Partner-Leiste"]):not([data-screen-label^="Artikel"]),
header[data-screen-label]:not([data-screen-label^="Artikel"]){min-height:80vh;min-height:80svh;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}
header[data-screen-label]:not([data-screen-label^="Artikel"]),
section[data-screen-label="Komponente – Page-Hero Unterseiten"],
section[data-screen-label="Komponente – CTA-Band"]{min-height:85vh;min-height:85svh}
/* Zentrierung per Flex würde Container mit „margin: auto“ auf Inhaltsbreite schrumpfen lassen →
   volle Breite erzwingen. border-box hält die Außenmaße gleich; Container mit 24-px-Rand
   bekommen +48 px Höchstbreite, damit die Inhaltsbreite auf breiten Bildschirmen bei 1600 px bleibt. */
:is(section[data-screen-label],header[data-screen-label])>:not([style*="position: absolute"]){width:100%;box-sizing:border-box}
:is(section[data-screen-label],header[data-screen-label])>[style*="max-width: 1600px"][style*="padding: 0px 24px"]{max-width:1648px}

/* ---------- ≤1100: Tablet quer ---------- */
@media (max-width:1100px){
  [style*="grid-template-columns: repeat(4, 1fr)"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  footer [style*="grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr"]{grid-template-columns:repeat(4,minmax(0,1fr))!important;row-gap:28px!important}
  footer [style*="grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr"]>:first-child{grid-column:1/-1}
  h1[style*="font-size: 54px"],h1[style*="font-size: 52px"]{font-size:46px!important}
  nav ul{gap:20px!important}
}

/* ---------- ≤900: Tablet hochkant ---------- */
@media (max-width:900px){
  /* Navigation: Burger statt Linkleiste */
  nav .mr-nav-links{display:none!important}
  nav .mr-burger{display:flex!important}
  nav .mr-mob-panel{display:block}

  /* Raster */
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  /* einzelne letzte Karte mittig statt allein links */
  [style*="grid-template-columns: repeat(3, 1fr)"]>:last-child:nth-child(odd),
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"]>:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 11px)}
  /* Startseite-Hero: schwebende Hinweise innerhalb des Bildes */
  header [style*="left: -30px"]{left:12px!important}
  header [style*="right: -25px"]{right:12px!important}
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1.1fr 1fr"],
  [style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr)"],
  [style*="grid-template-columns: 200px minmax(0px, 1fr)"]{grid-template-columns:minmax(0,1fr)!important;gap:36px!important}
  /* Hero-Bild unter dem Text nicht quadratisch über die volle Breite */
  [style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr)"]>:nth-child(2){max-width:520px;width:100%;margin:0 auto}
  [style*="grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr)"]>:first-child{max-width:none!important}
  header [style*="grid-template-columns: 1.1fr 1fr"] img[style*="height: 420px"]{height:340px!important}
  /* Artikel: Inhaltsverzeichnis als Zeile über dem Text */
  aside[style*="position: sticky"]{position:static!important;flex-direction:row!important;flex-wrap:wrap;gap:4px 14px!important}
  aside[style*="position: sticky"]>span{width:100%}

  /* Abstände und Schrift */
  section[style*="padding: 90px 0px"]{padding-top:70px!important;padding-bottom:70px!important}
  [style*="margin-bottom: 50px"]{margin-bottom:36px!important}
  h1[style*="font-size: 54px"],h1[style*="font-size: 52px"]{font-size:42px!important}
  h2[style*="font-size: 38px"]{font-size:32px!important}
  h2[style*="font-size: 36px"]{font-size:30px!important}
  h2[style*="font-size: 34px"]{font-size:29px!important}
}

/* ---------- ≤600: Handy ---------- */
@media (max-width:600px){
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"],
  [style*="grid-template-columns: repeat(4, 1fr)"]{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
  [style*="grid-template-columns: repeat(3, 1fr)"]>:last-child:nth-child(odd),
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr))"]>:last-child:nth-child(odd){width:auto;justify-self:stretch}
  /* Auszeichnungen bleiben zweispaltig, sie sind kompakt */
  [style*="grid-template-columns: repeat(4, minmax(0px, 1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  [style*="grid-template-columns: repeat(4, minmax(0px, 1fr))"]>div{padding:20px 12px 18px!important;gap:14px!important}
  footer [style*="grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Außenränder */
  [style*="max-width: 1600px"][style*="padding: 0px 24px"]{padding-left:20px!important;padding-right:20px!important}
  section[style*="padding: 90px 0px"]{padding-top:56px!important;padding-bottom:56px!important}
  header[style*="padding: 130px 0px 90px"]{padding:92px 0 56px!important}
  header[style*="padding: 130px 0px 60px"]{padding:92px 0 40px!important}
  section[style*="padding: 140px 0px 80px"]{padding:92px 0 48px!important}
  [style*="margin-bottom: 50px"]{margin-bottom:28px!important}

  /* Schrift */
  h1[style*="font-size: 54px"],h1[style*="font-size: 52px"]{font-size:34px!important;letter-spacing:-0.7px!important;line-height:1.1!important}
  h2[style*="font-size: 38px"]{font-size:27px!important;letter-spacing:-0.4px!important}
  h2[style*="font-size: 36px"]{font-size:26px!important}
  h2[style*="font-size: 34px"]{font-size:26px!important}
  h2[style*="font-size: 28px"]{font-size:23px!important}
  p[style*="font-size: 20px"]{font-size:17px!important}
  p[style*="font-size: 18px"]{font-size:16px!important}
  article[style*="font-size: 18px"]{font-size:16.5px!important}
  blockquote p[style*="font-size: 24px"]{font-size:19px!important}

  /* Karten etwas enger */
  a[data-screen-label="Komponente – Glass-Card"],
  [style*="border-radius: 24px"][style*="padding: 30px 28px"]{padding:24px 22px!important}
  [style*="border-radius: 24px"][style*="padding: 36px"]{padding:26px 22px!important}
  [style*="padding: 60px 30px"]{padding:40px 20px!important}
  blockquote{padding:22px 20px!important}

  /* Startseite-Hero: schwebende Hinweise innerhalb des Bildes */
  header [style*="left: -30px"]{left:10px!important;top:12px!important;padding:10px 12px!important}
  header [style*="right: -25px"]{right:10px!important;bottom:12px!important;padding:10px 12px!important}
  header img[style*="height: 420px"]{height:280px!important}
  /* Hero-Video der Unterseiten: 4:3 statt quadratisch */
  [data-hover-scope] video[style*="aspect-ratio: 1"]{aspect-ratio:4/3!important}

  /* Knopfreihen: Knöpfe teilen sich die Breite */
  [style*="flex-wrap: wrap"]>a[style*="border-radius: 980px"][style*="padding: 13px 26px"]{flex:1 1 auto;text-align:center}
  /* Partnerleiste */
  section [style*="gap: 30px 40px"]{gap:22px 26px!important}
  section [style*="gap: 36px 48px"]{gap:26px 28px!important}

  /* Logo-Laufband: schmalere Felder */
  .mr-marquee-track>div{width:140px!important;height:56px!important}
  .mr-marquee-track img{transform:scale(.8)}
  .mr-marquee-track span{font-size:15px!important}
  /* Fußzeile unten untereinander */
  footer [style*="justify-content: space-between"]{flex-direction:column!important}
}