/* Schwebender Glas-Header für Seiten, die sonst style.css verwenden (Recruiting).
   Entspricht dem Header aus portal.css + holo.css; alle Regeln sind auf .holo-header begrenzt. */
.holo-band{background:#04070d;padding:0 0 18px;background-image:
  radial-gradient(60% 120% at 80% 0%,#ff9c4d1f,transparent 70%),
  linear-gradient(#ffffff06 1px,transparent 1px),linear-gradient(90deg,#ffffff06 1px,transparent 1px);
  background-size:100% 100%,96px 96px,96px 96px}
.holo-header{--accent:#ff9c4d;--moc:#3d4cff;--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
  position:relative;z-index:60;isolation:isolate;box-sizing:border-box;
  margin:16px 3.2% 0;padding:12px 22px;border-radius:16px;
  display:flex;align-items:center;justify-content:space-between;gap:30px;color:#fff;
  font:16px/1.5 'Instrument Sans',Instrument,Arial,sans-serif;
  border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  background:linear-gradient(115deg,color-mix(in srgb,var(--accent) 9%,transparent),#0d152cb8 50%,color-mix(in srgb,var(--moc) 12%,transparent));
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  box-shadow:inset 0 1px #dceaff25,0 14px 50px #0006,0 0 30px color-mix(in srgb,var(--accent) 10%,transparent)}
.holo-header *{box-sizing:border-box}
.holo-header::before{content:'';position:absolute;inset:-1px 14% auto;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:hh-signal 7s ease-in-out infinite;pointer-events:none}
.holo-header::after{content:'';position:absolute;bottom:-1px;left:12%;width:90px;height:2px;background:var(--accent);box-shadow:0 0 16px var(--accent);animation:hh-trace 9s ease-in-out infinite alternate;pointer-events:none}
.holo-header .logo{display:block;line-height:0}
.holo-header .logo img{display:block;width:172px;height:auto}
.holo-header .nav{display:flex;align-items:center;gap:22px;margin:0}
.holo-header .nav a{position:relative;color:#fff;text-decoration:none;text-transform:uppercase;font-size:11px;font-weight:400;letter-spacing:.12em;line-height:1.5;white-space:nowrap;opacity:1;transition:color .25s}
.holo-header .nav a:not(.phone)::after{content:'';position:absolute;left:0;right:0;bottom:-9px;height:1px;background:var(--accent);transform:scaleX(0);transition:transform .25s;box-shadow:0 0 10px var(--accent)}
.holo-header .nav a:hover{opacity:1;color:#fff}
.holo-header .nav a:hover::after,.holo-header .nav a:focus-visible::after,.holo-header .nav a[aria-current="page"]::after{transform:scaleX(1)}
.holo-header .nav a[aria-current="page"]{color:var(--accent)}
.holo-header .nav .phone{border:1px solid color-mix(in srgb,var(--accent) 60%,transparent);border-radius:9px;background:linear-gradient(135deg,#5043ff90,#3425ff60);box-shadow:inset 0 1px #fff2,0 0 20px #4d40ff25;padding:13px 18px}
.holo-header .nav .phone:hover{background:linear-gradient(135deg,#5b4fff,#3a2cff)}
.holo-header .nav-toggle{display:none;width:45px;height:45px;margin:0;padding:0;border:0;background:transparent;cursor:pointer;flex:none}
.holo-header .nav-toggle span{display:block;width:auto;height:2px;background:#fff;margin:7px;opacity:1;transform:none}
.holo-header :focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@keyframes hh-trace{to{left:calc(88% - 90px)}}
@keyframes hh-signal{50%{opacity:.25;transform:scaleX(.4)}}
@media(max-width:1050px){.holo-header .nav{gap:14px}.holo-header .nav a{font-size:10px}.holo-header .logo img{width:150px}}
@media(max-width:760px){
  .holo-band{padding-bottom:12px}
  .holo-header{margin:10px 12px 0;padding:9px 14px;border-radius:14px}
  .holo-header .logo img{width:140px}
  .holo-header .nav-toggle{display:block}
  .holo-header .nav{display:none;position:absolute;top:76px;left:0;right:0;padding:25px;flex-direction:column;align-items:stretch;gap:0;margin:0;z-index:70;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:14px;background:#0a1226f5;box-shadow:0 20px 40px #0008}
  .holo-header .nav.is-open{display:flex;position:absolute;top:76px;padding:25px;background:#0a1226f5;gap:0}
  .holo-header .nav.is-open a{font-size:13px;padding:12px;text-align:left}
  .holo-header .nav .phone{margin-top:8px;text-align:center}
}
@media(prefers-reduced-motion:reduce){.holo-header::before,.holo-header::after{animation:none}}
.holo-header .nav-toggle[aria-expanded='true'] span:nth-child(1){transform:translateY(4.5px) rotate(45deg);opacity:1}
.holo-header .nav-toggle[aria-expanded='true'] span:nth-child(2){transform:translateY(-4.5px) rotate(-45deg);opacity:1}
