Matchcenter: Spielplan, Ergebnisse & Tabellen (eigene Seite statt BFV-Widget)

Neue Unterseite /matchcenter ersetzt die alten BFV-Widget-Embeds (verstoßen
gegen CSP) durch eine self-hostete Lösung: Cron-Scraper holt die Daten aus der
öffentlichen BFV-Widget-JSON-API, schreibt data/matchcenter.json und lädt die
Vereinswappen lokal — Besucher kontaktieren nur unsere Domain.

- bin/matchcenter-sync.php: CLI/Cron-Scraper (Muster wie instagram-sync), JSON-API
  team/{id}/matches + competition/{compoundId}/table, Wappen via getLogo lokal,
  atomarer Write, Fail-safe. Auto-Saison: Tabellen-compoundId wird aus der
  Matches-API abgeleitet (team_id ist saison-stabil). Per-Team-Cache-Fallback bei
  Fetch-Fehlern, damit Sektionen nie leeren.
- Seite app/pages/matchcenter.php + Route + Nav-Eintrag (unter Fußball).
- Komponenten: match-slider (nächste Spiele), match-card, match-row, league-table
  (mit Auf-/Abstiegszonen), matchcenter-section (kicker-Layout: Tabelle 2/3 +
  Spiele 1/3), matchcenter-empty, crest (weißes Chip + Initialen-Fallback).
- carousel.js: banner.js zum generischen [data-carousel]-Antrieb verallgemeinert
  (Banner- und Match-Slider teilen ihn); crest.js: Logo-Fallback im Browser.
- helpers.php: sportsevent_nodes() für SportsEvent-JSON-LD.
- Icons calendar-event; config.example + .gitignore + CLAUDE.md ergänzt.
- Responsive geprüft (kein Seiten-Overflow 360–1280, Tabelle scrollt in der Karte).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0192vTfGmGpoWeyUse4TuQFj

app/components/banner-slider.php

@@ -11,8 +11,8 @@ declare(strict_types=1);
  * "cta_secondary" (zweiter Button als Outline), "logo_light" (helle Logo-Platte
  * für dunkle Firmenlogos), "accent" (CSS-Farbe; überschreibt das Vereins-Rot
  * der Buttons für diese Slide, z. B. Sponsor-CI).
- * Auto-Rotation + Fortschritts-Indikatoren übernimmt assets/js/banner.js
- * (pausiert bei Hover/Fokus, respektiert prefers-reduced-motion).
+ * Auto-Rotation + Fortschritts-Indikatoren übernimmt der generische Antrieb
+ * assets/js/carousel.js (pausiert bei Hover/Fokus, respektiert prefers-reduced-motion).
  * Ohne JS: nur der erste Banner ist sichtbar (Graceful Degradation).
  */
 $bannerData = json_load('banners');
@@ -24,7 +24,7 @@ $heading = $bannerData['heading'] ?? null;
 $subline = $bannerData['subline'] ?? null;
 $total = count($banners);
 ?>
-        <section class="section ad-banner" id="anzeigen" aria-roledescription="Karussell" aria-label="Anzeigen unserer Sponsoren und Partner" data-banner>
+        <section class="section ad-banner" id="anzeigen" aria-roledescription="Karussell" aria-label="Anzeigen unserer Sponsoren und Partner" data-carousel>
             <div class="container">
 <?php if ($heading !== null): ?>
                 <h2><?= e($heading) ?></h2>
@@ -34,7 +34,7 @@ $total = count($banners);
 <?php if ($subline !== null): ?>
                 <p class="text-muted ad-banner__subline"><?= e($subline) ?></p>
 <?php endif; ?>
-                <ul class="ad-banner__track" id="ad-banner-track" aria-live="off">
+                <ul class="ad-banner__track" id="ad-banner-track" data-carousel-track aria-live="off">
 <?php foreach ($banners as $i => $banner): ?>
 <?php
     $bg = $banner['background'] ?? null;
@@ -76,7 +76,7 @@ $total = count($banners);
             . '</a>';
     };
 ?>
-                    <li class="<?= e($classes) ?>"<?= $style ?> data-banner-slide role="group" aria-roledescription="Folie" aria-label="<?= ($i + 1) ?> von <?= $total ?>"<?= $i === 0 ? '' : ' hidden' ?>>
+                    <li class="<?= e($classes) ?>"<?= $style ?> data-carousel-slide role="group" aria-roledescription="Folie" aria-label="<?= ($i + 1) ?> von <?= $total ?>"<?= $i === 0 ? '' : ' hidden' ?>>
 <?php if (!empty($banner['logo'])): ?>
                         <div class="ad-banner__logo<?= !empty($banner['logo_light']) ? ' ad-banner__logo--light' : '' ?>">
                             <img src="<?= e(asset($banner['logo'])) ?>" alt="<?= e($banner['company'] ?? $banner['title']) ?>" loading="lazy" decoding="async">
@@ -99,18 +99,18 @@ $total = count($banners);
 <?php endforeach; ?>
                 </ul>
 <?php if ($total > 1): ?>
-                <?php /* Ohne JS verborgen (Steuerung wäre funktionslos); banner.js blendet sie ein. */ ?>
-                <div class="ad-banner__controls" data-banner-controls hidden>
+                <?php /* Ohne JS verborgen (Steuerung wäre funktionslos); carousel.js blendet sie ein. */ ?>
+                <div class="ad-banner__controls" data-carousel-controls hidden>
                     <?php /* Explizite Pause/Play-Taste — WCAG 2.2.2. Nur bei aktiver Auto-Rotation sichtbar. */ ?>
-                    <button class="ad-banner__toggle" type="button" data-banner-toggle aria-pressed="false" aria-controls="ad-banner-track" hidden>
+                    <button class="ad-banner__toggle" type="button" data-carousel-toggle aria-pressed="false" aria-controls="ad-banner-track" hidden>
                         <?= icon('pause-fill', 'ad-banner__toggle-icon ad-banner__toggle-icon--pause') ?>
                         <?= icon('play-fill', 'ad-banner__toggle-icon ad-banner__toggle-icon--play') ?>
-                        <span class="visually-hidden" data-banner-toggle-label>Automatischen Wechsel pausieren</span>
+                        <span class="visually-hidden" data-carousel-toggle-label>Automatischen Wechsel pausieren</span>
                     </button>
                     <div class="ad-banner__indicators" role="group" aria-label="Anzeige wählen">
 <?php foreach ($banners as $i => $banner): ?>
-                        <button class="ad-banner__dot" type="button" data-banner-dot aria-controls="ad-banner-track" aria-label="Anzeige <?= ($i + 1) ?> von <?= $total ?>: <?= e($banner['company'] ?? $banner['title']) ?>">
-                            <span class="ad-banner__progress" aria-hidden="true"></span>
+                        <button class="ad-banner__dot" type="button" data-carousel-dot aria-controls="ad-banner-track" aria-label="Anzeige <?= ($i + 1) ?> von <?= $total ?>: <?= e($banner['company'] ?? $banner['title']) ?>">
+                            <span class="ad-banner__progress" data-carousel-progress aria-hidden="true"></span>
                         </button>
 <?php endforeach; ?>
                     </div>