/* Programm-App JT 2026 – Kopfzeilen-Menü (Stil 2026: #39577d, Lato 13 px Versalien, Aktiv-Strich #5da1c3).
   Desktop (≥900 px): Meine Daten ▾; Programm ▾ (Dropdown: Hover, Klick, Tastatur – static/nav.js); Livestream; Workshop buchen; MVV.
   Mobil/Tablet (<900 px): Burger-Schublade mit Gruppen „Meine Daten“, „Programm“, danach die Einzelpunkte. */
.hnav{display:none}
@media(min-width:900px){
  .hnav{order:1;display:flex;align-items:stretch;flex:1 1 auto;min-width:0;height:100%;gap:4px}
  .hn-group{position:relative;display:flex;align-items:stretch}
  .hn-top{position:relative;display:flex;align-items:center;gap:6px;padding:0 12px;margin:0;background:none;border:0;color:#fff;cursor:pointer;
    font:400 13px/1 Lato,Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
  .hn-link{position:relative;display:flex;align-items:center;padding:0 12px;color:#fff;text-decoration:none;font-size:13px;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
  .hn-link::before{content:"";position:absolute;left:12px;right:12px;top:21px;height:3px;border-radius:2px;background:var(--head-line);opacity:0;transition:opacity .15s}
  .hn-link:hover::before,.hn-link.on::before{opacity:1}
  .hn-link.on{color:#d4d4d4;font-weight:700}
  .hn-link:focus-visible{outline-offset:-3px}
  .hn-top::before{content:"";position:absolute;left:12px;right:12px;top:21px;height:3px;border-radius:2px;background:var(--head-line);opacity:0;transition:opacity .15s}
  .hn-top:hover::before,.hn-group.open .hn-top::before,.hn-group.on .hn-top::before{opacity:1}
  .hn-group.on .hn-top{color:#d4d4d4;font-weight:700}
  .hn-top:focus-visible{outline-offset:-3px}
  .hn-chev{width:11px;height:11px;flex:none;transition:transform .15s}
  .hn-group.open .hn-chev{transform:rotate(180deg)}
  .hn-sub{position:absolute;top:100%;left:0;z-index:45;min-width:240px;margin:0;padding:6px 0;list-style:none;background:var(--head);
    border-top:1px solid rgba(255,255,255,.18);border-radius:0 0 10px 10px;box-shadow:0 10px 22px rgba(10,20,40,.28)}
  .hn-sub li{margin:0;padding:0}
  .hn-sub a{display:flex;align-items:center;min-height:42px;padding:0 18px;color:#fff;text-decoration:none;font-size:13px;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
  .hn-sub a:hover,.hn-sub a:focus-visible{background:rgba(255,255,255,.1)}
  .hn-sub a:focus-visible{outline-offset:-3px}
  .hn-sub a.on{color:#d4d4d4;font-weight:700;box-shadow:inset 3px 0 0 var(--head-line)}
}
/* 900–1199 px: fünf Hauptpunkte + Anmeldung + Logo eng setzen */
@media(min-width:900px) and (max-width:1199px){
  .top-in{gap:12px}
  .hnav{gap:0}
  .hn-top,.hn-link{padding:0 8px}
  .hn-top::before,.hn-link::before{left:8px;right:8px}
  .top .who{display:none}
  .brand{width:104px}
}

/* Schublade: zwei Gruppen */
.dr-group{padding:4px 0 8px}
.dr-group + .dr-group{border-top:1px solid rgba(255,255,255,.18);padding-top:10px}
.dr-solo a{padding-left:16px}
.dr-h{margin:0;padding:6px 16px 4px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#c6dceb}
.dr-group a{display:flex;align-items:center;min-height:46px;padding:0 16px 0 26px;color:#fff;text-decoration:none;font-size:15px;text-transform:uppercase;letter-spacing:.01em;overflow-wrap:anywhere}
.dr-group a.on{color:#d4d4d4;font-weight:700;box-shadow:inset 3px 0 0 var(--head-line)}
.dr-group a:hover{background:rgba(255,255,255,.08)}
.dr-group a:focus-visible{outline-offset:-3px}