/* WESTKERN – Branchenfilm: nur auf /leistungen/website-betreuung/ */
.wk-managed-film-section {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:94px 0 88px;
  background:linear-gradient(153deg,#061522 0%,#0b2839 58%,#071827 100%);
  color:#fff;
}
.wk-managed-film-section::before{
  content:"";position:absolute;z-index:-1;inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 78% 18%,rgba(16,140,255,.18),transparent 35%),
             radial-gradient(circle at 8% 95%,rgba(16,140,255,.08),transparent 29%);
}
.wk-managed-film-intro {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(250px,.75fr);
  align-items:end;gap:38px;margin-bottom:34px;
}
.wk-managed-film-intro .wk-kicker{color:#5bb9ff;letter-spacing:.09em}
.wk-managed-film-intro h2 {
  max-width:820px;margin:13px 0 0;color:#fff;
  font-size:clamp(2rem,3.4vw,3.7rem);line-height:1.08;letter-spacing:-.035em;
}
.wk-managed-film-intro p{max-width:490px;margin:0;color:#c1d1dc;font-size:1.01rem;line-height:1.75}
.wk-managed-film-stage{
  padding:10px;border:1px solid rgba(129,194,248,.27);
  border-radius:25px;background:rgba(255,255,255,.045);
  box-shadow:0 25px 65px rgba(0,4,15,.3), 0 0 0 1px rgba(255,255,255,.02) inset;
}
.wk-managed-film-player{
  position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;
  border-radius:17px;background:#07111c;
}
/* Das freigegebene Vorschaubild bleibt bis zum ersten dekodierten Videobild sichtbar. */
.wk-managed-film-video,.wk-managed-film-poster{
  position:absolute;inset:0;display:block;width:100%;height:100%;
}
.wk-managed-film-video{z-index:1;object-fit:contain;opacity:0;transition:opacity .45s ease}
.wk-managed-film-poster{
  z-index:2;object-fit:cover;opacity:1;
  transition:opacity .45s ease;pointer-events:none;
}
.wk-managed-film-player.has-played .wk-managed-film-video{opacity:1}
.wk-managed-film-player.has-played .wk-managed-film-poster{opacity:0}
.wk-managed-film-play{
  position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:13px;
  padding:14px 24px 14px 15px;
  border:1px solid rgba(255,255,255,.55);border-radius:999px;
  background:rgba(9,36,62,.94);color:#fff;
  box-shadow:0 12px 46px rgba(0,0,0,.54);
  font:700 1rem/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;
  cursor:pointer;white-space:nowrap;
  transition:background .18s,transform .18s,opacity .2s;
}
.wk-managed-film-play:hover{background:#0a78d9;transform:translate(-50%,-50%) scale(1.035)}
/* Im Vorschaubild ist bereits ein Play-Symbol integriert: kein zweiter Knopf darüber. */
.wk-managed-film-player:not(.has-played) .wk-managed-film-play,
.wk-managed-film-player:not(.has-played) .wk-managed-film-play:hover{
  inset:0;top:0;left:0;transform:none;
  width:100%;height:100%;padding:0;
  border:0;border-radius:0;background:transparent;box-shadow:none;
}
.wk-managed-film-player:not(.has-played) .wk-managed-film-play > span{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;
}

.wk-managed-film-play:focus-visible{outline:3px solid #fff;outline-offset:4px}
.wk-managed-film-play:disabled{opacity:.75;cursor:wait}
.wk-managed-film-play-symbol{
  display:grid;place-items:center;width:42px;height:42px;
  border-radius:50%;background:#168cff;color:#fff;
  font-size:1.08rem;padding-left:2px;
}
.wk-managed-film-player.is-playing .wk-managed-film-play{
  opacity:0;visibility:hidden;pointer-events:none;
}
.wk-managed-film-length{
  position:absolute;z-index:3;right:20px;bottom:20px;pointer-events:none;
  padding:6px 12px;border-radius:8px;background:rgba(5,15,26,.84);
  color:#fff;font-size:.75rem;font-weight:800;letter-spacing:.05em;
}
.wk-managed-film-player.is-playing .wk-managed-film-length{opacity:0}
.wk-managed-film-caption{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px;padding:17px 20px 9px;
}
.wk-managed-film-points{display:flex;gap:14px 26px;flex-wrap:wrap}
.wk-managed-film-points span{color:#e2ecf5;font-size:.8rem;font-weight:700}
.wk-managed-film-points i{font-style:normal;color:#56b9ff;font-weight:900;padding-right:6px}
.wk-managed-film-meta{color:#b6cad8;font-size:.76rem;white-space:nowrap}
.wk-managed-film-foot{display:flex;justify-content:space-between;gap:30px;align-items:center;margin-top:19px}
.wk-managed-film-foot p{max-width:710px;margin:0;color:#b0c2ce;font-size:.76rem;line-height:1.6}
.wk-managed-film-foot .wk-text-link{flex:none;color:#74c5ff;white-space:nowrap}
@media(max-width:900px){
  .wk-managed-film-section{padding:65px 0}
  .wk-managed-film-intro{grid-template-columns:1fr;gap:12px}
  .wk-managed-film-intro p{max-width:680px}
  .wk-managed-film-foot{align-items:flex-start;flex-direction:column;gap:12px}
}
@media(max-width:600px){
  .wk-managed-film-section{padding:50px 0}
  .wk-managed-film-intro h2{font-size:clamp(1.9rem,8vw,2.55rem)}
  .wk-managed-film-intro p{font-size:.9rem}
  .wk-managed-film-stage{padding:5px;border-radius:16px}
  .wk-managed-film-player{border-radius:11px}
  .wk-managed-film-play{gap:7px;padding:6px 12px 6px 7px;font-size:.78rem}
  .wk-managed-film-play-symbol{width:30px;height:30px;font-size:.78rem}
  .wk-managed-film-length{right:9px;bottom:9px;font-size:.62rem;padding:4px 7px}
  .wk-managed-film-caption{padding:13px 9px 10px}
  .wk-managed-film-points{gap:7px 15px}
  .wk-managed-film-points span{font-size:.72rem}
}
@media(prefers-reduced-motion:reduce){
  .wk-managed-film-play,.wk-managed-film-video,.wk-managed-film-poster{transition:none}
}