/* ════════════════════════════════════════════════════════════════════
   Vollflaechen-Menue - Neufassung 2026
   Laedt NACH styles.css und ueberschreibt nur das geoeffnete Burger-Menue.
   styles.css bleibt unberuehrt (teilt sich der Live-Stand).
   ════════════════════════════════════════════════════════════════════ */

/* ── Flaeche: tiefes Gruen mit weichem Schein in der Mitte ── */
#nav-menu {
  background:#0A2019;
  background-image:
    radial-gradient(52% 40% at 50% 50%, rgba(16,185,129,.11) 0%, rgba(16,185,129,.035) 46%, transparent 72%);
}

#nav-menu { overflow-y:auto; }
#nav-menu-inner {
  position:relative;
  box-sizing:border-box;
  max-width:1320px;
  min-height:100vh;
  min-height:100dvh;
  padding:clamp(96px,13vh,150px) clamp(24px,4.6vw,64px) clamp(88px,13vh,140px);
  gap:clamp(10px,2.4vh,30px);
}

/* ── Menuepunkte mit vorangestellter Nummer ── */
.nav-menu-link {
  display:flex;
  align-items:center;
  gap:clamp(16px,2.4vw,40px);
  width:max-content;
  max-width:100%;
  opacity:1;
  color:rgba(214,232,224,.40);
  transition:color .35s ease, transform .5s cubic-bezier(.22,.7,.2,1);
}
.nav-open .nav-menu-link { opacity:1; }
.nav-menu-link::before {
  content:attr(data-num);
  flex:none;
  font-size:clamp(11px,1vw,14px);
  font-weight:600;
  letter-spacing:.14em;
  line-height:1;
  color:#FFFFFF;
  /* auf die optische Mitte der Versalien heben statt auf die Zeilenmitte */
  transform:translateY(-.55em);
  transition:color .35s ease;
}
/* Fallback, falls im Markup kein data-num steht */
#nav-menu-inner .nav-menu-link:nth-of-type(1)::before { content:"01"; }
#nav-menu-inner .nav-menu-link:nth-of-type(2)::before { content:"02"; }
#nav-menu-inner .nav-menu-link:nth-of-type(3)::before { content:"03"; }
#nav-menu-inner .nav-menu-link:nth-of-type(4)::before { content:"04"; }

.nav-menu-link:hover,
.nav-menu-link:focus-visible { color:#FFFFFF; opacity:1; }
.nav-menu-link:hover::before,
.nav-menu-link:focus-visible::before { color:#10B981; }

/* ── Sprachumschalter oben links ── */
#nav-menu-inner > .lang-switch {
  position:absolute;
  top:clamp(26px,4.4vh,44px);
  left:clamp(24px,4.6vw,64px);
  border:0;
  border-radius:0;
  gap:2px;
  align-items:center;
}
#nav-menu-inner > .lang-switch::before {
  content:"";
  position:absolute;
  left:calc(50% - .5px);
  top:20%;
  width:1px;
  height:60%;
  background:rgba(214,232,224,.3);
}
#nav-menu .lang-btn {
  display:inline-block;
  text-decoration:none;
  padding:4px 12px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  background:transparent;
  color:rgba(214,232,224,.45);
  border-radius:8px;
}
#nav-menu .lang-btn:first-child { padding-left:0; }
/* Aussenkanten ohne Padding → Mittellinie (50%) sitzt exakt zwischen den
   Labels, beide haben den gleichen Abstand zum Strich. */
#nav-menu .lang-btn:last-child { padding-right:0; }
#nav-menu .lang-btn:hover { color:rgba(255,255,255,.85); background:transparent; }
#nav-menu .lang-btn.is-active { background:transparent; color:#FFFFFF; }

/* ── Fuss: CTA unten links, Copyright unten rechts ── */
#nav-menu-foot {
  position:absolute;
  left:clamp(24px,4.6vw,64px);
  bottom:clamp(34px,5.6vh,58px);
  margin-top:0;
  gap:20px;
}
#nav-menu #nav-cta {
  display:inline-flex;
  line-height:1;
  align-items:center;
  gap:16px;
  justify-content:center;
  padding:14px 20px;
  border-radius:8px;
  font-size:15px;
  background:#EDEFEC;
  color:#0A2019;
}
#nav-menu #nav-cta::after {
  content:"";
  flex:none;
  width:26px; height:26px;
  border-radius:50%;
  background-color:#0A2019;
  /* Pfeil als Grafik statt Textzeichen - sitzt exakt in der Kreismitte */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M9 13h8M13.6 9.6 17 13l-3.4 3.4' fill='none' stroke='%23EDEFEC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:26px 26px;
  transition:transform .3s cubic-bezier(.22,.7,.2,1);
}
#nav-menu #nav-cta:hover { background:#FFFFFF; color:#0A2019; }
#nav-menu #nav-cta:hover::after { transform:translateX(3px); }

#nav-menu-inner::after {
  content:"© 2026 Links der Isar GmbH";
  position:absolute;
  right:clamp(24px,4.6vw,64px);
  bottom:clamp(34px,5.6vh,58px);
  font-size:12.5px;
  letter-spacing:.01em;
  color:rgba(214,232,224,.42);
  pointer-events:none;
}


/* Auf schmalen Schirmen ist neben dem Button kein Platz fuer die Zeile -
   der Button rueckt hoch, das Copyright darunter. */
@media (max-width:620px) {
  #nav-menu-foot { bottom:calc(clamp(34px,5.6vh,58px) + 40px); }
  #nav-menu-inner::after { left:clamp(24px,4.6vw,64px); right:auto; bottom:clamp(22px,3.4vh,34px); }
}

@media (max-width:720px) {
  #nav-menu-inner { padding-left:24px; padding-right:24px; }
  #nav-menu-inner > .lang-switch, #nav-menu-foot { left:24px; }
  #nav-menu-inner::after { right:24px; font-size:11.5px; }
}

/* Bei offenem Menue liegt #ldi-nav (z-index 200) ueber dem Overlay (150);
   das nur per opacity ausgeblendete Logo faengt sonst die Klicks auf den
   Sprachumschalter darunter ab. Leiste durchlaessig machen, Bedienelemente
   klickbar lassen. */
.nav-open #ldi-nav { pointer-events:none; }
.nav-open #ldi-nav #nav-toggle,
.nav-open #ldi-nav #theme-toggle { pointer-events:auto; }
