/*======================================
Theme Name: Divi Child
Description: Divi Child Theme
Version: 1.0
Template: Divi
======================================*/

/* (1) Logo-Wall (dsm/masonry-gallery): CSS-Grid statt Masonry-JS auf allen Groessen. */
.bb-logoband .dsm-gallery { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 16px; height: auto !important; }
.bb-logoband .grid-item { position: static !important; transform: none !important; width: auto !important; margin: 0 !important; display: flex; align-items: center; }
.bb-logoband .grid-item a { width: 100%; }
.bb-logoband .dsm-mg-aspect-reserve { aspect-ratio: auto !important; width: 100% !important; height: 140px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.bb-logoband .grid-item img { width: 100% !important; height: 100% !important; max-height: 96px !important; object-fit: contain !important; object-position: center center !important; }
.bb-logoband .grid-sizer, html body .bb-logoband .gutter-sizer { display: none !important; }
@media (max-width: 980px) {
  .bb-logoband .dsm-gallery { grid-template-columns: repeat(2, 1fr); }
  .bb-logoband .dsm-mg-aspect-reserve { height: 100px !important; }
  .bb-logoband .grid-item img { max-height: 64px !important; }
}

/* (2) Mobile Typografie (Silbentrennung deaktiviert) */
.et-l--post h1, .et-l--post h2, .et-l--post h3, .et-l--post h4, .et-l--post p, .et-l--post li {
  -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; overflow-wrap: break-word; word-break: normal;
}
@media (max-width: 767px) {
  .et-l--post h1 { font-size: 36px !important; line-height: 1.1em !important; }
  .et-l--post h2 { font-size: 32px !important; line-height: 1.2em !important; }
  .et-l--post h3 { font-size: 24px !important; line-height: 1.25em !important; }
}

/* (3) Navigation: Cyan (#2ea3f2) -> Grün */
.et-l--header .mobile_menu_bar:before,
.et-l--header .et_pb_menu__mobile-menu-bar:before { color: #1d8e35 !important; }
.et-l--header .et_mobile_menu { border-color: #1d8e35 !important; }
.et-l--header a:hover,
.et-l--header .et_mobile_menu li a:hover,
.et-l--header .et_pb_menu .current-menu-item > a,
.et-l--header .et_mobile_menu .current-menu-item > a { color: #1d8e35 !important; }

/* (4) Mobiles Menue-Dropdown: volle Content-Breite unter der Navbar */
@media (max-width: 980px) {
  .et-l--header .et_pb_row { position: relative; }
  .et-l--header .et_pb_menu,
  .et-l--header .et_pb_menu__wrap,
  .et-l--header .et_pb_menu_inner_container,
  .et-l--header .et_mobile_nav_menu,
  .et-l--header .mobile_nav,
  .et-l--header .et_pb_row > .et_pb_column { position: static !important; }
  .et-l--header .et_mobile_menu {
    position: absolute !important;
    left: 0 !important; right: 0 !important; width: auto !important;
    top: 100% !important; z-index: 9999 !important;
  }
  /* (6) Header-Logo an Content-Breite (gleiche 5%-Raender wie Content) */
  .et-l--header > .et_builder_inner_content > .et_pb_section > .et_pb_row { padding-left: 5% !important; padding-right: 5% !important; }
}

/* Hero-Marquee mobil: nur geringe Laufhoehe (Track bleibt 842px, Viewport clippt) */
@media (max-width: 767px) {
  .bb-hero-marquee.dsm_marquee,
  .bb-hero-marquee .dsm_marquee_tracks,
  .bb-hero-marquee .dsm_marquee_viewport {
    height: 280px !important; min-height: 0 !important; max-height: 280px !important;
  }
}


/* Topbar mobil: X-Spalte + Spaltenabstand minimieren, Text volle Restbreite -> niedrigere Topbar
   (Button bleibt display:none, das Schliessen-X bleibt sichtbar) */
@media (max-width: 767px) {
  .et-interaction-target-tbar1 .et_pb_row { column-gap: 10px !important; }
  .et-interaction-target-tbar1 .et_pb_column_1_tb_header {
    flex: 0 0 26px !important; width: 26px !important; max-width: 26px !important; min-width: 0 !important;
  }
  .et-interaction-target-tbar1 .et_pb_column_0_tb_header {
    flex: 1 1 auto !important; width: auto !important; max-width: none !important;
  }
}

/* Hover-Effekte: nicht zusammenziehen (Basis-Padding fixieren + Hover-Pfeil aus),
   stattdessen Farbe etwas dunkler (brightness 0.88). Nur CSS, keine Inhaltsaenderung. */
.et_pb_button:hover { filter: brightness(0.88) !important; transition: filter .2s ease, padding .2s ease !important; }
#et-boc .et_pb_button.et_pb_button.et_pb_button[class*="_tb_header"]:hover, #page-container .et_pb_button.et_pb_button.et_pb_button[class*="_tb_header"]:hover { padding-left: 20px !important; padding-right: 20px !important; }
#et-boc .et_pb_button.et_pb_button.et_pb_button:not([class*="_tb_"]):not([class*="0fc75fdc"]):hover, #page-container .et_pb_button.et_pb_button.et_pb_button:not([class*="_tb_"]):not([class*="0fc75fdc"]):hover { padding-left: 24px !important; padding-right: 24px !important; }
.et_pb_button[class*="_tb_header"]:hover::after,
.et_pb_button:not([class*="_tb_"]):not([class*="0fc75fdc"]):hover::after { opacity: 0 !important; margin-left: 0 !important; }

/* Anfrage-Hero (Seite 51797): grauer Hintergrund #eee wie in der Vorlage */
body.page-id-51797 #et-boc .et_pb_section_0 { background-color: rgb(238, 238, 238) !important; }

/* Mega-Menue: Panel-Titel bleiben beim Hover weiss (nicht gruen wie die Link-Akzentfarbe) */
.et-l--header .et_pb_blurb .et_pb_module_header a:hover,
#et-boc .et-l--header .et_pb_blurb .et_pb_module_header a:hover,
#page-container .et_pb_blurb .et_pb_module_header a:hover { color: #ffffff !important; }


/* ---------  DIVI HORIZONTAL SCROLL FIX (aus Customizer-Zusatz-CSS uebernommen) --------- */
#page-container { overflow: hidden; }

/* Content-Icons links ausrichten (Service + Kontakt); Header/Footer-Icons unberuehrt */
#et-boc .et_pb_icon:not([class*="_tb_"]),
#page-container .et_pb_icon:not([class*="_tb_"]) { align-self: flex-start !important; margin-left: 0 !important; margin-right: auto !important; justify-content: flex-start !important; }

/* Verlinktes Partner-Logoband: CSS-Scroll (Hover pausiert -> Logos klickbar) */
.bb-logoband2 { overflow: hidden !important; }
.bb-logoband2 .bb-logotrack { display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: 48px; width: max-content !important; animation: bb-logoscroll 50s linear infinite; }
.bb-logoband2:hover .bb-logotrack { animation-play-state: paused; }
.bb-logoband2 .bb-logotrack .et_pb_image { margin: 0 !important; flex: 0 0 auto !important; width: auto !important; }
.bb-logoband2 .bb-logotrack .et_pb_image img { max-height: 64px !important; width: auto !important; }
@keyframes bb-logoscroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Verlinktes Partner-Logoband: CSS-Scroll (Hover pausiert -> klickbar). #et-boc schlaegt Divis Group-Wrap. */
#et-boc .bb-logoband2, #page-container .bb-logoband2 { overflow: hidden !important; }
#et-boc .bb-logoband2 .bb-logotrack, #page-container .bb-logoband2 .bb-logotrack {
  display: flex !important; flex-wrap: nowrap !important; flex-direction: row !important;
  align-items: center !important; gap: 48px !important; width: max-content !important; max-width: none !important;
  animation: bb-logoscroll 50s linear infinite;
}
#et-boc .bb-logoband2:hover .bb-logotrack, #page-container .bb-logoband2:hover .bb-logotrack { animation-play-state: paused; }
#et-boc .bb-logoband2 .bb-logotrack .et_pb_image, #page-container .bb-logoband2 .bb-logotrack .et_pb_image {
  margin: 0 !important; flex: 0 0 auto !important; width: auto !important; max-width: none !important;
}
#et-boc .bb-logoband2 .bb-logotrack .et_pb_image img { max-height: 64px !important; width: auto !important; }
@keyframes bb-logoscroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Global-Sektion-Wrapper (vom global-layout-Block erzeugt) randlos+transparent -> die referenzierte Sektion fuellt randlos. Gilt fuer Logoband + CTAs (.bb-flush). */
#et-boc .et_pb_section:has(> .et_pb_row > .et_pb_column > .bb-logoband2),
#et-boc .et_pb_section:has(> .et_pb_row > .et_pb_column > .bb-flush) { padding: 0 !important; background: transparent !important; }
#et-boc .et_pb_row:has(> .et_pb_column > .bb-logoband2),
#et-boc .et_pb_row:has(> .et_pb_column > .bb-flush) { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: none !important; }
#et-boc .et_pb_column:has(> .bb-logoband2),
#et-boc .et_pb_column:has(> .bb-flush) { padding: 0 !important; margin: 0 !important; width: 100% !important; }

/* Task1: Logoband auf den Dienstleistungs-Unterseiten ohne grauen Hintergrund */
.parent-pageid-51791 #et-boc .bb-logoband2, #et-boc .parent-pageid-51791 .bb-logoband2 { background: transparent !important; background-color: transparent !important; }

/* Task2: Dropdown-Pfeil im Header gruen statt Divi-Default-Blau */
.et-l--header .dsm-dropdown-icon-wrapper, .et-l--header .dsm-dropdown-icon-wrapper *,
.et-l--header .dsm-mega-menu-item .dsm-dropdown-icon { color: #1d8e35 !important; fill: #1d8e35 !important; }

/* Task3: Mega-Menue buendig unter dem Header oeffnen (Dropdown ~26px runter) */
.et-l--header .dsm-submenu-container { margin-top: 26px !important; }

/* Task4: Mega-Menue Bottom-Bar-Link inline halten (Header setzt a{display:flex} fuer Menuepunkte) */
.et-l--header .dsm-submenu-container .et_pb_text a { display: inline !important; color: #ffffff !important; text-decoration: underline !important; }