/* Filme seit 16.10.2026: Imagefilm (mit Ton, Untertiteln) im Startseiten-Hero, Markenfilm (stumm, Schleife) auf Lösungen. */
.v5-hero-film.v9-image-film{height:auto;min-height:0;aspect-ratio:16/9;padding:0;background:#06121c;border:1px solid rgba(154,211,242,.18);box-shadow:0 52px 130px rgba(0,0,0,.42),0 0 90px rgba(38,124,181,.12);isolation:isolate}
/* Laptop (Fabian 17.10.2026): Film nie höher als das Fenster unter der fixen Kopfzeile (68 px + 2 x 24 px Luft), sonst fehlt unten ein Streifen. */
.v5-hero-film.v9-image-film{width:min(var(--shell),max(480px,calc((100vh - 116px) * 16 / 9)));width:min(var(--shell),max(480px,calc((100svh - 116px) * 16 / 9)))}
.v5-hero-film.v9-image-film:after{display:none}
.v5-hero-film.v9-image-film video{display:block;width:100%;height:100%;object-fit:contain;transform:none;background:#06121c}
.home-v5 .v5-hero-film.v9-image-film{margin-top:72px}
.v8-hero-quote+.v5-hero-film.v9-image-film{margin-top:34px}
.v9-image-film__note{margin-top:16px;color:rgba(232,243,249,.58);font-size:13px;line-height:1.6;text-align:center}
.v9-ton-an{display:flex;align-items:center;gap:9px;width:max-content;margin:20px auto 0;padding:11px 18px 11px 14px;border:1px solid rgba(190,228,255,.4);border-radius:var(--radius-pill);background:rgba(255,255,255,.06);color:#fff;font:600 14px/1 Montserrat,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer}
.v9-ton-an svg{width:20px;height:20px}
.v9-ton-an.ist-stumm{background:linear-gradient(120deg,#1f7fe0,#49a9ff);border-color:rgba(190,228,255,.8);box-shadow:0 10px 34px rgba(41,151,255,.35)}
.v9-ton-an:hover{border-color:rgba(190,228,255,.9)}
.v9-ton-an+.v9-image-film__note{margin-top:12px}
.v9-solutions-film{padding:0 0 120px;background:#02070d}
.v9-solutions-film .v8-brand-film{margin-top:0;border:1px solid rgba(154,211,242,.18);box-shadow:0 52px 130px rgba(0,0,0,.42),0 0 90px rgba(38,124,181,.12)}
@media (max-width:700px){
  .v5-hero-film.v9-image-film{width:calc(100vw - 20px);height:auto;aspect-ratio:16/9;margin-left:auto;margin-right:auto;border-radius:var(--radius-m)}
  .home-v5 .v5-hero-film.v9-image-film{margin-top:50px}
  .v9-image-film__note{font-size:12px;padding:0 6px}
  .v9-ton-an{margin-top:16px;padding:10px 16px 10px 12px;font-size:13px}
  .v9-solutions-film{padding-bottom:80px}
  .v9-solutions-film .v8-brand-film{margin-left:auto;margin-right:auto}
}
/* Seit 20.10.2026 abends (Fabian): randlos über die ganze Breite, stummer Autostart, nur die Knöpfe „Ton einschalten“
   und Anhalten (film-v9.js). Imagefilm v6 ist als Breitfassung 2,5:1 gebaut (2560x1024), alle Texte liegen im 16:9-Mittelteil:
   am Desktop genau 5:2, am Handy 16:9 (zeigt genau den Mittelteil). */
:root body .m2-film .v9-image-film{position:relative;width:100%;max-width:none;height:auto;min-height:0;aspect-ratio:5/2;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:#02070d;overflow:hidden}
:root body .m2-film .v9-image-film video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:#02070d}
.v9-steuer{position:absolute;z-index:2;left:clamp(16px,3vw,40px);right:clamp(16px,3vw,40px);bottom:clamp(16px,2.4vw,32px);display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}
.v9-steuer>*{pointer-events:auto}
.v9-ton{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 18px 10px 14px;border:0;border-radius:var(--radius-pill);background:rgba(255,255,255,.94);color:#0b1620;font:600 15px/1 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.01em;cursor:pointer;box-shadow:0 10px 30px rgba(2,7,13,.3);transition:background .2s,color .2s}
.v9-ton:hover{background:#fff}
.v9-ton svg{width:20px;height:20px;color:#006ed6}
.v9-ton.ist-an{background:rgba(2,7,13,.5);color:#fff;box-shadow:none}
.v9-ton.ist-an svg{color:#fff}
.v9-ton.ist-an:hover{background:rgba(2,7,13,.7)}
@media (max-width:700px){
  :root body .m2-film .v9-image-film{aspect-ratio:16/9;width:100%;border-radius:0}
  .v9-steuer{left:12px;right:12px;bottom:12px}
  .v9-ton{min-height:38px;padding:8px 14px 8px 11px;font-size:13px}
  .v9-ton svg{width:17px;height:17px}
  .v9-steuer .v9-pause{width:38px;height:38px}
}
.v9-steuer .v9-pause{background:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.v9-steuer .v9-pause:hover{background:rgba(255,255,255,.32)}

/* Zeitleiste (Fabian 21.10.2026: vor- und zurückspulen): schmal wie bei Apple, zwischen „Ton einschalten“ und Pause.
   Leichter Verlauf unten, damit Leiste und Zeit auch auf hellen Filmstellen lesbar bleiben. */
:root body .m2-film .v9-image-film::after{content:"";display:block;position:absolute;inset:auto 0 0;z-index:1;height:34%;background:linear-gradient(to top,rgba(2,7,13,.5),rgba(2,7,13,0));pointer-events:none}
.v9-leiste{flex:1;display:flex;align-items:center;gap:14px;min-width:0;max-width:760px;margin:0 auto}
.v9-zeit{--fort:0%;flex:1;min-width:0;height:32px;margin:0;padding:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}
.v9-zeit::-webkit-slider-runnable-track{height:4px;border-radius:var(--radius-pill);background:linear-gradient(to right,#fff var(--fort),rgba(255,255,255,.36) var(--fort))}
.v9-zeit::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;border:0;border-radius:50%;background:#fff;box-shadow:0 1px 8px rgba(0,0,0,.4);transition:transform .15s}
.v9-zeit:hover::-webkit-slider-thumb,.v9-zeit:active::-webkit-slider-thumb{transform:scale(1.25)}
.v9-zeit::-moz-range-track{height:4px;border-radius:var(--radius-pill);background:rgba(255,255,255,.36)}
.v9-zeit::-moz-range-progress{height:4px;border-radius:var(--radius-pill);background:#fff}
.v9-zeit::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff;box-shadow:0 1px 8px rgba(0,0,0,.4)}
.v9-zeit:focus{outline:none}
.v9-zeit:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:var(--radius-xs)}
.v9-uhr{flex:none;color:#fff;font:500 13px/1 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:0;text-shadow:0 1px 6px rgba(0,0,0,.5)}
@media (max-width:700px){.v9-leiste{gap:8px}.v9-uhr{display:none}.v9-zeit{height:28px}}

/* Spulen mit Finger (28.10.2026): ganze Leistenhöhe greift, Seite scrollt beim Ziehen nicht mit, größerer Punkt am Touchscreen.
   Am Handy nur das Lautsprecher-Zeichen und keine Uhr, damit die Zeitleiste breit genug zum Ziehen ist. */
.v9-zeit{height:44px;touch-action:none}
@media (pointer:coarse){
  .v9-zeit::-webkit-slider-thumb{width:20px;height:20px;margin-top:-8px}
  .v9-zeit::-moz-range-thumb{width:20px;height:20px}
}
@media (max-width:600px){
  .v9-ton{padding:8px 10px}
  .v9-ton span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .v9-uhr{display:none}
}