/* VERNETZT.DIGITAL – Hero-Video (Abschnitt mit Klasse vd-hero-video). Die Darstellung setzt hero.js als Klasse:
   .vd-hero-dark  – Video füllt den Abschnitt, Abdunklung, helle Schrift (Rechner; am Handy bei „Vollbild“)
   .vd-hero-band  – Handy: Video als vollständiges 16:9-Band oben, Text darunter in den Farben des Modus
   .vd-hero-novideo – Handy bei „kein Video“: nur Text in den Farben des Modus
   .vd-hero-full  – volle Bildschirmhöhe (Einstellung „Volle Bildschirmhöhe am Rechner“)
   Stärke der Abdunklung über --vd-shade-1/2/3. Auswahl mit „body #page-container“ wie die Divi-Presets. */
body #page-container .et_pb_section.vd-hero-video { position: relative; overflow: hidden; isolation: isolate; }
.vd-hero-media { position: absolute; inset: 0; z-index: 0; background: #0b1220 center / cover no-repeat; pointer-events: none; }
.vd-hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vd-hero-shade { position: absolute; inset: 0; }
body #page-container .et_pb_section.vd-hero-video > .et_pb_row { position: relative; z-index: 1; }

/* Vollbild mit Abdunklung */
body #page-container .et_pb_section.vd-hero-dark { display: flex; flex-direction: column; justify-content: center; background-color: #0b1220 !important; }
body #page-container .et_pb_section.vd-hero-dark.vd-hero-full { min-height: calc(100vh - 79px); min-height: calc(100svh - 79px); }
.vd-hero-dark .vd-hero-shade { background: linear-gradient(90deg, rgba(0, 20, 50, var(--vd-shade-1, .86)) 0%, rgba(0, 20, 50, var(--vd-shade-2, .62)) 55%, rgba(0, 20, 50, var(--vd-shade-3, .35)) 100%); }
body #page-container .et_pb_section.vd-hero-dark h1,
body #page-container .et_pb_section.vd-hero-dark h1 * { color: #ffffff !important; }
/* Dachzeile = erster Textbaustein direkt in der Spalte (nicht der erste Text in einer Gruppe, z. B. Vertrauensleiste; 0.9.14) */
body #page-container .et_pb_section.vd-hero-dark .et_pb_column > .et_pb_text:first-child,
body #page-container .et_pb_section.vd-hero-dark .et_pb_column > .et_pb_text:first-child * { color: #9cc3ff !important; }
body #page-container .et_pb_section.vd-hero-dark p { color: rgba(255, 255, 255, .9) !important; }
/* Vertrauensleiste unter den Knöpfen (Textbausteine in einer Gruppe): dezent (0.9.14) */
body #page-container .et_pb_section.vd-hero-dark .et_pb_group .et_pb_text p { color: rgba(255, 255, 255, .78) !important; }
body #page-container .et_pb_section.vd-hero-video .et_pb_group .et_pb_text p { margin: 0; padding: 0; }
body #page-container .et_pb_section.vd-hero-dark .et_pb_button.preset--module--divi-button--default { background-color: #3b82f6 !important; border-color: #3b82f6 !important; color: #ffffff !important; }
body #page-container .et_pb_section.vd-hero-dark .et_pb_button:not(.preset--module--divi-button--default) { background-color: transparent !important; border-color: #ffffff !important; color: #ffffff !important; }
@media (max-width: 980px) {
	body #page-container .et_pb_section.vd-hero-dark.vd-hero-full { min-height: calc(100vh - 63px); min-height: calc(100svh - 63px); }
	.vd-hero-dark .vd-hero-shade { background: linear-gradient(180deg, rgba(0, 20, 50, var(--vd-shade-1, .82)) 0%, rgba(0, 20, 50, var(--vd-shade-2, .7)) 100%); }
}

/* Handy: Band oben, Text darunter in den Modusfarben */
body #page-container .et_pb_section.vd-hero-band { display: block !important; padding-top: 0 !important; padding-bottom: 36px !important; }
body #page-container .et_pb_section.vd-hero-band .vd-hero-media { position: relative; inset: auto; width: 100%; aspect-ratio: 16 / 9; margin: 0 0 14px; background-color: transparent; }
body #page-container .et_pb_section.vd-hero-band .vd-hero-media video { object-fit: contain; }

/* Handy ohne Video */
body #page-container .et_pb_section.vd-hero-novideo .vd-hero-media { display: none; }

@media (max-width: 767px) {
	body #page-container .et_pb_section.vd-hero-video > .et_pb_row { width: calc(100% - 40px) !important; margin: 0 auto !important; }
	body #page-container .et_pb_section.vd-hero-band > .et_pb_row { padding-top: 0 !important; }
	body #page-container .et_pb_section.vd-hero-video h1 { font-size: 28px !important; line-height: 1.2 !important; }
}
