/*
 Theme Name: Schwarz+Matt Child
 Theme URI: https://github.com/elementor/hello-theme-child/
 Description: Schwarz+Matt Child is a child theme of Hello Elementor, created by the Elementor team and modified by Schwart+Matt.
 Author: Schwarz+Matt Team
 Author URI: https://www.schwarz-matt.com/
 Template: hello-elementor
 Version: 2.0.0
 Text Domain: schwarz+matt-child
 License: GNU General Public License v3 or later.
 License URI: https://www.gnu.org/licenses/gpl-3.0.html
 Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
 */
/* Design-Tokens: Typografie, Farben, Abstände und Buttons. */
:root {
  --font-primary: "General Sans", sans-serif;
  --space-wrapper: clamp(1.5rem, 0.1153846154rem + 6.1538461538vw, 7.5rem);
  /*
   * ========================================
   * COLORS – BRAND
   */
  --color-rich-teal: #079985;
  --color-deep-sea: #012C2D;
  --color-soft-teal: #CDEBE7;
  --color-soft-teal-50: #F1FAF9;
  --color-teal-2: #9CD6CE;
  --color-teal-3: #6AC2B6;
  --color-teal-4: #39AD9D;
  --color-teal-6: #067A6A;
  --color-teal-7: #045C50;
  --color-teal-8: #033D35;
  --color-bright-yellow: #E1FF51;
  /*
   * ========================================
   * COLORS – GREYSCALES / NEUTRALS
   */
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-grey-1: #E5E5E5;
  --color-grey-2: #CCCCCC;
  --color-grey-3: #B2B2B2;
  --color-grey-4: #999999;
  --color-grey-5: #808080;
  --color-grey-6: #666666;
  --color-grey-7: #4D4D4D;
  --color-grey-8: #333333;
  --color-grey-9: #1A1A1A;
  /*
   * ========================================
   * COLORS – INTERACTION ONLY
   */
  --color-error: #E90C0C;
  --color-success: #45E781;
  /*
   * ========================================
   * TYPOGRAPHY – FLUID FONT SIZES
   * 360px → 1920px
   */
  /* 48px → 96px */
  --font-heading-xxl: clamp(3rem, 2.3076923077rem + 3.0769230769vw, 6rem);
  /* 40px → 72px */
  --font-heading-xl: clamp(2.5rem, 2.0384615385rem + 2.0512820513vw, 4.5rem);
  /* 36px → 64px */
  --font-heading-l: clamp(2.25rem, 1.8461538462rem + 1.7948717949vw, 4rem);
  /* 24px → 48px */
  --font-heading-m: clamp(1.5rem, 1.1538461538rem + 1.5384615385vw, 3rem);
  /* 22px → 32px */
  --font-heading-s: clamp(1.375rem, 1.2307692308rem + 0.641025641vw, 2rem);
  /* 20px → 24px */
  --font-heading-xs: clamp(1.25rem, 1.1923076923rem + 0.2564102564vw, 1.5rem);
  /* 18px → 20px */
  --font-body-large: clamp(1.125rem, 1.0961538462rem + 0.1282051282vw, 1.25rem);
  /* 16px → 18px */
  --font-body: clamp(1rem, 0.9711538462rem + 0.1282051282vw, 1.125rem);
  /* 12px → 14px */
  --font-body-small: clamp(0.75rem, 0.7211538462rem + 0.1282051282vw, 0.875rem);
  /* 14px → 16px */
  --font-topline: clamp(0.875rem, 0.8461538462rem + 0.1282051282vw, 1rem);
  /*
   * ========================================
   * TYPOGRAPHY – LINE HEIGHT
   */
  --line-height-heading: 1.2;
  --line-height-body-large: 1.5;
  --line-height-body: 1.5;
  --line-height-body-small: 1.3;
  /* 120% → 150% */
  --line-height-topline: clamp(1.2em, 1.1181818182em + 0.3181818182vw, 1.5em);
  /*
   * ========================================
   * TYPOGRAPHY – FONT WEIGHTS
   */
  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  /*
   * ========================================
   * TYPOGRAPHY – LETTER SPACING
   */
  /* 2% → 4% */
  --letter-spacing-topline: clamp(0.02em, 0.0145454545em + 0.0212121212vw, 0.04em);
  /*
   * ========================================
   * SPACING
   * Fluid: 360px → 1920px
   * Name = Desktop-Wert
   */
  /* 4px → 8px */
  --spacing-8: clamp(0.25rem, 0.1923076923rem + 0.2564102564vw, 0.5rem);
  /* 8px → 16px */
  --spacing-16: clamp(0.5rem, 0.3846153846rem + 0.5128205128vw, 1rem);
  /* 12px → 20px */
  --spacing-20: clamp(0.75rem, 0.6346153846rem + 0.5128205128vw, 1.25rem);
  /* 16px → 24px */
  --spacing-24: clamp(1rem, 0.8846153846rem + 0.5128205128vw, 1.5rem);
  /* 24px → 32px */
  --spacing-32: clamp(1.5rem, 1.3846153846rem + 0.5128205128vw, 2rem);
  /* 28px → 48px */
  --spacing-48: clamp(1.75rem, 1.4615384615rem + 1.2820512821vw, 3rem);
  /* 32px → 64px */
  --spacing-64: clamp(2rem, 1.5384615385rem + 2.0512820513vw, 4rem);
  /* 40px → 80px */
  --spacing-80: clamp(2.5rem, 1.9230769231rem + 2.5641025641vw, 5rem);
  /* 44px → 96px */
  --spacing-96: clamp(2.75rem, 2rem + 3.3333333333vw, 6rem);
  /* 48px → 128px */
  --spacing-128: clamp(3rem, 1.8461538462rem + 5.1282051282vw, 8rem);
  /* 52px → 144px */
  --spacing-144: clamp(3.25rem, 1.9230769231rem + 5.8974358974vw, 9rem);
  /* 56px → 160px */
  --spacing-160: clamp(3.5rem, 2rem + 6.6666666667vw, 10rem);
  /* 64px → 192px */
  --spacing-192: clamp(4rem, 2.1538461538rem + 8.2051282051vw, 12rem);
  /* 80px → 240px */
  --spacing-240: clamp(5rem, 2.6923076923rem + 10.2564102564vw, 15rem);
  /* 96px → 272px */
  --spacing-272: clamp(6rem, 3.4615384615rem + 11.2820512821vw, 17rem);
  /*
   * ========================================
   * BUTTON TOKENS
   * Mobile 360px → Desktop 1920px
   */
  /* 14px → 16px */
  --font-button: clamp(0.875rem, 0.8461538462rem + 0.1282051282vw, 1rem);
  --font-weight-button: 500;
  /* Mobile 110% → Desktop 100% */
  --line-height-button: clamp(1em, 1.1272727273em - 0.1060606061vw, 1.1em);
  /* Mobile 38px → Desktop 48px */
  --button-height: clamp(2.375rem, 2.2307692308rem + 0.641025641vw, 3rem);
  /*
   * Horizontal Padding:
   */
  --button-padding-x: clamp(1rem, 0.9423076923rem + 0.2564102564vw, 1.25rem);
  /*
   * Abstand Text → Pfeil:
   */
  --button-gap: var(--spacing-8);
  --button-icon-size: 8px;
  /*
   * ========================================
   * BUTTON COLORS
   */
  --button-primary-bg: var(--color-deep-sea);
  --button-primary-color: var(--color-bright-yellow);
  --button-primary-dark-bg: var(--color-bright-yellow);
  --button-primary-dark-color: var(--color-deep-sea);
  --button-secondary-border: var(--color-deep-sea);
  --button-secondary-color: var(--color-deep-sea);
  --button-disabled-bg: var(--color-grey-3);
  --button-disabled-color: var(--color-white);
  /*
   * ========================================
   * ICON
   */
  --icon-arrow: url("data:image/svg+xml,%3Csvg width='5' height='12' viewBox='0 0 5 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.8499e-07 0L3.203 5.54773L0 11.0953H1.797L5 5.54773L1.797 7.85476e-08L4.8499e-07 0Z' fill='black'/%3E%3C/svg%3E%0A");
  /*
   * Aktuelle Höhe aus Topbar und Hauptnavigation:
   * Topbar ca. 58 px + Navigation 96 px.
   */
  --home-header-height: 154px;
}

html,
body {
  max-width: 100% !important;
  overflow-x: hidden !important;
  scroll-behavior: smooth;
}

.elementor-icon-wrapper {
  line-height: 0;
}

/* Unterstreicht Links ausschließlich innerhalb von Elementor-Texteditor-/WYSIWYG-Widgets */
.elementor-widget-text-editor a {
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.elementor-widget-text-editor a:hover,
.elementor-widget-text-editor a:focus,
.elementor-widget-text-editor a:active {
  text-decoration: underline !important;
}

/* Breakpoint für Navigation Desktop und Mobile */
@media (min-width: 1271px) {
  .header-mobile-toggle {
    display: none !important;
  }
}

@media (max-width: 1270px) {
  .header-desktop-nav {
    display: none !important;
  }
}

/*
 * =========================================================
 * ELEMENTOR – EINFARBIGE CUSTOM-SVG-ICONS
 * Farbe über Elementors „Primäre Farbe“ steuerbar
 */
/* Gefüllte SVG-Elemente */
.elementor-widget-icon .elementor-icon svg [fill]:not([fill="none"]) {
  fill: currentColor;
}

/* SVG-Elemente mit Kontur */
.elementor-widget-icon .elementor-icon svg [stroke]:not([stroke="none"]) {
  stroke: currentColor;
}

/* Listing Grid Slider: visible overflow for neighboring slides */
.slider-visible .swiper,
.slider-visible .swiper-container,
.slider-visible .swiper-viewport,
.slider-visible .swiper-wrapper {
  overflow: visible !important;
}

.jet-tabs-icon svg path {
  fill: currentColor;
}

.aspect-1-1 img {
  aspect-ratio: 1/1 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.aspect-16-9 img {
  aspect-ratio: 16/9 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.full-height.elementor-widget-image {
  height: auto;
}

.full-img-height .elementor-widget.elementor-widget-image {
  height: 100%;
}

.medium {
  font-weight: 500;
}

/* Elementor Texteditor – letzten Absatz unten bündig machen */
.elementor-widget-text-editor .elementor-widget-container > *:last-child {
  margin-bottom: 0 !important;
}

/* Sicherheit: falls nur p verwendet wird */
.elementor-widget-text-editor .elementor-widget-container p:last-child {
  margin-bottom: 0 !important;
}

.uppercase {
  text-transform: uppercase;
}

.wrapper {
  padding-inline: var(--space-wrapper);
}

/* Mobiles Seitenraster: exakt 20px links und rechts.
 * --spacing-20 ist fluid (12–20px); die Untergrenze sichert das Screendesign.
 * Der gemeinsame Wrapper-Token hält auch Slider-Randabstände synchron.
 */
@media (max-width: 767px) {
  :root {
    --space-wrapper: max(20px, var(--spacing-20));
  }

  .wrapper.wrapper {
    padding-inline: var(--space-wrapper) !important;
  }
}

/*
 * =========================================================
 * BUTTON BASIS
 */
.elementor .elementor-widget-button .elementor-button,
.elementor .elementor-widget-button .elementor-button:hover,
.elementor .elementor-widget-button .elementor-button:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 20px;
  box-sizing: border-box;
  font-family: var(--font-primary);
  font-size: var(--font-button);
  font-weight: var(--font-weight-button);
  line-height: var(--line-height-button);
  text-align: center;
  text-decoration: none;
  border-radius: 0;
  transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
  margin-bottom: -3px;
}

/* Elementor Wrapper */
.elementor .elementor-widget-button .elementor-button-content-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--button-gap);
}

.elementor .elementor-widget-button .elementor-button-text {
  display: block;
  padding: 0;
}

/* Elementor Standard Icon entfernen */
.elementor .elementor-widget-button .elementor-button-icon {
  display: none;
}

/* Button ohne Pfeil */
.elementor .elementor-widget-button.btn-no-icon .elementor-button::after {
  display: none;
  content: none;
}

/*
 * =========================================================
 * ARROW
 */
.elementor .elementor-widget-button .elementor-button::after {
  content: "";
  display: block;
  flex: 0 0 var(--button-icon-size);
  width: var(--button-icon-size);
  height: 12px;
  background-color: currentColor;
  -webkit-mask-image: var(--icon-arrow);
  mask-image: var(--icon-arrow);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
  transform: translateX(0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Hover Animation */
.elementor .elementor-widget-button .elementor-button:hover::after,
.elementor .elementor-widget-button .elementor-button:focus-visible::after {
  transform: translateX(3px);
}

/*
 * =========================================================
 * PRIMARY
 * Auf Weiß
 */
.elementor-widget-button.btn-primary .elementor-button {
  color: var(--button-primary-color);
  background-color: var(--button-primary-bg);
  border: 1px solid var(--button-primary-bg);
}

/* Hover / Active */
.elementor-widget-button.btn-primary .elementor-button:hover,
.elementor-widget-button.btn-primary .elementor-button:focus-visible {
  color: var(--color-bright-yellow);
  background-color: var(--color-teal-8);
  border-color: var(--color-teal-8);
}

/*
 * =========================================================
 * PRIMARY
 * Auf Dunkel / Bildern / Farbe
 */
.elementor-widget-button.btn-primary.btn-on-dark .elementor-button {
  color: var(--button-primary-dark-color);
  background-color: var(--button-primary-dark-bg);
  border-color: var(--button-primary-dark-bg);
}

.elementor-widget-button.btn-primary.btn-on-dark .elementor-button:hover,
.elementor-widget-button.btn-primary.btn-on-dark .elementor-button:focus-visible {
  color: var(--color-deep-sea);
  background-color: var(--color-white);
  border-color: var(--color-white);
}

/*
 * =========================================================
 * SECONDARY
 * Auf Weiß
 */
.elementor-widget-button.btn-secondary .elementor-button {
  color: var(--color-deep-sea);
  background-color: transparent;
  border: 1px solid var(--color-deep-sea);
}

.elementor-widget-button.btn-secondary .elementor-button:hover,
.elementor-widget-button.btn-secondary .elementor-button:focus-visible {
  color: var(--color-bright-yellow);
  background-color: var(--color-deep-sea);
  border-color: var(--color-deep-sea);
}

/*
 * =========================================================
 * SECONDARY
 * Auf Dunkel / Bildern / Farbe
 */
.elementor-widget-button.btn-secondary.btn-on-dark .elementor-button {
  color: var(--color-bright-yellow);
  background-color: transparent;
  border-color: var(--color-bright-yellow);
}

.elementor-widget-button.btn-secondary.btn-on-dark .elementor-button:hover,
.elementor-widget-button.btn-secondary.btn-on-dark .elementor-button:focus-visible {
  color: var(--color-deep-sea);
  background-color: var(--color-white);
  border-color: var(--color-white);
}

/*
 * =========================================================
 * WHITE
 */
.elementor-widget-button.btn-white .elementor-button {
  color: var(--color-deep-sea);
  background-color: var(--color-white);
  border: 1px solid var(--color-deep-sea);
}

.elementor-widget-button.btn-white .elementor-button:hover,
.elementor-widget-button.btn-white .elementor-button:focus-visible {
  color: var(--color-bright-yellow);
  background-color: var(--color-deep-sea);
  border-color: var(--color-deep-sea);
}

/*
 * =========================================================
 * GHOST
 * Auf Weiß
 */
.elementor .elementor-widget-button.btn-ghost .elementor-button,
.elementor .elementor-widget-button.btn-ghost .elementor-button:hover,
.elementor .elementor-widget-button.btn-ghost .elementor-button:focus,
.elementor .elementor-widget-button.btn-ghost .elementor-button:focus-visible {
  min-height: auto;
  padding-left: 0;
  padding-right: 0;
  color: var(--color-deep-sea);
  background: transparent;
  border: 0;
}

.elementor .elementor-widget-button.btn-ghost .elementor-button:hover,
.elementor .elementor-widget-button.btn-ghost .elementor-button:focus,
.elementor .elementor-widget-button.btn-ghost .elementor-button:focus-visible {
  color: var(--color-teal-8);
  background: transparent;
}

/*
 * =========================================================
 * GHOST
 * Auf Dunkel / Bildern / Farbe
 */
.elementor .elementor-widget-button.btn-ghost.btn-on-dark .elementor-button {
  color: var(--color-white);
}

.elementor .elementor-widget-button.btn-ghost.btn-on-dark .elementor-button:hover,
.elementor .elementor-widget-button.btn-ghost.btn-on-dark .elementor-button:focus,
.elementor .elementor-widget-button.btn-ghost.btn-on-dark .elementor-button:focus-visible {
  color: var(--color-white);
}

/*
 * =========================================================
 * DISABLED
 * Elementor / HTML
 */
.elementor-widget-button .elementor-button[disabled],
.elementor-widget-button .elementor-button.is-disabled,
.elementor-widget-button.is-disabled .elementor-button {
  pointer-events: none;
  color: var(--button-disabled-color);
  background-color: var(--button-disabled-bg);
  border-color: var(--button-disabled-bg);
  opacity: 0.65;
}

/* Ghost Disabled */
.elementor .elementor-widget-button.btn-ghost .elementor-button[disabled],
.elementor .elementor-widget-button.btn-ghost .elementor-button.is-disabled,
.elementor .elementor-widget-button.btn-ghost.is-disabled .elementor-button {
  color: var(--color-grey-3);
  background: transparent;
  border: 0;
}

/*
 * =========================================================
 * OPTIONAL:
 * Kleine Navigation / Symbol Buttons
 */
.elementor-widget-button.btn-symbol .elementor-button {
  width: var(--button-height);
  height: var(--button-height);
  min-height: var(--button-height);
  padding: 0;
  color: var(--color-bright-yellow);
  background-color: var(--color-deep-sea);
  border: 1px solid var(--color-deep-sea);
}

/* Bei Symbol Buttons keinen Abstand */
.elementor-widget-button.btn-symbol .elementor-button-content-wrapper {
  gap: 0;
}

/* Text verstecken */
.elementor-widget-button.btn-symbol .elementor-button-text {
  font-size: 0;
}

/* Symbol zentrieren */
.elementor-widget-button.btn-symbol .elementor-button::after {
  margin: 0;
}

/* Hover */
.elementor-widget-button.btn-symbol .elementor-button:hover,
.elementor-widget-button.btn-symbol .elementor-button:focus-visible {
  color: var(--color-deep-sea);
  background-color: var(--color-white);
  border-color: var(--color-deep-sea);
}

/*
 * Elementor Form Start
 */
/*-- select field custom icon --*/
.elementor-field.elementor-select-wrapper .select-caret-down-wrapper svg {
  display: none;
}

.elementor-form input[type=date],
.elementor-form input[type=email],
.elementor-form input[type=number],
.elementor-form input[type=password],
.elementor-form input[type=search],
.elementor-form input[type=tel],
.elementor-form input[type=text],
.elementor-form input[type=url],
.elementor-form select,
.elementor-form textarea {
  padding: 13px 20px;
}

.elementor-field.elementor-select-wrapper .select-caret-down-wrapper:before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' style='enable-background:new 0 0 511.9 272' viewBox='0 0 511.9 272'%3E%3Cpath d='M256 272c-4.2 0-8.2-1.6-11.4-4.6l-240-240c-6.2-6.2-6.2-16.3 0-22.6s16.3-6.2 22.6 0L256 233.5 484.7 4.7c6.2-6.2 16.3-6.2 22.6 0 6.2 6.2 6.2 16.3 0 22.6l-240 240c-3.1 3.1-7.1 4.7-11.3 4.7z' style='fill:%23111'/%3E%3C/svg%3E");
  width: 15px;
  height: 8px;
  display: block;
  background-size: contain;
  position: absolute;
  right: 12px;
  top: 4px;
}

.eicon-caret-down:before {
  content: "" !important;
}

/*-- dse checkbox --*/
.elementor-form .elementor-field-type-acceptance .elementor-field-option {
  display: flex;
  gap: .5rem;
  cursor: pointer;
}

/* reset checkbox */
.elementor-form .elementor-field-type-acceptance input {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-color: transparent !important;
}

.elementor-element.elementor-widget-form .elementor-form .elementor-field-type-acceptance label {
  font-size: var(--text-14);
  line-height: var(--lh-150);
  cursor: pointer;
}

.elementor-form .elementor-field-type-acceptance label a {
  color: var(--color-slate-600);
  text-decoration: underline;
}

.elementor-field-subgroup.elementor-subgroup-inline {
  gap: 32px;
}

body .elementor-19 .elementor-element.elementor-element-e1087f3 .elementor-labels-above .elementor-field-group > label {
  padding-top: 24px;
}

.elementor-field-type-acceptance.elementor-field-group.elementor-column.elementor-field-group-field_d22b590.elementor-col-100 {
  margin-top: 12px;
}

.elementor-field-type-acceptance.elementor-field-group.elementor-column.elementor-field-group-field_80c99cf.elementor-col-100 {
  margin-bottom: 48px;
}

/* check box */
.elementor-form .elementor-field-type-acceptance input:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 0;
  border: 1px solid var(--color-slate-600);
  background-color: transparent;
}

/* checked icon */
.elementor-form .elementor-field-type-acceptance input:after {
  content: "";
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-right-style: solid;
  border-right-width: 1px;
  border-color: var(--color-slate-600);
  display: inline-block;
  position: absolute;
  height: 10px;
  width: 5px;
  left: 6px;
  top: 4px;
  transform: rotate(45deg);
  opacity: 0;
  transition: .125s;
}

.elementor-form .elementor-field-type-acceptance input:checked:after {
  opacity: 1;
}

/*
 * =========================================================
 * ELEMENTOR CHECKBOX – CUSTOM (Haken pro Box korrekt)
 */
/* Wrapper optional */
.elementor-field-type-checkbox > div {
  display: grid;
  gap: 12px;
}

/* Native Checkbox "unsichtbar", aber klickbar/accessible */
.elementor-field-type-checkbox > div input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Label als Positionierungs-Container */
.elementor-field-type-checkbox > div label {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin: 0;
  /* deine 1em macht oft komische Abstände */
  user-select: none;
}

/* Checkbox-Kästchen */
.elementor-field-type-checkbox > div label:before {
  content: "";
  width: 15px;
  height: 15px;
  margin-right: 16px;
  border: 1px solid var(--color-slate-600);
  background: transparent;
  border-radius: 0;
  box-sizing: border-box;
  display: inline-block;
  flex: 0 0 15px;
  transition: border-color .2s ease, background-color .2s ease;
}

/* Hover auf dem jeweiligen Feld */
.elementor-field-type-checkbox > div label:hover:before {
  border-color: var(--color-slate-600);
}

/* Haken (an das jeweilige Label gebunden) */
.elementor-field-type-checkbox > div input[type="checkbox"]:checked + label:after {
  content: "";
  position: absolute;
  /* Position innerhalb des 15x15 Kästchens */
  left: 5px;
  top: 50%;
  width: 5px;
  height: 10px;
  transform: translateY(-90%) rotate(45deg);
  border-right: 1px solid var(--color-slate-600);
  border-bottom: 1px solid var(--color-slate-600);
  opacity: 1;
  transition: opacity .125s ease;
}

input#form-field-akzeptanz {
  padding: 0 16px 8px 0;
}

/*
 * Elementor Form End
 */
/*
 * =========================================================
 * CPRO PRODUCT HERO
 *
 * Elementor-Struktur:
 *
 * .product-hero.wrapper
 * ├── .product-hero__content
 * └── .product-hero-image
 * └── .product-hero__photo
 */
.product-hero {
  --hero-background: #cdebe7;
  --hero-wrapper-width: 1680px;
  --hero-height: clamp(680px, 39.583vw, 760px);
  --hero-media-width: clamp(687.158px, 40vw, 768px);
  --hero-image-position: 50% 50%;
  --hero-edge: max( var(--space-wrapper, 0px), calc((100vw - var(--hero-wrapper-width)) / 2) );
  --hero-text-width: calc( 100vw - var(--hero-edge) - var(--hero-media-width) );
  position: relative;
  min-height: var(--hero-height);
  overflow: hidden !important;
  background-color: var(--hero-background) !important;
}

/*
 * =========================================================
 * INNERER WRAPPER
 */
.product-hero > .e-con-inner {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 66%) minmax(0, 34%);
  align-items: stretch !important;
  gap: 0 !important;
  min-height: var(--hero-height);
  overflow: visible !important;
}

/*
 * =========================================================
 * CONTENT
 */
.product-hero__content {
  position: relative;
  z-index: 3;
  grid-column: 1 / 2;
  justify-self: start;
  width: min(100%, var(--hero-text-width)) !important;
  max-width: var(--hero-text-width) !important;
  min-width: 0;
  box-sizing: border-box;
  align-self: stretch !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(64px, 5vw, 96px) clamp(48px, 6vw, 112px) clamp(64px, 5vw, 96px) 0 !important;
}

.product-hero__content > .elementor-element,
.product-hero__content .elementor-widget-container {
  max-width: 100%;
  min-width: 0;
}

.product-hero__content h1 {
  width: 100%;
  max-width: 100%;
  white-space: normal !important;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  text-wrap: balance;
}

.product-hero__content .elementor-widget-text-editor {
  width: 100%;
  max-width: 720px;
}

.product-hero__content .elementor-widget-button {
  align-self: flex-start;
}

/*
 * =========================================================
 * BILDBEREICH
 */
.product-hero-image {
  position: absolute !important;
  z-index: 1;
  top: 0;
  right: calc(-1 * var(--hero-edge));
  bottom: 0;
  width: var(--hero-media-width) !important;
  height: auto !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  isolation: isolate;
}

/*
 * =========================================================
 * AUSTAUSCHBARES FOTO
 */
.product-hero__photo {
  position: absolute !important;
  z-index: 1;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.product-hero__photo > .elementor-widget-container,
.product-hero__photo > .elementor-widget-container > a,
.product-hero__photo > .elementor-widget-container > picture,
.product-hero__photo picture {
  display: block;
  width: 100%;
  height: 100%;
}

.product-hero__photo img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  object-position: var(--hero-image-position);
  -webkit-mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/mask.svg");
  mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/mask.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: left top;
  mask-position: left top;
  -webkit-mask-size: auto 100%;
  mask-size: auto 100%;
  mask-mode: alpha;
}

/*
 * =========================================================
 * DOUBLE-ARROW-ICON
 */
.product-hero-image::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 7.222%;
  left: 0;
  width: auto;
  height: 43.684%;
  aspect-ratio: 171 / 332;
  background-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/double-arrow-icon.svg");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100% 100%;
  pointer-events: none;
}

/*
 * =========================================================
 * FALLBACK OHNE CSS-MASK
 */
@supports not ( (-webkit-mask-image: url("")) or (mask-image: url("")) ) {
  .product-hero__photo img {
    clip-path: polygon( 16.61% 0, 100% 0, 100% 100%, 40.40% 100%, 0 29.13% );
  }
}

/*
 * =========================================================
 * TABLET – BILD ABSOLUT AM RECHTEN VIEWPORT-RAND
 */
@media (max-width: 1024px) {
  .product-hero {
    min-height: 0;
  }

  .product-hero > .e-con-inner {
    min-height: 0;
    padding-top: clamp(340px, 46vw, 460px);
  }

  .product-hero-image {
    position: absolute !important;
    z-index: 1;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    width: clamp(340px, 46vw, 460px) !important;
    height: clamp(340px, 46vw, 460px) !important;
    aspect-ratio: 768 / 760;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  .product-hero__photo img {
    object-position: 58% center;
    -webkit-mask-position: right top;
    mask-position: right top;
  }

  .product-hero__content {
    order: 2;
    width: 100% !important;
    max-width: none !important;
    padding: clamp(56px, 8vw, 80px) 0 clamp(44px, 7vw, 64px) 0 !important;
  }
}

/*
 * =========================================================
 * TABLET & MOBILE – HERO NACH FIGMA
 */
@media (max-width: 1024px) {
  .product-hero {
    --hero-mobile-image-height: min(70vw, 600px);
    min-height: 0 !important;
    padding: 0 20px !important;
  }

  .product-hero > .e-con-inner {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100%;
    min-height: 0 !important;
    padding: var(--hero-mobile-image-height) 0 0 !important;
  }

  /* Bild über die gesamte Breite */
  .product-hero .product-hero-image {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--hero-mobile-image-height) !important;
    min-height: 0 !important;
    max-width: none !important;
    aspect-ratio: auto;
    /* Gemeinsames Koordinatensystem für Bildmaske und SVG. */
    container-type: inline-size;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  .product-hero .product-hero__photo img {
    object-fit: cover;
    object-position: 60% center;
    /*
     * Kontur aus Ebene_4.svg: Die Bildkante läuft durch
     * die untere Außenkante des großen Pfeils. Alle Abstände beziehen
     * sich auf dieselbe Containerbreite wie das SVG.
     */
    -webkit-mask-image: none;
    mask-image: none;
    clip-path: polygon( 0 0, 100% 0, 100% calc(100% - 40.84904068cqw), 29.19131646cqw calc(100% + 0.03157975cqw), 0 calc(100% - 16.82198558cqw) );
  }

  /* Doppelpfeil nach unten */
  .product-hero .product-hero-image::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: auto;
    right: auto;
    bottom: 0;
    left: 7cqw;
    width: 44cqw;
    height: auto;
    aspect-ratio: 158 / 81;
    background-color: var(--color-rich-teal, #079985);
    background-image: none;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transform: none;
    pointer-events: none;
  }

  /* Inhalt unterhalb des Bildes */
  .product-hero .product-hero__content {
    order: 2;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 28px 0 64px !important;
  }

  .product-hero .product-hero__content h1 {
    text-wrap: wrap;
  }

  .product-hero .product-hero__content .elementor-widget-text-editor {
    width: 100%;
    max-width: none;
  }

  /* Gemeinsamen Button-Container untereinander ausrichten */
  .product-hero .product-hero__content .e-con:has(> .elementor-widget-button),
  .product-hero .product-hero__content .e-con-inner:has(> .elementor-widget-button) {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .product-hero .product-hero__content .elementor-widget-button {
    width: auto !important;
    align-self: flex-start;
  }
}

.hero--viewport {
  box-sizing: border-box;
  /*
   * Header + Hero ergeben zusammen immer mindestens
   * die vollständige sichtbare Viewporthöhe.
   */
  min-height: calc(100dvh - var(--home-header-height));
}

.hero--viewport > .e-con-inner {
  min-height: inherit;
}

/* Sicherheit für ältere Browser ohne dynamische Viewport-Einheit */
@supports not (height: 100dvh) {
  .hero--viewport {
    min-height: calc(100vh - var(--home-header-height));
  }
}

/* FAQ / JetTabs Classic Accordion */
.faq-accordion {
  --faq-closed-space: var(--spacing-32);
  --faq-open-gap: var(--spacing-16);
  --faq-number-width: var(--spacing-48);
  --faq-number-gap: 4px;
  --faq-number-offset: calc( var(--faq-number-width) + var(--faq-number-gap) );
  --faq-number-color: #00a39a;
}

/* Automatische Nummerierung */
.faq-accordion .jet-accordion__inner {
  counter-reset: faq-item;
}

.faq-accordion .jet-accordion__item {
  position: relative;
  counter-increment: faq-item;
}

.faq-accordion .jet-accordion__item::before {
  content: counter(faq-item, decimal-leading-zero);
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 1;
  width: var(--spacing-16);
  transform: translateY(-50%);
  color: var(--faq-number-color);
  font-size: var(--font-heading-xs);
  font-weight: 700;
  line-height: 1;
}

/* Verhindert einen zusätzlichen Counter aus älteren CSS-Versionen */
.faq-accordion .jet-toggle__control::before {
  display: none !important;
}

/* Geschlossen: 32 px oben und unten */
.faq-accordion .jet-toggle__control {
  display: flex;
  align-items: center;
  padding-top: var(--faq-closed-space) !important;
  padding-bottom: var(--faq-closed-space) !important;
}

/* Geöffnet: exakt 16 px zwischen Überschrift und Content */
.faq-accordion .jet-accordion__item.active-toggle .jet-toggle__control {
  padding-bottom: var(--faq-open-gap) !important;
}

/* Titel: 46 px Nummer + 4 px Abstand */
.faq-accordion .jet-toggle__label-text {
  order: 1;
  flex: 1 1 auto;
  min-width: 0;
  margin-left: var(--faq-number-offset) !important;
}

/* Plus/Minus bleibt rechts */
.faq-accordion .jet-toggle__label-icon {
  order: 2;
  flex: 0 0 auto;
  margin-left: var(--spacing-24);
}

/* Fließtext startet exakt bündig mit dem Titel */
.faq-accordion .jet-toggle__content {
  margin: 0 0 0 var(--faq-number-offset) !important;
  padding: 0 !important;
}

/* Antworttext: rechts 48 px Freiraum zur Icon-Spalte. */
.faq-accordion .jet-toggle__content-inner {
  box-sizing: border-box;
  padding: 0 48px var(--faq-closed-space) 0 !important;
}

.faq-accordion .jet-toggle__content-inner > :first-child,
.faq-accordion .jet-toggle__content-inner > :first-child * {
  margin-top: 0 !important;
}

.faq-accordion .jet-toggle__content-inner > :last-child,
.faq-accordion .jet-toggle__content-inner > :last-child * {
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .faq-accordion {
    --faq-number-width: 36px;
  }

  .faq-accordion .jet-accordion__item::before {
    font-size: var(--font-heading-xs);
  }

  .faq-accordion .jet-toggle__label-icon {
    margin-left: var(--spacing-16);
  }
}

/* Formular-Submit wie der bestehende .btn-primary */
.elementor .elementor-widget-form.form-btn-primary .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--button-primary-color) !important;
  background-color: var(--button-primary-bg) !important;
  border: 1px solid var(--button-primary-bg) !important;
  border-radius: 0;
  transition: color 0.25s, background-color 0.25s, border-color 0.25s, opacity 0.25s;
}

/* Pfeil-Icon – identisch zum btn-primary */
.elementor .elementor-widget-form.form-btn-primary .elementor-button::after {
  content: "";
  display: block;
  flex: 0 0 var(--button-icon-size);
  width: var(--button-icon-size);
  height: 12px;
  background-color: currentColor;
  mask-image: var(--icon-arrow);
  mask-repeat: no-repeat;
  mask-position: center center;
  mask-size: contain;
  transform: translateX(0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Derselbe Hover-Zustand und dieselbe Pfeilanimation */
.elementor .elementor-widget-form.form-btn-primary .elementor-button:hover,
.elementor .elementor-widget-form.form-btn-primary .elementor-button:focus-visible {
  color: var(--color-bright-yellow) !important;
  background-color: var(--color-deep-sea) !important;
  border-color: var(--color-deep-sea) !important;
}

.elementor .elementor-widget-form.form-btn-primary .elementor-button:hover::after,
.elementor .elementor-widget-form.form-btn-primary .elementor-button:focus-visible::after {
  transform: translateX(3px);
}

/*
 * =========================================
 * REFERENZ-HERO – LISTING-TEMPLATE
 * Äußerer Template-Container: referenz-hero
 * Listing Grid Widget: referenz-slider
 */
.referenz-hero {
  --hero-background: var(--color-deep-sea);
  --hero-wrapper-width: 1680px;
  --hero-height: 600px;
  --hero-media-width: clamp(687px, 40vw, 768px);
  --hero-image-position: 50% 50%;
  --hero-edge: max( var(--space-wrapper, 0px), calc((100vw - var(--hero-wrapper-width)) / 2) );
  --hero-text-width: calc( 100vw - var(--hero-edge) - var(--hero-media-width) );
  position: relative;
  min-height: var(--hero-height);
  overflow: hidden !important;
  background-color: var(--hero-background) !important;
}

.referenz-hero > .e-con-inner {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 66%) minmax(0, 34%);
  align-items: stretch !important;
  min-height: var(--hero-height);
  gap: 0 !important;
  overflow: visible !important;
}

/* Textbereich links */
.referenz-hero .referenz-hero__content {
  position: static;
  z-index: 3;
  grid-column: 1 / 2;
  align-self: stretch !important;
  justify-self: start;
  align-items: flex-start !important;
  justify-content: center !important;
  width: min(100%, var(--hero-text-width)) !important;
  max-width: var(--hero-text-width) !important;
  min-width: 0;
  box-sizing: border-box;
  padding: clamp(64px, 5vw, 96px) clamp(48px, 6vw, 112px) clamp(64px, 5vw, 96px) 0 !important;
}

.referenz-hero .referenz-hero__content > .elementor-element,
.referenz-hero .referenz-hero__content .elementor-widget-container {
  max-width: 100%;
  min-width: 0;
}

.referenz-hero .referenz-hero__content h1,
.referenz-hero .referenz-hero__content h2,
.referenz-hero .referenz-hero__content h3,
.referenz-hero .referenz-hero__content h4 {
  width: 100%;
  max-width: 100%;
  color: #ffffff;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  white-space: normal !important;
}

.referenz-hero .referenz-hero__content .elementor-widget-text-editor {
  width: 100%;
  max-width: 720px;
  color: #ffffff;
}

.referenz-hero .referenz-hero__content .elementor-widget-text-editor,
.referenz-hero .referenz-hero__content .elementor-widget-text-editor p {
  color: #ffffff;
}

.referenz-hero .referenz-hero__content .elementor-widget-button {
  align-self: flex-start;
}

/* Bildbereich rechts */
.referenz-hero .referenz-hero-image {
  position: absolute !important;
  z-index: 1;
  top: 0;
  right: calc(-1 * var(--hero-edge));
  bottom: 0;
  isolation: isolate;
  width: var(--hero-media-width) !important;
  height: auto !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.referenz-hero .referenz-hero__photo {
  position: absolute !important;
  z-index: 1;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.referenz-hero .referenz-hero__photo > .elementor-widget-container,
.referenz-hero .referenz-hero__photo > .elementor-widget-container > a,
.referenz-hero .referenz-hero__photo > .elementor-widget-container > picture,
.referenz-hero .referenz-hero__photo picture {
  display: block;
  width: 100%;
  height: 100%;
}

.referenz-hero .referenz-hero__photo img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  object-position: var(--hero-image-position);
  mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/mask.svg");
  mask-repeat: no-repeat;
  mask-position: left top;
  mask-size: auto 100%;
  mask-mode: alpha;
}

/* Gelber Doppel-Pfeil */
.referenz-hero .referenz-hero-image::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 7.222%;
  left: 0;
  width: auto;
  height: 43.684%;
  aspect-ratio: 171 / 332;
  pointer-events: none;
  background-color: var(--color-bright-yellow);
  mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/double-arrow-icon.svg");
  mask-repeat: no-repeat;
  mask-position: left top;
  mask-size: 100% 100%;
}

/* Branchen-Label rechts oben */
.referenz-hero .referenz-term {
  position: absolute !important;
  z-index: 5;
  top: clamp(32px, 3vw, 48px);
  right: clamp(32px, 3vw, 48px);
  margin: 0 !important;
}

.referenz-hero .referenz-term .jet-listing-dynamic-terms__link {
  display: inline-block;
  padding: 12px 16px;
  background-color: #ffffff;
  color: var(--color-deep-sea) !important;
  font-weight: 700;
}

/* REFERENZ-HERO – TABLET UND MOBILE BIS 1024px */
@media (max-width: 1024px) {
  .referenz-hero {
    --hero-mobile-image-height: min(70vw, 600px);
    min-height: 0 !important;
    padding: 0 20px !important;
  }

  .referenz-hero > .e-con-inner {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100%;
    min-height: 0 !important;
    padding: var(--hero-mobile-image-height) 0 0 !important;
  }

  /* Bild über die gesamte Breite */
  .referenz-hero .referenz-hero-image {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--hero-mobile-image-height) !important;
    min-height: 0 !important;
    max-width: none !important;
    aspect-ratio: auto;
    /* Gemeinsames Koordinatensystem für Bildmaske und SVG. */
    container-type: inline-size;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  .referenz-hero .referenz-hero__photo img {
    object-fit: cover;
    object-position: 60% center;
    /*
     * Kontur aus Ebene_4.svg: Die Bildkante läuft durch
     * die untere Außenkante des großen Pfeils. Alle Abstände beziehen
     * sich auf dieselbe Containerbreite wie das SVG.
     */
    -webkit-mask-image: none;
    mask-image: none;
    clip-path: polygon( 0 0, 100% 0, 100% calc(100% - 40.84904068cqw), 29.19131646cqw calc(100% + 0.03157975cqw), 0 calc(100% - 16.82198558cqw) );
  }

  /* Doppelpfeil nach unten */
  .referenz-hero .referenz-hero-image::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: auto;
    right: auto;
    bottom: 0;
    left: 7cqw;
    width: 44cqw;
    height: auto;
    aspect-ratio: 158 / 81;
    background-color: var(--color-bright-yellow, #e1ff51);
    background-image: none;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transform: none;
    pointer-events: none;
  }

  /* Inhalt unterhalb des Bildes */
  .referenz-hero .referenz-hero__content {
    order: 2;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 28px 0 64px !important;
  }

  .referenz-hero .referenz-hero__content :is(h1, h2, h3, h4) {
    text-wrap: wrap;
    overflow-wrap: anywhere;
  }

  .referenz-hero .referenz-hero__content .elementor-widget-text-editor {
    width: 100%;
    max-width: none;
  }

  /* Gemeinsamen Button-Container untereinander ausrichten */
  .referenz-hero .referenz-hero__content .e-con:has(> .elementor-widget-button),
  .referenz-hero .referenz-hero__content .e-con-inner:has(> .elementor-widget-button) {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .referenz-hero .referenz-hero__content .elementor-widget-button {
    width: auto !important;
    align-self: flex-start;
  }

  /* Branchen-Label innerhalb der Bildfläche */
  .referenz-hero .referenz-term {
    top: 20px !important;
    right: 20px !important;
    left: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: calc(100% - 40px);
  }

  .referenz-hero .referenz-term .jet-listing-dynamic-terms__link {
    padding: 8px 12px;
    font-size: var(--font-body-small, 0.875rem);
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/*
 * =========================================
 * REFERENZ-SLIDER – NAVIGATION UND DOTS
 * CSS-Klasse am Listing Grid: referenz-slider
 */
.referenz-slider {
  position: relative;
  overflow: visible !important;
}

.referenz-slider .jet-listing-grid {
  position: relative;
  overflow: visible !important;
  padding-bottom: var(--spacing-80);
}

.referenz-slider .jet-listing-grid__slider {
  position: relative;
  overflow: hidden;
}

/* Navigation: 24 px unter dem Slider */
.referenz-slider .jet-listing-grid__slider-icon {
  position: absolute !important;
  z-index: 30;
  top: auto !important;
  bottom: 65px !important;
  left: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background-color: var(--color-deep-sea);
  cursor: pointer;
  transform: none !important;
  transition: background-color 0.2s ease;
}

/* Zurück */
.referenz-slider .prev-arrow {
  right: 60px !important;
}

/* Weiter */
.referenz-slider .next-arrow {
  right: 0 !important;
}

.referenz-slider .jet-listing-grid__slider-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.referenz-slider .prev-arrow svg {
  transform: none !important;
}

.referenz-slider .next-arrow svg {
  transform: rotate(180deg) !important;
}

.referenz-slider .jet-listing-grid__slider-icon svg path {
  fill: var(--color-bright-yellow) !important;
  stroke: var(--color-bright-yellow) !important;
  transition: fill 0.2s ease, stroke 0.2s ease;
}

.referenz-slider .jet-listing-grid__slider-icon:hover {
  background-color: var(--color-bright-yellow);
}

.referenz-slider .jet-listing-grid__slider-icon:hover svg path {
  fill: var(--color-deep-sea) !important;
  stroke: var(--color-deep-sea) !important;
}

/* Tatsächlicher JetEngine-Dots-Wrapper */
.referenz-slider .jet-engine-swiper-pagination-wrapper {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  margin: 56px 0 0 !important;
  padding: 0 !important;
}

/* Dots */
.referenz-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
  width: 58px !important;
  height: 4px !important;
  margin: 0 5px !important;
  border: 0;
  border-radius: 0 !important;
  background-color: #9eddd8 !important;
  opacity: 1 !important;
  transition: background-color 0.2s ease;
}

.referenz-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet-active {
  background-color: var(--color-deep-sea) !important;
}

/* Tablet */
@media (max-width: 1024px) {
  .referenz-slider .jet-listing-grid {
    padding-bottom: 80px;
  }

  .referenz-slider .jet-listing-grid__slider-icon {
    bottom: 58px !important;
    width: 48px;
    height: 48px;
  }

  .referenz-slider .prev-arrow {
    right: 56px !important;
  }

  .referenz-slider .jet-engine-swiper-pagination-wrapper {
    margin-top: 24px !important;
  }

  .referenz-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
    width: 46px !important;
    margin: 0 4px !important;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .referenz-slider .jet-listing-grid {
    padding-bottom: 72px;
  }

  .referenz-slider .jet-listing-grid__slider-icon {
    bottom: 0px !important;
    width: 44px;
    height: 44px;
  }

  .referenz-slider .prev-arrow {
    right: 52px !important;
  }

  .referenz-slider .jet-engine-swiper-pagination-wrapper {
    margin-top: 8px !important;
  }

  .referenz-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
    width: 30px !important;
    height: 3px !important;
    margin: 0 3px !important;
  }
}

.ergebnis-box {
  --grafik-breite: 24%;
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: var(--grafik-breite) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  overflow: hidden;
  background-color: var(--color-soft-teal);
}

/* Großer äußerer Chevron – Desktop */
.ergebnis-box::before {
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--grafik-breite);
  content: "";
  background-color: var(--color-rich-teal);
  clip-path: polygon( 0 0, 67% 0, 100% 50%, 67% 100%, 0 100% );
}

/* Grafikbereich */
.ergebnis-grafik {
  position: relative;
  z-index: 1;
  grid-column: 1;
  width: 100%;
  min-width: 0;
  min-height: 100%;
  padding: 0;
  overflow: visible;
  background: transparent !important;
}

/* Dunkelgrüne Innenfläche – Desktop */
.ergebnis-grafik::before {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  width: 88%;
  content: "";
  background-color: var(--color-deep-sea);
  clip-path: polygon( 0 0, 63% 0, 100% 50%, 63% 100%, 0 100% );
}

/* Kleiner türkiser Chevron – Desktop */
.ergebnis-grafik::after {
  position: absolute;
  z-index: 2;
  top: 18%;
  left: 41%;
  width: 34%;
  height: 64%;
  content: "";
  background-color: var(--color-rich-teal);
  clip-path: polygon( 0 0, 36% 0, 100% 50%, 36% 100%, 0 100%, 64% 50% );
}

/* Textbereich */
.ergebnis-inhalt {
  position: relative;
  z-index: 2;
  grid-column: 2;
  width: 100%;
  min-width: 0;
  padding: clamp(40px, 4vw, 80px) clamp(30px, 5vw, 90px);
  background: transparent;
}

/* Tablet */
@media (max-width: 1024px) {
  .ergebnis-box {
    --grafik-breite: 30%;
  }

  .ergebnis-inhalt {
    padding: 45px 40px;
  }
}

/* Smartphone */
@media (max-width: 767px) {
  .ergebnis-box {
    --mobile-grafik-hoehe: clamp(220px, 62vw, 320px);
    --mobile-spitze: 93%;
    --mobile-schrage: clamp(63px, 18vw, 94px);
    --mobile-strich: clamp(24px, 6.4vw, 34px);
    --mobile-abstand: clamp(28px, 7.3vw, 40px);
    --mobile-klein-schrage: clamp(41px, 11.8vw, 62px);
    --mobile-klein-spitze: calc( var(--mobile-spitze) - var(--mobile-strich) - var(--mobile-abstand) );
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: var(--mobile-grafik-hoehe) auto;
    background-color: var(--color-soft-teal);
  }

  /*
   * Großer äußerer türkiser Chevron.
   */
  .ergebnis-box::before {
    display: block;
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    width: 100%;
    height: var(--mobile-grafik-hoehe);
    background-color: var(--color-rich-teal);
    clip-path: polygon( 0 0, calc( var(--mobile-spitze) - var(--mobile-schrage) ) 0, var(--mobile-spitze) 50%, calc( var(--mobile-spitze) - var(--mobile-schrage) ) 100%, 0 100% );
  }

  /*
   * Wichtig: transparent lassen.
   * So bleiben sowohl der äußere türkise Chevron
   * als auch der soft-teal Hintergrund sichtbar.
   */
  .ergebnis-grafik {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    max-width: none;
    height: var(--mobile-grafik-hoehe);
    min-height: var(--mobile-grafik-hoehe);
    overflow: hidden;
    background: transparent !important;
  }

  /*
   * Dunkelgrüne Innenfläche.
   */
  .ergebnis-grafik::before {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-deep-sea);
    clip-path: polygon( 0 0, calc( var(--mobile-spitze) - var(--mobile-schrage) - var(--mobile-strich) ) 0, calc( var(--mobile-spitze) - var(--mobile-strich) ) 50%, calc( var(--mobile-spitze) - var(--mobile-schrage) - var(--mobile-strich) ) 100%, 0 100% );
  }

  /*
   * Kleiner innerer türkiser Chevron.
   */
  .ergebnis-grafik::after {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--color-rich-teal);
    clip-path: polygon( calc( var(--mobile-klein-spitze) - var(--mobile-klein-schrage) - var(--mobile-strich) ) 18%, calc( var(--mobile-klein-spitze) - var(--mobile-klein-schrage) ) 18%, var(--mobile-klein-spitze) 50%, calc( var(--mobile-klein-spitze) - var(--mobile-klein-schrage) ) 82%, calc( var(--mobile-klein-spitze) - var(--mobile-klein-schrage) - var(--mobile-strich) ) 82%, calc( var(--mobile-klein-spitze) - var(--mobile-strich) ) 50% );
  }

  .ergebnis-inhalt {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    padding: 30px 24px;
  }
}

/*
 * =========================================================
 * KEY FACTS TICKER
 */
.key-facts-ticker {
  --ticker-fade-color: #ffffff;
}

/*
 * Elementor legt die Widgets in .e-con-inner ab.
 * Deshalb gehört das 30/70-Layout genau hierhin.
 */
.key-facts-ticker > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
  align-items: center;
  gap: clamp(32px, 4vw, 88px);
  width: 100%;
}

/*
 * =========================================================
 * ÜBERSCHRIFT – 30 %
 */
.key-facts-ticker__headline {
  min-width: 0;
  width: 100% !important;
}

.key-facts-ticker__headline .elementor-heading-title {
  white-space: nowrap;
}

/*
 * =========================================================
 * TICKER – 70 %
 */
.key-facts-ticker__track {
  position: relative;
  z-index: 1;
  min-width: 0;
  width: 100% !important;
  overflow: hidden;
  isolation: isolate;
}

.key-facts-ticker__track::before,
.key-facts-ticker__track::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  width: clamp(48px, 7vw, 150px);
  pointer-events: none;
}

.key-facts-ticker__track::before {
  left: 0;
  background: linear-gradient( 90deg, var(--ticker-fade-color) 0%, rgba(255, 255, 255, 0) 100% );
}

.key-facts-ticker__track::after {
  right: 0;
  background: linear-gradient( 270deg, var(--ticker-fade-color) 0%, rgba(255, 255, 255, 0) 100% );
}

.key-facts-ticker__track .elementor-widget-container {
  overflow: hidden;
}

.key-facts-ticker__track .elementor-icon-list-items {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap !important;
  gap: var(--spacing-96);
  width: max-content !important;
  margin: 0 !important;
  padding: 0 !important;
  animation: key-facts-ticker-scroll 20s linear infinite;
  will-change: transform;
}

.key-facts-ticker__track .elementor-icon-list-item {
  display: inline-flex !important;
  align-items: center;
  flex: 0 0 auto;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.key-facts-ticker__track .elementor-icon-list-icon {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin-right: 16px !important;
}

.key-facts-ticker__track .elementor-icon-list-text {
  white-space: nowrap;
}

.key-facts-ticker__track:hover .elementor-icon-list-items {
  animation-play-state: paused;
}

@keyframes key-facts-ticker-scroll {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(var(--ticker-shift, -50%), 0, 0);
  }
}

/*
 * =========================================================
 * TABLET & MOBILE
 */
@media (max-width: 1024px) {
  .key-facts-ticker > .e-con-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }

  .key-facts-ticker__headline {
    width: 100% !important;
  }

  .key-facts-ticker__headline .elementor-heading-title {
    white-space: nowrap;
  }

  .key-facts-ticker__track {
    width: 100%;
  }

  .key-facts-ticker__track .elementor-icon-list-items {
    gap: 48px;
  }
}

@media (max-width: 767px) {
  .key-facts-ticker > .e-con-inner {
    gap: 16px;
  }

  .key-facts-ticker__track::before,
  .key-facts-ticker__track::after {
    width: 48px;
  }

  .key-facts-ticker__track .elementor-icon-list-items {
    gap: 36px;
  }

  .key-facts-ticker__track .elementor-icon-list-icon {
    margin-right: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .key-facts-ticker__track .elementor-icon-list-items {
    animation: none;
    transform: none;
  }
}

/* Mega-Menü: Schatten */
.jet-mega-menu-mega-container {
  filter: drop-shadow(0 10px 4px rgba(0, 0, 0, 0.10));
}

/* Desktop-Mega-Menü */
@media (min-width: 1025px) {
  /* Mega-Menü unter die komplette Header-Zeile verschieben */
  .jet-mega-menu--layout-horizontal .jet-mega-menu-mega-container {
    top: calc(100% + 29px) !important;
  }

  /* Navigationseinträge über die verfügbare Breite */
  .elementor-3293 .elementor-element.elementor-element-ab44cbc .jet-tabs__control {
    width: 100%;
  }

  /* Pfeile rechtsbündig ausrichten */
  .elementor-3293 .elementor-element.elementor-element-ab44cbc .jet-tabs__control-inner {
    width: 100% !important;
    justify-content: space-between !important;
  }

  /* Trennlinien entfernen */
  .elementor-3293 .elementor-element.elementor-element-aeebebd,
  .elementor-3293 .elementor-element.elementor-element-18b2acc9 {
    border-right: none !important;
  }
}

/* Logo-Karussells als fließender Ticker */
.logo-ticker {
  position: relative;
  opacity: 0.3;
}

/* Gleichmäßige Bewegung ohne Bremsen */
.logo-ticker .swiper-wrapper,
.logo-ticker .swiper-wrapper:hover {
  transition-timing-function: linear !important;
}

/* Einheitliche Logo-Höhe */
.logo-ticker .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo-ticker .swiper-slide img {
  width: auto !important;
  height: 48px !important;
  max-width: 100%;
  object-fit: contain;
}

/* Fade an der linken und rechten Kante */
.logo-ticker::before,
.logo-ticker::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  width: clamp(40px, 7vw, 120px);
  pointer-events: none;
}

.logo-ticker::before {
  left: 0;
  background: linear-gradient( to right, #ffffff 0%, rgba(255, 255, 255, 0) 100% );
}

.logo-ticker::after {
  right: 0;
  background: linear-gradient( to left, #ffffff 0%, rgba(255, 255, 255, 0) 100% );
}

/*
 * =========================================================
 * CARD SLIDER
 *
 * Elementor CSS-Klasse: card-slider
 *
 * Über 1400px: normales Elementor-Raster.
 * Bis 1400px: horizontaler Card-Slider.
 *
 * Button-Gestaltung vom vorhandenen Referenz-Slider.
 */
.card-slider {
  --card-slider-gap: var(--spacing-16, 16px);
}

.card-slider-nav {
  --card-slider-button-size: 52px;
  --card-slider-button-gap: 8px;
  --card-slider-icon-size: 18px;
  --card-slider-button-background: var(--color-deep-sea, #012c2d);
  --card-slider-button-icon: var(--color-bright-yellow, #e1ff51);
  display: none;
}

/*
 * =========================================================
 * SLIDER BIS 1400PX
 */
@media (max-width: 1400px) {
  .card-slider {
    display: flex !important;
    grid-template-columns: none !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch;
    gap: var(--card-slider-gap) !important;
    /* Slider bis zu den Bildschirmrändern verbreitern. */
    width: calc( 100% + (var(--space-wrapper) * 2) ) !important;
    max-width: none !important;
    margin-left: calc(var(--space-wrapper) * -1);
    margin-right: calc(var(--space-wrapper) * -1);
    /* Abstand vor der ersten und nach der letzten Card. */
    padding-left: var(--space-wrapper);
    padding-right: var(--space-wrapper);
    overflow-x: auto;
    overflow-y: visible;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scroll-padding-left: var(--space-wrapper);
    scroll-padding-right: var(--space-wrapper);
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .card-slider::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .card-slider > .e-con {
    flex: 0 0 calc( (100% - var(--card-slider-gap)) / 2.35 ) !important;
    width: calc( (100% - var(--card-slider-gap)) / 2.35 ) !important;
    max-width: calc( (100% - var(--card-slider-gap)) / 2.35 ) !important;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  /*
   * =====================================================
   * NAVIGATION
   */
  .card-slider-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--card-slider-button-gap);
    width: 100%;
    margin-top: var(--spacing-32, 32px);
    padding: 0;
  }

  .card-slider-nav .card-slider-nav__button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--card-slider-button-size);
    width: var(--card-slider-button-size);
    min-width: var(--card-slider-button-size);
    max-width: var(--card-slider-button-size);
    height: var(--card-slider-button-size);
    min-height: var(--card-slider-button-size);
    max-height: var(--card-slider-button-size);
    margin: 0 !important;
    padding: 0 !important;
    -webkit-appearance: none;
    appearance: none;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--card-slider-button-background) !important;
    color: var(--card-slider-button-icon) !important;
    box-shadow: none !important;
    text-shadow: none;
    line-height: 1;
    opacity: 1;
    filter: none;
    transform: none !important;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.2s;
  }

  .card-slider-nav .card-slider-nav__button::before,
  .card-slider-nav .card-slider-nav__button::after {
    content: none !important;
    display: none !important;
  }

  /*
   * =====================================================
   * ORIGINAL-SVG DES REFERENZ-SLIDERS
   */
  .card-slider-nav .card-slider-nav__button svg {
    display: block;
    flex: 0 0 auto;
    width: var(--card-slider-icon-size);
    height: var(--card-slider-icon-size);
    fill: none !important;
    pointer-events: none;
  }

  .card-slider-nav .card-slider-nav__button svg path {
    fill: var(--card-slider-button-icon) !important;
    stroke: var(--card-slider-button-icon) !important;
    stroke-width: 1;
    transition: fill 0.2s, stroke 0.2s;
  }

  /* Das Original-SVG zeigt nach links. */
  .card-slider-nav .card-slider-nav__button--previous svg {
    transform: none !important;
  }

  .card-slider-nav .card-slider-nav__button--next svg {
    transform: rotate(180deg) !important;
  }

  /*
   * =====================================================
   * HOVER WIE BEIM REFERENZ-SLIDER
   */
  .card-slider-nav .card-slider-nav__button:hover:not(:disabled) {
    background: var(--card-slider-button-icon) !important;
    color: var(--card-slider-button-background) !important;
  }

  .card-slider-nav .card-slider-nav__button:hover:not(:disabled) svg path {
    fill: var(--card-slider-button-background) !important;
    stroke: var(--card-slider-button-background) !important;
  }

  /* Sichtbarer Tastaturfokus. */
  .card-slider-nav .card-slider-nav__button:focus-visible {
    outline: 2px solid var(--card-slider-button-background) !important;
    outline-offset: 4px;
  }

  /*
   * =====================================================
   * DEAKTIVIERTE BUTTONS
   *
   * Behalten die Grundfarben.
   * Die Klickfunktion deaktiviert das Script.
   */
  .card-slider-nav .card-slider-nav__button:disabled,
  .card-slider-nav .card-slider-nav__button:disabled:hover,
  .card-slider-nav .card-slider-nav__button:disabled:focus,
  .card-slider-nav .card-slider-nav__button:disabled:active {
    background: var(--card-slider-button-background) !important;
    color: var(--card-slider-button-icon) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    cursor: not-allowed;
  }

  .card-slider-nav .card-slider-nav__button:disabled svg path {
    fill: var(--card-slider-button-icon) !important;
    stroke: var(--card-slider-button-icon) !important;
  }
}

/*
 * =========================================================
 * TABLET: ORIGINAL-BUTTONGRÖSSE 48PX
 */
@media (max-width: 1024px) {
  .card-slider-nav {
    --card-slider-button-size: 48px;
  }
}

/*
 * =========================================================
 * MOBILE: ORIGINAL-BUTTONGRÖSSE 44PX
 *
 * Eine vollständige und eine angeschnittene Card.
 */
@media (max-width: 767px) {
  .card-slider {
    --card-slider-gap: var(--spacing-16, 16px);
    width: calc( 100% + (var(--space-wrapper) * 2) ) !important;
    margin-left: calc(var(--space-wrapper) * -1);
    margin-right: calc(var(--space-wrapper) * -1);
    padding-left: var(--space-wrapper);
    padding-right: var(--space-wrapper);
    scroll-padding-left: var(--space-wrapper);
    scroll-padding-right: var(--space-wrapper);
  }

  .card-slider > .e-con {
    flex: 0 0 calc( (100% - var(--card-slider-gap)) / 1.15 ) !important;
    width: calc( (100% - var(--card-slider-gap)) / 1.15 ) !important;
    max-width: calc( (100% - var(--card-slider-gap)) / 1.15 ) !important;
  }

  .card-slider-nav {
    --card-slider-button-size: 44px;
    margin-top: var(--spacing-24, 24px);
  }
}

/*
 * =========================================================
 * REDUZIERTE BEWEGUNG
 */
@media (prefers-reduced-motion: reduce) {
  .card-slider {
    scroll-behavior: auto;
  }

  .card-slider-nav .card-slider-nav__button,
  .card-slider-nav .card-slider-nav__button svg path {
    transition: none;
  }
}

/*
 * ========================================
 * Produktkarten – Grundzustand
 */
.product-card {
  --card-bg: #f1f9f8;
  --card-text: #003638;
  --card-icon: #00a58e;
  --card-hover-bg: #005c50;
  --card-hover-text: #ffffff;
  --card-hover-accent: var(--color-bright-yellow);
  background-color: var(--card-bg) !important;
  color: var(--card-text);
  transition: background-color 250ms ease, color 250ms ease;
}

/* Texte und Links */
.product-card :where( h1, h2, h3, h4, h5, h6, p, span, a, i, .elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-box-description, .jet-listing-dynamic-field__content, .jet-listing-dynamic-link__link ) {
  color: inherit;
  transition: color 250ms ease;
}

/* Icon im Grundzustand */
.product-card .elementor-icon-box-icon .elementor-icon,
.product-card .elementor-icon-box-icon .elementor-icon i,
.product-card .product-card-icon,
.product-card .product-card-icon :where(i, span, .elementor-icon) {
  color: var(--card-icon) !important;
}

/* SVG-Icons */
.product-card :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg {
  fill: currentColor;
  transition: fill 250ms ease, stroke 250ms ease;
}

.product-card :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [fill]:not([fill="none"]) {
  fill: currentColor;
}

.product-card :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [stroke]:not([stroke="none"]) {
  stroke: currentColor;
}

/*
 * ========================================
 * Hover und Tastaturfokus
 */
.product-card:is(:hover, :focus-within) {
  background-color: var(--card-hover-bg) !important;
  color: var(--card-hover-text);
}

/* Beschreibung und Links werden weiß */
.product-card:is(:hover, :focus-within) :where( h1, h2, h3, h4, h5, h6, p, span, a, i, .elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-box-description, .jet-listing-dynamic-field__content, .jet-listing-dynamic-link__link ) {
  color: var(--card-hover-text) !important;
}

/* Icon-Box: Titel und Icon werden Bright Yellow */
.product-card:is(:hover, :focus-within) :is( .elementor-icon-box-title, .elementor-icon-box-title *, .elementor-icon-box-icon .elementor-icon, .elementor-icon-box-icon .elementor-icon *, .product-card-title, .product-card-title *, .product-card-icon, .product-card-icon * ) {
  color: var(--card-hover-accent) !important;
}

/* SVG-Füllfarbe auch gegen Elementor-Vorgaben setzen */
.product-card:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg {
  fill: var(--card-hover-accent) !important;
}

.product-card:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [fill]:not([fill="none"]) {
  fill: var(--card-hover-accent) !important;
}

.product-card:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [stroke]:not([stroke="none"]) {
  stroke: var(--card-hover-accent) !important;
}

/* Reduzierte Bewegung */
@media (prefers-reduced-motion: reduce) {
  .product-card,
  .product-card * {
    transition: none !important;
  }
}

/*
 * ========================================
 * Dunkle Produktkarten – Grundzustand
 */
.product-card-dark {
  --card-bg: #103638;
  --card-text: #ffffff;
  --card-icon: var(--color-bright-yellow, #e5ff43);
  --card-hover-bg: var(--color-bright-yellow, #e5ff43);
  --card-hover-text: #003638;
  --card-hover-accent: #003638;
  --card-duration: 450ms;
  --card-easing: cubic-bezier(0.4, 0, 0.2, 1);
  background-color: var(--card-bg) !important;
  color: var(--card-text);
  transition: background-color var(--card-duration) var(--card-easing), color var(--card-duration) var(--card-easing);
}

/* Vertikaler Aufbau */
.product-card-dark,
.product-card-dark > .e-con-inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-start !important;
  gap: 0 !important;
}

/* Texte und Links */
.product-card-dark :where( h1, h2, h3, h4, h5, h6, p, span, a, i, .elementor-heading-title, .elementor-icon-box-title, .elementor-widget-text-editor, .elementor-icon-box-description, .jet-listing-dynamic-field__content, .jet-listing-dynamic-link__link ) {
  color: var(--card-text) !important;
  transition: color var(--card-duration) var(--card-easing);
}

/* Icon im Grundzustand */
.product-card-dark .elementor-icon-box-icon .elementor-icon,
.product-card-dark .elementor-icon-box-icon .elementor-icon i,
.product-card-dark .product-card-icon,
.product-card-dark .product-card-icon :where(i, span, .elementor-icon) {
  color: var(--card-icon) !important;
}

/* SVG-Icons */
.product-card-dark :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg {
  fill: var(--card-icon) !important;
}

.product-card-dark :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [fill]:not([fill="none"]) {
  fill: var(--card-icon) !important;
}

.product-card-dark :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [stroke]:not([stroke="none"]) {
  stroke: var(--card-icon) !important;
}

/*
 * ========================================
 * Text – weich auf- und zuklappen
 */
.product-card-dark .card-text {
  display: grid !important;
  grid-template-rows: 0fr;
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  pointer-events: none;
  transition: grid-template-rows var(--card-duration) var(--card-easing), margin var(--card-duration) var(--card-easing), opacity var(--card-duration) var(--card-easing), visibility 0s linear var(--card-duration);
}

.product-card-dark .card-text > .elementor-widget-container {
  min-height: 0 !important;
  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
}

.product-card-dark .card-text p:first-child {
  margin-top: 0;
}

.product-card-dark .card-text p:last-child {
  margin-bottom: 0;
}

/* Button-Abstand im Grundzustand */
.product-card-dark .card-button {
  padding-top: var(--spacing-80, 80px) !important;
  transition: padding-top var(--card-duration) var(--card-easing);
}

/*
 * ========================================
 * Hover und Tastaturfokus
 */
.product-card-dark:is(:hover, :focus-within) {
  background-color: var(--card-hover-bg) !important;
  color: var(--card-hover-text);
}

/* Text aufklappen */
.product-card-dark:is(:hover, :focus-within) .card-text {
  grid-template-rows: 1fr;
  margin: 20px 0 0 !important;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: grid-template-rows var(--card-duration) var(--card-easing), margin var(--card-duration) var(--card-easing), opacity var(--card-duration) var(--card-easing), visibility 0s;
}

/* Button-Abstand weich reduzieren */
.product-card-dark:is(:hover, :focus-within) .card-button {
  padding-top: var(--spacing-48, 48px) !important;
}

/* Texte und Links werden dunkel */
.product-card-dark:is(:hover, :focus-within) :where( h1, h2, h3, h4, h5, h6, p, span, a, i, .elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-box-description, .jet-listing-dynamic-field__content, .jet-listing-dynamic-link__link ) {
  color: var(--card-hover-text) !important;
}

/* Titel und Icons werden dunkel */
.product-card-dark:is(:hover, :focus-within) :is( .elementor-icon-box-title, .elementor-icon-box-title *, .elementor-icon-box-icon .elementor-icon, .elementor-icon-box-icon .elementor-icon *, .product-card-title, .product-card-title *, .product-card-icon, .product-card-icon * ) {
  color: var(--card-hover-accent) !important;
}

/* SVG-Farben bei Hover und Tastaturfokus */
.product-card-dark:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg {
  fill: var(--card-hover-accent) !important;
}

.product-card-dark:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [fill]:not([fill="none"]) {
  fill: var(--card-hover-accent) !important;
}

.product-card-dark:is(:hover, :focus-within) :is( .elementor-icon-box-icon .elementor-icon, .product-card-icon ) svg [stroke]:not([stroke="none"]) {
  stroke: var(--card-hover-accent) !important;
}

/* Icons: Farbwechsel sofort, Bewegungseffekte weiterhin möglich */
.product-card-dark :is( .elementor-icon-box-icon, .elementor-icon-box-icon *, .product-card-icon, .product-card-icon * ) {
  transition-property: transform, opacity !important;
}

/* Touchgeräte */
@media (hover: none) {
  .product-card-dark .card-text {
    grid-template-rows: 1fr;
    margin: 20px 0 0 !important;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .product-card-dark .card-button {
    padding-top: var(--spacing-48, 48px) !important;
  }
}

/* Reduzierte Bewegung */
@media (prefers-reduced-motion: reduce) {
  .product-card-dark,
  .product-card-dark * {
    transition: none !important;
  }
}

.breadcrumb-webinar nav.rank-math-breadcrumb a {
  color: var(--color-white);
  font-size: var(--font-body-small);
}

.breadcrumb-webinar nav.rank-math-breadcrumb span.last {
  color: var(--color-white);
  font-size: var(--font-body-small);
  font-weight: 600;
}

.breadcrumb-webinar span.separator {
  color: var(--color-white);
}

/*
 * ========================================
 * Webinar-Agenda
 */
.webinar-agenda {
  --agenda-border: #6AC2B6;
  --agenda-accent: #079985;
  --agenda-text: #003337;
  --agenda-break-bg: #F1FAF9;
}

/* Listing ohne Zwischenräume */
.webinar-agenda .jet-listing-grid__items {
  margin: 0 !important;
  gap: 0 !important;
}

.webinar-agenda .jet-listing-grid__items > .jet-listing-grid__item {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Jede Agenda-Zeile */
.webinar-agenda .agenda-row {
  display: grid !important;
  grid-template-columns: 90px minmax(0, 1fr) minmax(180px, 25%);
  align-items: center;
  gap: 24px;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  min-height: 0;
  margin: 0 !important;
  padding: 24px 12px !important;
  border: 0 !important;
  border-top: 1px solid var(--agenda-border) !important;
  border-radius: 0;
  color: var(--agenda-text);
}

/* Elementor-Innenwrapper für das Grid auflösen */
.webinar-agenda .agenda-row > .e-con-inner {
  display: contents !important;
}

/* Ausschließlich letzter Eintrag: unterer Rahmen */
.webinar-agenda .jet-listing-grid__items > .jet-listing-grid__item:last-child .agenda-row {
  border-bottom: 1px solid var(--agenda-border) !important;
}

/* Hilfsfeld für die Art des Eintrags ausblenden */
.webinar-agenda .agenda-row .agenda-type {
  display: none !important;
}

/* Pause: Hintergrund der gesamten Zeile einfärben */
.webinar-agenda .agenda-row:has(.agenda-type-break) {
  background-color: var(--agenda-break-bg) !important;
  background-image: none !important;
}

/* Die drei Inhaltscontainer */
.webinar-agenda .agenda-row :is(.agenda-time, .agenda-content, .agenda-speaker) {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

/* Inhalt untereinander */
.webinar-agenda .agenda-content {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
}

/* Widget-Breiten und Abstände */
.webinar-agenda .agenda-row .elementor-widget {
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
}

.webinar-agenda .agenda-row .jet-listing-dynamic-field,
.webinar-agenda .agenda-row .jet-listing-dynamic-field__inline-wrap,
.webinar-agenda .agenda-row .jet-listing-dynamic-field__content {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
}

/* Uhrzeit */
.webinar-agenda .agenda-time .jet-listing-dynamic-field__content {
  color: var(--agenda-accent);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* Titel */
.webinar-agenda .agenda-title .jet-listing-dynamic-field__content {
  color: var(--agenda-text);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
}

/* Beschreibung */
.webinar-agenda .agenda-description .jet-listing-dynamic-field__content {
  color: var(--agenda-text);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
}

/* Speaker */
.webinar-agenda .agenda-speaker .jet-listing-dynamic-field__content {
  color: var(--agenda-accent);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  text-align: right;
  overflow-wrap: break-word;
}

.webinar-agenda .agenda-row p {
  margin: 0;
}

.webinar-agenda .agenda-row p + p {
  margin-top: 0.5em;
}

/* Tablet */
@media (max-width: 1024px) {
  .webinar-agenda .agenda-row {
    grid-template-columns: 80px minmax(0, 1fr);
    column-gap: 20px;
    row-gap: 8px;
  }

  .webinar-agenda .agenda-time {
    grid-column: 1;
    grid-row: 1;
  }

  .webinar-agenda .agenda-content {
    grid-column: 2;
    grid-row: 1;
  }

  .webinar-agenda .agenda-speaker {
    grid-column: 2;
    grid-row: 2;
  }

  .webinar-agenda .agenda-speaker .jet-listing-dynamic-field__content {
    text-align: left;
  }
}

/* Mobil */
@media (max-width: 767px) {
  /* Nur die Card erhält oben und unten Padding */
  .webinar-agenda .agenda-row {
    --padding-top: 20px;
    --padding-bottom: 20px;
    --padding-left: 8px;
    --padding-right: 8px;
    --gap: 8px;
    --row-gap: 8px;
    --column-gap: 0px;

    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 20px 8px !important;
  }

  /* Innerer Wrapper erzeugt keine eigenen Abstände */
  .webinar-agenda .agenda-row > .e-con-inner {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
  }

  /* Eigene Abstände und Höhen aller drei Inhaltscontainer entfernen */
  .webinar-agenda .agenda-row :is(
  .agenda-time,
  .agenda-content,
  .agenda-speaker
  ) {
    --padding-top: 0px;
    --padding-bottom: 0px;
    --padding-left: 0px;
    --padding-right: 0px;
    --gap: 0px;
    --row-gap: 0px;
    --column-gap: 0px;

    justify-content: flex-start !important;
    flex-grow: 0 !important;
    flex-basis: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  .webinar-agenda .agenda-time {
    order: 1;
  }

  .webinar-agenda .agenda-content {
    order: 2;
  }

  .webinar-agenda .agenda-speaker {
    order: 3;
  }

  /* Auch verschachtelte Innenwrapper ohne zusätzliche Abstände */
  .webinar-agenda .agenda-row :is(
  .agenda-time,
  .agenda-content,
  .agenda-speaker
  ) .e-con-inner {
    justify-content: flex-start !important;
    flex-grow: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  /* Widget-Abstände bei Uhrzeit, Inhalt und Name entfernen */
  .webinar-agenda .agenda-row .elementor-widget,
  .webinar-agenda .agenda-row .elementor-widget-container {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Dynamische Felder mobil links ausrichten */
  .webinar-agenda .agenda-row .jet-listing-dynamic-field,
  .elementor-3594 .elementor-element.elementor-element-ae9d880 .jet-listing-dynamic-field {
    justify-content: flex-start !important;
  }

  .webinar-agenda .agenda-speaker .jet-listing-dynamic-field__inline-wrap {
    justify-content: flex-start !important;
  }

  .webinar-agenda .agenda-speaker .jet-listing-dynamic-field__content {
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .webinar-agenda .agenda-time .jet-listing-dynamic-field__content {
    font-size: 21px;
    line-height: 1.4;
  }

  .webinar-agenda .agenda-title .jet-listing-dynamic-field__content,
  .webinar-agenda .agenda-description .jet-listing-dynamic-field__content,
  .webinar-agenda .agenda-speaker .jet-listing-dynamic-field__content {
    font-size: 17px;
  }
}

/*
 * ========================================
 * Speaker-Listing: Abstände und Bildmaske
 */
.webinar-speakers {
  --speaker-gap: var(--spacing-8) var(--spacing-16);
  --speaker-image-width: 74px;
  --speaker-image-position: center;
  --speaker-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='74' height='64' viewBox='0 0 74 64'%3E%3Cpath d='M18.4332 64H55.2995L73.7327 32L55.2995 3.22296e-06L18.4332 0L0 32L18.4332 64Z' fill='%23012C2D'/%3E%3C/svg%3E");
}

/* Drei Spalten mit 32px Zwischenraum */
.webinar-speakers .jet-listing-grid__items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--speaker-gap) !important;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* JetEngine-Spaltenbreiten und Abstandspadding zurücksetzen */
.webinar-speakers .jet-listing-grid__items > .jet-listing-grid__item {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

/* Bild-Widget: 74px breit, links ausgerichtet */
.webinar-speakers .speaker-image {
  width: var(--speaker-image-width) !important;
  max-width: 100% !important;
  min-width: 0;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  align-self: flex-start;
}

/* Innere Bild-Wrapper */
.webinar-speakers .speaker-image .elementor-widget-container,
.webinar-speakers .speaker-image .jet-listing-dynamic-field,
.webinar-speakers .speaker-image .jet-listing-dynamic-field__inline-wrap,
.webinar-speakers .speaker-image .jet-listing-dynamic-field__content,
.webinar-speakers .speaker-image picture {
  display: block;
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

/* Sechseckiges Bild: 74 × 64px */
.webinar-speakers .speaker-image img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 74 / 64;
  object-fit: cover;
  object-position: var(--speaker-image-position);
  border-radius: 0 !important;
  -webkit-mask-image: var(--speaker-mask);
  mask-image: var(--speaker-mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mask-mode: alpha;
}

/* Tablet und Mobil: eine Spalte */
@media (max-width: 1024px) {
  .webinar-speakers .jet-listing-grid__items {
    grid-template-columns: minmax(0, 1fr);
  }
}

/*
 * ========================================
 * Dunkler Card-Slider – Navigation
 */
/* Normalzustand: Bright Yellow mit Deep-Sea-Pfeil */
.card-slider-dark .card-slider-nav__button {
  background-color: var(--color-bright-yellow, #e1ff51) !important;
  color: var(--color-deep-sea, #012c2d) !important;
  border-color: transparent !important;
  transition: background-color 200ms ease;
}

/* SVG übernimmt die Pfeilfarbe */
.card-slider-dark .card-slider-nav__button svg {
  color: inherit !important;
}

.card-slider-dark .card-slider-nav__button svg [fill]:not([fill="none"]) {
  fill: currentColor !important;
}

.card-slider-dark .card-slider-nav__button svg [stroke]:not([stroke="none"]) {
  stroke: currentColor !important;
}

/* Hover und Tastaturfokus: weißer Hintergrund */
.card-slider-dark .card-slider-nav__button:not(:disabled):is( :hover, :focus-visible ) {
  background-color: #ffffff !important;
  color: var(--color-deep-sea, #012c2d) !important;
}

/* Reduzierte Bewegung */
@media (prefers-reduced-motion: reduce) {
  .card-slider-dark .card-slider-nav__button {
    transition: none !important;
  }
}

/*
 * =========================================================
 * HUBSPOT-FORMULARE – CPRO
 */
/* Basis */
.cpro-hubspot-form {
  width: 100%;
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body);
}

.cpro-hubspot-form,
.cpro-hubspot-form *,
.cpro-hubspot-form *::before,
.cpro-hubspot-form *::after {
  box-sizing: border-box;
}

.cpro-hubspot-form form {
  width: 100%;
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
}

/* Felder untereinander */
.cpro-hubspot-form form fieldset {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.cpro-hubspot-form form fieldset .hs-form-field {
  float: none !important;
  width: 100% !important;
  min-width: 0;
  margin: 0 0 var(--spacing-8);
  padding: 0;
}

.cpro-hubspot-form .hs-form-field > .input {
  margin: 0 !important;
}

/* Beschriftungen */
.cpro-hubspot-form .hs-form-field > label {
  display: block;
  margin: 0 0 var(--spacing-24);
  padding: 0;
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body-small);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body);
}

.cpro-hubspot-form .hs-form-required {
  margin-left: 0.2em;
  color: var(--color-rich-teal);
}

/* Eingabefelder */
.cpro-hubspot-form input.hs-input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.cpro-hubspot-form select.hs-input,
.cpro-hubspot-form textarea.hs-input {
  display: block;
  width: 100% !important;
  max-width: none !important;
  min-height: 12px;
  margin: 0;
  padding: var(--spacing-8);
  border: 1px solid var(--color-teal-2);
  border-radius: 0;
  background-color: var(--color-white);
  box-shadow: none;
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body-small);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body-large);
  transition: border-color 0.25s ease, background-color 0.25s ease;
}

.cpro-hubspot-form input.hs-input::placeholder,
.cpro-hubspot-form textarea.hs-input::placeholder {
  color: var(--color-deep-sea);
  opacity: 1;
}

.cpro-hubspot-form textarea.hs-input {
  min-height: 9rem;
  resize: vertical;
}

/* Dropdowns – eigener Pfeil mit definiertem Randabstand */
.cpro-hubspot-form .hs-fieldtype-select > .input {
  position: relative;
}

.cpro-hubspot-form .hs-fieldtype-select > .input > select.hs-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: none;
  /* Platz für Pfeil und Abstand zum Text */
  padding-right: calc( var(--spacing-16) + var(--spacing-16) + 0.75rem );
  cursor: pointer;
}

.cpro-hubspot-form .hs-fieldtype-select > .input::after {
  content: "";
  position: absolute;
  top: 50%;
  right: calc(var(--spacing-16) + 0.125rem);
  width: 0.5rem;
  height: 0.5rem;
  border-right: 2px solid var(--color-deep-sea);
  border-bottom: 2px solid var(--color-deep-sea);
  transform: translateY(-75%) rotate(45deg);
  pointer-events: none;
}

/* Native Darstellung bei Mehrfachauswahl */
.cpro-hubspot-form .hs-fieldtype-select > .input:has( select[multiple] )::after {
  content: none;
}

.cpro-hubspot-form .hs-fieldtype-select > .input > select[multiple] {
  padding: var(--spacing-16);
}

/* Hover und Fokus */
.cpro-hubspot-form input.hs-input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):hover,
.cpro-hubspot-form select.hs-input:hover,
.cpro-hubspot-form textarea.hs-input:hover {
  border-color: var(--color-rich-teal);
}

.cpro-hubspot-form input.hs-input:focus,
.cpro-hubspot-form select.hs-input:focus,
.cpro-hubspot-form textarea.hs-input:focus {
  border-color: var(--color-rich-teal);
  outline: 2px solid var(--color-rich-teal);
  outline-offset: 2px;
}

/* Checkboxen und Radio-Buttons */
.cpro-hubspot-form .inputs-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cpro-hubspot-form .inputs-list > li {
  margin: 0 0 var(--spacing-8);
  padding: 0;
  list-style: none;
}

.cpro-hubspot-form .hs-form-booleancheckbox-display,
.cpro-hubspot-form .hs-form-checkbox-display,
.cpro-hubspot-form .hs-form-radio-display {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-16);
  margin: 0;
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body);
  cursor: pointer;
}

.cpro-hubspot-form input.hs-input[type="checkbox"],
.cpro-hubspot-form input.hs-input[type="radio"] {
  appearance: auto;
  flex: 0 0 1.25rem;
  float: none !important;
  width: 1.25rem !important;
  height: 1.25rem;
  min-height: 0;
  margin: 0.2em 0 0;
  padding: 0;
  accent-color: var(--color-rich-teal);
  cursor: pointer;
}

.cpro-hubspot-form .hs-form-booleancheckbox-display > span,
.cpro-hubspot-form .hs-form-checkbox-display > span,
.cpro-hubspot-form .hs-form-radio-display > span {
  display: block;
  min-width: 0;
  margin: 0 !important;
}

/* Einwilligung und Hinweise */
.cpro-hubspot-form .legal-consent-container,
.cpro-hubspot-form .hs-richtext,
.cpro-hubspot-form .hs-field-desc {
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body-small);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body);
}

.cpro-hubspot-form .legal-consent-container p {
  margin: 0;
  font-size: var(--font-body-small);
}

.cpro-hubspot-form .legal-consent-container p + p {
  margin-top: var(--spacing-8);
}

.cpro-hubspot-form a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.cpro-hubspot-form a:hover,
.cpro-hubspot-form a:focus-visible {
  color: var(--color-rich-teal);
}

/* Button – Primary-Tokens */
.cpro-hubspot-form .hs-submit > .actions {
  margin: var(--spacing-8) 0 0;
  padding: 0;
}

.cpro-hubspot-form .hs-button,
.cpro-hubspot-form .hs-button:hover,
.cpro-hubspot-form .hs-button:focus {
  appearance: none;
  display: inline-block;
  width: auto;
  max-width: 100%;
  min-height: var(--button-height);
  margin: 0;
  padding: var(--spacing-8) var(--button-padding-x);
  border: 1px solid var(--button-primary-bg);
  border-radius: 0;
  background: var(--button-primary-bg);
  box-shadow: none;
  color: var(--button-primary-color);
  font-family: var(--font-primary);
  font-size: var(--font-button);
  font-weight: var(--font-weight-button);
  line-height: var(--line-height-button);
  text-align: center;
  text-decoration: none;
  text-transform: none;
  white-space: normal;
  cursor: pointer;
  transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease;
}

.cpro-hubspot-form .hs-button:focus-visible {
  outline: 2px solid var(--color-rich-teal);
  outline-offset: 4px;
}

.cpro-hubspot-form .hs-button:disabled {
  border-color: var(--button-disabled-bg);
  background: var(--button-disabled-bg);
  color: var(--button-disabled-color);
  opacity: 0.65;
  cursor: not-allowed;
}

/* Fehlermeldungen */
.cpro-hubspot-form .hs-error-msgs {
  margin: var(--spacing-8) 0 0;
  padding: 0;
  list-style: none;
}

.cpro-hubspot-form .hs-error-msgs li,
.cpro-hubspot-form .hs-error-msgs label {
  margin: 0;
  padding: 0;
  color: var(--color-error);
  font-family: var(--font-primary);
  font-size: var(--font-body-small);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body-small);
  list-style: none;
}

.cpro-hubspot-form .hs-input.error,
.cpro-hubspot-form .hs-input.invalid,
.cpro-hubspot-form .hs-input[aria-invalid="true"] {
  border-color: var(--color-error) !important;
}

.cpro-hubspot-form .hs_error_rollup {
  margin-bottom: var(--spacing-16);
}

/* Bestätigung nach dem Absenden */
.cpro-hubspot-form .submitted-message {
  padding: var(--spacing-24);
  border: 1px solid var(--color-rich-teal);
  background-color: var(--color-soft-teal-50);
  color: var(--color-deep-sea);
  font-family: var(--font-primary);
  font-size: var(--font-body-large);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-body-large);
}

.cpro-hubspot-form .submitted-message p:last-child {
  margin-bottom: 0;
}

/* Mobil */
@media (max-width: 767px) {
  .cpro-hubspot-form .hs-button {
    width: 100%;
  }
}

/* Reduzierte Bewegung */
@media (prefers-reduced-motion: reduce) {
  .cpro-hubspot-form *,
  .cpro-hubspot-form *::before,
  .cpro-hubspot-form *::after {
    transition: none !important;
  }
}

/* HubSpot: zweispaltiges Layout und Beschriftungen im Feld */
.cpro-hubspot-form form {
  display: block !important;
}

/* Vorname und Nachname: mobil untereinander */
.cpro-hubspot-form form fieldset.form-columns-2 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  width: 100% !important;
  max-width: none !important;
  align-items: start;
}

.cpro-hubspot-form form fieldset .hs-form-field {
  float: none !important;
  width: 100% !important;
  min-width: 0;
  margin-bottom: var(--spacing-16) !important;
}

.cpro-hubspot-form form fieldset .hs-form-field > .input {
  margin-right: 0 !important;
}

/* Die Klasse wird erst nach dem Setzen des Platzhalters ergänzt. */
.cpro-hubspot-form form .cpro-label-inside {
  position: relative;
}

.cpro-hubspot-form form .cpro-label-inside input.hs-input {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100%;
  min-height: 56px;
  margin: 0 !important;
  padding: 16px !important;
  color: var(--color-deep-sea, #012c2d);
  background-color: var(--color-white, #fff);
}

.cpro-hubspot-form form .cpro-label-inside input::placeholder {
  color: var(--color-deep-sea, #012c2d);
  opacity: 1;
}

/* Labels für Screenreader erhalten; Checkboxen und Fehler bleiben sichtbar. */
.cpro-hubspot-form form .cpro-label-inside > label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (min-width: 768px) {
  .cpro-hubspot-form form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--spacing-16);
    row-gap: 0;
    align-items: start;
  }

  /* Datenschutz, Button und weitere Elemente über die volle Breite. */
  .cpro-hubspot-form form > * {
    grid-column: 1 / -1;
    min-width: 0;
  }

  .cpro-hubspot-form form fieldset.form-columns-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: var(--spacing-16) !important;
  }

  .cpro-hubspot-form form > fieldset.form-columns-1:has(input[name="email"]) {
    grid-column: 1;
  }

  .cpro-hubspot-form form > fieldset.form-columns-1:has(input[name="phone"]) {
    grid-column: 2;
  }
}

/*
 * =========================================
 * ZITAT-SLIDER – NAVIGATION UND DOTS
 * CSS-Klasse am Listing Grid: zitat-slider
 */
.zitat-slider {
  position: relative;
  overflow: visible !important;
}

.zitat-slider .jet-listing-grid {
  position: relative;
  overflow: visible !important;
  padding-bottom: 88px;
}

.zitat-slider .jet-listing-grid__slider {
  position: relative;
  overflow: hidden;
}

/* Navigation: 24 px unter dem Slider */
.zitat-slider .jet-listing-grid__slider-icon {
  position: absolute !important;
  z-index: 30;
  top: auto !important;
  bottom: 65px !important;
  left: auto !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background-color: var(--color-deep-sea);
  cursor: pointer;
  transform: none !important;
  transition: background-color 0.2s ease;
}

/* Zurück */
.zitat-slider .prev-arrow {
  right: 60px !important;
}

/* Weiter */
.zitat-slider .next-arrow {
  right: 0 !important;
}

.zitat-slider .jet-listing-grid__slider-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.zitat-slider .prev-arrow svg {
  transform: none !important;
}

.zitat-slider .next-arrow svg {
  transform: rotate(180deg) !important;
}

.zitat-slider .jet-listing-grid__slider-icon svg path {
  fill: var(--color-bright-yellow) !important;
  stroke: var(--color-bright-yellow) !important;
  transition: fill 0.2s ease, stroke 0.2s ease;
}

.zitat-slider .jet-listing-grid__slider-icon:hover {
  background-color: var(--color-bright-yellow);
}

.zitat-slider .jet-listing-grid__slider-icon:hover svg path {
  fill: var(--color-deep-sea) !important;
  stroke: var(--color-deep-sea) !important;
}

/* Tatsächlicher JetEngine-Dots-Wrapper */
.zitat-slider .jet-engine-swiper-pagination-wrapper {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  margin: 48px 0 0 !important;
  padding: 0 !important;
}

/* Dots */
.zitat-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
  width: 58px !important;
  height: 4px !important;
  margin: 0 5px !important;
  border: 0;
  border-radius: 0 !important;
  background-color: #9eddd8 !important;
  opacity: 1 !important;
  transition: background-color 0.2s ease;
}

.zitat-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet-active {
  background-color: var(--color-deep-sea) !important;
}

/* Tablet */
@media (max-width: 1024px) {
  .zitat-slider .jet-listing-grid {
    padding-bottom: 80px;
  }

  .zitat-slider .jet-listing-grid__slider-icon {
    bottom: 58px !important;
    width: 48px;
    height: 48px;
  }

  .zitat-slider .prev-arrow {
    right: 56px !important;
  }

  .zitat-slider .jet-engine-swiper-pagination-wrapper {
    margin-top: 24px !important;
  }

  .zitat-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
    width: 46px !important;
    margin: 0 4px !important;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .zitat-slider .jet-listing-grid {
    padding-bottom: 72px;
  }

  .zitat-slider .jet-listing-grid__slider-icon {
    bottom: 0px !important;
    width: 44px;
    height: 44px;
  }

  .zitat-slider .prev-arrow {
    right: 52px !important;
  }

  .zitat-slider .jet-engine-swiper-pagination-wrapper {
    margin-top: 32px !important;
  }

  .zitat-slider .jet-engine-swiper-pagination-wrapper .swiper-pagination-bullet {
    width: 30px !important;
    height: 3px !important;
    margin: 0 3px !important;
  }
}

/*
 * =========================================
 * ZITAT-HERO – LISTING-TEMPLATE
 * Äußerer Template-Container: zitat-hero
 * Listing Grid Widget: zitat-slider
 */
.zitat-hero {
  --hero-background: var(--color-deep-sea);
  --hero-wrapper-width: 1680px;
  --hero-height: clamp(680px, 39.583vw, 760px);
  --hero-media-width: clamp(687px, 40vw, 768px);
  --hero-image-position: 50% 50%;
  --hero-edge: max( var(--space-wrapper, 0px), calc((100vw - var(--hero-wrapper-width)) / 2) );
  --hero-text-width: calc( 100vw - var(--hero-edge) - var(--hero-media-width) );
  position: relative;
  min-height: var(--hero-height);
  overflow: hidden !important;
  background-color: var(--hero-background) !important;
}

.zitat-hero > .e-con-inner {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(0, 66%) minmax(0, 34%);
  align-items: stretch !important;
  min-height: var(--hero-height);
  gap: 0 !important;
  overflow: visible !important;
}

/* Textbereich links */
.zitat-hero .zitat-hero__content {
  position: static;
  z-index: 3;
  grid-column: 1 / 2;
  align-self: stretch !important;
  justify-self: start;
  align-items: flex-start !important;
  justify-content: center !important;
  width: min(100%, var(--hero-text-width)) !important;
  max-width: var(--hero-text-width) !important;
  min-width: 0;
  box-sizing: border-box;
  padding: clamp(64px, 5vw, 96px) clamp(48px, 6vw, 112px) clamp(64px, 5vw, 96px) 0 !important;
}

.zitat-hero .zitat-hero__content > .elementor-element,
.zitat-hero .zitat-hero__content .elementor-widget-container {
  max-width: 100%;
  min-width: 0;
}

.zitat-hero .zitat-hero__content h1,
.zitat-hero .zitat-hero__content h2,
.zitat-hero .zitat-hero__content h3,
.zitat-hero .zitat-hero__content h4 {
  width: 100%;
  max-width: 100%;
  color: var(--color-deep-sea, #012c2d);
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  white-space: normal !important;
}

.zitat-hero .zitat-hero__content .elementor-widget-text-editor {
  width: 100%;
  max-width: 720px;
  color: var(--color-deep-sea, #012c2d);
}

.zitat-hero .zitat-hero__content .elementor-widget-text-editor,
.zitat-hero .zitat-hero__content .elementor-widget-text-editor p {
  color: var(--color-deep-sea, #012c2d);
}

.zitat-hero .zitat-hero__content .elementor-widget-button {
  align-self: flex-start;
}

/* Bildbereich rechts */
.zitat-hero .zitat-hero-image {
  position: absolute !important;
  z-index: 1;
  top: 0;
  right: calc(-1 * var(--hero-edge));
  bottom: 0;
  isolation: isolate;
  width: var(--hero-media-width) !important;
  height: auto !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.zitat-hero .zitat-hero__photo {
  position: absolute !important;
  z-index: 1;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.zitat-hero .zitat-hero__photo > .elementor-widget-container,
.zitat-hero .zitat-hero__photo > .elementor-widget-container > a,
.zitat-hero .zitat-hero__photo > .elementor-widget-container > picture,
.zitat-hero .zitat-hero__photo picture {
  display: block;
  width: 100%;
  height: 100%;
}

.zitat-hero .zitat-hero__photo img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  object-position: var(--hero-image-position);
  mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/mask.svg");
  mask-repeat: no-repeat;
  mask-position: left top;
  mask-size: auto 100%;
  mask-mode: alpha;
}

/* Gelber Doppel-Pfeil */
.zitat-hero .zitat-hero-image::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 7.222%;
  left: 0;
  width: auto;
  height: 43.684%;
  aspect-ratio: 171 / 332;
  pointer-events: none;
  background-color: var(--color-bright-yellow);
  mask-image: url("https://www.cpro-gruppe.de/wp-content/uploads/2026/09/double-arrow-icon.svg");
  mask-repeat: no-repeat;
  mask-position: left top;
  mask-size: 100% 100%;
}

/* Branchen-Label rechts oben */
.zitat-hero .zitat-term {
  position: absolute !important;
  z-index: 5;
  top: clamp(32px, 3vw, 48px);
  right: clamp(32px, 3vw, 48px);
  margin: 0 !important;
}

.zitat-hero .zitat-term .jet-listing-dynamic-terms__link {
  display: inline-block;
  padding: 12px 16px;
  background-color: var(--color-deep-sea, #012c2d);
  color: var(--color-deep-sea) !important;
  font-weight: 700;
}

/* ZITAT-HERO – TABLET UND MOBILE BIS 1024px */
@media (max-width: 1024px) {
  .zitat-hero {
    --hero-mobile-image-height: min(70vw, 600px);
    min-height: 0 !important;
    padding: 0 20px !important;
  }

  .zitat-hero > .e-con-inner {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100%;
    min-height: 0 !important;
    padding: var(--hero-mobile-image-height) 0 0 !important;
  }

  /* Bild über die gesamte Breite */
  .zitat-hero .zitat-hero-image {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--hero-mobile-image-height) !important;
    min-height: 0 !important;
    max-width: none !important;
    aspect-ratio: auto;
    /* Gemeinsames Koordinatensystem für Bildmaske und SVG. */
    container-type: inline-size;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  .zitat-hero .zitat-hero__photo img {
    object-fit: cover;
    object-position: 60% center;
    /*
     * Kontur aus Ebene_4.svg: Die Bildkante läuft durch
     * die untere Außenkante des großen Pfeils. Alle Abstände beziehen
     * sich auf dieselbe Containerbreite wie das SVG.
     */
    -webkit-mask-image: none;
    mask-image: none;
    clip-path: polygon( 0 0, 100% 0, 100% calc(100% - 40.84904068cqw), 29.19131646cqw calc(100% + 0.03157975cqw), 0 calc(100% - 16.82198558cqw) );
  }

  /* Doppelpfeil nach unten */
  .zitat-hero .zitat-hero-image::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: auto;
    right: auto;
    bottom: 0;
    left: 7cqw;
    width: 44cqw;
    height: auto;
    aspect-ratio: 158 / 81;
    background-color: var(--color-bright-yellow, #e1ff51);
    background-image: none;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%22158%22%20height%3D%2281%22%20viewBox%3D%220%200%20158%2081%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url%28%23clip0_1355_33659%29%22%3E%0A%3Cpath%20d%3D%22M79.687%2081.1134L158.532%2035.5931L158.532%2019.2332L79.687%2064.7535L0.843298%2019.2332L0.843296%2035.5931L79.687%2081.1134Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3Cpath%20d%3D%22M129.351%20-5.72205e-05L78.8437%2029.1603L28.3385%20-6.60323e-05L28.3385%2016.3599L78.8437%2045.5202L129.351%2016.3599L129.351%20-5.72205e-05Z%22%20fill%3D%22%23079985%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_1355_33659%22%3E%0A%3Crect%20width%3D%22157.689%22%20height%3D%2280.86%22%20fill%3D%22white%22%20transform%3D%22translate%28157.689%2080.86%29%20rotate%28-180%29%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transform: none;
    pointer-events: none;
  }

  /* Inhalt unterhalb des Bildes */
  .zitat-hero .zitat-hero__content {
    order: 2;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    align-items: flex-start !important;
    padding: 28px 0 64px !important;
  }

  .zitat-hero .zitat-hero__content :is(h1, h2, h3, h4) {
    text-wrap: wrap;
    overflow-wrap: anywhere;
  }

  .zitat-hero .zitat-hero__content .elementor-widget-text-editor {
    width: 100%;
    max-width: none;
  }

  /* Gemeinsamen Button-Container untereinander ausrichten */
  .zitat-hero .zitat-hero__content .e-con:has(> .elementor-widget-button),
  .zitat-hero .zitat-hero__content .e-con-inner:has(> .elementor-widget-button) {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .zitat-hero .zitat-hero__content .elementor-widget-button {
    width: auto !important;
    align-self: flex-start;
  }

  /* Branchen-Label innerhalb der Bildfläche */
  .zitat-hero .zitat-term {
    top: 20px !important;
    right: 20px !important;
    left: auto !important;
    bottom: auto !important;
    width: auto !important;
    max-width: calc(100% - 40px);
  }

  .zitat-hero .zitat-term .jet-listing-dynamic-terms__link {
    padding: 8px 12px;
    font-size: var(--font-body-small, 0.875rem);
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/*
 * =========================================================
 * ZITAT-HERO – GESTALTUNG UND VARIABLEN
 * Die globalen Theme-Tokens werden mit Fallbacks übernommen.
 */
.zitat-hero {
  --hero-background: var(--color-white, #fff);
  --hero-height: clamp(560px, 35.7vw, 720px);
  --zitat-content-width: 60%;
  --hero-media-width: calc(100% - var(--zitat-content-width));
  --hero-edge: 0px;
  --hero-text-width: 100%;
  --zitat-accent: var(--color-rich-teal, #079985);
  --zitat-text: var(--color-deep-sea, #012c2d);
  --zitat-font: var(--font-primary, "General Sans", sans-serif);
  --zitat-quote-size: var(--font-heading-m, clamp(1.5rem, 1.1538461538rem + 1.5384615385vw, 3rem));
  --zitat-name-size: var(--font-heading-xs, 1.5rem);
  --zitat-role-size: var(--font-body-small, 0.875rem);
  --zitat-line-height: var(--line-height-heading, 1.2);
  --zitat-regular: var(--font-weight-regular, 400);
  --zitat-semibold: var(--font-weight-semibold, 600);
  --zitat-padding: var(--spacing-96, 6rem);
  --zitat-author-gap: var(--spacing-16, 1rem);
  --zitat-content-gap: var(--spacing-64, 4rem);
  --zitat-mobile-padding: var(--spacing-24, 1.5rem);
  --zitat-mobile-top: var(--spacing-32, 2rem);
  --zitat-mobile-bottom: var(--spacing-64, 4rem);
  --zitat-image-position: 60% center;
  box-sizing: border-box;
  padding: 0 !important;
  font-family: var(--zitat-font);
}

.zitat-hero > .e-con-inner {
  position: static;
  width: 100% !important;
  max-width: none !important;
  grid-template-columns: minmax(0, var(--zitat-content-width)) minmax(0, var(--hero-media-width));
}

.zitat-hero .zitat-hero__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between !important;
  gap: var(--zitat-content-gap);
  padding: var(--zitat-padding) !important;
}

/* Klasse auf das Text-, Überschrift- oder dynamische Feld-Widget. */
.zitat-hero .zitat-hero__content .zitat-hero__quote,
.zitat-hero .zitat-hero__content .zitat-hero__quote :is( .elementor-heading-title, .jet-listing-dynamic-field__content, blockquote, p, h1, h2, h3, h4 ) {
  color: var(--zitat-accent);
  font-family: var(--zitat-font);
  font-size: var(--zitat-quote-size);
  font-weight: var(--zitat-regular);
  line-height: var(--zitat-line-height);
  letter-spacing: normal;
  overflow-wrap: anywhere;
}

.zitat-hero .zitat-hero__quote blockquote {
  margin: 0;
  padding: 0;
  border: 0;
}

.zitat-hero .zitat-hero__quote p {
  margin: 0;
}

.zitat-hero .zitat-hero__quote p + p {
  margin-top: 1em;
}

.zitat-hero .zitat-hero__author {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--zitat-author-gap);
  width: 100%;
  padding: 0;
  margin: 0;
}

.zitat-hero .zitat-hero__author > .e-con-inner {
  flex-direction: column;
  align-items: flex-start;
  gap: var(--zitat-author-gap);
}

.zitat-hero .zitat-hero__content .zitat-hero__name,
.zitat-hero .zitat-hero__content .zitat-hero__name :is( .elementor-heading-title, .jet-listing-dynamic-field__content, p ) {
  margin: 0;
  color: var(--zitat-text);
  font-size: var(--zitat-name-size);
  font-weight: var(--zitat-regular);
  line-height: var(--zitat-line-height);
}

.zitat-hero .zitat-hero__content .zitat-hero__role,
.zitat-hero .zitat-hero__content .zitat-hero__role :is( .elementor-heading-title, .jet-listing-dynamic-field__content, p ) {
  margin: 0;
  color: var(--zitat-accent);
  font-size: var(--zitat-role-size);
  font-weight: var(--zitat-semibold);
  line-height: var(--line-height-body, 1.5);
}

.zitat-hero .zitat-hero-image::after {
  background-color: var(--zitat-accent);
}

@media (max-width: 1024px) {
  .zitat-hero {
    padding: 0 var(--zitat-mobile-padding) !important;
  }

  .zitat-hero .zitat-hero__content {
    padding: var(--zitat-mobile-top) 0 var(--zitat-mobile-bottom) !important;
    justify-content: flex-start !important;
  }

  .zitat-hero .zitat-hero__photo img {
    object-position: var(--zitat-image-position);
  }
}

/*
 * JetSmartFilters – Suchicon für das Referenzen-Suchfeld.
 * CSS-Klasse am Search-Filter-Widget: search-filter-referenzen
 * Das SVG ist eingebettet; ein Upload ist nicht erforderlich.
 */
.search-filter-referenzen {
  --referenzen-search-icon-size: 16px;
  --referenzen-search-icon-right: 12px;
}

.search-filter-referenzen input.jet-search-filter__input {
  box-sizing: border-box;
  padding-right: calc( var(--referenzen-search-icon-right) + var(--referenzen-search-icon-size) + 16px ) !important;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M11.2766%206.37548C11.2766%205.0748%2010.7599%203.82739%209.84022%202.90768C8.9205%201.98796%207.67309%201.47126%206.37241%201.47126C5.07173%201.47126%203.82433%201.98796%202.90461%202.90768C1.98489%203.82739%201.4682%205.0748%201.4682%206.37548C1.4682%207.67616%201.98489%208.92356%202.90461%209.84328C3.82433%2010.763%205.07173%2011.2797%206.37241%2011.2797C7.67309%2011.2797%208.9205%2010.763%209.84022%209.84328C10.7599%208.92356%2011.2766%207.67616%2011.2766%206.37548ZM10.3326%2011.3747C9.24444%2012.236%207.87126%2012.751%206.37548%2012.751C2.85364%2012.751%200%209.89732%200%206.37548C0%202.85364%202.85364%200%206.37548%200C9.89732%200%2012.751%202.85364%2012.751%206.37548C12.751%207.87126%2012.236%209.24751%2011.3747%2010.3326L16%2014.9579L14.9609%2015.9969L10.3356%2011.3716L10.3326%2011.3747Z%22%20fill%3D%22black%22%2F%3E%0A%3C%2Fsvg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right var(--referenzen-search-icon-right) center !important;
  background-size: var(--referenzen-search-icon-size) var(--referenzen-search-icon-size) !important;
}

@media (max-width: 767px) {
  .search-filter-referenzen {
    --referenzen-search-icon-size: 16px;
    --referenzen-search-icon-right: 12px;
  }
}

/* Geschäftsführer – Bild und SVG-Fallback mit identischer Maske */
.geschaeftsfuehrer_image {
  --geschaeftsfuehrer-image-position: center;
  --geschaeftsfuehrer-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='74' height='64' viewBox='0 0 74 64'%3E%3Cpath d='M18.4332 64H55.2995L73.7327 32L55.2995 3.22296e-06L18.4332 0L0 32L18.4332 64Z' fill='%23012C2D'/%3E%3C/svg%3E");
}

.geschaeftsfuehrer_image .elementor-widget-container,
.geschaeftsfuehrer_image .jet-listing-dynamic-field,
.geschaeftsfuehrer_image .jet-listing-dynamic-field__inline-wrap,
.geschaeftsfuehrer_image .jet-listing-dynamic-field__content,
.geschaeftsfuehrer_image .jet-listing-dynamic-image,
.geschaeftsfuehrer_image .jet-listing-dynamic-image__link,
.geschaeftsfuehrer_image picture {
  display: block;
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  height: auto !important;
  margin: 0;
  padding: 0;
}

.geschaeftsfuehrer_image img {
  position: static !important;
  display: block;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: 74 / 64 !important;
  object-fit: cover;
  object-position: var(--geschaeftsfuehrer-image-position);
  margin: 0 !important;
  border-radius: 0 !important;
  -webkit-mask-image: var(--geschaeftsfuehrer-mask);
  mask-image: var(--geschaeftsfuehrer-mask);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mask-mode: alpha;
}

/* Tablet und Mobil */
@media (max-width: 1024px) {
  .geschaeftsfuehrer_image {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    aspect-ratio: auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .geschaeftsfuehrer_image .elementor-widget-container,
  .geschaeftsfuehrer_image .jet-listing-dynamic-field,
  .geschaeftsfuehrer_image .jet-listing-dynamic-field__inline-wrap,
  .geschaeftsfuehrer_image .jet-listing-dynamic-field__content,
  .geschaeftsfuehrer_image .jet-listing-dynamic-image,
  .geschaeftsfuehrer_image picture,
  .geschaeftsfuehrer_image a {
    position: static !important;
    display: block;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    margin: 0;
    padding: 0;
  }
}

/* =========================================
 IMAGE ACCORDION
 ========================================= */

.image-accordion {
  --accordion-background: #002e30;
  --accordion-gap: 18px;
  --accordion-padding: clamp(24px, 2.4vw, 40px);
  --accordion-duration: 550ms;
  --accordion-easing: cubic-bezier(0.22, 1, 0.36, 1);

  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: var(--accordion-gap) !important;

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

.image-accordion,
.image-accordion * {
  box-sizing: border-box;
}

/* Karte */

.image-accordion .image-accordion-card {
  position: relative !important;
  isolation: isolate;

  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  gap: 0 !important;

  flex: 1 1 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: clamp(440px, 31vw, 540px);

  margin: 0 !important;
  padding: var(--accordion-padding) !important;

  overflow: hidden;
  border: 0;
  border-radius: 0 !important;
  background: var(--accordion-background) !important;
  color: #fff;
  text-align: left;
  cursor: pointer;

  transition:
  flex-grow var(--accordion-duration) var(--accordion-easing);
}

.image-accordion .image-accordion-card[data-open="true"] {
  flex-grow: 3.15 !important;
}

.image-accordion .image-accordion-card:focus-visible {
  outline: 3px solid #d9ff43;
  outline-offset: 5px;
}

/* Hintergrundbild */

.image-accordion .image-accordion-card-bg-img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0;

  width: 100% !important;
  height: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  opacity: 0;
  pointer-events: none;

  transition:
  opacity var(--accordion-duration) var(--accordion-easing);
}

.image-accordion .image-accordion-card-bg-img > div,
.image-accordion .image-accordion-card-bg-img a,
.image-accordion .image-accordion-card-bg-img picture {
  display: block;
  width: 100%;
  height: 100%;
}

.image-accordion .image-accordion-card-bg-img img {
  display: block;

  width: 100% !important;
  height: 100% !important;
  max-width: none !important;

  object-fit: cover;
  object-position: center;
  border-radius: 0 !important;
}

.image-accordion
.image-accordion-card[data-open="true"]
.image-accordion-card-bg-img {
  opacity: 1;
}

/* Bildabdunklung */

.image-accordion .image-accordion-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;

  background: linear-gradient(
  180deg,
  rgba(0, 46, 48, 0.32) 0%,
  rgba(0, 46, 48, 0.38) 40%,
  rgba(0, 46, 48, 0.82) 100%
  );

  opacity: 0;
  pointer-events: none;

  transition:
  opacity var(--accordion-duration) var(--accordion-easing);
}

.image-accordion .image-accordion-card[data-open="true"]::after {
  opacity: 1;
}

/* Icon */

.image-accordion .image-accordion-card-icon {
  position: relative;
  z-index: 2;

  flex: 0 0 auto;
  align-self: flex-start;

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

  text-align: left !important;
  pointer-events: none;
}

.image-accordion .image-accordion-card-icon img {
  display: block;

  width: auto !important;
  height: 64px !important;
  max-width: 100% !important;

  object-fit: contain;
  object-position: left center;
}

/* Überschrift */

.image-accordion .image-accordion-card-headline {
  position: relative;
  z-index: 2;

  flex: 0 0 auto;
  width: 100% !important;
  max-width: none !important;

  margin: auto 0 0 !important;
  padding: 0 !important;

  color: #fff !important;
  text-align: left !important;
}

.image-accordion .image-accordion-card-headline,
.image-accordion .image-accordion-card-headline :is(
h2, h3, h4, h5, h6, p, span, a
) {
  margin-bottom: 0 !important;
  color: #fff !important;
  font-family: inherit;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  overflow-wrap: normal;
  hyphens: manual;
}

/* Beschreibung */

.image-accordion .image-accordion-card-text {
  position: relative;
  z-index: 2;

  flex: 0 0 auto;
  width: 100% !important;
  max-width: 560px !important;

  margin: 10px 0 0 !important;
  padding: 0 !important;

  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

.image-accordion .image-accordion-card-text p {
  margin: 0 0 0.75em !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

.image-accordion .image-accordion-card-text p:last-child {
  margin-bottom: 0 !important;
}

.image-accordion .image-accordion-card-text[hidden] {
  display: none !important;
}

/* Tablet */

@media (max-width: 1024px) {
  .image-accordion {
    --accordion-gap: 16px;
    --accordion-padding: 28px;

    flex-direction: column !important;
  }

  .image-accordion .image-accordion-card {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 160px;

    transition:
    min-height var(--accordion-duration) var(--accordion-easing);
  }

  .image-accordion .image-accordion-card[data-open="true"] {
    flex-grow: 0 !important;
    min-height: 420px;
  }

  .image-accordion .image-accordion-card-icon {
    margin-bottom: 24px !important;
  }

  .image-accordion .image-accordion-card-icon img {
    height: 52px !important;
  }
}

/* Mobil */

@media (max-width: 767px) {
  .image-accordion {
    --accordion-gap: 12px;
    --accordion-padding: 24px;
  }

  .image-accordion .image-accordion-card[data-open="true"] {
    min-height: 380px;
  }

  .image-accordion .image-accordion-card-headline,
  .image-accordion .image-accordion-card-headline :is(
  h2, h3, h4, h5, h6, p, span, a
  ) {
    font-size: 17px !important;
  }

  .image-accordion .image-accordion-card-text {
    font-size: 16px !important;
  }
}

/* Reduzierte Bewegung */

@media (prefers-reduced-motion: reduce) {
  .image-accordion .image-accordion-card,
  .image-accordion .image-accordion-card::after,
  .image-accordion .image-accordion-card-bg-img {
    transition: none !important;
  }
}

/* Kompetenzkarten: Fallback-Icons im Normal- und Hover-Zustand */
.kompetenz-card .kompetenz-icon .icon-light img[src$="/branchen-icon-light.svg"],
.kompetenz-card .kompetenz-icon .icon-dark img[src$="/chevron.svg"] {
  display: block;
  width: auto !important;
  height: var(--spacing-32, 32px) !important;
  max-width: 100% !important;
  max-height: var(--spacing-32, 32px) !important;
  object-fit: contain;
  object-position: center top;
  margin-inline: auto;
}

/* =========================================
 ZITAT-MODUL
 Proportionale Abstände nach dem Entwurf
 ========================================= */

.zitat-modul {
  --zitat-zeichen-breite: 7%;
  --zitat-zeichen-abstand: 12%;
  --zitat-padding-seitlich: 5%;

  box-sizing: border-box;
  width: 100%;
  min-width: 0;

  /* Ungefähres Seitenverhältnis aus dem Entwurf.
   Bei mehr Inhalt darf das Modul höher werden. */
  aspect-ratio: 1.9 / 1;
  height: auto !important;

  padding:
  var(--spacing-48, 48px)
  var(--zitat-padding-seitlich) !important;

  align-self: stretch;
}

/* Unterstützt volle und begrenzte Elementor-Inhaltsbreite */
.zitat-modul:not(:has(> .e-con-inner)),
.zitat-modul > .e-con-inner {
  display: grid !important;

  grid-template-columns:
  var(--zitat-zeichen-breite)
  minmax(0, 1fr)
  var(--zitat-zeichen-breite);

  column-gap: var(--zitat-zeichen-abstand) !important;
  row-gap: 0 !important;

  align-items: center !important;
  align-content: center !important;
}

/* Elementor-Container mit zusätzlichem Innencontainer */
.zitat-modul:has(> .e-con-inner) {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.zitat-modul > .e-con-inner {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  flex-grow: 1;
  margin: 0 !important;
  padding: 0 !important;
}

/* Mittlerer Inhalt */
.zitat-modul .zitat-modul__inhalt {
  grid-column: 2;
  grid-row: 1;

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

  margin: 0 !important;
  padding-inline: 0 !important;

  align-self: center !important;
  justify-self: stretch;
}

/* Beide Bild-Widgets */
.zitat-modul :is(
.zitat-modul__zeichen-links,
.zitat-modul__zeichen-rechts
) {
  position: static !important;
  inset: auto !important;
  transform: none !important;

  grid-row: 1;
  align-self: center !important;
  justify-self: center;

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

  margin: 0 !important;
  padding: 0 !important;
}

.zitat-modul .zitat-modul__zeichen-links {
  grid-column: 1;
}

.zitat-modul .zitat-modul__zeichen-rechts {
  grid-column: 3;
}

/* Bild-Wrapper */
.zitat-modul :is(
.zitat-modul__zeichen-links,
.zitat-modul__zeichen-rechts
) :is(.elementor-widget-container, a, picture) {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
}

/* SVGs proportional skalieren */
.zitat-modul :is(
.zitat-modul__zeichen-links,
.zitat-modul__zeichen-rechts
) img {
  display: block;

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

  margin: 0 !important;
  object-fit: contain;
}

/* Mobil: volle Breite für den Inhalt */
@media (max-width: 767px) {
  .zitat-modul {
    aspect-ratio: auto;
    min-height: 0 !important;
    padding: 32px 24px !important;
  }

  .zitat-modul:not(:has(> .e-con-inner)),
  .zitat-modul > .e-con-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 0 !important;
  }

  .zitat-modul .zitat-modul__inhalt {
    grid-column: 1;
  }

  .zitat-modul :is(
  .zitat-modul__zeichen-links,
  .zitat-modul__zeichen-rechts
  ) {
    display: none !important;
  }
}

nav.rank-math-breadcrumb p {
  margin-block-end: 0 !important;
  margin-block-start: 0;
}

nav.rank-math-breadcrumb a {
  color: var(--color-deep-sea);
  font-size: var(--font-body-small);
}

nav.rank-math-breadcrumb span.last {
  color: var(--color-deep-sea);
  font-size: var(--font-body-small);
  font-weight: 600;
}

/* =========================================
 KOMPETENZFELDER – ARGUMENTE ACCORDION
 Verwendet die vorhandenen Theme-Tokens.
 ========================================= */

.kompetenzfelder-argumente {
  --argumente-font-size: 18px;
  --argumente-padding-y: 32px;
  --argumente-padding-x: var(--spacing-24, 24px);
  --argumente-content-gap: 16px;
  --argumente-card-gap: var(--spacing-8, 8px);
  --argumente-icon-size: 18px;
  --argumente-icon-gap: var(--spacing-32, 32px);

  color: var(--color-deep-sea, #012c2d);
  font-family: var(--font-primary, "General Sans", sans-serif);
}

/* Listing: eine Spalte */
.kompetenzfelder-argumente .jet-listing-grid__items {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--argumente-card-gap) !important;
  margin: 0 !important;
}

.kompetenzfelder-argumente .jet-listing-grid__item {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Die Kartenklasse wird automatisch gesetzt. */
.kompetenzfelder-argumente .argumente-accordion-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;

  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: var(--spacing-32) var(--spacing-24) !important;
  color: var(--color-deep-sea, #012c2d);
  background: var(--color-white, #fff) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.kompetenzfelder-argumente
.argumente-accordion-card > .e-con-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Titel- und Text-Widgets */
.kompetenzfelder-argumente .argumente-accordion-card
:is(.argumente_titel, .argumente_text) {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Dynamische Feld-Wrapper */
.kompetenzfelder-argumente
:is(.argumente_titel, .argumente_text)
:is(
.elementor-widget-container,
.jet-listing-dynamic-field,
.jet-listing-dynamic-field__inline-wrap,
.jet-listing-dynamic-field__content
) {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

/* Titel: Body Semibold, 18 px */
.kompetenzfelder-argumente .argumente_titel,
.kompetenzfelder-argumente .argumente_titel
:is(h1, h2, h3, h4, h5, h6, p, span,
.jet-listing-dynamic-field__content),
.kompetenzfelder-argumente button.argumente-toggle {
  color: var(--color-deep-sea, #012c2d) !important;
  font-family:
  var(--font-primary, "General Sans", sans-serif) !important;
  font-size: var(--font-body) !important;
  font-weight: var(--font-weight-semibold, 600) !important;
  line-height: var(--line-height-body, 1.5) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

.kompetenzfelder-argumente .argumente_titel
:is(h1, h2, h3, h4, h5, h6, p) {
  margin: 0 !important;
  padding: 0 !important;
}

/* Bedienbarer Titel mit Plus/Minus rechts */
.kompetenzfelder-argumente button.argumente-toggle {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--argumente-icon-gap);

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

  text-align: left;
  text-decoration: none;
  white-space: normal;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  cursor: pointer;
}

.kompetenzfelder-argumente button.argumente-toggle:focus-visible {
  outline: 2px solid var(--color-deep-sea, #012c2d);
  outline-offset: 6px;
}

.kompetenzfelder-argumente .argumente-toggle__label {
  flex: 1 1 auto;
  min-width: 0;
}

/* Plus/Minus: 18 px */
.kompetenzfelder-argumente .argumente-toggle__icon {
  position: relative;
  display: block;
  flex: 0 0 var(--argumente-icon-size);
  width: var(--argumente-icon-size);
  height: var(--argumente-icon-size);
}

.kompetenzfelder-argumente .argumente-toggle__icon::before,
.kompetenzfelder-argumente .argumente-toggle__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--argumente-icon-size);
  height: 2px;
  background: currentColor;
  transform: translate(-50%, -50%);
}

.kompetenzfelder-argumente .argumente-toggle__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: opacity 180ms ease, transform 180ms ease;
}

.kompetenzfelder-argumente
.argumente-toggle[aria-expanded="true"]
.argumente-toggle__icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(0deg);
}

/* Text: Body Regular, 18 px */
.kompetenzfelder-argumente
.argumente-accordion-card .argumente_text {
  box-sizing: border-box;
  margin-top: var(--spacing-16) !important;
  /* Text endet vor der Icon-Spalte: Iconbreite + spacing-32. */
  padding-inline-end: calc(
  var(--argumente-icon-size) + var(--argumente-icon-gap)
  ) !important;
}

.kompetenzfelder-argumente .argumente_text,
.kompetenzfelder-argumente .argumente_text
:is(
.elementor-widget-container,
.jet-listing-dynamic-field,
.jet-listing-dynamic-field__inline-wrap,
.jet-listing-dynamic-field__content,
p, li, span, a
) {
  color: var(--color-deep-sea, #012c2d) !important;
  font-family:
  var(--font-primary, "General Sans", sans-serif) !important;
  font-size: var(--font-topline) !important;
  font-weight: var(--font-weight-regular, 400);
  line-height: var(--line-height-body, 1.5) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

.kompetenzfelder-argumente .argumente_text p {
  margin: 0 0 1em !important;
}

.kompetenzfelder-argumente .argumente_text p:last-child {
  margin-bottom: 0 !important;
}

.kompetenzfelder-argumente .argumente_text a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.kompetenzfelder-argumente .argumente_text[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .kompetenzfelder-argumente .argumente-toggle__icon::after {
    transition: none;
  }
}

/* Äußerer Abschnitt als Bezugspunkt */
.logo-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Das Logo soll sich am äußeren Abschnitt orientieren */
.logo-section > .e-con-inner {
  position: static;
}

/* Textcontainer vor dem Hintergrundlogo */
.logo-section > .e-con-inner > .e-con {
  position: relative;
  z-index: 1;
}

/* Das komplette Elementor-Bild-Widget positionieren */
.logo-section .elementor-widget-image.bg-img-logo {
  position: absolute !important;

  top: 50% !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;

  width: clamp(260px, 29.5vw, 526px) !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  transform: translateY(-50%) !important;

  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Bild füllt das positionierte Widget */
.logo-section .bg-img-logo > .elementor-widget-container {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

.logo-section .bg-img-logo img {
  display: block;
  position: static;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0;
  transform: none;
}

/* Äußerer Abschnitt */
.logo-section-full {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Bezugspunkt für das Logo bleibt der äußere Abschnitt */
.logo-section-full > .e-con-inner {
  position: static;
}

/* Inhalte vor dem Hintergrundlogo */
.logo-section-full > .e-con-inner > .e-con {
  position: relative;
  z-index: 1;
}

/* Bild-Widget rechts und vertikal mittig */
.logo-section-full .elementor-widget-image.bg-img-logo-full {
  position: absolute !important;

  top: 50% !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;

  width: clamp(320px, 58vw, 1100px) !important;
  max-width: none !important;
  height: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: translateY(-50%) !important;

  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Innerer Bildcontainer */
.logo-section-full .bg-img-logo-full > .elementor-widget-container {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

/* Bild */
.logo-section-full .bg-img-logo-full img {
  display: block;
  position: static;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0;
  transform: none;
}

/* Abschnitt mit tiefer positioniertem Logo */
.logo-section-low {
  --logo-top: 24%;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Äußerer Abschnitt als Bezugspunkt */
.logo-section-low > .e-con-inner {
  position: static;
}

/* Inhalte vor dem Logo */
.logo-section-low > .e-con-inner > .e-con {
  position: relative;
  z-index: 1;
}

/* Bild-Widget rechts und nach unten versetzt */
.logo-section-low .elementor-widget-image.bg-img-logo-low {
  position: absolute !important;

  top: var(--logo-top) !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;

  width: clamp(260px, 29.5vw, 526px) !important;
  max-width: none !important;
  height: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: none !important;

  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Innerer Bildcontainer */
.logo-section-low .bg-img-logo-low > .elementor-widget-container {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

/* Logo proportional skalieren */
.logo-section-low .bg-img-logo-low img {
  display: block;
  position: static;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0;
  transform: none;
}

/* Abschnitt mit höher positioniertem Logo */
.logo-section-high {
  --logo-top: 0;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Äußerer Abschnitt als Bezugspunkt */
.logo-section-high > .e-con-inner {
  position: static;
}

/* Inhalte vor dem Logo */
.logo-section-high > .e-con-inner > .e-con {
  position: relative;
  z-index: 1;
}

/* Bild-Widget rechts und nach oben versetzt */
.logo-section-high .elementor-widget-image.bg-img-logo-high {
  position: absolute !important;

  top: var(--logo-top) !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;

  width: clamp(260px, 29.5vw, 526px) !important;
  max-width: none !important;
  height: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: none !important;

  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Innerer Bildcontainer */
.logo-section-high .bg-img-logo-high > .elementor-widget-container {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

/* Logo proportional skalieren */
.logo-section-high .bg-img-logo-high img {
  display: block;
  position: static;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0;
  transform: none;
}

/* Äußerer Footer */
.footer-logo-section {
  --footer-logo-width: 680px;
  --footer-logo-offset: 40%;
  --footer-logo-opacity: 0.1;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Inhalts-Wrapper als Bezugspunkt */
.footer-logo-section > .e-con-inner {
  position: relative;
}

/* Footer-Inhalte vor dem Logo */
.footer-logo-section > .e-con-inner > .elementor-element:not(.footer-bg-logo) {
  position: relative;
  z-index: 1;
}

/* Logo rechts am Wrapper und unten angeschnitten */
.footer-logo-section .elementor-widget-image.footer-bg-logo {
  position: absolute !important;

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

  width: var(--footer-logo-width) !important;
  max-width: 100% !important;
  height: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: translateY(var(--footer-logo-offset)) !important;
  opacity: var(--footer-logo-opacity) !important;

  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Innerer Bildcontainer */
.footer-logo-section .footer-bg-logo > .elementor-widget-container {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
}

/* Bild proportional skalieren */
.footer-logo-section .footer-bg-logo img {
  display: block;
  position: static;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0;
  transform: none;
}

/* Repeater-FAQ: vollständige Styles. Das bestehende FAQ-JavaScript bleibt aktiv.
 * Doppelte Stammklasse erhöht die Priorität gegenüber älteren eingebetteten Styles.
 */

/* Grundeinstellungen */
.webinar-faq.webinar-faq {
  --faq-closed-space: var(--spacing-32, 32px);
  --faq-space: var(--faq-closed-space);
  --faq-open-gap: var(--spacing-16, 16px);
  --faq-number-width: var(--spacing-48, 48px);
  --faq-number-gap: 4px;
  --faq-number-offset: calc(var(--faq-number-width) + var(--faq-number-gap));
  --faq-number-color: #00a39a;
  --faq-border-color: #6ac2b6;
  --faq-text-color: var(--color-deep-sea, #012c2d);
  --faq-number-size: var(--font-heading-xs, 24px);
  --faq-title-size: var(--font-body-large, 20px);
  --faq-answer-size: var(--font-body, 18px);
  --faq-icon-size: 16px;
  --faq-icon-stroke: 2px;
  --faq-icon-gap: var(--spacing-24, 24px);
  --faq-answer-end-space: calc(var(--faq-icon-size) + var(--faq-icon-gap));
}

/* Listing */
.webinar-faq.webinar-faq .jet-listing-grid__items {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  counter-reset: webinar-faq-counter;
}

/* Gesamter Eintrag ist der Bezugspunkt für die Zahl */
.webinar-faq.webinar-faq .jet-listing-grid__items
> .jet-listing-grid__item {
  position: relative !important;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  counter-increment: webinar-faq-counter;
}

/* Zahl mittig zur gesamten Zeile */
.webinar-faq.webinar-faq .jet-listing-grid__items
> .jet-listing-grid__item::before {
  content: counter(webinar-faq-counter, decimal-leading-zero);
  position: absolute !important;
  inset: auto !important;
  top: 50% !important;
  left: 0 !important;
  transform: translateY(-50%) !important;

  display: block !important;
  width: var(--faq-number-width);
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  color: var(--faq-number-color);
  background: none;
  font-size: var(--faq-number-size);
  font-weight: 700;
  line-height: 1;
  text-align: left;
  pointer-events: none;
  z-index: 2;
}

/* Alte Nummer am Elementor-Container entfernen */
.webinar-faq.webinar-faq .webinar-faq-card::before {
  content: none !important;
  display: none !important;
}

/* FAQ-Container */
.webinar-faq.webinar-faq .webinar-faq-card {
  position: relative;
  display: block !important;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  min-height: 0;
  margin: 0 !important;
  padding: 16px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--faq-border-color) !important;
  border-radius: 0;
  background: transparent;
}

.webinar-faq.webinar-faq .webinar-faq-card > .e-con-inner {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Widget-Abstände */
.webinar-faq.webinar-faq .webinar-faq-question,
.webinar-faq.webinar-faq .webinar-faq-answer {
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.webinar-faq.webinar-faq .webinar-faq-question > .elementor-widget-container,
.webinar-faq.webinar-faq .webinar-faq-answer > .elementor-widget-container {
  margin: 0 !important;
  padding: 0 !important;
}

.webinar-faq.webinar-faq .webinar-faq-card .jet-listing-dynamic-field,
.webinar-faq.webinar-faq .webinar-faq-card .jet-listing-dynamic-field__inline-wrap,
.webinar-faq.webinar-faq .webinar-faq-card .jet-listing-dynamic-field__content {
  display: block;
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
}

/* Frage */
.webinar-faq.webinar-faq .webinar-faq-trigger {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--faq-icon-gap);
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding:
  var(--faq-space)
  0
  var(--faq-space)
  var(--faq-number-offset);

  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--faq-text-color);
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
  white-space: normal;

  font-family: var(--font-primary, "General Sans", sans-serif);
  font-size: var(--faq-title-size);
  font-weight: var(--font-weight-semibold, 600);
  line-height: var(--line-height-body, 1.5);

  cursor: pointer;
}

.webinar-faq.webinar-faq .webinar-faq-trigger:hover,
.webinar-faq.webinar-faq .webinar-faq-trigger:focus {
  color: var(--faq-text-color);
  background: transparent;
}

.webinar-faq.webinar-faq .webinar-faq-trigger:focus-visible {
  outline: 2px solid var(--faq-number-color);
  outline-offset: -2px;
}

.webinar-faq.webinar-faq .webinar-faq-trigger-text {
  flex: 1;
  min-width: 0;
}

/* Plus und Minus */
.webinar-faq.webinar-faq .webinar-faq-icon {
  position: relative;
  display: block;
  flex: 0 0 var(--faq-icon-size);
  width: var(--faq-icon-size);
  height: var(--faq-icon-size);
  color: var(--faq-text-color);
}

.webinar-faq.webinar-faq .webinar-faq-icon::before,
.webinar-faq.webinar-faq .webinar-faq-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: currentColor;
  transform: translate(-50%, -50%);
}

.webinar-faq.webinar-faq .webinar-faq-icon::before {
  width: var(--faq-icon-size);
  height: var(--faq-icon-stroke);
}

.webinar-faq.webinar-faq .webinar-faq-icon::after {
  width: var(--faq-icon-stroke);
  height: var(--faq-icon-size);
}

.webinar-faq.webinar-faq .webinar-faq-trigger[aria-expanded="true"]
.webinar-faq-icon::after {
  display: none;
}

.webinar-faq.webinar-faq .webinar-faq-card.is-open .webinar-faq-trigger {
  padding-bottom: var(--faq-open-gap);
}

/* Antwort */
.webinar-faq.webinar-faq .webinar-faq-answer {
  box-sizing: border-box;
  padding:
  0
  var(--faq-answer-end-space)
  var(--faq-space)
  var(--faq-number-offset) !important;

  color: var(--faq-text-color);
  font-family: var(--font-primary, "General Sans", sans-serif);
  font-size: var(--faq-answer-size);
  font-weight: var(--font-weight-regular, 400);
  line-height: var(--line-height-body, 1.5);
}

.webinar-faq.webinar-faq .webinar-faq-answer[hidden] {
  display: none !important;
}

.webinar-faq.webinar-faq .webinar-faq-answer p {
  margin: 0 0 1em;
}

.webinar-faq.webinar-faq .webinar-faq-answer ul,
.webinar-faq.webinar-faq .webinar-faq-answer ol {
  margin: 0 0 1em;
  padding-left: 1.4em;
}

.webinar-faq.webinar-faq .webinar-faq-answer
.jet-listing-dynamic-field__content > :first-child {
  margin-top: 0;
}

.webinar-faq.webinar-faq .webinar-faq-answer
.jet-listing-dynamic-field__content > :last-child {
  margin-bottom: 0;
}

.webinar-faq.webinar-faq .webinar-faq-answer strong,
.webinar-faq.webinar-faq .webinar-faq-answer b {
  font-weight: 600;
}

.webinar-faq.webinar-faq .webinar-faq-answer a {
  color: inherit;
  text-decoration: underline;
}

/* Mobil */
@media (max-width: 767px) {
  .webinar-faq.webinar-faq {
    --faq-number-width: 36px;
    --faq-icon-gap: var(--spacing-16, 16px);
  }

  .webinar-faq.webinar-faq .jet-listing-grid__items
  > .jet-listing-grid__item::before {
    font-size: var(--faq-number-size);
  }

  .webinar-faq.webinar-faq .webinar-faq-trigger {
    gap: var(--faq-icon-gap);
  }
}

/* Dynamische Feld-Widgets übernehmen die Typografie des Antwortcontainers. */
.webinar-faq.webinar-faq .webinar-faq-answer
:is(.jet-listing-dynamic-field, .jet-listing-dynamic-field__inline-wrap,
.jet-listing-dynamic-field__content, p, li) {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

nav.rank-math-breadcrumb {
  line-height: 120%;
}

a.elementor-toc__list-item-text.elementor-item-active {
  font-weight: 600;
}

/* JetSearch im Header: Live-Ausgabe vollständig ausblenden */
#search-desktop .jet-ajax-search__results-area,
#search-desktop .jet-ajax-search__spinner-holder,
#search-desktop .jet-ajax-search__message,
#search-desktop .jet-ajax-search__suggestions-inline-area,
#search-desktop .jet-ajax-search__suggestions-focus-area,
#jet-ajax-search-popup-511f563 .jet-ajax-search__results-area,
#jet-ajax-search-popup-511f563 .jet-ajax-search__spinner-holder,
#jet-ajax-search-popup-511f563 .jet-ajax-search__message,
#jet-ajax-search-popup-511f563 .jet-ajax-search__suggestions-inline-area,
#jet-ajax-search-popup-511f563 .jet-ajax-search__suggestions-focus-area {
  display: none !important;
}

/* Zurück-Pfeil: identisches JetMenu-Icon, nach links gedreht */
.header-mobile-toggle
.jet-mobile-menu__back[aria-label="Back to Prev Items"]::before {
  content: "";

  display: block;
  flex: 0 0 15px;
  width: 15px;
  height: 25px;

  border: 0 !important;
  background: currentColor;

  -webkit-mask:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M8.37189 7.30625L7.84064 7.8375L1.59064 14.0875L1.05939 14.6187L0.0000118051 13.5594L0.531262 13.0281L6.25001 7.30937L0.531262 1.59062L0.0000123515 1.05937L1.05939 0L1.59064 0.53125L7.84064 6.78125L8.37189 7.3125L8.37189 7.30625Z'/%3E%3C/svg%3E")
  center / contain no-repeat;

  mask:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M8.37189 7.30625L7.84064 7.8375L1.59064 14.0875L1.05939 14.6187L0.0000118051 13.5594L0.531262 13.0281L6.25001 7.30937L0.531262 1.59062L0.0000123515 1.05937L1.05939 0L1.59064 0.53125L7.84064 6.78125L8.37189 7.3125L8.37189 7.30625Z'/%3E%3C/svg%3E")
  center / contain no-repeat;

  transform: rotate(180deg) !important;
}

/* Mobiles JetMenu: Kontaktbereich dauerhaft unten */
.header-mobile-toggle .jet-mobile-menu__container {
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

.header-mobile-toggle .jet-mobile-menu__container-inner {
  display: flex !important;
  flex-direction: column !important;

  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box;
  overflow: hidden !important;
}

/* Logo, Suche und Menüsteuerung behalten ihren Platz */
.header-mobile-toggle .jet-mobile-menu__header-template,
.header-mobile-toggle .jet-mobile-menu__controls,
.header-mobile-toggle .jet-mobile-menu__before-template {
  flex: 0 0 auto !important;
}

/* Nur die Menüeinträge scrollen */
.header-mobile-toggle .jet-mobile-menu__body {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}

/* Kontaktbereich mit festem unterem Abstand */
.header-mobile-toggle .jet-mobile-menu__after-template {
  flex: 0 0 auto !important;
  position: relative;
  z-index: 5;

  width: 100%;
  margin-top: auto !important;
  box-sizing: border-box;
  background: #eff8f7;

  padding-bottom: calc(
  var(--spacing-24) + env(safe-area-inset-bottom, 0px)
  ) !important;
}

/* Grundzustand */
.jet-mega-menu.jet-mega-menu--layout-horizontal
.jet-mega-menu-item > .jet-mega-menu-item__inner
.jet-mega-menu-item__title {
  text-shadow:
  -0.3px 0 transparent,
  0.3px 0 transparent;

  transition: text-shadow 300ms ease-in-out;
}

/* Hover und Tastaturfokus: sanfte optische Verstärkung */
.jet-mega-menu.jet-mega-menu--layout-horizontal
.jet-mega-menu-item > .jet-mega-menu-item__inner:hover
.jet-mega-menu-item__title,
.jet-mega-menu.jet-mega-menu--layout-horizontal
.jet-mega-menu-item > .jet-mega-menu-item__inner:focus-within
.jet-mega-menu-item__title {
  text-shadow:
  -0.3px 0 currentColor,
  0.3px 0 currentColor;
}

/* Aktiver Menüpunkt: echter Schriftschnitt */
.jet-mega-menu.jet-mega-menu--layout-horizontal
.jet-mega-menu-item.jet-menu-item--active > .jet-mega-menu-item__inner
.jet-mega-menu-item__title {
  font-weight: 600;
  text-shadow: none;
}

/* Reduzierte Bewegung */
@media (prefers-reduced-motion: reduce) {
  .jet-mega-menu.jet-mega-menu--layout-horizontal
  .jet-mega-menu-item > .jet-mega-menu-item__inner
  .jet-mega-menu-item__title {
    transition: none;
  }
}
