/* ═══════════════════════════════════════════════════════════════════════════
   teil-zv — Der Eintritt der Startseite: ein weißer Bildschirm, der aufgeht
   ───────────────────────────────────────────────────────────────────────────
   Christopher, 04.10.2026 (Sprachdiktat):

     „Man soll auf die Brillen-Voigt-Webseite kommen, das Intro soll so sein,
      dass es ein komplett weißer, weicher Bildschirm ist, dann praktisch der
      Hintergrund geladen wird, und dann der Text und die Bilder und die
      einzelnen Elemente reinfliegen sozusagen oder mit einem Fade-In-Effekt
      auftauchen. Aber das muss schneller gehen. Das Auge, das ist zu
      verspielt, das ist nicht seriös genug. Das muss aufgehen aus dem weißen
      Hintergrund und direkt alles sichtbar sein."

   ── Der Ablauf, in Zahlen ─────────────────────────────────────────────────
     0,00 s   weiß. Vollflächig, kein Aufblitzen von Inhalt dahinter.
     0,00 s   die Bühne beginnt gleichzeitig einzublenden — sie wartet NICHT
              mehr auf den Vorhang. Genau das macht den Unterschied.
     0,40 s   das Weiß ist weg, der Hintergrund steht.
     0,10 s   Markenzeile · 0,17 s Überschrift · 0,24 s Absatz ·
     0,31 s   Knöpfe · 0,38 s Zahlenzeile · das Bühnenbild mit
     0,17 s   Verzug — jedes Stück 0,42 s lang.
     0,80 s   alles im ersten Bildschirm steht.

   **Vorher: 4,20 s** nur für den Vorhang, danach erst die Einblendung.
   **Jetzt: 0,80 s** bis alles steht — das Fünffache schneller.

   ── Warum reines CSS ──────────────────────────────────────────────────────
   Keine Leinwand, kein Skript, kein Ereignis, auf das jemand wartet. Das alte
   Intro hat drei Dateien in Abhängigkeit gehalten (bewegung.js, buehne.js,
   wirkung.js warteten alle auf „eintritt-fertig"). Hier kann nichts hängen
   bleiben: selbst wenn kein JavaScript läuft, ist das Weiß nach 0,40 s weg,
   weil es eine Keyframe ist.

   Das alte Augen-Intro liegt vollständig unter Assets/Web/intro-auge-archiv.
   ═══════════════════════════════════════════════════════════════════════════ */

#weiss{
  position:fixed; inset:0; z-index:200;
  background:#fff;
  pointer-events:none;                 /* fängt nie einen Klick ab */
  animation:bv-weiss-auf .40s var(--weich) both;
}
@keyframes bv-weiss-auf{
   0%{ opacity:1 }
  70%{ opacity:.18 }
 100%{ opacity:0; visibility:hidden }
}

/* ── Die Bühne tritt gleichzeitig hervor ───────────────────────────────────
   grund.css gibt `.auf` 0,07–0,42 s Verzug und eine längere Dauer. Auf der
   Startseite wird beides gestrafft: sein „direkt alles sichtbar". Nur hier —
   die Unterseiten behalten ihren ruhigeren Takt. */
body.home .buehne .auf{
  transition-duration:.42s;
  transform:translateY(16px);
}
body.home .buehne .auf.da{ transform:none }
body.home .buehne .auf.v1{ transition-delay:.10s }
body.home .buehne .auf.v2{ transition-delay:.17s }
body.home .buehne .auf.v3{ transition-delay:.24s }
body.home .buehne .auf.v4{ transition-delay:.31s }
body.home .buehne .auf.v5{ transition-delay:.38s }
/* Die Marke über der Überschrift trägt kein v… und käme sonst ohne Verzug. */
body.home .buehne .marke.auf{ transition-delay:.06s }

/* ── Netze ──────────────────────────────────────────────────────────────────
   Bei `prefers-reduced-motion` gibt es kein Weiß und keine Bewegung: die Seite
   steht sofort. Ohne JavaScript bekommt `.auf` nie ein `.da` — darum hier
   dasselbe dritte Netz, das im Haus überall gilt. */
@media (prefers-reduced-motion: reduce){
  #weiss{ display:none }
  body.home .buehne .auf{ transition:none; transform:none; opacity:1 }
}
@media (scripting: none){
  #weiss{ display:none }
  body.home .buehne .auf{ opacity:1; transform:none; transition:none }
}
