/* ============================================================
   TFCZ · BAUSTEIN: Menüleiste (Single Source)

   EINE Leiste für ALLE Seiten. Vorher gab es zwei parallele Systeme —
   `.nav` (Home, geschichte, regeln, über-uns) und `.top` (medien, training,
   firmenevents, mitglied). Sie liefen in Höhe, Logo-Position und Aufbau immer
   wieder auseinander (Single-Source-Verstoss). Ab jetzt nur noch `.nav`.

   Aufgabenteilung:
     · Aussehen (Hintergrund, Markenlinien, Logo, Links, CTA)  → HIER.
     · Masse/Position (Höhe 72/64, Logo links, Burger rechts)   → system/page.css
       (erzwingt die Gleichheit über ALLE Seiten, egal welcher Inhalt).
     · Burger/Drawer/Schliess-Verhalten                         → system/components/nav.js
     · INHALT pro Seite (welche Links, ob ein CTA)              → bleibt frei im HTML
       der jeweiligen Seite. Genau deshalb kann Home ihren „Komm vorbei"-CTA
       haben und eine andere Seite eigene Links/CTAs — das Gerüst ist gleich,
       der Inhalt individuell.

   Einbinden IMMER nach tokens.css:  <link rel="stylesheet" href="system/nav.css">
   ============================================================ */

.nav{
  position:sticky; top:0; z-index:90; width:100%;
  display:flex; align-items:center; gap:10px;
  /* Inhalt fluchtet mit .wrap (max-width 1160, 22px Rand) → Logo linksbündig zu den Sektionen */
  padding:12px max(22px, calc((100% - 1160px)/2 + 22px));
  background:linear-gradient(155deg, rgba(10,24,38,.92), rgba(6,15,24,.90));
  border-top:3px solid var(--blue); border-bottom:3px solid var(--gold);   /* Markenlinie blau oben / gold unten */
  box-shadow:var(--e-2);
}

/* Logo: links fixiert (schiebt Links + Burger nach rechts) */
.nav .logo{
  display:flex; align-items:center; gap:10px; min-width:0; margin-right:auto;
  color:#fff; font-weight:900; font-size:15px; letter-spacing:.02em; text-decoration:none;
}
.nav .logo img{ height:38.8px; width:auto; object-fit:contain; display:block; }
.nav .logo span{ color:var(--gold-lt); }
.nav .logo:active{ transform:scale(.9); }
.nav .logo.pressed{ animation:logoPress .42s var(--ease); }
@keyframes logoPress{ 0%{transform:scale(1)} 35%{transform:scale(.86)} 70%{transform:scale(1.05)} 100%{transform:scale(1)} }

/* KEINE Sektions-Links im Kopf (Vasco 01.08.2026): der Kopf trägt nur noch
   Logo · Konto-Knopf · Burger — die Navigation lebt komplett im Burger-Drawer.
   Die frühere `.navlinks`-Leiste samt Hover-Strich und Scroll-Spy ist entfernt.
   Konto-Knopf (Anmelden bzw. Avatar + Menü) und Burger baut
   system/components/nav.js selbst ein — auf JEDER Seite gleich. */

/* Optionaler CTA pro Seite: Form/Farbe kommt aus den Button-Klassen (buttons.css),
   hier nur das Nav-Verhalten. */
.nav .cta{ white-space:nowrap; }

@media(prefers-reduced-motion:reduce){ .nav .cta, .nav .logo.pressed{ animation:none!important; } }
