/* Film vom Einstieg in den Atlas in der drehbaren Vorschau der Startseite (gehört zu vorschau3d.js). Eigene Datei, weil
   die Content-Security-Policy keine Stile im HTML erlaubt. Der Film liegt über der drehbaren Figur und blendet am Ende aus;
   darunter steht die Figur deckungsgleich mit dem letzten Filmbild. */
/* Hintergrund wie auf der Atlas-Seite: die Praxis, unscharf und abgedunkelt (gleiche Werte wie .atlas-buehne::before).
   Der Film endet genau in diesem Bild, die drehbare Figur steht davor. clip-path statt overflow, damit der Hinweis
   unter der Bühne sichtbar bleibt. */
.dreh-buehne{isolation:isolate}
.dreh-buehne::after{content:"";position:absolute;inset:-16px;z-index:-1;pointer-events:none;clip-path:inset(16px round var(--radius));
  background:#0b1512 center 40%/cover no-repeat;background-image:linear-gradient(rgba(11,21,18,.32),rgba(11,21,18,.56)),url(/bilder/raum-liege-kabelzug-1600.webp);
  filter:blur(7px) saturate(.8) brightness(.74)}
.dreh-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;background:#0b1512;pointer-events:none;opacity:0;visibility:hidden}
.dreh-film-an .dreh-film{opacity:1;visibility:visible}
.dreh-film-an .dreh-buehne picture{opacity:0}
.dreh-film-an .dreh-buehne::before{opacity:0}
.dreh-film-weg .dreh-film{opacity:0;transition:opacity 1.1s ease}
.dreh-film-weg .dreh-buehne::before{opacity:1;transition:opacity 1.1s ease}
/* Freddy stellt sich vor (Martin, 21.10.2026): kleines, unauffälliges Schild rechts neben dem Kopf (Kopf im Bild bei x 42–55 %,
   y 5–13 %). Klicks gehen durch auf den Link der Bühne, das Schild selbst fängt nichts ab. */
.dreh-freddy{position:absolute;z-index:3;left:57%;top:6%;max-width:42%;box-sizing:border-box;padding:.22rem .55rem;border:1px solid rgba(255,255,255,.16);
  border-radius:99px;background:rgba(11,21,18,.55);color:rgba(244,246,241,.92);font-size:.7rem;line-height:1.25;text-align:left;pointer-events:none;
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;transform:translateY(3px);transition:opacity .6s ease,transform .6s ease}
.dreh-freddy strong{font-weight:600}
.dreh-freddy em{font-style:normal;color:#9dcc6a}
.dreh-freddy em::before{content:" · ";color:rgba(244,246,241,.5)}
.dreh-freddy-da .dreh-freddy{opacity:1;transform:none}
@media (max-width:700px){.dreh-freddy{font-size:.62rem;max-width:44%}}
@media (prefers-reduced-motion:reduce){.dreh-freddy{transition:opacity .2s;transform:none}}