/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.1
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

/*
Zusammengeführt am 2026-09-22:
Zuvor lag das Custom-CSS an zwei Stellen gleichzeitig:
  1) WPBakery "Custom CSS"-Feld (wp-content/uploads/js_composer/custom.css)
  2) Diese Child-Theme-Datei (style.css)
Beide Inhalte sind jetzt hier in EINER Datei zusammengeführt, in der
gleichen relativen Reihenfolge wie bisher (WPBakery-Teil zuerst, dann
der bisherige Child-Theme-Teil) — das entspricht exakt der bisherigen
Lade-Reihenfolge auf der Live-Seite, damit sich an der Kaskade
(welche Regel bei Konflikten gewinnt) nichts ändert.

Dabei entfernt:
- Kompletter "Tesla-Style Mega Menu"-Block (.tesla-mega, .tesla-col-tiles,
  .tile-the-triple usw.) — per Live-Check bestätigt: keine passenden
  HTML-Elemente mehr auf der Seite vorhanden, reiner Alt-Code.
- Doppelt eingefügter Blocksatz-Block (war zweimal fast identisch
  vorhanden) — nur eine Kopie behalten.

Dabei geändert:
- In der Mega-Menü-Navigation (#site-navigation-wrap ... img.icon):
  object-fit von "cover" auf "contain" geändert, damit die
  Navigations-Vorschaubilder nicht mehr angeschnitten werden
  (Box-Größe 175x125px bleibt unverändert).

Bewusst NICHT angefasst (siehe Chat-Hinweis):
- #site-header wird in beiden Teilen unterschiedlich positioniert
  (WPBakery: position:relative für body.home / Child-Theme: position:sticky
  global). Das Child-Theme gewinnt aktuell durch die Ladereihenfolge —
  das ist hier unverändert erhalten, aber als Beobachtung dokumentiert.
- Die mehrfach gestaffelten @media(max-width:767px)-Blöcke für die
  Modell-Überschriften (h1.fp-brand / h3.fp-model-kicker) am Ende der
  WPBakery-Sektion sind funktional überlappend, aber nicht identisch.
  Nicht zusammengelegt, um keine Regression bei der mobilen Darstellung
  zu riskieren — eigenes Aufräumthema für später.
*/


/* =========================================================
   TEIL A — vormals WPBakery "Custom CSS"
   ========================================================= */

/* =========================================================
   FERTIG-PUMPTRACK — Zentrales Custom CSS
   OceanWP + WPBakery + WooCommerce + Staggs
   Bereinigt: Hero, Snap-Scroll, Responsive, Komponenten
   ========================================================= */


/* =========================================================
   1. VARIABLEN
   ========================================================= */

:root {
  --fp-blue: #436ddc;
  --fp-blue-hover: #3959ad;
  --fp-dark: #363d43;
  --fp-dark-hover: #c4caca;

  --fp-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.30),
               0 4px 6px -2px rgba(0, 0, 0, 0.15);

  --fp-shadow-hover: 0 20px 25px -5px rgba(0, 0, 0, 0.30),
                     0 10px 10px -5px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   2. GLOBALE FIXES
   ========================================================= */

/* WPBakery-Scroll-Fix ausschließlich auf Unterseiten */
body:not(.home) {
  position: static !important;
  height: auto !important;
  overflow-y: auto !important;
}

/* Links global ohne Unterstreichung */
a,
a:link,
a:visited,
a:hover,
a:active,
a:focus {
  text-decoration: none !important;
}

/* reCAPTCHA ausblenden */
.grecaptcha-badge {
  visibility: hidden !important;
  bottom: 8px !important;
  transform: scale(0.85) !important;
  transform-origin: right bottom !important;
}

/* Schatten-Hilfsklasse */
.schatten {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

/* CF7: neutrale Rückmeldung */
.wpcf7 form .wpcf7-response-output {
  border: 0 !important;
  color: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: transparent !important;
}

/* Kontaktformular: Nachricht */
.wpcf7[data-id="1126225"] .wpcf7-textarea {
  width: 100% !important;
  height: 200px !important;
  resize: vertical !important;
}


/* =========================================================
   3. HEADER & NAVIGATION
   ========================================================= */

#site-header,
#site-header-inner,
#site-navigation .sub-menu,
.dropdown-menu,
.mega-menu-row {
  background-color: #fff !important;
}

/* Header auf Startseite immer sichtbar halten */
body.home #site-header,
body.home #site-header-wrap {
  position: relative !important;
  z-index: 2147483647 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
}


/* =========================================================
   4. MEGA MENU
   ========================================================= */

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu {
  display: flex !important;
  flex-wrap: nowrap !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 16px !important;

  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 20px 24px !important;

  left: 50% !important;
  transform: translateX(-50%) !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu > li.menu-item {
  display: flex !important;
  flex-shrink: 0 !important;
  flex-direction: column !important;
  align-items: center !important;

  float: none !important;
  width: 175px !important;
  text-align: center !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu > li.menu-item > a.menu-link,
#site-navigation-wrap .dropdown-menu > li > ul.sub-menu .icon-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;

  min-width: 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu > li.menu-item > a.menu-link {
  height: auto !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu .icon-wrap {
  gap: 6px !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu img.icon {
  display: block !important;

  float: none !important;
  width: 175px !important;
  height: 125px !important;
  object-fit: contain !important;
  vertical-align: unset !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu .menu-text {
  display: block !important;
  margin-top: 6px !important;
  text-align: center !important;
}

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu .icon-wrap {
  height: 125px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* =========================================================
   5. STARTSEITE — SNAP SCROLL & LAYOUT
   ========================================================= */

.page-id-1746 .page-header {
  display: none !important;
}

body.home {
  overflow: hidden;
}

/* Standard-Container auf der Startseite neutralisieren */
body.home #content-wrap,
body.home #primary,
body.home #content,
body.home .entry,
body.home .site-content,
body.home article.single-page-article {
  margin: 0 !important;
  padding: 0 !important;
}

/* Der einzige Desktop-Scrollcontainer */
body.home #wrap {
  height: 100vh;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
  -webkit-overflow-scrolling: touch;
}

/* Jeder Modellbereich entspricht einer Viewport-Höhe */
body.home .snap-section {
  height: 100vh !important;
  min-height: 100vh !important;

  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  scroll-snap-align: start;
  scroll-snap-stop: always;
}

/* Von WPBakery erzeugte Leerzeilen entfernen */
body.home .vc_row-full-width.vc_clearfix {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.home .vc_row {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* WPBakery / OceanWP volle Breite */
body.home #content-wrap.container,
body.home .wpb-content-wrapper {
  width: 100vw !important;
  max-width: 100vw !important;
}

body.home #content-wrap.container {
  padding-right: 0 !important;
  padding-left: 0 !important;
}


/* =========================================================
   6. HERO — BASIS
   ========================================================= */

.fp-hero,
.home .fp-hero-video-only {
  position: relative;
  isolation: isolate;

  width: 100vw;
  min-height: 100vh;
  max-width: 100vw;

  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);

  overflow: hidden;
  border-radius: 0;
  background: #000;
}

.fp-hero {
  display: grid;
  place-items: center;
}

.home .fp-hero-video-only,
.home .fp-hero-video-only * {
  box-sizing: border-box;
}


/* =========================================================
   7. HERO — MEDIEN, VIDEO & OVERLAY
   ========================================================= */

.fp-hero__media,
.fp-hero__poster,
.fp-hero__video,
.fp-hero__overlay,
.home .fp-hero-video-only__poster,
.home .fp-hero-video-only__shade,
.home .fp-hero-video-only__video {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;
}

.fp-hero__poster,
.fp-hero__video,
.home .fp-hero-video-only__video {
  object-fit: cover;
  object-position: center center;
}

/* Klassischer Hero */
.fp-hero__poster {
  z-index: -3;
}

.fp-hero__video {
  z-index: -2;
}

.fp-hero__overlay {
  z-index: -1;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.28) 0%,
    rgba(0, 0, 0, 0.38) 40%,
    rgba(0, 0, 0, 0.52) 100%
  );
}

/* Video-only Hero der Startseite */
.home .fp-hero-video-only__video {
  z-index: 0;
  display: block;
  opacity: 0;
  background: #000;
  transition: opacity 0.5s ease;
}

.home .fp-hero-video-only__poster {
  z-index: 1;
  opacity: 1;
  background:
    center center / cover no-repeat
    url("https://www.fertig-pumptrack.de/wp-content/uploads/2026/07/Fertig-Pumptrack_Platzhalter_Video.jpg");
  transition: opacity 0.45s ease;
}

.home .fp-hero-video-only__shade {
  z-index: 2;
  opacity: 1;
  background: rgba(0, 0, 0, 0.18);
  transition: opacity 0.4s ease;
}

.home .fp-hero-video-only.is-ready .fp-hero-video-only__video {
  z-index: 3;
  opacity: 1;
}

.home .fp-hero-video-only.is-ready .fp-hero-video-only__poster,
.home .fp-hero-video-only.is-ready .fp-hero-video-only__shade {
  opacity: 0;
}


/* =========================================================
   8. HERO — INHALT
   ========================================================= */

.fp-hero__content {
  position: relative;
  z-index: 2;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;

  width: min(100% - 32px, 980px);
  margin: 0 auto;
  padding: clamp(24px, 5vw, 64px);

  text-align: center;
}

.fp-hero__eyebrow {
  margin: 0;

  color: #c4caca;
  font-size: clamp(14px, 1.3vw, 18px);
  line-height: 1.2;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.fp-hero__title {
  max-width: 10ch;
  margin: 0;

  color: #fff;
  font-size: clamp(40px, 8vw, 96px);
  line-height: 0.98;
  text-wrap: balance;
}

.fp-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;

  margin-top: 10px;
}

.fp-hero__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 52px;
  padding: 14px 24px;

  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;

  transition:
    transform 0.2s ease,
    opacity 0.2s ease,
    background-color 0.2s ease;
}

.fp-hero__btn:hover {
  transform: translateY(-1px);
}

.fp-hero__btn--primary,
.fp-hero__btn--secondary {
  color: var(--fp-dark);
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(6px);
}


/* =========================================================
   9. HERO — OCEANWP / WPBAKERY WRAPPER-FIXES
   ========================================================= */

.home #primary,
.home #content,
.home .content-area,
.home .site-content,
.home .container,
.home .elementor-section .elementor-container,
.home .vc_row,
.home .wpb_row,
.home .vc_column_container,
.home .wpb_column {
  overflow: visible;
}

/* Wrapper des Video-Hero */
.home .fp-hero-wrapper,
.home .fp-hero-row,
.home .fp-hero-row .wpb_wrapper,
.home .fp-hero-row .vc_column-inner,
.home .fp-hero-row .wpb_wrapper > .fp-hero,
.home .fp-hero-video-only-wrapper,
.home .fp-hero-video-only-row,
.home .fp-hero-video-only-row .wpb_wrapper,
.home .fp-hero-video-only-row .vc_column-inner {
  width: 100% !important;
  max-width: none !important;

  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.home .fp-hero-video-only-wrapper {
  width: 100vw;
  max-width: 100vw;

  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 0 !important;
}

/* Moderne Browser: Elterncontainer des Hero vollständig öffnen */
.home .content-area:has(.fp-hero),
.home #primary:has(.fp-hero),
.home .content-area:has(.fp-hero-video-only),
.home #primary:has(.fp-hero-video-only) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
   10. MODELLSEKTIONEN — TYPOGRAFIE
   ========================================================= */

/* WPBakery-Container */
body.home .snap-section .wpb_wrapper,
body.home .snap-section .vc_custom_heading,
body.home .snap-section .vc_column-inner,
body.home .snap-section .vc_column_container {
  text-align: center !important;
}

/* Abstände aus WPBakery-Headings entfernen */
body.home .snap-section .wpb_wrapper > .vc_custom_heading,
body.home .snap-section .wpb_text_column .vc_custom_heading,
body.home .snap-section .vc_column-inner .vc_custom_heading {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Kicker / Markenzeile */
body.home .snap-section h3,
body.home .snap-section h3.vc_custom_heading,
body.home .snap-section h3.fp-brand,
body.home .snap-section h3.fp-model,
body.home .snap-section .fp-model-kicker {
  display: block !important;

  width: 100% !important;
  margin: 0 0 0.09em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  opacity: 0.88;
  font-size: clamp(1.85rem, 1.4vw + 0.75rem, 2.4rem) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-wrap: balance;
}

/* Modellname */
body.home .snap-section h1,
body.home .snap-section h1.vc_custom_heading,
body.home .snap-section h1.fp-brand,
body.home .snap-section h1.fp-model-title,
body.home .snap-section h1.fp-kicker,
body.home .snap-section .fp-model-title {
  position: static !important;
  right: auto !important;
  left: auto !important;

  display: block !important;

  width: 100% !important;
  max-width: 11ch !important;
  margin: 0 auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  font-size: clamp(2.4rem, 5.8vw, 6.2rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.015em !important;
  text-align: center !important;
  text-wrap: balance;

  transform: none !important;
}

/* CTA-Text und Beschreibungen */
body.home .snap-section p,
body.home .snap-section .wpb_text_column p {
  font-size: clamp(0.875rem, 2vw, 1.1rem) !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

/* Manuelle Zentrierungs-Hilfsklasse */
.text-center,
.text-center * {
  text-align: center !important;
}

/* Sehr große Desktopansichten */
@media (min-width: 1200px) {
  body.home .snap-section h3,
  body.home .snap-section h3.vc_custom_heading,
  body.home .snap-section .fp-model-kicker {
    margin-bottom: 0.2em !important;
    font-size: 2.5rem !important;
    line-height: 1.08 !important;
  }

  body.home .snap-section h1,
  body.home .snap-section h1.vc_custom_heading,
  body.home .snap-section h1.fp-brand,
  body.home .snap-section h1.fp-model-title,
  body.home .snap-section h1.fp-kicker,
  body.home .snap-section .fp-model-title {
    max-width: 10ch !important;
    font-size: 6rem !important;
    line-height: 0.96 !important;
  }
}

/* Tablet */
@media (max-width: 1024px) {
  body.home .snap-section h3,
  body.home .snap-section h3.vc_custom_heading,
  body.home .snap-section .fp-model-kicker {
    margin-bottom: 0.18em !important;
    font-size: 1rem !important;
    line-height: 1.1 !important;
  }

  body.home .snap-section h1,
  body.home .snap-section h1.vc_custom_heading,
  body.home .snap-section h1.fp-brand,
  body.home .snap-section h1.fp-model-title,
  body.home .snap-section h1.fp-kicker,
  body.home .snap-section .fp-model-title {
    max-width: 11ch !important;
    font-size: clamp(2.5rem, 7vw, 4.6rem) !important;
    line-height: 0.99 !important;
    letter-spacing: -0.012em !important;
  }
}


/* =========================================================
   11. SNAP DOTS
   ========================================================= */

.snap-dots {
  position: fixed;
  z-index: 9999;
  top: 50%;
  right: 20px;

  display: flex;
  flex-direction: column;
  gap: 10px;

  transform: translateY(-50%);
}

.snap-dots span {
  display: block;

  width: 10px;
  height: 10px;

  cursor: pointer;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  transition: background 0.3s ease;
}

.snap-dots span.active {
  background: #fff;
}


/* =========================================================
   12. BUTTONS & CF7-SUBMIT
   ========================================================= */

/* WPBakery-Button-Wrapper */
.btn-lg,
.btn-lg-2 {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Gemeinsame Button-Basis */
.btn-lg a,
.btn-lg .vc_btn3,
.btn-lg button,
.btn-lg-2 a,
.btn-lg-2 .vc_btn3,
.btn-lg-2 button,
.wpcf7 input[type="submit"],
form.wpcf7-form input.wpcf7-submit {
  display: inline-block !important;

  min-width: 160px !important;
  padding: 16px 32px !important;

  border: 0 !important;
  border-radius: 5px !important;
  box-shadow: var(--fp-shadow) !important;

  font-size: 16px !important;
  font-weight: 400 !important;
  text-align: center !important;
  text-transform: none !important;

  transition: all 0.3s ease !important;
}

/* Sekundär: Mehr Informationen */
.btn-lg a,
.btn-lg .vc_btn3,
.btn-lg button {
  color: #fff !important;
  background-color: var(--fp-dark-hover) !important;
}

.btn-lg a:hover,
.btn-lg .vc_btn3:hover,
.btn-lg button:hover {
  background-color: #c0c0c0 !important;
  box-shadow: var(--fp-shadow-hover) !important;
  transform: translateY(-2px) !important;
}

/* Primär: Angebot anfordern */
.btn-lg-2 a,
.btn-lg-2 .vc_btn3,
.btn-lg-2 button,
.wpcf7 input[type="submit"],
form.wpcf7-form input.wpcf7-submit {
  cursor: pointer !important;
  color: #fff !important;
  background-color: var(--fp-blue) !important;
}

.btn-lg-2 a:hover,
.btn-lg-2 .vc_btn3:hover,
.btn-lg-2 button:hover,
.wpcf7 input[type="submit"]:hover,
form.wpcf7-form input.wpcf7-submit:hover {
  color: #fff !important;
  background-color: var(--fp-blue-hover) !important;
  box-shadow: var(--fp-shadow-hover) !important;
  transform: translateY(-2px) !important;
}


/* =========================================================
   13. SICHTBARKEIT & MOBILE REIHENFOLGE
   ========================================================= */

@media (max-width: 767px) {
  .vc_row.hide-mobile,
  .wpb_row.hide-mobile,
  .hide-mobile {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .vc_row.hide-desktop,
  .wpb_row.hide-desktop,
  .hide-desktop {
    display: none !important;
    margin-bottom: -22px !important;
  }
}

@media (max-width: 768px) {
  .swap-on-mobile.vc_row {
    display: flex !important;
    flex-direction: column-reverse !important;
  }

  .swap-on-mobile.vc_row > .wpb_column {
    width: 100% !important;
  }
}


/* =========================================================
   14. KARUSSELL & MEDIEN
   ========================================================= */

.wpb_images_carousel .vc_item .vc_inner,
.wpb_images_carousel .vc_item .vc_inner > a,
.wpb_images_carousel .vc_item .vc_inner img {
  overflow: hidden !important;
  border-radius: 5px !important;
}

.wpb_images_carousel .vc_item .vc_inner > a {
  display: block;
}

.wpb_images_carousel .vc_item .vc_inner img {
  display: block;
  width: 100%;
  height: 100%;
}

/* Rechter Carousel-Pfeil sichtbar */
.vc_images_carousel .vc_right.vc_carousel-control {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Peek Carousel */
.peek-carousel {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.peek-carousel .vc_col-sm-12,
.peek-carousel .wpb_wrapper,
.peek-carousel .wpb_images_carousel {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

.peek-carousel .vc_carousel-slideline {
  overflow: visible !important;
}

.peek-carousel .vc_row-fluid {
  max-width: 100vw !important;
  margin-right: calc(-50vw + 50%) !important;
  margin-left: calc(-50vw + 50%) !important;
}

.peek-carousel .vc_carousel-slideline-inner .vc_item,
.peek-carousel .vc_carousel-slideline-inner .vc_item a,
.peek-carousel .vc_carousel-slideline-inner .vc_item img {
  height: 480px !important;
}

.peek-carousel .vc_carousel-slideline-inner .vc_item {
  overflow: hidden !important;
}

.peek-carousel .vc_carousel-slideline-inner .vc_item a,
.peek-carousel .vc_carousel-slideline-inner .vc_item img {
  display: block !important;
  width: 100% !important;

  object-fit: cover !important;
  object-position: center !important;
}

.peek-carousel .slick-slide {
  opacity: 0.5;
  transform: scale(0.95);
  transition: all 0.3s ease;
}

.peek-carousel .slick-center {
  opacity: 1 !important;
  transform: scale(1) !important;
}


/* =========================================================
   15. POPUP MAKER
   ========================================================= */

.pum-container .pum-content,
.pum-container .pum-content p,
.pum-container .pum-content li,
.pum-container .pum-content span {
  line-height: 1.6;
}

.pum-container .pum-content p,
.pum-container .pum-content li,
.pum-container .pum-content span {
  margin-bottom: 0.8em;
}

.pum-container .pum-content h1,
.pum-container .pum-content h2,
.pum-container .pum-content h3,
.pum-container .pum-content h4 {
  margin-bottom: 0.6em;
  line-height: 1.3;
}


/* =========================================================
   16. LVCA & STAGGS
   ========================================================= */

/* Features-Seite */
.lvca-heading {
  width: 100%;
  max-width: 100%;
}

/* Staggs: Markenschrift */
.staggs-product-form .staggs-attribute-name,
.staggs-product-form .staggs-product-title,
.staggs-share-configuration span,
.staggs-product-form label,
.stg-product-title,
.stg-attribute-title {
  font-family: Impact, sans-serif !important;
  font-style: italic !important;
}

/* LVCA-Texte linksbündig und sauber umbrechen */
.lvca-heading p.lvca-text,
.lvca-heading .lvca-title,
.lvca-alignleft p.lvca-text,
.lvca-alignleft .lvca-title,
.lvca-alignright p.lvca-text,
.lvca-alignright .lvca-title,
.lvca-aligncenter p.lvca-text,
.lvca-aligncenter .lvca-title,
.option-group-panel,
.option-group-panel--panel,
.option-group-panel-content {
  text-align: left !important;
}

.lvca-heading p.lvca-text,
.lvca-heading .lvca-title,
.lvca-alignleft p.lvca-text,
.lvca-alignleft .lvca-title,
.lvca-alignright p.lvca-text,
.lvca-alignright .lvca-title,
.lvca-aligncenter p.lvca-text,
.lvca-aligncenter .lvca-title,
.option-group-panel-content p {
  overflow-wrap: break-word;
  word-spacing: -0.05em;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
}

.option-group-panel-content p {
  text-align: justify !important;
  line-height: 1.7;
}

.option-group-panel-content ul,
.option-group-panel-content ul li {
  padding-left: 1.5em;
  list-style-position: outside;
  text-align: left !important;
}


/* =========================================================
   17. COUNTERS
   ========================================================= */

.ctrbCounters {
  align-items: stretch !important;
  min-height: 240px !important;
}

.ctrbCounters > * {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

.counter {
  justify-content: space-between !important;
  padding: 1rem !important;
}

.counterLabel,
.ctrbCounters .counterLabel {
  display: flex !important;
  flex-grow: 1 !important;
  align-items: flex-end !important;
  justify-content: center !important;

  min-height: 4rem !important;
  margin-top: -0.5rem !important;
  padding-top: 0 !important;
}

.ctrbCounters .counterNumber {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}


/* =========================================================
   18. GUTSCHEIN-KONTAKTFORMULAR
   ========================================================= */

#gutschein-liste {
  width: 100%;
  max-width: 900px;
  margin-right: auto !important;
  margin-left: auto !important;
}

#gutschein-liste > .bit-iconic-list {
  display: block !important;

  float: none !important;
  clear: both !important;

  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#gutschein-liste > .bit-iconic-list + .bit-iconic-list {
  margin-top: 4px !important;
}

#gutschein-liste .bit-iconic-list-item,
#gutschein-liste .bit-iconic-list-inner,
#gutschein-liste .bit-iconic-list-content,
#gutschein-liste h4 {
  min-height: 0 !important;
  height: auto !important;
  margin: 4px !important;
  padding: 0 !important;
}

#gutschein-liste h4 {
  line-height: 1.5 !important;
}

#gutschein-liste p:empty {
  display: none !important;
}


/* =========================================================
   19. DILESCO / LVCA-TITEL
   ========================================================= */

.fp-dilesco-block {
  max-width: 900px;
}

.lvca-title,
.fp-dilesco-block .lvca-title {
  margin: 0 0 18px !important;

  font-family: inherit !important;
  font-size: clamp(18px, 4vw, 26px) !important;
  font-weight: 400 !important;
  font-variant-caps: normal !important;
  font-feature-settings: normal !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.lvca-text,
.fp-dilesco-block .lvca-text {
  margin: 0 !important;

  font-family: inherit !important;
  font-size: clamp(14px, 1.8vw, 16px) !important;
  font-variant-caps: normal !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.fp-brand-word {
  white-space: nowrap !important;
  letter-spacing: -0.01em !important;
}



/* =========================================================
   20. MOBIL
   ========================================================= */

@media (max-width: 767px) {

  /* Kein Snap-Scroll auf Smartphones */
  body.home {
    overflow: visible;
  }

  body.home #wrap {
    height: auto;
    overflow-y: auto !important;
    scroll-snap-type: none !important;
  }

  body.home .snap-section {
   height: 100svh !important;
  min-height: 100svh !important;
  }

  /* Mobile Footer darf nie über dem Inhalt liegen */
  #wrap,
  #main,
  #footer,
  #footer-bottom,
  .site-footer {
    position: relative !important;
    transform: none !important;
  }

  #footer,
  #footer-bottom,
  .site-footer {
    z-index: 1 !important;
    top: auto !important;
    bottom: auto !important;
    clear: both !important;
    margin-top: 0 !important;
  }

  .home #content,
  .home .content-area,
  .home .site-content,
  .home .oceanwp-row {
    position: relative;
    z-index: 2;
  }

  /* Hero-Video */
  .fp-hero,
  .home .fp-hero-video-only {
    min-height: 78vh;
  }

  .fp-hero__content {
    gap: 12px;
    width: min(100% - 24px, 560px);
    padding: 24px 16px 32px;
  }

  .fp-hero__title {
    max-width: 12ch;
    font-size: clamp(34px, 11vw, 56px);
  }

  .fp-hero__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
  }

  .fp-hero__btn {
    width: min(100%, 320px);
  }

  /* =======================================================
     MODELL-HEADLINES
     ======================================================= */

  /* Kleine Zeile: FERTIG-PUMPTRACK */
  body.home .snap-section h3,
  body.home .snap-section h3.vc_custom_heading,
  body.home .snap-section h3.fp-brand,
  body.home .snap-section h3.fp-model,
  body.home .snap-section .fp-model-kicker {
    position: static !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;

    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto 0.12em !important;
    padding: 0 !important;

    opacity: 0.9;
    font-size: 1.25rem !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

/* Große Modellzeile: 4FUN, MOTORIK SCHULE usw. */
body.home .snap-section h1,
body.home .snap-section h1.vc_custom_heading,
body.home .snap-section h1.fp-brand,
body.home .snap-section h1.fp-model-title,
body.home .snap-section h1.fp-kicker,
body.home .snap-section .fp-model-title {
  position: static !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;

  display: block !important;
  width: calc(100% - 32px) !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 16px !important;

  box-sizing: border-box !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;

  font-size: clamp(2.25rem, 9vw, 3.2rem) !important;
  line-height: 0.92 !important;
  letter-spacing: -0.015em !important;
  text-align: center !important;
  text-wrap: balance !important;
}
  /* WPBakery-Spalten auf Mobil stapeln */
  body.home .snap-section .vc_row .vc_col-sm-6,
  body.home .snap-section .vc_row .vc_col-sm-4,
  body.home .snap-section .vc_row .vc_col-sm-3 {
    float: none !important;
    width: 100% !important;
  }

  body.home .snap-section .vc_column_container > .vc_column-inner {
    padding: 20px !important;
  }

  body.home .snap-section img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Carousel etwas niedriger */
  .peek-carousel .vc_carousel-slideline-inner .vc_item,
  .peek-carousel .vc_carousel-slideline-inner .vc_item a,
  .peek-carousel .vc_carousel-slideline-inner .vc_item img {
    height: 320px !important;
  }

  /* Dots weiter an den Rand */
  .snap-dots {
    right: 12px;
    gap: 8px;
  }
}


/* =========================================================
   KLEINE SMARTPHONES
   ========================================================= */

@media (max-width: 480px) {

  /* Kleine Zeile: FERTIG-PUMPTRACK */
  body.home .snap-section h3,
  body.home .snap-section h3.vc_custom_heading,
  body.home .snap-section h3.fp-brand,
  body.home .snap-section h3.fp-model,
  body.home .snap-section .fp-model-kicker {
    margin-bottom: 0.14em !important;
    font-size: 1.15rem !important;
    line-height: 1.04 !important;
  }

/* Modellname */
body.home .snap-section h1,
body.home .snap-section h1.vc_custom_heading,
body.home .snap-section h1.fp-brand,
body.home .snap-section h1.fp-model-title,
body.home .snap-section h1.fp-kicker,
body.home .snap-section .fp-model-title {
  width: calc(100% - 24px) !important;
  max-width: 100% !important;
  padding: 0 12px !important;

  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;

  font-size: clamp(2.1rem, 9vw, 2.85rem) !important;
  line-height: 0.93 !important;
  letter-spacing: -0.012em !important;
}

  /* WPBakery-Spalten stapeln */
  body.home .snap-section .vc_row .vc_col-sm-6,
  body.home .snap-section .vc_row .vc_col-sm-4,
  body.home .snap-section .vc_row .vc_col-sm-3 {
    float: none !important;
    width: 100% !important;
  }

  body.home .snap-section .vc_column_container > .vc_column-inner {
    padding: 20px !important;
  }

  body.home .snap-section img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Carousel etwas niedriger */
  .peek-carousel .vc_carousel-slideline-inner .vc_item,
  .peek-carousel .vc_carousel-slideline-inner .vc_item a,
  .peek-carousel .vc_carousel-slideline-inner .vc_item img {
    height: 320px !important;
  }

  /* Dots weiter an den Rand */
  .snap-dots {
    right: 12px;
    gap: 8px;
  }
}


/* Kleine Smartphones */
@media (max-width: 480px) {
  body.home .snap-section h3,
  body.home .snap-section h3.vc_custom_heading,
  body.home .snap-section .fp-model-kicker {
    margin-bottom: 0.2em !important;
    font-size: 0.95rem !important;
    line-height: 1.08 !important;
  }

  body.home .snap-section h1,
  body.home .snap-section h1.vc_custom_heading,
  body.home .snap-section h1.fp-brand,
  body.home .snap-section h1.fp-model-title,
  body.home .snap-section h1.fp-kicker,
  body.home .snap-section .fp-model-title {
    max-width: calc(100vw - 24px) !important;

    padding-right: 12px !important;
    padding-left: 12px !important;

    font-size: 1.95rem !important;
    line-height: 1 !important;
    letter-spacing: -0.008em !important;
  }
}


/* =========================================================
   21. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .fp-hero__video {
    display: none;
  }

  .home .fp-hero-video-only__video {
    animation: none;
  }

  .fp-hero__btn,
  .home .fp-hero-video-only__video,
  .home .fp-hero-video-only__poster,
  .home .fp-hero-video-only__shade {
    transition: none;
  }
}

/* =========================================================
   MOBILE: Normaler Seitenfluss der Startseite
   Footer folgt nach dem gesamten Inhalt
   ========================================================= */

@media (max-width: 767px) {

  /* Kein eigener Viewport-Scrollcontainer auf Smartphones */
  body.home {
    overflow: visible !important;
  }

  body.home #wrap {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    overscroll-behavior-y: auto !important;
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
    -webkit-overflow-scrolling: auto !important;
  }

  /* Modellbereiche normal untereinander ausgeben */
  body.home .snap-section {
    display: block !important;
  height: 100svh !important;
min-height: 100svh !important;
  }

  /* Erste Video-Section behält ihre mobile Mindesthöhe */
  body.home .video-hero-row,
  body.home .video-hero-row > .vc_column_container,
  body.home .video-hero-row .vc_column-inner,
  body.home .video-hero-row .wpb_wrapper,
  body.home .fp-hero-video-only {
    min-height: 78svh !important;
    min-height: 78vh !important;
  }

  /*
   * Kein position: fixed/absolute für den Footer erzwingen.
   * OceanWP verwaltet die Footer-Position im normalen Dokumentfluss.
   */
  body.home #footer,
  body.home #footer-bottom,
  body.home .site-footer {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    clear: both !important;
    transform: none !important;
  }
}
/* ^ Fehlende schließende Klammer ergänzt (2026-09-22): schließt den
     @media(max-width:767px)-Block "MOBILE: Normaler Seitenfluss".
     Ohne sie war der nächste @media-Block unbeabsichtigt darin
     verschachtelt (siehe Chat-Hinweis). */


/* =========================================================
   FINAL — MOBILE MODELL-HEADLINES, OHNE ABSCHNEIDEN
   ========================================================= */

@media (max-width: 767px) {

  /* Kicker: FERTIG-PUMPTRACK */
  body.home .snap-section h3.fp-brand,
  body.home .snap-section h3.fp-model,
  body.home .snap-section h3.fp-model-kicker,
  body.home .snap-section .fp-model-kicker {
    position: static !important;
    display: block !important;
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 0.16em !important;
    padding: 0 16px !important;

    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: normal !important;

    font-size: 1.2rem !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  /* Modellname: 4FUN, ROLLPARK, MOTORIK SCHULE usw. */
  body.home .snap-section h1.fp-brand,
  body.home .snap-section h1.fp-kicker,
  body.home .snap-section h1.fp-model-title,
  body.home .snap-section .fp-model-title {
    position: static !important;
    display: block !important;
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 16px !important;

    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: auto !important;
    -webkit-hyphens: auto !important;

    font-size: clamp(2rem, 9vw, 2.7rem) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.015em !important;
    text-align: center !important;
    text-wrap: balance !important;
  }
}

@media (max-width: 480px) {
  body.home .snap-section h3.fp-brand,
  body.home .snap-section h3.fp-model,
  body.home .snap-section h3.fp-model-kicker,
  body.home .snap-section .fp-model-kicker {
    padding-right: 12px !important;
    padding-left: 12px !important;
    font-size: 1.1rem !important;
  }

  body.home .snap-section h1.fp-brand,
  body.home .snap-section h1.fp-kicker,
  body.home .snap-section h1.fp-model-title,
  body.home .snap-section .fp-model-title {
    padding-right: 12px !important;
    padding-left: 12px !important;
    font-size: clamp(1.85rem, 8.8vw, 2.35rem) !important;
    line-height: 0.96 !important;
  }
}
/* =========================================================
   STARTSEITE MOBIL — FOOTER NACH #main ERZWINGEN
   Gegen Ocean Sticky Footer / osf-footer
   ========================================================= */

@media (max-width: 767px) {

  /* #wrap enthält: Header, #main, Footer.
     Mobile normal im Dokumentfluss untereinander anordnen. */
  body.home #wrap {
    display: flex !important;
    flex-direction: column !important;

    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;

    scroll-snap-type: none !important;
    scroll-behavior: auto !important;
  }

  /* Der vollständige Seiteninhalt kommt zwingend vor dem Footer */
  body.home #main {
    display: block !important;
    position: relative !important;
    order: 1 !important;
    flex: 0 0 auto !important;

    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /* Footer nach #main, niemals als Overlay */
  html body.home.osf-footer #wrap > #footer.site-footer,
  html body.home #wrap > #footer.site-footer {
    position: relative !important;
    order: 2 !important;
    flex: 0 0 auto !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;

    opacity: 1 !important;
    transform: none !important;
    z-index: auto !important;
  }
}
/* ^ Fehlende schließende Klammer ergänzt (2026-09-22): schließt den
     @media(max-width:767px)-Block "STARTSEITE MOBIL — FOOTER NACH
     #main ERZWINGEN". Gleiches Muster wie oben. */


/* =========================================================
   NUR MOBIL — MODELL-SCHRIFT GRÖSSER, KEINE WPBAKERY-GAPS
   ========================================================= */

@media (max-width: 767px) {

  /* WPBakery-Leer-Div direkt nach jeder Modell-Section entfernen */
  body.home .snap-section + .vc_row-full-width.vc_clearfix {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* FERTIG-PUMPTRACK */
  body.home .snap-section h3.fp-brand.fp-model-kicker {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 0.16em !important;
    padding: 0 16px !important;

    font-size: clamp(1.3rem, 5.5vw, 1.55rem) !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  /* MODEL O PLUS, ROLLPARK KOMBI PAKET usw. */
  body.home .snap-section h1.fp-brand.fp-kicker {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 16px !important;

    overflow: visible !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;

    font-size: clamp(2.45rem, 11vw, 3.35rem) !important;
    line-height: 0.92 !important;
    letter-spacing: -0.02em !important;
    text-align: center !important;
    text-wrap: balance !important;
  }
}

@media (max-width: 480px) {
  body.home .snap-section h3.fp-brand.fp-model-kicker {
    padding-right: 12px !important;
    padding-left: 12px !important;
    font-size: 1.25rem !important;
  }

  body.home .snap-section h1.fp-brand.fp-kicker {
    padding-right: 12px !important;
    padding-left: 12px !important;
    font-size: clamp(2.2rem, 10.5vw, 2.85rem) !important;
    line-height: 0.94 !important;
  }
}

/* =========================================================
   MOBIL — WEISSE FLÄCHEN ZWISCHEN SNAP-SEKTIONEN ENTFERNEN
   ========================================================= */

@media (max-width: 767px) {
  body.home .wpb-content-wrapper > .vc_row-full-width.vc_clearfix {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    clear: none !important;
  }
}

body.home .snap-section {
  min-height: 100dvh !important;
  height: 100dvh !important;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

body.home .snap-section + .vc_row-full-width.vc_clearfix {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
   TEIL B — vormals Child-Theme style.css (eigener Inhalt)
   ========================================================= */

/* Smooth Scroll + Scroll-Snap (Basis) */

html {
  scroll-behavior: smooth;
}


/* Button Hover-Effekt */

.vc_general.vc_btn {
  transition: all 0.3s ease;
}

.vc_general.vc_btn:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}


/* Responsive: Desktop Menü, Mobile Hamburger */

@media (min-width: 960px){
  #site-navigation-wrap{ display: flex !important; }
  .oceanwp-mobile-menu-icon{ display: none !important; }
}
@media (max-width: 959px){
  #site-navigation-wrap{ display: none !important; }
  .oceanwp-mobile-menu-icon{ display: block !important; margin-left: auto !important; }
}


/* OceanWP Standard-Navigation sichtbar + Tesla-Style + Offset-Fix */


/* Header immer oben & sauber */

#site-header,
.site-header{
  position: sticky !important;
  top: 0 !important;
  z-index: 999999 !important;
  background: rgba(255,255,255,.92) !important;
  -webkit-backdrop-filter: saturate(180%) blur(10px);
  backdrop-filter: saturate(180%) blur(10px);
}


/* Layout: Logo links, Menü mittig */

#site-header-inner{
  display: flex !important;
  align-items: center !important;
  padding: 0 24px !important;
}

#site-logo{ flex: 0 0 auto !important; }

#site-navigation-wrap{
  flex: 1 1 auto !important;
  justify-content: center !important;
}


/* Desktop-Menü als Inline-Flex */

#site-navigation-wrap > ul.dropdown-menu{
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
}


/* Link-Optik (OceanWP setzt oft line-height 104px bzw. 30px im shrink) */

#site-navigation-wrap .dropdown-menu > li > a,
.is-sticky #site-navigation-wrap .dropdown-menu > li > a{
  padding: 0 10px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #111 !important;
}


/* Scroll-Snap (sauber mit Sticky Header) */

html{
  scroll-snap-type: y proximity;
  scroll-padding-top: calc(64px + var(--wp-admin--admin-bar--height, 0px));
}

.vc_row{
  scroll-snap-align: start;
  scroll-margin-top: calc(64px + var(--wp-admin--admin-bar--height, 0px));
  scroll-snap-stop: normal;
}


/* Dropdown nur bei echtem Hover/Fokus – kein "Ghost Hover" unter dem Menü */

#site-navigation-wrap .dropdown-menu > li {
  position: relative;
}


/* Anpassungen Header */

:root { --headerH: 104px; }

#site-header-inner{
  height: var(--headerH) !important;
}

/* Menülinks vertikal zentrieren */

#site-navigation-wrap .dropdown-menu > li > a{
  line-height: var(--headerH) !important;
}

/* Sticky Shrink neutralisieren (OceanWP setzt sonst z.B. 30px) */

.is-sticky #site-header.shrink-header #site-header-inner,
.is-sticky .site-header.shrink-header #site-header-inner{
  height: var(--headerH) !important;
}
.is-sticky #site-navigation-wrap .dropdown-menu > li > a{
  line-height: var(--headerH) !important;
}

/* Logo max-height passend */

#site-logo #site-logo-inner a img{
  max-height: calc(var(--headerH) - 8px) !important;
}


/* Weißer Streifen direkt unter dem Header */

#main,
#content-wrap,
#primary {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@media (min-width: 960px) {
  #site-navigation-wrap li.mega-modelle > ul.sub-menu{
    display: flex !important;
    gap: 24px;
    padding: 24px !important;
    overflow: visible !important;
  }
  #site-navigation-wrap li.mega-modelle > ul.sub-menu > li{
    width: 170px;
  }
  #site-navigation-wrap li.mega-modelle ul.sub-menu li ul.sub-menu{
    display: block !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    transform: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
  }
  #site-navigation-wrap li.mega-modelle ul.sub-menu li ul.sub-menu a{
    display: block;
    text-align: center;
    padding: 6px 0 !important;
  }
}

@media (min-width: 960px){
  #site-navigation-wrap ul.sub-menu{
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (min-width: 960px){
  #site-navigation-wrap li#menu-item-1197 > ul.sub-menu{
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* Dropdown/Mega-Menü Panel: nicht transparent */

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu{
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

/* Logo immer über Dropdown */

#site-logo{
  position: relative;
  z-index: 10050;
}

#site-navigation-wrap{
  position: relative;
  z-index: 10000;
}


/* Top Bar standardmäßig verstecken */

#top-bar-sticky-wrapper.oceanwp-sticky-top-bar-holder #top-bar-wrap{
  display: none;
}

/* …und erst bei Sticky/Scroll anzeigen */

#top-bar-sticky-wrapper.oceanwp-sticky-top-bar-holder.is-sticky #top-bar-wrap{
  display: block;
}


/* Features Seite Kacheln */

.image-text-overlay {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 5px;
  cursor: pointer;
}

.image-text-overlay .overlay-image {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.35s ease;
}

.image-text-overlay:hover .overlay-image {
  transform: scale(1.05);
}

.image-text-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 60%);
  z-index: 1;
  pointer-events: none;
  transition: background 0.3s ease;
}

.image-text-overlay:hover::before {
  background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,0) 60%);
}

.image-text-overlay .overlay-text {
  position: absolute;
  left: 18px;
  bottom: 18px;
  z-index: 2;
  color: #c4caca;
}

.image-text-overlay .overlay-text h3 {
  margin: 0;
  color: #c4caca;
}

.image-text-overlay .overlay-btn {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 3;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 0;
  background: #436ddc;
  color: #ffffff;
  font-size: 28px;
  line-height: 1px;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease, background 0.3s ease;
}

.image-text-overlay:hover .overlay-btn {
  transform: rotate(90deg) scale(1.1);
  background: #2f52b0;
}


/* Nur die 2. Ebene (Dropdown-Panel) verstecken – NICHT alle sub-menus */

#site-navigation-wrap .dropdown-menu > li > ul.sub-menu{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
}

/* 2. Ebene nur bei Hover/Fokus zeigen */

#site-navigation-wrap .dropdown-menu > li:hover > ul.sub-menu,
#site-navigation-wrap .dropdown-menu > li:focus-within > ul.sub-menu{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition-delay: 0s;
}

/* 3. Ebene unter jedem Modell IM Mega-Menü immer sichtbar */

@media (min-width: 960px){
  #site-navigation-wrap li#menu-item-1197 > ul.sub-menu > li > ul.sub-menu{
    display: flex !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }
}

/* Unteren Menü-Text unter Icons ausrichten */

@media (min-width: 960px) {
  #site-navigation-wrap .dropdown-menu > li > a .icon-wrap{
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 90px;
    line-height: 0;
  }
  #site-navigation-wrap .dropdown-menu > li > a .icon-wrap img{
    display: block;
    max-height: 90px;
    width: auto;
  }
  #site-navigation-wrap .dropdown-menu > li > a .menu-text{
    display: block;
    text-align: center;
    margin-top: 6px;
  }
}

/* Angebotsanfrage Kontaktformular */

.staggs-quote-form-wrapper .wpcf7-form p{
  margin: 0 0 14px;
}

.staggs-quote-form-wrapper .wpcf7-form input.wpcf7-submit{
  width: 100%;
  padding: 14px 18px;
  border-radius: 10px;
  cursor: pointer;
}

.staggs-quote-form-wrapper{
  margin-top: 16px;
}

/* Akzentfarben zentral */
:root{
  --fp-accent: #363d43;
  --fp-accent-hover: #c4caca;
}

/* Button */

.staggs-quote-form-wrapper input.wpcf7-submit{
  background: var(--fp-accent);
  color: #fff;
  border: 1px solid var(--fp-accent);
  padding: 14px 18px;
  border-radius: 10px;
  font-weight: 800;
}

.staggs-quote-form-wrapper input.wpcf7-submit:hover,
.staggs-quote-form-wrapper input.wpcf7-submit:focus{
  background: var(--fp-accent-hover);
  border-color: var(--fp-accent-hover);
}

/* Icon-Liste: Farbe + Größe */

.oceanwp-icon-list-item i {
  color: #333;
  font-size: 18px;
}


/* === FLOATING SIDE TAB – NUR RECHTS === */

.side-tab--right {
    position: fixed !important;
    z-index: 999999 !important;
    top: 40% !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(-50%) translateX(0) !important;

    background-color: #436ddc !important;
    color: #ffffff !important;

    text-decoration: none !important;
    font-size: 18px !important;
    padding: 14px 18px !important;
    min-width: 140px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    white-space: normal !important;
    border-radius: 10px 0 0 10px !important;
    border: none !important;

    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.3), 0 4px 6px -2px rgba(0,0,0,0.15) !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transition: all 0.3s ease !important;
}

.side-tab--right:hover {
    background-color: #3959ad !important;
    color: #ffffff !important;
    transform: translateY(-50%) translateX(-8px) !important;
    border-radius: 10px !important;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.3), 0 10px 10px -5px rgba(0,0,0,0.15) !important;
}

@media (max-width: 959px) {
    .side-tab--right {
        top: auto !important;
        bottom: 20px !important;
        right: 20px !important;
        left: auto !important;

        width: 80px !important;
        height: 80px !important;
        min-width: 80px !important;
        min-height: 80px !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;

        font-size: 14px !important;
        line-height: 1.2 !important;
        white-space: normal !important;

        border-radius: 18px !important;
        transform: none !important;
    }

    .side-tab--right:hover {
        background-color: #3959ad !important;
        color: #ffffff !important;
        transform: none !important;
        box-shadow: 0 20px 25px -5px rgba(0,0,0,0.3), 0 10px 10px -5px rgba(0,0,0,0.15) !important;
    }
}

/* Links-Modus komplett ausblenden */

.side-tab--left {
    display: none !important;
}


/* Verhindert Überdecken durch WPBakery-Container */

.vc_row,
.wpb_wrapper,
body.admin-bar,
.site-footer,
.oceanwp-row {
    overflow: visible !important;
}


/* Fertig-Pumptrack immer in Impact kursiv */

.fp-brand,
.fp-brand-word {
  font-family: Impact, Chicago, sans-serif !important;
  font-style: italic !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* Darstellung Modell Name und Ausrichtung mittig Gewinnt gegen WPBakerys eigene js_composer/custom.css */

body.home .snap-section h1.fp-brand,
body.home .snap-section h1.fp-brand-word {
  max-width: none !important;
}

/* Darstellung Modell Name Zeilenumbruch mobil */

@media (max-width: 767px) {
  .fp-model-hero.fp-model-title {
    font-size: 9vw !important;
    white-space: normal !important;
    line-height: 1.1 !important;
  }
}

/* Blocksatz mit ausgeglichenen Wortabständen für Popup- und Fließtext.
   Ab 641px Spaltenbreite Blocksatz + Silbentrennung + leicht negativer
   Wortabstand (gleicht die durch Blocksatz vergrößerten Lücken aus).
   Unterhalb von 641px bleibt es linksbündig, weil die Spalte sonst zu
   schmal für gleichmäßige Wortabstände ist. */

@media (min-width: 641px) {
  .pum-content p:not([style*="text-align: center"]):not([style*="text-align:center"]):not([style*="text-align: right"]),
  .pum-content li,
  .lvca-text p {
    text-align: justify;
    hyphens: auto;
    -webkit-hyphens: auto;
    word-spacing: -0.08em;
  }
}

/* Volle Popup-Breite nutzen statt seitlichem Innenrand,
   dadurch werden Zeilen länger und der Blocksatz ruhiger */
.pum-content .fp-popup__inner {
  padding-left: 0 !important;
  padding-right: 0 !important;
}