/* Mobile-Navigation — gemeinsame Komponente fuer alle Seiten.
   Markup wird von nav-mobile.js erzeugt. Ab md wird alles ausgeblendet. */

.nav-burger{position:relative;z-index:9600;display:flex;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:0 9px;margin-right:-9px;background:none;border:0;cursor:pointer}
.nav-burger span{display:block;height:1.5px;width:100%;background:#fff;border-radius:2px;
  transition:transform .32s cubic-bezier(.22,.61,.36,1),opacity .2s ease}
.nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media (min-width:768px){.nav-burger{display:none}}
/* nav hat z-index:50 und bildet einen Stacking-Context — der Burger darin
   laege sonst unter dem Overlay. Bei offenem Menue die Leiste anheben. */
body.mm-open nav{z-index:9600!important}

.mm{position:fixed;inset:0;z-index:9500;background:#0F0E14;
  display:flex;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:96px 24px 40px;
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .34s ease,transform .34s cubic-bezier(.22,.61,.36,1),visibility .34s}
.mm.is-open{opacity:1;visibility:visible;transform:none}
@media (min-width:768px){.mm{display:none}}

.mm-link{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:30px;font-weight:300;color:#fff;
  padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08);line-height:1.2}
.mm-link[aria-current]{color:#A29990}

.mm-group{border-bottom:1px solid rgba(255,255,255,.08)}
.mm-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:30px;font-weight:300;color:#fff;
  padding:13px 0;background:none;border:0;text-align:left;line-height:1.2;cursor:pointer}
.mm-toggle svg{width:14px;height:9px;flex:none;transition:transform .3s ease;color:#930413}
.mm-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.mm-sub{overflow:hidden;max-height:0;transition:max-height .42s cubic-bezier(.22,.61,.36,1)}
.mm-sub-inner{padding:6px 0 18px}
.mm-sub-head{display:block;font-size:9px;letter-spacing:.3em;text-transform:uppercase;font-weight:800;
  color:#930413;margin:14px 0 8px}
.mm-sub-link{display:block;font-size:15px;font-weight:300;color:rgba(255,255,255,.72);
  padding:9px 0 9px 14px;border-left:1px solid rgba(255,255,255,.12)}
.mm-sub-link[aria-current]{color:#fff;border-left-color:#930413}
.mm-sub-all{display:inline-block;margin-top:14px;margin-left:14px;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;font-weight:700;color:rgba(255,255,255,.5)}

.mm-foot{margin-top:auto;padding-top:34px}
.mm-cta{display:block;text-align:center;font-size:11px;letter-spacing:.25em;text-transform:uppercase;
  font-weight:700;color:#fff;border:1px solid #930413;padding:19px 20px}
.mm-meta{margin-top:24px;font-size:13px;font-weight:300;line-height:2;color:rgba(255,255,255,.5)}
.mm-meta a{color:rgba(255,255,255,.5)}

/* CTA in der Leiste weicht dem Burger */
@media (max-width:767px){nav .liquid-cta{display:none!important}
  nav a[href="/#kontakt"].border{display:none!important}
  .mm-hide-sm{display:none!important}}

@media (prefers-reduced-motion:reduce){
  .mm,.mm-sub,.nav-burger span,.mm-toggle svg{transition-duration:.001ms!important}}

/* Leistungsmenü am gesamten Navigationsbalken ausrichten. */
@media (min-width:768px) {
  nav .nav-drop { position:static; }
  nav .nav-panel {
    top:100%;
    width:min(680px, calc(100vw - 48px));
    min-width:0;
  }
  nav .nav-panel::before { top:-28px; height:28px; }
}
