Beitragskarten reagieren auf Zeiger und Tastatur

Umut: "es gibt keinen Mausover-Effekt, das fehlt". Am Original
nachgemessen und uebernommen: die Karte hebt sich um 8px mit weichem
Schatten, das Bild zieht auf 1,06 auf, darueber blendet ein Hinweis ein.

Die Bewegung steht vollstaendig hinter der Bewegungsschranke - wer
weniger Bewegung eingestellt hat, bekommt keine, sieht den Hinweis aber
trotzdem. Alles haengt zusaetzlich an :focus-within, damit der Effekt
nicht nur Mausbenutzern gehoert. Der Hinweis ist fuer Vorlesesoftware
ausgeblendet, weil der Titel darunter zum selben Ziel fuehrt.

Ausserdem: der Leuchteffekt trug noch das Gruen der Vorlage statt der
Akzentfarbe der Website.

Geprueft: 391 Tests unter PHP 8.2 und 8.4, Editortest, Browserpruefung,
axe ohne Verstoss.

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

tests/CmsTest.php

@@ -678,6 +678,44 @@ final class CmsTest extends TestCase
         }
     }
 
+    public function testAPostCardReactsToThePointerAndToTheKeyboard(): void
+    {
+        // Umut: „es gibt keinen Mausover-Effekt, das fehlt“. Eine Karte, die sich beim Zeigen
+        // nicht rührt, wirkt tot. Der Hinweis liegt über dem Bild, ist für Vorlesesoftware aber
+        // nichts Neues - der Titel darunter führt zum selben Ziel.
+        $this->publishedPost('projekt-eins', 'Projekt eins', '2026-02-01', ['Projekte'], []);
+        // Der Hinweis liegt über dem Beitragsbild, also braucht der Beitrag eines.
+        $media = new MediaLibrary($this->db, $this->path.'-media');
+        $file = tempnam(sys_get_temp_dir(), 'kant-karte-');
+        $image = imagecreatetruecolor(600, 400);
+        imagepng($image, $file);
+        imagedestroy($image);
+        $item = $media->upload(new UploadedFile($file, 'karte.png', test: true));
+        @unlink($file);
+        $id = $this->db->fetchOne('SELECT id FROM page WHERE path = ?', ['projekt-eins']);
+        $this->posts->saveMetadata($id, ['featuredMediaId' => $item['id'], 'publishedAt' => '2026-02-01'], ['Projekte'], [], (int) $this->db->fetchOne('SELECT version FROM page WHERE id = ?', [$id]));
+
+        $document = DemoContent::starter('Startseite');
+        $document['schemaVersion'] = 17;
+        $document['blocks'][] = ['id' => 'raster', 'type' => 'postlist', 'props' => ['count' => 5, 'category' => 'projekte', 'tag' => '']];
+        $this->pages->publish('page-1', $this->pages->saveDraft('page-1', $document, 0), 1);
+
+        $html = $this->request('/')->getContent();
+        self::assertStringContainsString('<span class="post-view" aria-hidden="true">Ansehen</span>', $html);
+
+        // Die Bewegung steht vollständig hinter der Bewegungsschranke, der Hinweis selbst nicht:
+        // wer weniger Bewegung eingestellt hat, sieht ihn trotzdem.
+        $effects = (string) file_get_contents(__DIR__.'/../public/assets/enhancements.css');
+        $guarded = explode('@media (prefers-reduced-motion: no-preference) {', $effects);
+        self::assertStringContainsString('.post-card:hover, .post-card:focus-within {', end($guarded));
+        self::assertStringContainsString('transform: scale(1.06)', end($guarded));
+        self::assertStringNotContainsString('transform: translateY(-8px)', $guarded[0], 'Keine Bewegung außerhalb der Schranke.');
+
+        // Und über die Tastatur erreichbar: der Zustand hängt auch an :focus-within.
+        $site = (string) file_get_contents(__DIR__.'/../public/assets/site.css');
+        self::assertStringContainsString('.post-card:hover .post-view,.post-card:focus-within .post-view{opacity:1}', $site);
+    }
+
     public function testAPostListCanLookLikeAProjectGridInsteadOfABlogArchive(): void
     {
         // Beim Nachbau von kant-it.de fehlte genau das: das Projektraster dort zeigt Bild und