/* ===== Filme: Seite filme.html und Block auf der Startseite (31.10.2026) ===== */
.film-block { max-width:1040px; padding-top:2.5rem; }
.film-liste { display:grid; gap:4rem; }
.film {
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:2.4rem; align-items:center;
}
.film:nth-child(even) .film-video { order:2; }

.film-video {
  position:relative; aspect-ratio:16/9; overflow:hidden;
  border-radius:var(--rand); background:#1d1a16;
  box-shadow:0 14px 34px var(--schatten);
}
.film-video video { display:block; width:100%; height:100%; object-fit:cover; }
.film-marke {
  position:absolute; top:.8rem; right:.8rem; pointer-events:none;
  background:rgba(45,62,47,.86); color:var(--weiss);
  font:600 .7rem/1 var(--sans); letter-spacing:.16em; text-transform:uppercase;
  padding:.45rem .65rem; border-radius:4px; transition:opacity .3s ease;
}
.film-video.spielt .film-marke { opacity:0; }
.film-start {
  position:absolute; right:4%; bottom:7%;
  width:66px; height:66px; border-radius:50%; border:2px solid rgba(251,249,243,.85);
  background:rgba(176,141,76,.92); color:var(--text); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 22px rgba(0,0,0,.35); transition:transform .25s ease, background .25s ease;
}
.film-start[hidden] { display:none; }
.film-start svg { width:30px; height:30px; fill:currentColor; margin-left:4px; }
.film-start:hover, .film-start:focus-visible { background:var(--weiss); transform:scale(1.06); }
.film-start:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }

.film-teil {
  display:block; font-size:.78rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold); margin-bottom:.4rem;
}
.block .film h2, .block .film-kasten h2 {
  font-size:clamp(1.6rem,3vw,2.15rem); line-height:1.15;
  text-align:left; margin-bottom:.8rem;
}
.film p { color:var(--text-weich); }
.film-daten { font-size:.88rem; margin:.7rem 0 1.2rem; }
.film-knoepfe { display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; }
.film-knoepfe .knopf { padding:.8rem 1.6rem; }
.film-bald {
  display:inline-block; font-size:.85rem; font-weight:600; color:var(--text);
  background:var(--bg-tief); border:1px solid var(--linie);
  padding:.5rem .9rem; border-radius:2rem;
}

.film-kasten {
  margin-top:4.5rem; padding:2.2rem 2.4rem; background:var(--bg-tief);
  border-radius:var(--rand); border-left:3px solid var(--gold);
}
.film-kasten p { color:var(--text-weich); margin-bottom:1.3rem; max-width:640px; }
.film-hinweis {
  font-size:.82rem; line-height:1.6; color:var(--text-weich);
  margin-top:1.6rem; max-width:760px;
}

/* Startseite: dunkles Band wie ein Diaabend */
.filme-start { background:var(--text); color:var(--bg); }
.filme-start .block { max-width:1040px; }
.filme-start-raster {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);
  gap:2.8rem; align-items:center;
}
.filme-start .abschnitt-kicker { text-align:left; color:var(--akzent); }
.block .filme-start-text h2 {
  text-align:left; color:var(--weiss); margin-bottom:1.2rem;
  font-size:clamp(1.9rem,4vw,2.6rem);
}
.filme-start-text p { color:#D9D3C4; margin-bottom:1.5rem; }
.filme-start .knopf-voll { background:var(--gold); color:var(--text); }
.filme-start .knopf-voll:hover { background:var(--weiss); }
.filme-start .knopf-linie { color:var(--weiss); border-color:var(--akzent); }
.filme-start .film-video { box-shadow:0 18px 40px rgba(0,0,0,.35); }

@media (max-width:820px) {
  .film, .filme-start-raster { grid-template-columns:1fr; gap:1.3rem; }
  .film:nth-child(even) .film-video { order:0; }
  .film-liste { gap:3.2rem; }
  .film-kasten { padding:1.6rem 1.3rem; }
  .filme-start .film-video { order:-1; }
}
@media (max-width:480px) {
  .film-start { width:54px; height:54px; }
  .film-start svg { width:24px; height:24px; }
}
@media (prefers-reduced-motion:reduce) {
  .film-marke, .film-start { transition:none; }
}