Einblendungen laufen beim Scrollen, ohne Skript

Umut: "Effekte gibts keine, sind die aktiv?" Nachgemessen: die
Zeigereffekte liefen alle. Die Einblendungen gab es seit Schema v3 - nur
benutzt hatte sie niemand, weil eine Animation beim Laden unterhalb der
Falz wertlos ist.

Mit animation-timeline: view() laufen dieselben Keyframes, wenn der
Abschnitt in den Blick kommt - hinter der Bewegungsschranke, hinter
@supports (Firefox und Safari behalten das Einblenden beim Laden) und mit
einem Bereich, der endet, bevor der Abschnitt in der Mitte steht.

Dabei hat axe einen Fehler gefunden, den ich selbst gebaut hatte: eine
Scroll-Zeitachse ist umkehrbar, also stand alles unterhalb der Falz
dauerhaft am Anfang der Kurve - bei opacity .35 blass, bei .85 immer noch
3,86:1 statt 7,1:1. Auf dem Scrollweg wird deshalb nur Bewegung animiert,
keine Deckkraft.

Benutzt wird es jetzt auch: alle drei Beitragsvorlagen bringen die
Einblendung je Abschnitt mit.

Geprueft: 400 Tests unter PHP 8.2 und 8.4, Editortest, Browserpruefung,
axe ohne Verstoss auf Startseite, Projekteseite und Beitrag - vor und
nach dem Durchscrollen.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

public/assets/enhancements.css

@@ -66,3 +66,43 @@
     .button { transition: transform .2s ease, background-color .2s ease, border-color .2s ease }
     .button:hover { transform: translateY(-2px) }
 }
+
+/* Einblenden beim Hineinscrollen, ergänzt am 13.09.2026.
+
+   Bisher liefen die Einblendungen beim Laden der Seite - was unterhalb der Falz stand, war
+   fertig animiert, bevor es jemand gesehen hat. Mit einer Scroll-Zeitachse läuft dieselbe
+   Animation genau dann, wenn das Element in den Blick kommt, und zwar ohne eine Zeile
+   JavaScript: `animation-timeline: view()` bindet den Ablauf an die Sichtbarkeit.
+
+   Drei Bedingungen, alle bewusst:
+   - Hinter der Bewegungsschranke: wer weniger Bewegung eingestellt hat, bekommt keine.
+   - Hinter `@supports`: Browser ohne Scroll-Zeitachse (heute Firefox und Safari) behalten die
+     bisherige Fassung - die Animation läuft beim Laden. Niemand sieht deshalb weniger Inhalt.
+   - `animation-range` endet früh (`cover 26%`): die Bewegung ist vorbei, bevor das Element in
+     der Mitte des Bildschirms steht. Eine Einblendung, die beim Lesen noch läuft, stört. */
+@media (prefers-reduced-motion: no-preference) {
+    @supports (animation-timeline: view()) {
+        /* Eigene Kurven für den Scrollweg: **nur Bewegung, keine Deckkraft**.
+           Eine Scroll-Zeitachse ist umkehrbar - ein Abschnitt außerhalb des Blicks steht wieder am
+           Anfang. Alles unterhalb der Falz wäre also dauerhaft blass, und blasser Text ist nicht
+           weniger Effekt, sondern schlechterer Kontrast: #3d4d5c bei 85 Prozent ergibt 3,86:1
+           statt 7,1:1 - axe meldet das zu Recht. Der Weg trägt den Effekt allein. */
+        @keyframes kant-scroll-rise { from { transform: translateY(20px) } to { transform: none } }
+        @keyframes kant-scroll-fade { from { transform: translateY(10px) } to { transform: none } }
+
+        .fx-entrance-fade, .fx-entrance-rise, .fx-entrance-sink, .fx-entrance-left,
+        .fx-entrance-right, .fx-entrance-zoom, .fx-entrance-flip, .fx-entrance-blur {
+            animation-name: kant-scroll-rise;
+            animation-timeline: view();
+            animation-range: entry 10% cover 28%;
+            animation-duration: 1ms; /* Die Zeitachse bestimmt den Ablauf, nicht die Uhr. */
+            animation-fill-mode: both;
+        }
+        .fx-entrance-fade { animation-name: kant-scroll-fade }
+        /* Die Verzögerungsstufen sind auf einer Scroll-Zeitachse eine Verschiebung im Weg,
+           nicht in der Zeit - sonst würden sie gar nicht wirken. */
+        .fx-delay-short { animation-range: entry 16% cover 32% }
+        .fx-delay-medium { animation-range: entry 22% cover 36% }
+        .fx-delay-long { animation-range: entry 28% cover 40% }
+    }
+}