/* Identisches mobiles Hauptmenü für Seiten mit dem alternativen Landingpage-Template. */
@font-face {
  font-family: "IBM Plex Sans Condensed Local";
  src: url("fonts/IBM Plex Sans Condensed/IBMPlexSansCondensed-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@media (max-width: 1100px) {
  .site-header, .site-header .header-inner { height: 82px !important; }
  .site-header .header-inner { position: relative; z-index: 100; }
  .site-header .brand, .site-header .brand-logo { width: 125px !important; }

  .mobile-menu {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99 !important;
    padding: 0 !important;
    overflow-y: auto !important;
    color: #fff !important;
    background: #112f58 !important;
    border: 0 !important;
    overscroll-behavior: contain;
  }

  .mobile-menu nav {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 20px !important;
    padding: 96px 12vw 48px;
    font-family: "IBM Plex Sans Condensed Local", Arial, sans-serif;
    font-size: 30px;
    font-weight: 400;
  }

  .mobile-menu nav > a {
    padding: 0 !important;
    color: #fff !important;
    border: 0 !important;
    font-size: 30px !important;
    font-weight: 400 !important;
  }

  .mobile-menu .mobile-menu-label {
    padding: 0 !important;
    color: #56af31 !important;
    border: 0 !important;
    font-size: 13px !important;
    font-weight: 400;
    letter-spacing: .15em;
  }

  .mobile-menu .mobile-services {
    display: grid !important;
    gap: 9px !important;
    margin: -8px 0 9px !important;
    padding: 0 0 0 18px !important;
    border: 0 !important;
    border-left: 1px solid rgba(86, 175, 49, .55) !important;
  }

  .mobile-menu .mobile-services a {
    padding: 0 !important;
    color: #fff !important;
    border: 0 !important;
    font-size: 21px !important;
    font-weight: 400 !important;
  }

  .site-header:has(.menu-toggle[aria-expanded="true"]) {
    color: #fff !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }
  .site-header:has(.menu-toggle[aria-expanded="true"]) .brand-logo--light { opacity: 1 !important; }
  .site-header:has(.menu-toggle[aria-expanded="true"]) .brand-logo--dark { opacity: 0 !important; }
  .site-header .menu-toggle span { width: 28px; height: 1px; margin: 8px; }
  .site-header .menu-toggle { position: relative; z-index: 101; }
  .site-header .menu-toggle[aria-expanded="true"] span { background: #fff !important; }
  .site-header .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4.5px) rotate(45deg); }
  .site-header .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4.5px) rotate(-45deg); }
}