/* ============================================================
   Bewegung für die Beispielseiten — gemeinsame Grundlage.
   Greift nur, wenn das Skript die Klasse .lebt gesetzt hat. Ohne Skript
   und bei abgeschalteter Bewegung steht alles ganz normal da.

   ACHTUNG: Selektoren hier nur aus Klassen und Attributen bauen. Ein
   Element-Selektor wöge schwerer als das .is-in weiter unten — das
   Element bliebe dann für immer unsichtbar.
   ============================================================ */

.lebt [data-tritt-ein] {
  opacity: 0; transform: translateY(26px);
  transition: opacity 0.6s cubic-bezier(0.2, 0.8, 0.2, 1),
              transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.lebt .is-in { opacity: 1; transform: none; }

/* Seitlich statt von unten — für Reihen, die von der Seite hereinkommen */
.lebt [data-tritt-ein][data-richtung="links"]  { transform: translateX(-34px); }
.lebt [data-tritt-ein][data-richtung="rechts"] { transform: translateX(34px); }
.lebt [data-tritt-ein][data-richtung="zoom"]   { transform: scale(0.94); }
.lebt [data-richtung].is-in { transform: none; }

/* Bilder mit Tiefe brauchen Übermaß, damit beim Verschieben keine Kante
   frei läuft. Keine Transition: Die Position kommt aus dem Scrollstand. */
.lebt [data-tiefe] img {
  transform: scale(1.12); transition: none; will-change: transform;
}

/* Lesefortschritt */
.fortschritt {
  position: fixed; top: 0; left: 0; right: 0; height: 3px;
  z-index: 60; pointer-events: none;
}
.fortschritt span {
  display: block; height: 100%;
  transform: scaleX(0); transform-origin: 0 50%;
  background: currentColor;
}

/* Kopfzeile bekommt beim Scrollen Grund unter den Füßen */
[data-kopf] { transition: box-shadow 0.3s ease, background 0.3s ease; }

@media (max-width: 860px) {
  .lebt [data-tiefe] img { transform: none; will-change: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .lebt [data-tritt-ein] { opacity: 1; transform: none; transition: none; }
  .lebt [data-tiefe] img { transform: none; }
  .fortschritt { display: none; }
}