/* Gemeinsame Kopfzeile aller Seiten (2026-10-12, Thomas: „Eine gemeinsame Kopfzeile“). Wird nach dem Stil der Seite geladen und
   überschreibt deren eigene .kopf-Regeln mit höherer Genauigkeit (header.kopf.kf). Aufbau und Menü liefert assets/kopf.js. */
/* Vor kopf.js (defer) gilt derselbe Rahmen schon für header.kopf[data-kopf]: gleiche Höhe und Lage, damit die Seite beim Umbau nicht springt (CLS) */
header.kopf.kf,header.kopf[data-kopf]{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:flex-start;gap:14px;height:56px;padding:0 max(16px,env(safe-area-inset-left));background:var(--navy,#0a1540);color:#fff;box-shadow:inset 0 -1px 0 rgba(255,255,255,.09);font-family:inherit}
/* Glas (Design-Refresh 2026-10-14): halbtransparent mit Weichzeichner, feine Unterkante, kein harter Schatten; ohne Unterstützung bleibt die deckende Farbe */
@supports (((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))) and (color:color-mix(in srgb,red,blue))){
  header.kopf.kf,header.kopf[data-kopf]{background:color-mix(in srgb,var(--navy,#0a1540) 84%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3)}
}
@media print{header.kopf.kf{background:var(--navy,#0a1540);-webkit-backdrop-filter:none;backdrop-filter:none}}
header.kopf[data-kopf="formeln"]{height:58px}
header.kopf[data-kopf]:not(.kf) :is(nav.kopfnav,.frei-marke,.kopf-link){display:none}
/* Sprunglink „Zum Inhalt“ (kopf.js): nur bei Tastaturfokus sichtbar */
header.kopf.kf .kf-sprung{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);z-index:60;padding:0;border-radius:10px;background:var(--volt,#c4ff1a);color:var(--navy,#0a1540);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}
header.kopf.kf .kf-sprung:focus-visible{left:12px;top:8px;width:auto;height:auto;clip-path:none;padding:10px 14px;outline:3px solid var(--navy,#0a1540);outline-offset:2px}
main:focus{outline:none}
header.kf .suche{flex:0 1 220px;min-width:0;overflow:hidden;margin-left:auto}
header.kf .navi-knopf{flex:none}
header.kf .suche+.kf-rechts{margin-left:10px}
header.kf .marke{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;flex:none;min-width:0}
header.kf .marke .logo,header.kf .marke .logo svg{display:block;width:30px;height:30px}
header.kf .marke .logo{border:0;padding:0;margin:0;overflow:visible}
header.kf .marke b{font-weight:700;font-stretch:118%;letter-spacing:-.01em;font-size:16px;color:#fff;white-space:nowrap}
header.kf .marke b i{font-style:normal;color:var(--volt,#c4ff1a)}
header.kf .marke span:not(.logo){color:#aab4dc;font-weight:500;font-size:14px;padding-left:10px;border-left:1px solid rgba(255,255,255,.2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
header.kf .kf-nav{display:flex;align-items:center;gap:2px;margin-left:12px}
header.kf .kf-nav>a,header.kf .kf-mehr>button,header.kf .kf-konto{color:#dfe5ff;text-decoration:none;padding:8px 11px;border-radius:8px;font:inherit;font-size:14.5px;background:none;border:0;cursor:pointer;white-space:nowrap;line-height:1.2}
header.kf .kf-nav>a:hover,header.kf .kf-mehr>button:hover,header.kf .kf-konto:hover{background:rgba(255,255,255,.09);color:#fff}
header.kf .kf-nav>a[aria-current="page"]{color:#fff;background:rgba(255,255,255,.12);font-weight:600}
header.kf .kf-mehr{position:relative}
header.kf .kf-mehr>button::after{content:"";display:inline-block;margin-left:7px;width:6px;height:6px;border:solid currentColor;border-width:0 1.8px 1.8px 0;transform:translateY(-2px) rotate(45deg)}
header.kf .kf-mehr>button[aria-expanded="true"]{background:rgba(255,255,255,.12);color:#fff}
header.kf .kf-panel{position:absolute;right:0;top:calc(100% + 10px);z-index:50;min-width:250px;padding:8px;border-radius:16px;background:#fff;color:#0a1540;box-shadow:0 18px 50px rgba(5,10,40,.3),0 0 0 1px rgba(20,33,90,.1)}
[data-theme="dark"] header.kf .kf-panel{background:#1b2650;color:#e9eefa;box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 0 1px rgba(125,147,255,.3)}
header.kf .kf-panel[hidden]{display:none}
header.kf .kf-panel a{display:block;padding:9px 12px;border-radius:9px;color:inherit;text-decoration:none;font-size:14.5px;line-height:1.3}
header.kf .kf-panel a small{display:block;color:#5a6690;font-size:12.5px;margin-top:1px}
[data-theme="dark"] header.kf .kf-panel a small{color:#aab4dc}
/* Einträge im Menü behalten ihre Schrift beim Überfahren (nur die Hauptnavigation ist weiß auf dunkel) */
header.kf .kf-panel a:hover,header.kf .kf-panel a:focus-visible{background:rgba(31,63,224,.09);color:#0a1540}
[data-theme="dark"] header.kf .kf-panel a:hover,[data-theme="dark"] header.kf .kf-panel a:focus-visible{background:rgba(125,147,255,.16);color:#fff}
header.kf .kf-panel a:focus-visible,header.kf .kf-feld a:focus-visible{outline:2px solid #1f3fe0;outline-offset:-2px}
[data-theme="dark"] header.kf .kf-panel a:focus-visible,[data-theme="dark"] header.kf .kf-feld a:focus-visible{outline-color:var(--volt,#c4ff1a)}
header.kf .kf-panel a[aria-current="page"]{font-weight:700}
header.kf .kf-panel hr{border:0;border-top:1px solid rgba(10,21,64,.12);margin:6px 4px}
[data-theme="dark"] header.kf .kf-panel hr{border-color:rgba(125,147,255,.25)}
header.kf .kf-rechts{display:flex;align-items:center;gap:8px;margin-left:auto}
header.kf .kf-konto{border:1px solid rgba(255,255,255,.28)}
header.kf .kf-cta{background:var(--volt,#c4ff1a);color:#0a1540;font-weight:650;font-size:14.5px;padding:8px 13px;border-radius:8px;text-decoration:none;white-space:nowrap}
header.kf .kf-cta:hover{background:#d6ff5c}
header.kf .kf-cta[hidden]{display:none}
header.kf .kf-extra{display:flex;align-items:center;gap:8px}
header.kf .thema-knopf{margin:0;flex:none}
header.kf .kf-menue{display:none;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.28);background:none;color:#fff;font:inherit;font-size:14px;cursor:pointer}
header.kf .kf-menue svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
header.kf :focus-visible{outline:2px solid var(--volt,#c4ff1a);outline-offset:2px}
/* Touch: Menü, Hell/Dunkel und Marke mindestens 44 px (Daumen) */
@media (pointer:coarse){header.kf .kf-menue,header.kf button.thema-knopf{min-width:44px;min-height:44px;justify-content:center}header.kf .marke{min-height:44px}}
@media (min-width:1101px){header.kf .marke span:not(.logo){display:none}}
/* Formelsammlung: Sparten, Suche und App-Knopf brauchen Platz; volle Navigation erst ab 1581 px (abgemeldet mit „Kostenlos registrieren“ ist der breiteste Fall), bis 1680 px mit kurzer Suche */
@media (min-width:1101px) and (max-width:1580px){header.kopf.kf[data-kopf="formeln"] .marke span:not(.logo){display:inline}}
header.kf .suche-kurz,header.kf .suche-text{white-space:nowrap}
@media (max-width:1100px){
  header.kf .kf-nav,header.kf .kf-konto,header.kf .kf-cta{display:none}
  header.kf .kf-menue{display:inline-flex}
}
@media (max-width:1580px){
  header.kf[data-kopf="formeln"] .kf-nav,header.kf[data-kopf="formeln"] .kf-konto,header.kf[data-kopf="formeln"] .kf-cta{display:none}
  header.kf[data-kopf="formeln"] .kf-menue{display:inline-flex}
}
@media (max-width:520px){
  header.kf .marke b{font-size:15px}
  header.kf .marke span:not(.logo){display:none}
  header.kf .kf-menue span{display:none}
  header.kf .kf-menue{padding:8px 9px}
}
/* Menüfeld auf kleinen Bildschirmen: volle Breite unter der Kopfzeile */
header.kf .kf-feld{position:fixed;left:8px;right:8px;top:calc(56px + 6px + env(safe-area-inset-top,0px));max-height:calc(100dvh - 80px);overflow:auto;z-index:60;padding:10px;border-radius:18px;background:#fff;color:#0a1540;box-shadow:0 22px 60px rgba(5,10,40,.4),0 0 0 1px rgba(20,33,90,.1)}
[data-theme="dark"] header.kf .kf-feld{background:#1b2650;color:#e9eefa;box-shadow:0 22px 60px rgba(0,0,0,.6),0 0 0 1px rgba(125,147,255,.3)}
header.kf .kf-feld[hidden]{display:none}
header.kf .kf-feld a{display:block;padding:11px 12px;border-radius:10px;color:inherit;text-decoration:none;font-size:15.5px}
header.kf .kf-feld a:hover,header.kf .kf-feld a:focus-visible{background:rgba(31,63,224,.1)}
header.kf .kf-feld a[aria-current="page"]{font-weight:700;background:rgba(31,63,224,.08)}
[data-theme="dark"] header.kf .kf-feld a:hover,[data-theme="dark"] header.kf .kf-feld a:focus-visible{background:rgba(125,147,255,.16);color:#fff}
[data-theme="dark"] header.kf .kf-feld a[aria-current="page"]{background:rgba(125,147,255,.12)}
header.kf .kf-feld h2{margin:8px 12px 2px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#5a6690;font-weight:700}
[data-theme="dark"] header.kf .kf-feld h2{color:#aab4dc}
header.kf .kf-feld .kf-kv{background:var(--volt,#c4ff1a);color:#0a1540;border-color:transparent}
header.kf .kf-feld .kf-k{display:block;margin:6px 4px 2px;text-align:center;border:1px solid rgba(10,21,64,.25);font-weight:700}
@media (min-width:1101px){header.kf:not([data-kopf="formeln"]) .kf-feld{display:none!important}}
@media (min-width:1581px){header.kf[data-kopf="formeln"] .kf-feld{display:none!important}}
@media (min-width:1581px) and (max-width:1680px){header.kf[data-kopf="formeln"] .suche-text,header.kf[data-kopf="formeln"] .suche .suche-kbd{display:none}header.kf[data-kopf="formeln"] .suche-kurz{display:block}}
@media (min-width:901px) and (max-width:1100px){header.kopf.kf[data-kopf="formeln"] .marke span:not(.logo){display:none}}
@media (max-width:400px){header.kopf.kf[data-kopf="formeln"]{gap:8px;padding:0 max(12px,env(safe-area-inset-left))}}
@media print{header.kopf.kf{position:static;box-shadow:none}header.kf .kf-nav,header.kf .kf-rechts,header.kf .kf-menue{display:none}}
/* Kopfzeile haftet oben: Sprungziele und Tastaturfokus nicht darunter verstecken (2026-10-27); :where, damit Seitenregeln wie in der Formelsammlung Vorrang haben */
:where(html){scroll-padding-top:68px}