/* kit/reveal-once — MIT, siehe LICENSE im selben Ordner. 0 Abhaengigkeiten.
   Kein Klassenname aus irgendeinem Theme steht hier drin: gebunden wird
   ausschliesslich ueber data-kit-reveal, gesetzt von reveal-once.js.

   WARUM der Zustand am Attribut haengt und nicht an einer Klasse: das Attribut
   traegt den ZUSTAND im Wert. "pending" versteckt, "in" zeigt. Ein Autor, der
   nur data-kit-reveal (leer) in seine Vorlage schreibt, versteckt damit NICHTS —
   dieser Regelsatz greift erst, wenn JS den Wert gesetzt hat. Genau das ist die
   Konsequenz aus der Falle, an der die Vorgaenger-Fassung starb: dort versteckte
   das Stylesheet, und ohne JS blieben 7 Sektionen dauerhaft leer. */

/* WARUM DIE MASSE AUS EINER VARIABLE KOMMEN — Anlass 2026-07-30, vierte
   Rueckmeldung desselben Nutzers am selben Tag: "Ich sehe weiterhin keine
   react bits." Gemessen war zu dem Zeitpunkt alles gruen: 12 Skripte geladen,
   Attribute gebunden, Zustandswechsel gezaehlt. Und trotzdem sah man nichts,
   weil 18px Versatz in 520ms auf einem Telefon unter der Wahrnehmungsschwelle
   liegen. Jede Einzelregel war richtig, die Summe war Nichts.
   Der Fallback hinter dem Komma IST die Stufe "normal" — wer diese Datei ohne
   apply-kit einbindet (Weg 2, eigene Vorlage mit data-kit-*-Attributen im
   Markup), bekommt genau sie. kraft.css setzt nur :root-Variablen und kann
   deshalb NICHT still danebengreifen: fehlt sie, greift der Fallback. */

[data-kit-reveal="pending"] {
  opacity: 0;
  transform: translate3d(0, var(--kit-dy, 44px), 0);
  /* will-change nur im Vorher-Zustand — dauerhaft gesetzt kostet es Speicher
     auf jeder Sektion, ohne nach dem Reveal noch etwas zu bringen. */
  will-change: opacity, transform;
}

[data-kit-reveal="in"] {
  opacity: 1;
  transform: none;
  /* Nur transform + opacity: beides laeuft im Compositor, kein Layout, kein
     Repaint der Sektion. Der Versatz ist rein vertikal — translateX wuerde auf
     393px waagerechten Ueberlauf erzeugen und damit eine Zahl im Geraete-Raster
     bewegen, die sich durch das Kit nicht aendern darf. */
  transition: opacity var(--kit-dur, 720ms) cubic-bezier(.2, .7, .3, 1),
              transform var(--kit-dur, 720ms) cubic-bezier(.2, .7, .3, 1);
}

/* Der Effekt ist scroll-getrieben, nicht hover-getrieben: er ist auf einem
   Telefon sichtbar. Deshalb steht hier KEIN @media (hover: hover) — die
   Vorgaenger-Fassung hatte genau das und war auf dem Geraet des Nutzers
   unsichtbar ("sieht genauso aus wie davor", zweimal). */

@media (prefers-reduced-motion: reduce) {
  /* Zweiter Guertel. reveal-once.js versteckt bei reduce schon gar nichts;
     diese Regel faengt den Fall, dass die Einstellung nach dem Laden umgestellt
     wird und ein Element noch auf "pending" steht. */
  [data-kit-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}