/* MANOVA — 3D-Logo Intro: Layout */
.logo-scene{position:relative;height:260vh;
  background:radial-gradient(120% 80% at 50% 28%,#173355 0%,#0a1626 55%,#060d17 100%)}
.logo-sticky{position:sticky;top:var(--header-h,78px);height:calc(100vh - var(--header-h,78px) - var(--banner-h,0px));overflow:hidden;display:grid;place-items:center}
.logo-stage{position:absolute;inset:0;transition:opacity .3s linear}
.logo-canvas{width:100%;height:100%;display:block}

.logo-grain{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(1px 1px at 20% 30%,rgba(255,255,255,.12),transparent 60%),
  radial-gradient(1px 1px at 70% 65%,rgba(255,255,255,.09),transparent 60%),
  radial-gradient(1px 1px at 45% 80%,rgba(255,255,255,.07),transparent 60%)}
.logo-vig{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(75% 65% at 50% 45%,transparent 45%,rgba(4,9,16,.75) 100%)}

.logo-caps{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center}
.logo-cap{position:absolute;left:0;right:0;text-align:center;padding:0 6vw;opacity:0;transition:opacity .25s linear}
.logo-cap .k{display:block;font-family:var(--ff-mono,monospace);font-size:.74rem;letter-spacing:.34em;
  text-transform:uppercase;color:#8fb4d8}
.logo-cap .big{display:block;margin-top:.5em;font-family:var(--ff-display,sans-serif);font-weight:900;
  text-transform:uppercase;letter-spacing:-.02em;line-height:1;color:#fff;
  font-size:clamp(1.8rem,5.2vw,4rem);text-shadow:0 8px 40px rgba(0,0,0,.5)}
.logo-cap--a{bottom:14%}
.logo-cap--b{bottom:14%}
.logo-cap--c{bottom:13%}
.logo-cap--c .big{font-size:clamp(1.5rem,3.6vw,2.6rem)}

.logo-hint{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);transition:opacity .3s linear;
  font-family:var(--ff-mono,monospace);font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;
  color:#6d8bab;display:flex;align-items:center;gap:.8em;pointer-events:none}
.logo-hint::after{content:"";width:1px;height:26px;background:linear-gradient(#6d8bab,transparent);
  animation:logoHint 1.9s ease-in-out infinite}
@keyframes logoHint{0%,100%{opacity:.25;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}

@media (max-width:760px){
  .logo-scene{height:260vh}
  .logo-cap .big{font-size:clamp(1.5rem,7.5vw,2.4rem)}
  .logo-cap .k{font-size:.62rem;letter-spacing:.26em}
}
@media (max-height:620px){
  .logo-cap--a,.logo-cap--b,.logo-cap--c{bottom:19%}
  .logo-cap .big{font-size:clamp(1.3rem,4vw,2rem)}
  .logo-hint{bottom:2.5%}
}
@media (prefers-reduced-motion:reduce){ .logo-scene{display:none} }

/* ---------- Cinema-Ausklang ---------- */
.cine-bars{--bar:0%;position:absolute;inset:0;z-index:6;pointer-events:none}
.cine-bars::before,.cine-bars::after{content:"";position:absolute;left:0;right:0;height:var(--bar);
  background:#04090f;transition:height .05s linear}
.cine-bars::before{top:0}
.cine-bars::after{bottom:0}
.cine-vig{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;
  background:radial-gradient(58% 52% at 50% 46%,transparent 40%,rgba(3,8,14,.72) 100%)}