/* Hero der Startseite (und der Galerie): Überschrift in zwei Zeilen in U3 Display, das Wechselwort weiß mit Fallblatt-Effekt (hero.js)
 * und kurzem weißem Leuchten, wenn das letzte Zeichen gelandet ist (wie auf ultra3.de). Keine Farbflächen, keine Verläufe.
 * Alle Bewegung ist abschaltbar (prefers-reduced-motion). */
.hero-wow { position: relative; isolation: isolate; }
.hero-wow .aurora { display: none; }
.hero-wow h1 { display: flex; flex-direction: column; gap: .02em; }
.hero-wow .h1-fix { display: block; }
.wechsel { display: block; position: relative; min-height: 1em; white-space: nowrap; color: var(--text); }
.zelle { display: inline-block; text-align: center; transform-origin: 50% 55%; backface-visibility: hidden; }
.zelle.mess { position: absolute; visibility: hidden; white-space: pre; }
.zelle.dreht { color: rgba(242, 242, 239, .5); }
.zelle.landet { animation: klapp .38s cubic-bezier(.2, .8, .2, 1); }
@keyframes klapp {
  0% { transform: perspective(500px) rotateX(-85deg); opacity: .35; }
  55% { transform: perspective(500px) rotateX(14deg); opacity: 1; }
  100% { transform: none; opacity: 1; }
}
/* Leuchten: ein weißer Schein um das Wort, einmal nach dem Landen */
.wechsel.schein { animation: leuchten 1.6s ease-out 1 both; }
@keyframes leuchten {
  0% { text-shadow: 0 0 0 rgba(255, 255, 255, 0); }
  35% { text-shadow: 0 0 34px rgba(255, 255, 255, .55), 0 0 2px rgba(255, 255, 255, .9); }
  100% { text-shadow: 0 0 0 rgba(255, 255, 255, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .zelle.landet, .wechsel.schein { animation: none; }
}

/* Die große Wortmarke im Fuß ragt über den Rand: kein horizontaler Scrollbalken */
html, body { overflow-x: hidden; overflow-x: clip; }
