/* Footer bleibt durchgehend schwarz – keine weißen Ecken (nur Footer-Bereich) */

/* Footer-Bereich explizit schwarz und bis zu den Rändern */
.footer_wrapper,
.footer_wrapper.fade-up {
  background-color: #000 !important;
  min-height: 100%;
  position: relative;
  padding-bottom: 100px;
  box-sizing: border-box;
}

.footer_gesamt {
  background-color: #000 !important;
}

.section_footer,
.div-block-30 {
  background-color: #000 !important;
}

/* Links und rechts von .section_footer 100 % schwarz ausfüllen, Box behält ihre Breite */
.section_footer {
  position: relative !important;
}
.section_footer::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 50%;
  margin-left: -50vw;
  width: 100vw;
  top: 0;
  bottom: 0;
  background-color: #000 !important;
}

/* Footer-Logo: Lottie (3×) ausblenden, stattdessen einmal das gleiche Logo wie oben links */
.section_footer .logo_footer,
.section_footer .lottie-animation-3.logo_footer {
  display: none !important;
}
.section_footer .logo_footer svg,
.section_footer .lottie-animation-3.logo_footer svg {
  display: none !important;
}
/* Erstes Wrapper-Feld = Logo-Platz: gleiches Logo wie Header (yev_3.svg), einmal, weiß */
.section_footer .efi-frm-03-text-grid > .efi-frm-03-wrapper:first-child {
  background-image: url('https://cdn.prod.website-files.com/62ed903217fa63b1718c2fb5/6849d0a4ac97176c86d7b21a_yev_3.svg') !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  min-width: 52px !important;
  min-height: 28px !important;
  filter: invert(1); /* weiß auf schwarzem Footer wie Header-Logo */
}
.section_footer .efi-frm-03-text-grid > .efi-frm-03-wrapper:first-child > * {
  display: none !important; /* Lottie-Inhalt ausblenden */
}

/* Verhindern, dass 100vw weiße Streifen erzeugt */
.footer_wrapper {
  width: 100% !important;
  max-width: 100vw;
  box-sizing: border-box;
}

.footer_gesamt {
  width: 100% !important;
  max-width: 100vw;
  box-sizing: border-box;
}

/* Benefits: nur Lottie-Icons anzeigen – statische Doppel-Bilder ausblenden */
#benefits .image-26 {
  display: none !important;
}

/* Pro Spalte nur 1 Icon: Lottie rendert 3× dasselbe SVG – nur das erste SVG behalten (2. und 3. ausblenden) */
#benefits .icons_benefits > * > svg:nth-child(n+2) {
  display: none !important;
}
/* Falls die 3 SVGs direkt im Container liegen (ohne Wrapper-Div) */
#benefits .icons_benefits > svg:nth-child(n+2) {
  display: none !important;
}

/* Benefits: Icons klar oberhalb der Schrift, kein Überlappen */
#benefits .features-block,
#benefits .features-block-first {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  padding-top: 0 !important;
}

/* Icons auf einer Linie mit den vertikalen Trennlinien – nichts drückt sie nach unten */
#benefits .icons_benefits {
  flex-shrink: 0 !important;
  min-height: 70px !important;
  margin-top: 0 !important;
  margin-bottom: 18px !important;
  padding-top: 0 !important;
  width: 65px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}

/* Lottie-Inhalt (SVG/Canvas) oben ausrichten */
#benefits .icons_benefits svg,
#benefits .icons_benefits canvas {
  display: block !important;
  vertical-align: top !important;
}

#benefits .benefits_text {
  margin-top: 0 !important;
  order: 10 !important;
}

/* Blöcke nicht nach unten schieben – Icons und Trennlinien bleiben auf einer Linie (überschreibt Media-Query margin-top) */
#benefits .features-block,
#benefits .features-block-first {
  margin-top: 0 !important;
}

/* Logo oben links: fixiert, oberste Ebene, Invertierung je nach Hintergrund */
.link-block-4,
.link-block-4.glitch-transition.w--current {
  mix-blend-mode: difference !important;
  position: fixed !important;
  z-index: 2147483647 !important;
  min-width: 56px;
  min-height: 32px;
  display: flex !important;
  align-items: center;
}
/* Original-Logo ausblenden (Klon liegt als oberste Ebene auf body) */
.link-block-4.logo-original-hidden {
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Wrapper für Header-Logo: immer oberste Ebene */
#yev-logo-wrapper {
  isolation: isolate !important;
  z-index: 2147483647 !important;
}
#yev-logo-wrapper .image-49 {
  display: block !important;
  width: 52px !important;
  height: auto !important;
  min-height: 28px;
  filter: invert(1);
  object-fit: contain;
}
#yev-logo-wrapper .link-block-4:hover .image-49 {
  transform: scale(1.12);
}
/* Logo weiß halten, damit difference es je nach Hintergrund invertiert */
.link-block-4 .image-49 {
  display: block !important;
  width: 52px !important;
  height: auto !important;
  min-height: 28px;
  filter: invert(1); /* SVG wird weiß → auf Weiß = schwarz, auf Schwarz = weiß */
  object-fit: contain;
  transition: transform 0.25s ease, opacity 0.2s ease;
}
.link-block-4:hover .image-49 {
  transform: scale(1.12);
}
/* Lottie im Header aus – Hover nur per CSS (Logo bleibt sichtbar) */
.link-block-4 .lottie-animation-3 {
  display: none !important;
}