/* Widescreen-Overrides: Lockern die wrapper/main-Caps der Legacy-Site,
   damit die Seite auf breiten Monitoren breiter floaten kann. Mobile +
   Tablet bleiben unverändert (alle Werte sind Min-Width-Queries). */

@media screen and (min-width: 90em) {
  main { max-width: 100% !important; }
  .wrapper { max-width: 90rem !important; padding-left: 2rem !important; padding-right: 2rem !important; }
}

@media screen and (min-width: 110em) {
  .wrapper { max-width: 100rem !important; padding-left: 3rem !important; padding-right: 3rem !important; }
}

@media screen and (min-width: 130em) {
  .wrapper { max-width: 112rem !important; padding-left: 4rem !important; padding-right: 4rem !important; }
}

/* Header-Image: nutze die volle Breite des Viewports auf großen Monitoren. */
@media screen and (min-width: 90em) {
  .header-image:not(.small) {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Floating Vollbild-Header (header.full) — Logo, Nav-Padding nur auf
   ECHT großen Monitoren kompakter. Kleinere Screens behalten den
   Legacy-Default 7.5rem Logo. */
@media screen and (min-width: 90em) {
  header.full { padding-top: 0.75rem !important; }
  header.full nav.main-nav ul {
    margin-top: 0.5rem !important;
    padding-top: 0.5rem !important;
  }
  header.full nav.main-nav .main li a {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }
}