/* ==========================================================================
   Top Zirkon – statische Ergänzungen (ersetzen Elementor-/Swiper-JavaScript)
   ========================================================================== */

/* ---------- Header: Untermenü per Hover/Fokus statt SmartMenus-JS ---------- */
.elementor-nav-menu--main .elementor-nav-menu li:hover > ul,
.elementor-nav-menu--main .elementor-nav-menu li:focus-within > ul { display: block; }
.elementor-nav-menu--main .elementor-nav-menu > li > ul { top: 100%; left: 0; z-index: 100; }

/* ---------- Mobil-Menü (Off-Canvas, ehemals Elementor-Popup) ---------- */
.tz-menu-toggle,
.tz-menu-toggle:hover,
.tz-menu-toggle:focus { background-color: transparent; cursor: pointer; line-height: 1; font: inherit; border-radius: 0; }
.tz-menu-toggle .tz-close-icon { display: none; }
#tz-nav-toggle:checked + .tz-menu-toggle { position: fixed; top: 20px; right: 20px; z-index: 10001; border-color: transparent !important; }
#tz-nav-toggle:checked + .tz-menu-toggle svg:not(.tz-close-icon) { display: none; }
#tz-nav-toggle:checked + .tz-menu-toggle .tz-close-icon { display: block; fill: var(--e-global-color-text, #fff); }

.tz-offcanvas,
.tz-offcanvas[data-elementor-type="popup"]:not(.elementor-edit-area) {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; justify-content: flex-end; align-items: flex-start;
  background-color: #00000080;
  visibility: hidden; opacity: 0;
  transition: opacity .3s ease, visibility .3s ease;
}
.tz-offcanvas__dialog {
  width: 360px; max-width: 90vw; height: 100vh; overflow-y: auto;
  background-color: #000000E6;
  box-shadow: 0 0 30px 0 rgba(80, 196, 254, .5);
  transform: translateX(100%);
  transition: transform .6s ease;
}
body:has(#tz-nav-toggle:checked) { overflow: hidden; }
body:has(#tz-nav-toggle:checked) .tz-offcanvas { visibility: visible; opacity: 1; }
body:has(#tz-nav-toggle:checked) .tz-offcanvas__dialog { transform: none; }
.tz-offcanvas .elementor-nav-menu--dropdown.elementor-nav-menu__container { transform: none; max-height: none; overflow: visible; }
.tz-offcanvas .elementor-nav-menu ul.sub-menu { display: block; position: static; width: auto; padding-left: 20px; }
@media (min-width: 1025px) { .tz-offcanvas[data-elementor-type="popup"] { display: none; } }

/* ---------- Galerie (Masonry per CSS-Spalten statt e-gallery-JS) ---------- */
.tz-gallery { display: block !important; columns: var(--tzg-cols, 4); column-gap: var(--tzg, 20px); --e-gallery-height: auto; }
.tz-gallery__item { display: block; position: relative; margin: 0 0 var(--tzg, 20px); break-inside: avoid; overflow: hidden; }
.tz-gallery__item img { display: block; width: 100%; height: auto; transition: transform .4s ease, opacity .4s ease; }
.tz-gallery__item:hover img,
.tz-gallery__item:focus-visible img { transform: scale(1.03); opacity: .85; }
@media (max-width: 1024px) { .tz-gallery { columns: 3; column-gap: 10px; } .tz-gallery__item { margin-bottom: 10px; } }
@media (max-width: 767px)  { .tz-gallery { columns: 2; } }

/* ---------- Bild-Karussell (Scroll-Snap statt Swiper) ---------- */
.tz-carousel { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--e-global-color-primary, #50C5FF) transparent; padding-bottom: 12px; }
.tz-carousel__track { display: flex; gap: 10px; }
.tz-carousel__slide { flex: 0 0 calc((100% - 30px) / 4); scroll-snap-align: start; }
.tz-carousel__slide figure { margin: 0; }
.tz-carousel__slide img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }
@media (max-width: 1024px) { .tz-carousel__slide { flex-basis: calc((100% - 10px) / 2); } }
@media (max-width: 767px)  { .tz-carousel__slide { flex-basis: 100%; } }

/* ---------- Tabs (Radio-Tabs, ohne JS) ---------- */
.tz-tab-radio { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.e-n-tabs label.e-n-tab-title { cursor: pointer; user-select: none; }
.e-n-tabs .e-n-tabs-content > .e-con[data-tab-index] { display: none; }
.tz-tab-radio[value="1"]:checked ~ .e-n-tabs-content > .e-con[data-tab-index="1"],
.tz-tab-radio[value="2"]:checked ~ .e-n-tabs-content > .e-con[data-tab-index="2"],
.tz-tab-radio[value="3"]:checked ~ .e-n-tabs-content > .e-con[data-tab-index="3"],
.tz-tab-radio[value="4"]:checked ~ .e-n-tabs-content > .e-con[data-tab-index="4"] { display: flex; }
.tz-tab-radio[value="1"]:focus-visible ~ .e-n-tabs-heading [data-tab-index="1"],
.tz-tab-radio[value="2"]:focus-visible ~ .e-n-tabs-heading [data-tab-index="2"],
.tz-tab-radio[value="3"]:focus-visible ~ .e-n-tabs-heading [data-tab-index="3"],
.tz-tab-radio[value="4"]:focus-visible ~ .e-n-tabs-heading [data-tab-index="4"] { outline: 2px solid var(--e-global-color-primary, #50C5FF); outline-offset: 2px; }

/* ---------- Videos ---------- */
.elementor-widget-video .elementor-wrapper { aspect-ratio: 16 / 9; }
.elementor-widget-video iframe { width: 100%; height: 100%; border: 0; }

/* ---------- Formular ---------- */
.elementor-upload-field { cursor: pointer; }

/* ---------- 404 / Danke ---------- */
.tz-back-link { color: var(--e-global-color-primary, #50C5FF); text-decoration: underline; }

/* ---------- Hintergrund-Slideshow (ehemals Swiper) ---------- */
.tz-slideshow { overflow: hidden; }
.tz-slideshow .tz-slide { position: absolute; inset: 0; }
.tz-slideshow .tz-slide:not(:only-child) { opacity: 0; }
.tz-slideshow .tz-slide:first-child:not(:only-child) { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .tz-slideshow .tz-slide { animation: none !important; }
  .tz-slideshow .tz-slide:not(:first-child) { opacity: 0 !important; }
}

/* ---------- Footer-Menüs (statisch sichtbar) ---------- */
.tz-static-menu.elementor-nav-menu--dropdown.elementor-nav-menu__container { transform: none; max-height: none; overflow: visible; }

/* Schließen-Button über dem Off-Canvas halten */
body:has(#tz-nav-toggle:checked) header.elementor-location-header > .e-con { z-index: 10001; }
body:has(#tz-nav-toggle:checked) header.elementor-location-header .elementor-widget-theme-site-logo { visibility: hidden; }

/* ---------- Drawer-Steuerung ohne JS (Checkbox + Label) ---------- */
.tz-nav-checkbox { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.tz-nav-checkbox:focus-visible + .tz-menu-toggle { outline: 2px solid var(--e-global-color-primary, #50C5FF); outline-offset: 3px; }
.tz-menu-toggle { display: inline-flex; align-items: center; justify-content: center; }
.tz-offcanvas__backdrop { position: absolute; inset: 0; cursor: pointer; }
.tz-offcanvas__dialog { position: relative; z-index: 1; }

/* ---------- Home: H2 „Über uns – …“ (ehemalige Dachzeile entfernt) ---------- */
.elementor-15 .elementor-element.elementor-element-27d4622 { margin-top: 0; }

/* ---------- Untermenü: Einträge nicht abschneiden ---------- */
.elementor-nav-menu--main .elementor-nav-menu ul.sub-menu { width: auto; min-width: 12em; }
.elementor-nav-menu--main .elementor-sub-item { white-space: nowrap; }
.tz-offcanvas .elementor-sub-item { white-space: normal; overflow-wrap: anywhere; }

/* Cookie-Links ohne href (ProntoSite setzt den Link beim Ausliefern) */
a[data-ps^="cookie-"] { cursor: pointer; }

/* ---------- ProntoSite-Rechtstexte bündig mit H1 / Seitenraster ---------- */
.ps-legal { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }

/* ---------- Rechtstext-Seiten: Abstand H1 → Inhalt leicht reduziert ---------- */
.elementor-598 .elementor-element.elementor-element-573172e { --padding-bottom: 88px; }
@media (max-width: 767px) { .elementor-598 .elementor-element.elementor-element-573172e { --padding-bottom: 48px; } }
.ps-legal > section:first-of-type > :first-child,
.ps-legal > :first-child:not(style) { margin-top: 0 !important; }

/* ---------- Sanftes Scrollen zu Ankern („Mehr erfahren“ → #mehr) ---------- */
html { scroll-beh\61 vior: smooth; } /* = scroll-behavior; escaped, weil der PS-Sanitizer „behavior“ umschreibt */
@media (prefers-reduced-motion: reduce) { html { scroll-beh\61 vior: auto; } }

/* ---------- Rechtstexte: Zwischenüberschriften im Headline-Stil der Website ---------- */
body .ps-legal h2,
body .ps-legal h3 {
  font-family: var(--e-global-typography-22053e3-font-family, "Montserrat"), Sans-serif !important;
  font-size: var(--e-global-typography-22053e3-font-size) !important;
  font-weight: var(--e-global-typography-22053e3-font-weight, 500) !important;
  line-height: var(--e-global-typography-22053e3-line-height) !important;
  text-transform: var(--e-global-typography-22053e3-text-transform, uppercase) !important;
  color: var(--e-global-color-primary, #50C5FF) !important;
  margin: 40px 0 12px !important;
}
body .ps-legal > section:first-of-type > h2:first-child { margin-top: 0 !important; }