/* Navigation unter 1200 px: Hamburger-Menue (Tablet/kleiner Laptop 901-1199 px) und Korrektur des geoeffneten Menues bis 1199 px.
   Wird nur bis 1199 px geladen (media-Attribut am link-Tag). */
@media (min-width: 901px) {
  .nav a, body.nav-open .nav { display: block; }
  .burger { display: inline-flex; }
  .nav { position: absolute; left: 0px; right: 0px; top: 100%; background: var(--nav); padding: 10px 16px 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); display: none; }
  .nav ul { flex-direction: column; gap: 6px; }
  .nav a { padding: 10px 12px; border-radius: 10px; }
  .nav a:hover { background: rgba(255, 255, 255, 0.15); }
  body.nav-open { overflow: hidden; }
  body.nav-open .burger span:first-child { transform: translateY(8px) rotate(45deg); }
  body.nav-open .burger span:nth-child(2) { opacity: 0; }
  body.nav-open .burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
  .site-header { position: relative; padding-bottom: 10px; }
  .burger { display: inline-flex !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 8px !important; }
  .burger span { background: rgb(255, 255, 255) !important; width: 26px !important; height: 3px !important; margin: 4px 0px !important; }
  .site-header { position: sticky; top: 0px; z-index: 1000; background: var(--nav, #0A246A); }
  .wrap.header-row { display: flex; align-items: center; justify-content: space-between; min-height: 64px; padding: 0px 1rem; gap: 0px; }
  .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; flex: 1 1 0%; min-width: 0px; }
  .brand img { flex-shrink: 0; height: 40px !important; width: auto !important; }
  .brand-text { font-weight: 800; color: rgb(255, 255, 255); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1rem !important; }
  .burger { align-items: center; justify-content: center; flex-direction: column; gap: 5px; border-radius: 8px; cursor: pointer; flex-shrink: 0; transition: background 0.2s; display: inline-flex !important; width: 44px !important; height: 44px !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 8px !important; }
  .burger:active { background: rgba(255, 255, 255, 0.1) !important; }
  .burger span { display: block !important; width: 24px !important; height: 2px !important; background: rgb(255, 255, 255) !important; border-radius: 2px !important; transition: transform 0.25s, opacity 0.25s !important; margin: 0px !important; box-shadow: none !important; }
  .burger.open span:first-child, nav-open .burger span:first-child { transform: rotate(45deg) translate(5px, 5px); }
  .burger.open span:nth-child(2) { opacity: 0; }
  .burger.open span:nth-child(3), body.nav-open .burger span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
  .nav { flex-direction: column; overflow-y: auto; transform: translateY(-110%); z-index: 999; position: fixed !important; inset: 64px 0px 0px !important; background: rgba(10, 36, 106, 0.97) !important; backdrop-filter: blur(12px) !important; display: flex !important; padding: 1.5rem 1rem 2rem !important; transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important; gap: 0px !important; }
  body.nav-open .nav { transform: translateY(0px) !important; }
  .nav ul { display: flex !important; flex-direction: column !important; gap: 2px !important; padding: 0px !important; margin: 0px !important; }
  .nav ul li { width: 100% !important; }
  .nav a { border-radius: 10px; display: block !important; padding: 14px 16px !important; font-size: 1.05rem !important; font-weight: 600 !important; color: rgba(255, 255, 255, 0.9) !important; text-decoration: none !important; transition: background 0.15s, color 0.15s !important; }
  .nav a:hover, .nav a:active { background: rgba(255, 255, 255, 0.12) !important; color: rgb(255, 255, 255) !important; }
  .mobile-section-header span { display: block; padding: 12px 16px 4px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.4); margin-top: 8px; }
  .header-row { gap: 8px !important; }
  .header-row .brand { flex: 1 1 0%; min-width: 0px; }
  .header-row .fontsize-toggle { order: 8; margin-left: 0px; }
  .header-row .burger { display: inline-flex !important; order: 9; }
  .burger, button.burger, .site-header .burger, #burger, .site-header #burger { display: inline-flex !important; visibility: visible !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 8px !important; width: 44px !important; height: 44px !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; position: relative !important; z-index: 1002 !important; border-radius: 8px !important; flex-direction: column !important; gap: 5px !important; }
  .burger:hover, button.burger:hover, #burger:hover { background: rgba(255, 255, 255, 0.1) !important; transform: none !important; }
  .burger span, button.burger span, .site-header .burger span, #burger span, .site-header #burger span { display: block !important; width: 24px !important; height: 2.5px !important; background: rgb(255, 255, 255) !important; border-radius: 2px !important; transition: transform 0.25s, opacity 0.25s !important; margin: 0px !important; box-shadow: none !important; }
  body.nav-open .burger span:first-child { transform: translateY(7.5px) rotate(45deg) !important; }
  body.nav-open .burger span:nth-child(2) { opacity: 0 !important; }
  body.nav-open .burger span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg) !important; }
  .site-header .nav, nav.nav, #mainnav { display: none !important; }
  body.nav-open .site-header .nav, body.nav-open nav.nav, body.nav-open #mainnav { display: block !important; position: absolute !important; left: 0px !important; right: 0px !important; top: 100% !important; background: rgb(10, 37, 64) !important; padding: 12px 16px 20px !important; border-bottom: 2px solid rgba(255, 255, 255, 0.1) !important; box-shadow: rgba(0, 0, 0, 0.3) 0px 8px 24px !important; z-index: 1001 !important; max-height: 80vh !important; overflow-y: auto !important; }
  body.nav-open .nav ul, body.nav-open #mainnav ul { display: flex !important; flex-direction: column !important; gap: 0px !important; padding: 0px !important; margin: 0px !important; list-style: none !important; width: 100% !important; }
  body.nav-open .nav li, body.nav-open #mainnav li { width: 100% !important; padding: 0px !important; margin: 0px !important; border-bottom: none !important; }
  body.nav-open .nav a, body.nav-open #mainnav a { display: block !important; padding: 12px 16px !important; color: rgb(255, 255, 255) !important; text-decoration: none !important; font-weight: 500 !important; border-radius: 8px !important; transition: background 0.2s !important; background: transparent !important; }
  body.nav-open .nav a:hover, body.nav-open #mainnav a:hover { background: rgba(255, 255, 255, 0.1) !important; color: rgb(255, 255, 255) !important; }
  .mobile-section-header span { display: block !important; padding: 14px 16px 6px !important; font-size: 0.75rem !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.08em !important; color: rgba(255, 255, 255, 0.5) !important; }
  .more-menu-container { display: none !important; }
  html body .site-header .wrap.header-row button#burger.burger, html body .site-header button#burger, html body button#burger { display: inline-flex !important; visibility: visible !important; opacity: 1 !important; background: transparent !important; border: none !important; box-shadow: none !important; padding: 8px !important; width: 44px !important; height: 44px !important; align-items: center !important; justify-content: center !important; flex-direction: column !important; gap: 5px !important; cursor: pointer !important; position: relative !important; z-index: 1002 !important; order: 99 !important; flex-shrink: 0 !important; }
  html body .site-header button#burger span, html body button#burger span { display: block !important; width: 24px !important; height: 2.5px !important; background: rgb(255, 255, 255) !important; border-radius: 2px !important; margin: 0px !important; box-shadow: none !important; transition: transform 0.25s, opacity 0.25s !important; }
  body.nav-open .site-header .nav a, body.nav-open .header-row .nav a, body.nav-open #mainnav a, body.nav-open nav.nav a { color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important; }
  body.nav-open .site-header .nav a:hover, body.nav-open #mainnav a:hover { color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important; background: rgba(255, 255, 255, 0.1) !important; }
  body.nav-open .mobile-section-header span { color: rgba(255, 255, 255, 0.5) !important; -webkit-text-fill-color: rgba(255, 255, 255, 0.5) !important; }
}
@media (max-width: 1199px) {
  /* Geoeffnetes Menue: Hoehe aus dem Inhalt (bottom:0 aus dem Overlay-Entwurf fuehrte zu 34 px Hoehe) */
  html body.nav-open header.site-header #mainnav { bottom: auto !important; height: auto !important; }
  /* Mobil-Links (Services, Wissen, Rechtliches ...) im geoeffneten Menue anzeigen (theme.css blendet sie sonst immer aus) */
  html body.nav-open .header-row .nav > ul > li.mobile-only { display: block !important; }
  html body.nav-open .header-row .nav > ul > li.mobile-section-header span { display: block !important; }
  /* Lesbarkeit im dunklen Menue: Fokus/Hover-Zustand und Abschnittsueberschriften (sonst weiss auf weiss) */
  html body.nav-open header.site-header #mainnav a:hover,
  html body.nav-open header.site-header #mainnav a:focus,
  html body.nav-open header.site-header #mainnav a:focus-visible { background: rgba(255, 255, 255, 0.12) !important; background-image: none !important; color: #fff !important; -webkit-text-fill-color: #fff !important; outline-offset: -2px; }
  html body.nav-open .header-row .nav > ul > li.mobile-section-header { background: transparent !important; border-bottom: 0 !important; }
}