/* Navigation passend machen (02.10.2026)
   Grund: 12 Reiter + BOOSTER-Button sind breiter als die 1240px-Leiste, der Button rutschte in eine zweite Zeile.
   Loesung: Leiste breiter, Schrift und Abstaende je Bildschirmbreite abgestuft, unter 1300px Klappmenue.
   Wird auf jeder Seite NACH den seiteneigenen Styles geladen, deshalb gewinnen diese Regeln. */

@media (min-width: 1300px) {
  nav.top > div.navwrap, nav.top > div.wrap { max-width: 1600px; padding-left: 24px; padding-right: 24px; }
  nav.top .nav-links { display: flex; align-items: center; flex-wrap: nowrap; gap: 9px; }
  nav.top .nav-links > a,
  nav.top .nav-links > .nav-item { margin-left: 0; }
  nav.top .nav-links > a,
  nav.top .nav-links > .nav-item > a { font-size: 12px; white-space: nowrap; }
  nav.top .nav-links .nav-item > a { gap: 6px; }
  nav.top .nav-links a.btn-nav { padding: 9px 14px; margin-left: 4px; }
}
@media (min-width: 1440px) {
  nav.top .nav-links { gap: 12px; }
  nav.top .nav-links > a,
  nav.top .nav-links > .nav-item > a { font-size: 13px; }
  nav.top .nav-links a.btn-nav { padding: 10px 16px; }
}
@media (min-width: 1600px) {
  nav.top .nav-links { gap: 17px; }
  nav.top .nav-links > a,
  nav.top .nav-links > .nav-item > a { font-size: 14px; }
  nav.top .nav-links a.btn-nav { padding: 11px 20px; margin-left: 6px; }
}

/* 901 bis 1299px: Klappmenue wie auf dem Handy (unter 900px regeln das die Seiten selbst) */
@media (min-width: 901px) and (max-width: 1299px) {
  nav.top .nav-toggle { display: block; }
  nav.top .nav-links { position: absolute; top: 100%; left: 0; right: 0; display: flex; flex-direction: column; align-items: stretch;
    background: rgba(6,13,26,0.98); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255,255,255,0.08); padding: 8px 32px 22px;
    max-height: 0; overflow: hidden; opacity: 0; visibility: hidden;
    transition: max-height .35s ease, opacity .3s, visibility .3s; }
  nav.top .nav-links.open { max-height: calc(100vh - 80px); overflow-y: auto; opacity: 1; visibility: visible; }
  nav.top .nav-links a { margin-left: 0; padding: 14px 2px; font-size: 16px; border-bottom: 1px solid rgba(255,255,255,0.07); }
  nav.top .nav-links a.btn-nav { margin: 14px 0 4px; text-align: center; justify-content: center; border-bottom: 0; padding: 15px; }
  nav.top .nav-links .nav-item { display: block; width: 100%; margin-left: 0; }
  nav.top .nav-links .nav-item > a { width: 100%; justify-content: space-between; }
  nav.top .nav-links .nav-item > a::after { transform: rotate(45deg); }
  nav.top .nav-sub { position: static; min-width: 0; margin: 0; padding: 0 0 4px 16px; background: none; border: 0;
    box-shadow: none; backdrop-filter: none; opacity: 1; visibility: visible; transform: none; }
  nav.top .nav-sub::before { display: none; }
  nav.top .nav-sub a { font-size: 15px; padding: 12px 2px; border-radius: 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
}

/* Pfeil an "KI-Schulungen": der Unterstrich-Effekt einiger Seiten (a:not(.btn-nav)::after) hat ihn verdrängt */
nav.top .nav-links .nav-item > a:not(.btn-nav)::after,
nav.top .nav-links .nav-item > a:not(.btn-nav):hover::after {
  position: static; width: 6px; height: 6px; background: none; bottom: auto; left: auto;
}