/* Hero-Wechsel 24.10.: fuenf Bilder, sanfte Ueberblendung (Gman 22:52) */
.hero .hero-bild{isolation:isolate}
.hero .hero-bild picture.hero-slide{opacity:0;transition:none;pointer-events:none}
.hero .hero-bild picture.hero-slide.vor{opacity:1;z-index:1}
.hero .hero-bild picture.hero-slide.on{opacity:1;z-index:2}
.hero .hero-bild picture.hero-slide.blende{transition:opacity 1200ms ease-in-out}
/* Bilder 2 bis 5: ruhiger Zoom nur auf dem aktiven Bild */
.hero .hero-bild picture.hero-slide:not(.hero-slide-1) img{transform:scale(1.05);transition:none}
.hero .hero-bild picture.hero-slide:not(.hero-slide-1).on img,
.hero .hero-bild picture.hero-slide:not(.hero-slide-1).vor img{transform:scale(1);transition:transform 8000ms cubic-bezier(.16,1,.3,1)}
.hero .hero-bild picture.hero-slide-2 img{object-position:50% 85%}
@media (max-width:767px){
.hero .hero-bild picture.hero-slide-2 img{object-position:50% 70%!important}
.hero .hero-bild picture.hero-slide img{object-position:50% 70%!important}
}
/* Lesbarkeit weisser Schrift ueber allen Bildern: Verlauf je Bild leicht verstaerkt */
.hero.bild-3 .hero-verlauf-links,.hero.bild-5 .hero-verlauf-links{background:linear-gradient(to right,rgba(18,46,77,.62) 0%,rgba(18,46,77,.3) 45%,rgba(18,46,77,0) 70%)}
.hero-verlauf,.hero-verlauf-links{transition:background-color 1200ms ease}
@media (prefers-reduced-motion:reduce){
.hero .hero-bild picture.hero-slide,.hero .hero-bild picture.hero-slide img{transition:none!important}
}
/* Desktop-Drohnenflug (24.10. 23:04): Video liegt ueber Bild 1, unter Verlauf und Text */
.hero .hero-bild video.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%;z-index:3;opacity:0;transition:opacity 1200ms ease-in-out;pointer-events:none;background:transparent}
.hero .hero-bild video.hero-video.an{opacity:1;z-index:4}
@media (max-width:767px){.hero .hero-bild video.hero-video{display:none}}
@media (prefers-reduced-motion:reduce){.hero .hero-bild video.hero-video{display:none}}

/* 13.11.2026 Hero-Sicherheitsnetz (Gman): Der Hero ist nie leer.
   Bild 1 bleibt hinter jedem Slide und hinter dem Video sichtbar.
   Video blendet darueber ein; fällt das Video aus, bleibt das Bild. */
html body #kopf.hero .hero-bild picture.hero-slide-1{
  opacity:1!important;
  z-index:0;
}
html body #kopf.hero .hero-bild picture.hero-slide-1.on,
html body #kopf.hero .hero-bild picture.hero-slide-1.vor,
html body #kopf.hero.video-zeigt .hero-bild picture.hero-slide-1.on,
html body #kopf.hero.hero-video-an .hero-bild picture.hero-slide-1.on{
  opacity:1!important;
}