/* Block «Film» — Figma «imagefilm» 2214:3182: dunkelgrün 600, Abstand 64, Vorschau 560 × 320 */

.gw-film { padding-block: var(--sektion); background: var(--dunkelgruen-600); color: #e5e7eb; }

.gw-film__innen { display: flex; align-items: center; gap: 64px; }

.gw-film__text {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--abstand-xxl);
}
.gw-film__kern { display: flex; flex-direction: column; gap: var(--abstand-lg); }
.gw-film__kern .gw-lauftext { margin: 0; }
.gw-film__titel { color: var(--hellgruen-500); }

.gw-film__vorschau {
  position: relative;
  flex: 0 0 560px;
  height: 320px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(0, 0, 0, 0.15);
}
.gw-film__bild { width: 100%; height: 100%; object-fit: cover; opacity: 0.65; }

.gw-film__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.gw-film__play:hover { transform: translate(-50%, -50%) scale(1.08); }

/* 1001–1140: die Vorschau schrumpft (16:9 wie 560 × 320), nicht der Text (sonst Titel vierzeilig) */
@media (min-width: 1001px) {
  .gw-film__text { flex: 1 0 400px; }
  .gw-film__vorschau { flex: 0 1 560px; min-width: 0; height: auto; aspect-ratio: 560 / 320; }
}

@media (max-width: 1000px) {
  .gw-film__innen { flex-direction: column; align-items: stretch; gap: var(--abstand-xxl); }
  .gw-film__vorschau { flex-basis: auto; height: auto; aspect-ratio: 560 / 320; }
}

/* Video-Dialog für alle Play-Knöpfe */
.gw-videodialog {
  width: min(100% - 2 * var(--rand), 1200px);
  /* Querformat: Breite an die Höhe koppeln (16:9), 2 × 56 frei für den Schliessen-Knopf */
  width: min(100% - 2 * var(--rand), 1200px, (100vh - 112px) * 16 / 9);
  width: min(100% - 2 * var(--rand), 1200px, (100dvh - 112px) * 16 / 9);
  max-width: none;
  padding: 0;
  border: 0;
  background: #000;
  overflow: visible;
}
.gw-videodialog::backdrop { background: rgba(0, 31, 53, 0.85); }
.gw-videodialog video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; }
/* Klickziel 44 × 44, bleibt im Querformat ganz im Bild */
.gw-videodialog__zu {
  position: absolute;
  top: -52px;
  right: -2px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: url("../../img/icons/schliessen.svg") center / 32px no-repeat;
  cursor: pointer;
}
