fix: Video läuft durchgehend, kein Neustart bei Slide-Wechsel

Video aus dem Slide-Div herausgelöst und als eigenständiges Element
zwischen hero-brand und hero-slider platziert. Dadurch wird es nie
via visibility:hidden versteckt und der Browser resettet es nicht.
Ein-/Ausblenden per opacity + max-height Transition.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Code
2026-04-12 16:07:49 +02:00
Ursprung 964b8d47f2
Commit 9df30bcd96
3 geänderte Dateien mit 15 neuen und 11 gelöschten Zeilen

Datei anzeigen

@@ -104,11 +104,11 @@ a { color:inherit; text-decoration:none; }
.hero-arrow { width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.3); background:transparent; color:var(--white); font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.hero-arrow:hover { border-color:var(--gold); color:var(--gold); }
/* ==================== HERO INLINE VIDEO (Slide 0) ==================== */
.hero-slide-has-video { display:flex; flex-direction:column; }
.hero-slide-video-inline { width:100%; border-radius:var(--radius-lg); overflow:hidden; }
.hero-slide-video-inline video { display:block; width:100%; height:auto; }
.hero-slide-bottom { margin-top:16px; }
/* ==================== HERO VIDEO CONTAINER ==================== */
.hero-video-container { width:100%; border-radius:var(--radius-lg); overflow:hidden; margin-bottom:16px; transition:opacity 0.6s ease, max-height 0.6s ease; max-height:700px; }
.hero-video-container video { display:block; width:100%; height:auto; }
.hero-video-container.hidden { opacity:0; max-height:0; margin-bottom:0; pointer-events:none; }
.hero-slide-bottom { }
/* ==================== BUTTONS ==================== */
.btn { display:inline-flex; align-items:center; justify-content:center; padding:12px 28px; border-radius:var(--radius); font-family:inherit; font-size:0.95rem; font-weight:600; cursor:pointer; transition:all 0.2s; border:2px solid transparent; text-decoration:none; }