/* =====================================================================
   ZENTRALE HEADER-DEFINITION (Single Source of Truth)
   Hier wird festgelegt, wie der Header auf ALLEN Seiten aussieht.
   Aenderungen hier wirken automatisch auf jede Seite, die diese Datei einbindet.
   Hohe Spezifitaet (html body) + !important => gewinnt ueber alte Seiten-CSS.
   ===================================================================== */
/* ===== Einheitlicher Header – identisch zur Startseite (inline, robust) ===== */
html body .topbar{position:fixed!important;z-index:50;inset:0 0 auto;display:flex!important;align-items:center;justify-content:space-between;gap:18px!important;padding:10px clamp(14px,2.4vw,27px)!important;border-bottom:1px solid rgba(246,243,241,.10);background:rgba(7,18,29,.82);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);box-shadow:0 18px 44px rgba(0,0,0,.20)}
/* Schriftart zentral festlegen – sonst erben Seiten ihre eigene Body-Schrift (z.B. Arial vs. Inter) */
html body .topbar,html body .topbar *,html body .mnav-overlay,html body .mnav-overlay *{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important}
html body .topbar .brand{display:flex!important;align-items:center;gap:14px!important;min-width:0;text-decoration:none}
html body .topbar .brand img{width:44px!important;height:44px!important;flex:0 0 auto!important;object-fit:contain!important;display:block!important;background:none!important;border:0!important;border-radius:0!important;padding:0!important;margin:0!important;box-shadow:none!important;filter:none!important;max-width:none!important;min-width:0!important}
html body .topbar .brand div{display:flex;flex-direction:column;line-height:1}
html body .topbar .brand strong{display:block;font-size:14px!important;line-height:1!important;color:#fff;letter-spacing:-.02em;max-width:none!important;white-space:normal!important}
html body .topbar .brand span{display:block!important;margin-top:5px;color:rgba(246,243,241,.54);font-size:9.5px!important;font-weight:800;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
html body .topbar .nav{display:flex!important;align-items:center;gap:14px!important;color:rgba(246,243,241,.68);font-size:11.5px!important;font-weight:750}
html body .topbar .nav a{color:inherit;text-decoration:none;letter-spacing:.04em;font-size:11.5px!important;transition:color .15s ease;white-space:nowrap}
html body .topbar .nav a:hover,html body .topbar .nav-areas-t:hover{color:#fff}
html body .topbar .top-cta{display:inline-flex!important;align-items:center;justify-content:center;min-height:36px!important;padding:0 14px!important;border-radius:999px!important;background:linear-gradient(135deg,#2f86ff,#1d5aa9)!important;color:#fff!important;font-weight:900;font-size:12px!important;text-decoration:none;white-space:nowrap;box-shadow:0 16px 34px rgba(47,134,255,.26)}
html body .topbar .nav-areas{position:relative;display:inline-flex;align-items:center}
html body .topbar .nav-areas>.nav-areas-t{display:inline-flex;align-items:center;gap:5px;cursor:pointer;color:inherit;text-decoration:none;font-size:11.5px!important}
html body .topbar .nav-areas-t svg{width:11px!important;height:11px!important;opacity:.65;transition:transform .18s ease}
html body .topbar .nav-areas:hover .nav-areas-t svg,html body .topbar .nav-areas:focus-within .nav-areas-t svg{transform:rotate(180deg)}
html body .topbar .nav-areas-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:252px;background:#21384f;border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:7px;box-shadow:0 24px 54px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.07);opacity:0;visibility:hidden;transition:opacity .16s ease;z-index:90}
html body .topbar .nav-areas-menu::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
html body .topbar .nav-areas:hover .nav-areas-menu,html body .topbar .nav-areas:focus-within .nav-areas-menu{opacity:1;visibility:visible}
html body .topbar .nav-areas-menu a{display:block;padding:9px 13px;border-radius:8px;color:rgba(246,243,241,.92);font-size:13px!important;font-weight:600;letter-spacing:.2px;text-transform:none;white-space:nowrap;text-decoration:none;transition:background .12s ease,color .12s ease}
html body .topbar .nav-areas-menu a:hover{background:rgba(47,134,255,.16);color:#fff}
html body .topbar-spacer{height:64px}
html body .topbar .mnav-toggle{display:none}
@media (max-width:1080px){html body .topbar .nav{display:none!important}html body .topbar .top-cta{display:none!important}html body .topbar .mnav-toggle{display:inline-flex!important;align-items:center;justify-content:center;width:46px;height:46px;flex:0 0 auto;border-radius:13px;border:1px solid rgba(246,243,241,.16);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;padding:0}html body .topbar .mnav-toggle svg{width:25px;height:25px;stroke:currentColor;stroke-width:2.3;fill:none;stroke-linecap:round}}
@media (max-width:680px){html body .topbar .brand span{display:none!important}}
@media (max-width:840px){html body .topbar .brand img{width:38px!important;height:38px!important;flex:0 0 auto!important}html body .topbar .brand strong{font-size:15px!important;line-height:1.08!important;max-width:none!important}html body .topbar-spacer{height:60px}}
@media (max-width:480px){html body .topbar .brand img{width:42px!important;height:42px!important;flex:0 0 auto!important}html body .topbar .brand strong{font-size:14.5px!important;max-width:none!important}html body .topbar-spacer{height:62px}}
@media (max-width:370px){html body .topbar{padding-inline:10px!important}}
html body .mnav-overlay{position:fixed;inset:0;z-index:10000;background:rgba(6,14,23,.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);opacity:0;visibility:hidden;transition:opacity .26s ease;overflow-y:auto;overscroll-behavior:contain}
html body .mnav-overlay.open{opacity:1;visibility:visible}
html body.mnav-lock{overflow:hidden}
html body .mnav-panel{max-width:560px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;padding:18px clamp(18px,5vw,30px) 46px}
html body .mnav-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:24px}
html body .mnav-brand{display:flex;align-items:center;gap:12px;color:#fff;font-weight:900;font-size:15px;letter-spacing:-.01em}
html body .mnav-brand img{width:42px;height:42px;object-fit:contain}
html body .mnav-close{width:46px;height:46px;flex:0 0 auto;border-radius:13px;border:1px solid rgba(246,243,241,.16);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
html body .mnav-close svg{width:24px;height:24px;stroke:currentColor;stroke-width:2.3;fill:none;stroke-linecap:round}
html body .mnav-links{display:flex;flex-direction:column}
html body .mnav-links>a,html body .mnav-acc>button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;padding:17px 6px;border:0;border-bottom:1px solid rgba(246,243,241,.09);background:none;color:#f6f3f1;font-size:18px;font-weight:850;letter-spacing:-.01em;font-family:inherit;cursor:pointer;text-decoration:none}
html body .mnav-links>a:hover,html body .mnav-acc>button:hover{color:#9ec5ff}
html body .mnav-acc>button svg{width:18px;height:18px;flex:0 0 auto;stroke:currentColor;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform .22s ease;opacity:.7}
html body .mnav-acc.open>button svg{transform:rotate(180deg)}
html body .mnav-sub{max-height:0;overflow:hidden;transition:max-height .32s ease}
html body .mnav-acc.open .mnav-sub{max-height:720px}
html body .mnav-sub a{display:block;padding:13px 6px 13px 18px;color:rgba(246,243,241,.74);font-size:15px;font-weight:650;border-bottom:1px solid rgba(246,243,241,.055);text-decoration:none}
html body .mnav-sub a:hover{color:#fff}
html body .mnav-cta{margin-top:28px;display:inline-flex;align-items:center;justify-content:center;min-height:56px;border-radius:999px;background:linear-gradient(135deg,#2f86ff,#1d5aa9);color:#fff;font-weight:900;font-size:16px;text-decoration:none;box-shadow:0 18px 38px rgba(47,134,255,.28)}
html body .mnav-foot{margin-top:22px;display:flex;flex-wrap:wrap;gap:16px}
html body .mnav-foot a{color:rgba(246,243,241,.5);font-size:13px;font-weight:700;text-decoration:none}
html body .mnav-foot a:hover{color:rgba(246,243,241,.8)}