/*
 * mb- Klassen-Äquivalente für v3-Loop-Inseln + Motion-Fallback.
 *
 * Warum Custom CSS (Bordmittel reichen nicht):
 * 1) v3-Inseln (Nav, Footer-Nav, Hero, Loop-Items, DCE): Styles primär in Elementor
 *    (Widget-/Container-Settings + Kit-Globals). Kein visueller Child-Spiegel mehr.
 * 2) Child behält: A11y (:focus-visible, aria-hidden, :focus-within), Conditional
 *    (:empty/:has), Motion/prefers-reduced-motion, Atomic-GC-Fallbacks und Runtime-Lücken.
 * 3) Elementor liefert Global-Class-CSS als global-{postId}-frontend-*.css;
 *
 * Token-Werte nur über CSS Custom Properties (--mb-*), keine Hex-Werte
 * in den Klassenregeln. Kein !important.
 */

:root {
  --mb-primaer: #184478;
  --mb-primaer-hell: #215CA3;
  --mb-weiss: #FFFFFF;
  --mb-text: #606060;
  --mb-nav-inaktiv: #B2BECC;
  --mb-flaeche-footer: #E1E1E1;
	--mb-flaeche-band: #EFF2F6;
  --mb-linie: #C6C6C6;
  --mb-linie-kraeftig: #D0D0D0;
  --mb-deko: #B6BABA;
  --mb-schrift-text: "Open Sans", sans-serif;
  --mb-schrift-headline: "Open Sans Condensed", sans-serif;
  --mb-schrift-nav: "Open Sans", sans-serif; /* war Mallanna – keine Umlaute */
  --mb-abstand-auftakt: 40px;
}

.mb-section {
  padding-block: 60px;
  padding-inline: 0;
}

/* mb-section--surface: Hintergrund am v3-Container in Elementor (Kit mb-flaeche-band). */

.mb-card:not([class*="mb-loop-"]) {
  background-color: var(--mb-weiss);
  border: 1px solid var(--mb-linie);
  border-radius: 8px;
  box-shadow: 0 4px 10px color-mix(in srgb, var(--mb-primaer) 12%, transparent), 0 14px 32px color-mix(in srgb, var(--mb-primaer) 10%, transparent);
  padding: 32px;
}

.mb-card--teaser:not([class*="mb-loop-"]) {
  background-color: var(--mb-weiss);
  border: 1px solid var(--mb-linie);
  border-radius: 8px;
  border-top: 3px solid var(--mb-primaer);
  box-shadow: 0 4px 10px color-mix(in srgb, var(--mb-primaer) 12%, transparent), 0 14px 32px color-mix(in srgb, var(--mb-primaer) 10%, transparent);
  padding: 48px 40px 36px;
  text-align: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mb-card--teaser:hover,
.mb-card--teaser:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px color-mix(in srgb, var(--mb-primaer) 16%, transparent), 0 20px 40px color-mix(in srgb, var(--mb-primaer) 14%, transparent);
}

.mb-eyebrow {
  color: var(--mb-primaer);
  font-family: var(--mb-schrift-text);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 8px;
  text-transform: none;
}

/* v3-Nav: volle Viewport-Breite wie .mainnavigation-wrapper; Inhalt zentriert 1140px */
/*
 * Header-Nav: visuelle Styles liegen am Elementor-nav-menu / nav-insel (Global Colors + Typo).
 * Active/Current inkl. Pointer-Underline: Elementor-Frontend-CSS (inline post-25 /
 * widget-nav-menu), NICHT diese Datei. Hier nur A11y-Fälle ohne Bordmittel.
 * Footer-Active: .current-menu-item unten in .mb-footer-nav.
 */

/* Grund: Elementor klappt das Burger-Menü per max-height/transform ein, setzt aria-hidden,
   lässt Links aber mit offsetParent im DOM. Kein Elementor-Schalter für inert/tabindex=-1. */
.mb-nav nav.elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="true"] {
  visibility: hidden;
}

/* Submenü bei Tastatur-Fokus öffnen (Elementor zeigt sonst nur :hover). */
.mb-nav .elementor-nav-menu--main > .elementor-nav-menu > li:focus-within > .elementor-nav-menu--dropdown,
.mb-nav .elementor-nav-menu--main > .elementor-nav-menu > li:focus-within > ul {
  display: block;
}

.mb-nav a:focus-visible,
.mb-header-logo:focus-visible,
.e-image-link-base:focus-visible {
  outline: 2px solid var(--mb-weiss);
  outline-offset: 3px;
}

.mb-nav .elementor-nav-menu--dropdown a:focus-visible {
  outline-color: var(--mb-primaer);
}

/*
 * Dropdown-Breite: Elementor Pro setzt .elementor-nav-menu ul { width: 12em }
 * fest – zu schmal für lange Submenü-Labels (z. B. Leistungen). Beim ersten
 * Öffnen wirkt das wie die Hauptmenü-Breite; transition:all animiert dann
 * sichtbare Nachkorrekturen. Fix: max-content + keine Width-Transition.
 */
.mb-nav .elementor-nav-menu--main .elementor-nav-menu > li > ul.elementor-nav-menu--dropdown {
	width: max-content;
	min-width: 100%;
	max-width: min(96vw, 40rem);
	transition: none;
}

.mb-nav .elementor-nav-menu--main .elementor-nav-menu > li > ul.elementor-nav-menu--dropdown a {
	white-space: nowrap;
}

/*
 * v3-Footer-Nav: Fläche, Rand, Padding, Linkfarben/Typo/Spacing liegen in
 * Elementor (Container footer-nav-insel + nav-menu + Kit-Globals).
 * Hier nur :focus-visible – Elementor liefert dafür keinen ausreichenden Fokusring.
 */
.mb-footer-nav a:focus-visible {
  outline: 2px solid var(--mb-primaer);
  outline-offset: 3px;
}

/*
 * v3-Loop-Karten/Inseln: Styles in Elementor (Loop-Items 391–394, Insel-Container,
 * loop-grid Gaps, DCE grid_*_gap). Kein Child-Spiegel mehr für Fläche/Typo/Gap.
 */

/* Person-Bild 1:1 – Elementor object-fit allein setzt kein aspect-ratio. */
/*
 * Teamkacheln: kompakter, Sheet-Radius/Schatten, Hover/Zoom.
 * Button nur bei .mb-loop-team--detail (Fließ-/Kurztext vorhanden).
 * Warum Child: v3-Loop-Item; Bordmittel steuern Höhe/Hover/Visibility nicht zuverlässig.
 */
.elementor .mb-card.mb-card--person.mb-loop-team,
.elementor .mb-loop-team.mb-card {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	height: auto;
	border-radius: 12px;
	border-color: var(--mb-linie);
	box-shadow: 0 8px 28px color-mix(in srgb, var(--mb-primaer) 10%, transparent);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.elementor .mb-card.mb-card--person.mb-loop-team:hover,
.elementor .mb-card.mb-card--person.mb-loop-team:focus-within,
.elementor .mb-loop-team.mb-card:hover,
.elementor .mb-loop-team.mb-card:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px color-mix(in srgb, var(--mb-primaer) 16%, transparent);
}

.elementor .mb-loop-insel .dce-wrapper-grid {
	align-items: flex-start;
}

/* Gleiche Spaltenbreite – Flex-Items sonst per Inhalt (langer Text/Button) breiter */
.elementor .mb-loop-insel.dce-col-3 .dce-wrapper-grid > .dce-post-item,
.elementor .mb-loop-insel .dce-col-3 .dce-wrapper-grid > .dce-post-item,
.elementor .mb-loop-grid.dce-col-3 .dce-wrapper-grid > .dce-post-item {
	flex: 0 0 calc((100% - 64px) / 3);
	width: calc((100% - 64px) / 3);
	max-width: calc((100% - 64px) / 3);
	min-width: 0;
	box-sizing: border-box;
}

@media (max-width: 1024px) {
	.elementor .mb-loop-grid.dce-col-tablet-2 .dce-wrapper-grid > .dce-post-item {
		flex-basis: calc((100% - 32px) / 2);
		width: calc((100% - 32px) / 2);
		max-width: calc((100% - 32px) / 2);
	}
}

@media (max-width: 767px) {
	.elementor .mb-loop-grid .dce-wrapper-grid > .dce-post-item {
		flex-basis: 100%;
		width: 100%;
		max-width: 100%;
	}
}

.elementor .mb-loop-insel .dce-posts-container .dce-post-item,
.elementor .mb-loop-insel .dce-item-container,
.elementor .mb-loop-insel .dce-post-block,
.elementor .mb-loop-insel .e-loop-item {
	width: 100%;
	max-width: 100%;
	height: auto;
	align-self: flex-start;
	box-sizing: border-box;
}

.elementor .mb-loop-insel .e-loop-item > .elementor,
.elementor .mb-loop-insel .dce-post-block > .elementor,
.elementor .mb-loop-insel .dce-item-container > .elementor {
	width: 100%;
}

.elementor .mb-loop-team .mb-card-body,
.elementor .mb-loop-team .e-con.mb-card-body {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	padding: 16px 16px 20px;
	box-sizing: border-box;
}

.elementor .mb-loop-team .mb-card-body .elementor-heading-title,
.elementor .mb-loop-team .mb-card-body .elementor-widget-heading {
	max-width: 100%;
	overflow-wrap: anywhere;
	word-break: normal;
}

/* Button nur bei Team-Mitgliedern mit Detailseite */
.elementor .mb-loop-team:not(.mb-loop-team--detail) .elementor-widget-button {
	display: none;
}

.elementor .mb-loop-team.mb-loop-team--detail .mb-btn--outline,
.elementor .mb-loop-team.mb-loop-team--detail .elementor-widget-button,
.elementor .mb-loop-team.mb-loop-team--detail .elementor-button-wrapper {
	margin-block-start: 8px;
	width: 100%;
}

.elementor .mb-person-img,
.elementor .mb-loop-team .elementor-widget-image {
	overflow: hidden;
}

.elementor .mb-person-img,
.elementor .mb-loop-team .elementor-widget-image,
.elementor .mb-loop-team .elementor-widget-image .elementor-widget-container {
	width: 100%;
}

.elementor .mb-person-img img,
.elementor .mb-loop-team .elementor-widget-image img {
	aspect-ratio: 3 / 4;
	height: auto;
	max-height: none;
	object-fit: cover;
	object-position: center top;
	width: 100%;
	display: block;
	transition: transform 0.35s ease;
}

.elementor .mb-loop-team:hover .mb-person-img img,
.elementor .mb-loop-team:focus-within .mb-person-img img,
.elementor .mb-loop-team:hover .elementor-widget-image img,
.elementor .mb-loop-team:focus-within .elementor-widget-image img {
	transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
	.elementor .mb-card.mb-card--person.mb-loop-team,
	.elementor .mb-loop-team.mb-card,
	.elementor .mb-person-img img,
	.elementor .mb-loop-team .elementor-widget-image img {
		transition: none;
		transform: none;
	}

	.elementor .mb-card.mb-card--person.mb-loop-team:hover,
	.elementor .mb-loop-team.mb-card:hover,
	.elementor .mb-loop-team:hover .mb-person-img img,
	.elementor .mb-loop-team:hover .elementor-widget-image img {
		transform: none;
	}
}

/* Loop-Item Typo/Hover/Buttons: Elementor (Templates 391–394). */

/*
 * Logoleiste:/*
 * Logoleiste: Verlauf wie mangoblau .logowrapper.
 * Warum Child-Theme: kein mb-verlauf-*-Token (Projektentscheidung);
 * Elementor liefert den Verlauf auf Atomic-Klassen nicht zuverlässig aus.
 * Stop-Farben sind Bestandswerte der Logoleiste, kein Allgemein-Token.
 */
.elementor .e-flexbox-base.mb-header-logo-bar,
.elementor .e-flexbox-base.s-header-logo-bar {
  background: linear-gradient(
    to bottom,
    #e5e5e5 0%,
    #ececec 25%,
    #fefefe 50%,
    var(--mb-weiss) 75%,
    var(--mb-weiss) 100%
  );
  padding-block: 18px 25px;
  padding-inline: 16px;
}

/*
 * Footer-Hauptfläche: gleicher Grauton-Verlauf wie Logoleiste/Subheader
 * (mangoblau .logowrapper). Warum Child: kein mb-verlauf-*-Token;
 * Elementor liefert Verläufe auf Atomic-Klassen nicht zuverlässig.
 * Stop-Farben = Bestand Logoleiste (kein neues Token).
 */
.elementor .e-flexbox-base.mb-footer-main,
.elementor .e-flexbox-base.s-footer-main,
.elementor-location-footer .e-flexbox-base.s-footer-main {
	background: linear-gradient(
		to bottom,
		var(--mb-weiss) 0%,
		#fefefe 25%,
		#ececec 75%,
		#e5e5e5 100%
	);
	background-color: transparent;
}

.elementor .e-image-base.mb-footer-logo,
.elementor .e-image-base.s-footer-logo {
	width: 142px;
	max-width: 100%;
	height: auto;
	display: block;
	margin-block-end: 12px;
}

.elementor .e-image-base.mb-footer-logo:focus-visible,
.elementor .e-image-base.s-footer-logo:focus-visible,
.elementor .e-image-base.mb-footer-logo a:focus-visible,
.elementor .e-image-base.s-footer-logo a:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 3px;
}


@media (prefers-reduced-motion: reduce) {

.elementor .e-flexbox-base.mb-card--teaser {
    transition: none;
  }

  .elementor .e-flexbox-base.mb-card--teaser:hover,
  .elementor .e-flexbox-base.mb-card--teaser:focus-within {
    transform: none;
  }

  .elementor .mb-teaser-img img,
  .elementor .e-image-base.mb-teaser-img {
    transition: none;
    transform: none;
  }

  .mb-card--teaser {
    transition: none;
  }

  .mb-card--teaser:hover,
  .mb-card--teaser:focus-within,
  .mb-card--teaser.mb-loop-leistung:hover,
  .mb-card--teaser.mb-loop-leistung:focus-within,
  .mb-card--teaser.mb-loop-koop:hover,
  .mb-card--teaser.mb-loop-koop:focus-within {
    transform: none;
  }

  .mb-header-logo-bar,
  .mb-header-logo,
  .mb-footer-nav .elementor-nav-menu--main > .elementor-nav-menu > li > a {
    transition: none;
    animation: none;
  }

  }

/* Fließtext aus ACF als Plain-Text mit Zeilenumbrüchen (Atomic e-paragraph kann kein Block-HTML).
 * Warum Bordmittel nicht reichen: e-paragraph/html-v3 strippt ul/li und liefert leere Nodes. */
.mb-team-kurz,
.mb-loop-job .elementor-widget-text-editor {
	white-space: pre-line;
}

/* v3-Buttons: Styles am Button-Widget in den Loop-Item-Templates (Elementor + Kit). */

.elementor .e-flexbox-base.mb-card--teaser {
	/* GC deckt Look; Child: Top-Akzent, kantenbündiges Bild, weichere Karte */
	border-top: 3px solid var(--mb-primaer);
	border-radius: 12px;
	padding: 0;
	overflow: hidden;
	gap: 0;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}


.elementor .e-flexbox-base.mb-card--teaser.mb-card-stack {
	gap: 0;
}

.elementor .e-flexbox-base.mb-card-body > .elementor-widget-e-button,
.elementor .e-flexbox-base.mb-card-body > .e-button-base {
	align-self: center;
	margin-top: auto;
	margin-block-start: auto;
}

/* Atomic-Teaser: Abstand nur im Body, Bild bleibt kantenbündig */
.elementor .e-flexbox-base.mb-card--teaser > .e-flexbox-base.mb-card-body {
	flex: 1 1 auto;
	width: 100%;
	padding: 24px 28px 28px;
	gap: 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}

.elementor .e-flexbox-base.mb-card--teaser .e-paragraph-base {
	color: var(--mb-text);
	font-size: 16px;
	line-height: 1.5;
	margin: 0;
}

.elementor .e-flexbox-base.mb-card--teaser > .e-flexbox-base.mb-card-body > .e-button-base {
	align-self: flex-start;
	margin-top: auto;
	margin-block-start: auto;
}

.elementor .mb-card--teaser .mb-card-body.e-con {
	padding: 32px 28px 28px;
	gap: 12px;
}

.elementor .e-flexbox-base.mb-card--teaser > .e-image-base.mb-teaser-img,
.elementor .e-flexbox-base.mb-card--teaser > .elementor-widget-e-image {
	width: 100%;
	margin: 0;
	padding: 0;
	border-radius: 0;
}

.elementor .e-flexbox-base.mb-card--teaser:hover,
.elementor .e-flexbox-base.mb-card--teaser:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 8px 16px color-mix(in srgb, var(--mb-primaer) 16%, transparent), 0 20px 40px color-mix(in srgb, var(--mb-primaer) 14%, transparent);
}

.elementor .e-button-base.mb-btn {
	background-color: var(--mb-primaer);
	color: var(--mb-weiss);
	font-family: var(--mb-schrift-headline);
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	border: 0;
	border-radius: 8px;
	min-height: 46px;
	padding: 12px 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.25s ease;
	text-decoration: none;
}

.elementor .e-button-base.mb-btn:hover,
.elementor .e-button-base.mb-btn:focus-visible {
	background-color: var(--mb-primaer-hell);
}

.elementor .e-button-base.mb-btn:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 3px;
}

.elementor .mb-card .e-paragraph-base,
.elementor .mb-card--teaser .e-paragraph-base {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	line-height: 1.5;
	margin: 0;
}

.elementor .mb-eyebrow .e-paragraph-base {
\tcolor: var(--mb-primaer);
\tfont-family: var(--mb-schrift-text);
\tfont-size: 14px;
\tfont-weight: 700;
\tletter-spacing: 0.02em;
\ttext-transform: none;
\tmargin: 0;
}

@media (max-width: 991px) {
	.elementor .e-flexbox-base.mb-layout-grid-item {
		flex: 1 1 100%;
	}

}

@media (max-width: 767px) {
	.elementor .e-flexbox-base.mb-card:not(.mb-card--teaser),
	.elementor .e-flexbox-base.mb-card.mb-card--info {
		padding: 24px;
	}

	.elementor .e-flexbox-base.mb-card.mb-card--teaser {
		padding: 0;
	}
}

/* Atomic-v4: Infokarten – Padding/Align in GC + Start-Overrides oben */
.elementor .e-flexbox-base.mb-card.mb-card--info {
	align-items: center;
	text-align: center;
}

@media (max-width: 767px) {
	.elementor .e-flexbox-base.mb-card.mb-card--info {
		padding: 32px 20px 24px;
	}
}

.elementor .e-flexbox-base.mb-card--info.mb-card-stack {
	align-items: center;
}

.elementor .mb-icon-circle .e-svg-base {
	width: 30px;
	height: 30px;
	color: var(--mb-weiss);
}

.elementor .e-button-base.mb-btn--outline:hover,
.elementor .e-button-base.mb-btn--outline:focus-visible {
	background-color: var(--mb-primaer);
	color: var(--mb-weiss);
}

.elementor .e-button-base.mb-btn--outline:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.elementor .e-button-base.mb-btn--outline {
		transition: none;
	}
}

/* Atomic-v4: mb-teaser-img – Global-Class-CSS wird nicht ausgeliefert.
 * Overflow am Widget-Wrapper, damit der Hover-Zoom die Karte nicht sprengt.
 * Kein Bildrahmen: die Karte trägt bereits die Linie; Bild sitzt kantenbündig. */
.elementor .mb-card--teaser .elementor-widget-e-image {
	overflow: hidden;
	width: 100%;
	flex-shrink: 0;
	border-block-end: 1px solid var(--mb-linie);
}

.elementor .e-image-base.mb-teaser-img,
.elementor .e-image-link-base.mb-teaser-img img,
.elementor .mb-teaser-img .e-image-base,
.elementor .mb-teaser-img img {
	width: 100%;
	aspect-ratio: 342 / 136;
	object-fit: cover;
	border: 0;
	display: block;
	transition: transform 0.25s ease;
}

.elementor .e-flexbox-base.mb-card--teaser:hover .mb-teaser-img img,
.elementor .e-flexbox-base.mb-card--teaser:hover .e-image-base.mb-teaser-img,
.elementor .e-flexbox-base.mb-card--teaser:focus-within .mb-teaser-img img,
.elementor .e-flexbox-base.mb-card--teaser:focus-within .e-image-base.mb-teaser-img {
	transform: scale(1.04);
}

/*
 * v3 Hero-Insel: Rahmen/Breite/Radius/Schatten in Elementor (home-hero-insel).
 * margin-inline:auto greift an e-con mit --width nicht zuverlässig (Elementor setzt
 * margin-left/right auf 0). Deshalb nur Zentrierung hier.
 * Fokusringe: Elementor liefert keinen :focus-visible an Swiper-Controls.
 */
.elementor .e-con.mb-hero-insel {
	margin-inline: auto;
}

.mb-hero-insel .elementor-swiper-button:focus-visible {
	outline: 2px solid var(--mb-weiss);
	outline-offset: 3px;
}

.mb-hero-insel .swiper-pagination-bullet:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 2px;
}

/*
 * Start-Infokarten: stärkere Überlagerung des Hero (Bestand).
 */
.elementor .e-flexbox-base[data-id="home-info"] {
	padding-block-start: 0;
}

.elementor .e-flexbox-base[data-id="home-info-inner"] {
	margin-block-start: -56px;
	position: relative;
	z-index: 2;
	align-items: stretch;
	/* nowrap: height:100% auf Kindern bricht Stretch; auto+stretch braucht eine Zeile */
	flex-wrap: nowrap;
}

@media (max-width: 991px) {
	.elementor .e-flexbox-base[data-id="home-info-inner"] {
		flex-wrap: wrap;
	}
}

/*
 * Icon-Kreise: halb über Kartenoberkante (64px-Kreis, Pad-top 48 → -80).
 * Außenring: Bordmittel setzen keinen Doppel-Schatten am Atomic-Flexbox.
 */
.elementor .e-flexbox-base.mb-icon-circle {
	margin-block-start: -80px;
	margin-block-end: 8px;
	box-shadow:
		0 0 0 4px var(--mb-weiss),
		0 4px 12px color-mix(in srgb, var(--mb-primaer) 22%, transparent);
}

/* Tel/Fax in einer Zeile wie Bestand (Absatz-Margins sonst stapeln Höhe). */
.elementor .e-flexbox-base[data-id="home-adr-tel-fax"] {
	flex-wrap: nowrap;
	justify-content: center;
	width: auto;
	max-width: 100%;
	gap: 0 8px;
}

.elementor .e-flexbox-base[data-id="home-adr-tel-fax"] > .e-paragraph-base {
	margin: 0;
	white-space: nowrap;
}

/* Infokarten: Stretch-Höhe + CTA unten + Fresh-Up Radius/Hover */
.elementor .e-flexbox-base.mb-layout-grid-item.mb-card--info,
.elementor .e-flexbox-base.mb-card.mb-card--info {
	align-items: center;
	height: auto;
	min-height: 0;
	align-self: stretch;
	overflow: visible;
	border-radius: 12px;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.elementor .e-flexbox-base.mb-card.mb-card--info:hover,
.elementor .e-flexbox-base.mb-card.mb-card--info:focus-within {
	transform: translateY(-3px);
	box-shadow:
		0 8px 18px color-mix(in srgb, var(--mb-primaer) 14%, transparent),
		0 18px 36px color-mix(in srgb, var(--mb-primaer) 10%, transparent);
}

.elementor .e-flexbox-base[data-id="home-info-inner"] > .e-flexbox-base.mb-card--info {
	display: flex;
	flex-direction: column;
	height: auto;
	align-self: stretch;
}

.elementor .e-flexbox-base.mb-card--info.mb-card-stack {
	display: flex;
	flex-direction: column;
	align-items: center;
	height: auto;
	overflow: visible;
}

@media (max-width: 767px) {
	.elementor .e-flexbox-base[data-id="home-info-inner"] {
		margin-block-start: -28px;
	}

	/* Pad-top 40 + ~halber Icon-Kreis 32 → -72 */
	.elementor .e-flexbox-base.mb-icon-circle {
		margin-block-start: -72px;
	}

	.elementor .e-flexbox-base.mb-card.mb-card--info {
		padding: 40px 20px 24px;
	}

	.elementor .e-flexbox-base[data-id="home-adr-tel-fax"] {
		flex-wrap: wrap;
	}
}

/* Single-Leistung Kartentypo: Elementor am Template 410. */

/*
 * Kontaktkarten (mb-card--contact):/*
 * Kontaktkarten (mb-card--contact): Layout/Padding in Global Class.
 * Hier nur Nachfahren-Margin, Inline-Zeile, leere ACF-Absätze.
 * Linkfarbe über s-page-lead. Kein page-id.
 * Fokus-Bugfix: :focus-visible war fälschlich mit :empty gekoppelt.
 */
.elementor .mb-card--contact .mb-inline-line.e-flexbox-base,
.elementor .e-flexbox-base.mb-card--contact .mb-inline-line {
  justify-content: flex-start;
  margin-block: 0;
}

.elementor .mb-card--contact .e-heading-base:is(h2),
.elementor .mb-card--contact .s-page-h2.e-heading-base {
  margin: 0 0 8px;
}

.elementor .mb-card--contact .e-paragraph-base:empty {
  display: none;
}

.elementor .mb-layout-grid-item.e-flexbox-base {
  display: flex;
}

/*
 * Sprechzeiten-Raster (s-sz-*): Flex/Typo in Global Classes.
 * Child behält: last-child-Border, Mittelpunkt-Trenner, :empty/:has
 * (Atomic hat kein Hide-if-empty für Optionsfelder).
 */
/* baseline + border: Schema ohne baseline; Border bewusst hier (last-child-Reset). */
.elementor .e-flexbox-base.s-sz-day {
  align-items: baseline;
  border-bottom: 1px solid var(--mb-linie);
}

.elementor .e-flexbox-base.s-sz-day:last-child {
  border-bottom: 0;
  border-block-end-width: 0;
}

.elementor .s-sz-times .e-paragraph-base + .e-paragraph-base:not(.mb-eyebrow)::before {
  color: var(--mb-deko);
  content: "·";
  margin-inline-end: 12px;
}

.elementor .s-sz-day .e-paragraph-base:empty,
.elementor .s-sz-sonder.e-paragraph-base:empty {
  display: none;
}

.elementor .s-sz-day:not(:has(.e-paragraph-base:not(:empty))) {
  display: none;
}


.elementor .s-page-list .e-paragraph-base::before {
  color: var(--mb-primaer);
  content: "\2022";
  margin-inline-end: 0.45em;
}

.elementor a.e-paragraph-link-base,
.elementor a.s-page-lead.e-paragraph-base,
.elementor .s-page-lead.e-paragraph-base a,
.elementor .s-page-inner a:not(.e-button-base):not(.elementor-button),
.mb-leistung-fliesstext a,
.mb-job-fliesstext a {
  color: var(--mb-primaer);
  font-weight: 400;
  text-decoration: none;
}

.elementor a.s-page-lead.e-paragraph-base:hover,
.elementor .s-page-lead.e-paragraph-base a:hover,
.elementor .s-page-inner a:not(.e-button-base):not(.elementor-button):hover,
.mb-leistung-fliesstext a:hover,
.mb-job-fliesstext a:hover {
  color: var(--mb-primaer-hell);
}

.elementor a.s-page-lead.e-paragraph-base:focus-visible,
.elementor .s-page-lead.e-paragraph-base a:focus-visible {
  outline: 2px solid var(--mb-primaer);
  outline-offset: 3px;
}

body.page-id-286 .elementor .e-image-base.s-imp-mango,
body.page-id-286 .elementor .s-imp-mango img {
  display: inline-block;
  height: 48px;
  width: auto;
  max-width: 220px;
  vertical-align: middle;
}

@media (max-width: 767px) {
  /* s-sz-day mobile: Global Class. Heading-Basisbreite nur hier. */
  .elementor .s-sz-day-h.e-heading-base:is(h2) {
    flex: 0 0 auto;
  }
}

/*
 * Datenschutz (287): lange URL-Absätze sprengen auf mobile die Viewportbreite.
 * Atomic-Style-Schema kennt overflow-wrap nicht (nur overflow).
 */
body.page-id-287 .s-page-inner,
body.page-id-287 .s-page-inner a {
    overflow-wrap: anywhere;
}

/*
 * Jobs-Leerzustand (Seite 273): Atomic-Absatz in der Intro-Sektion.
 * Warum Child-Theme: loop-grid nothing-found sitzt im v3-Loop-Subtree;
 * der Auftrag verlangt einen Atomic-Leerzustand. Intro und Loop sind
 * getrennte Subtrees, deshalb :has auf dem Seiten-Body.
 * Kein Hex, kein !important.
 */
body.page-id-273 [data-id="jobs-empty"] {
  display: none;
}

body.page-id-273:not(:has(.mb-card.mb-loop-job)) [data-id="jobs-empty"] {
  display: block;
}

body.page-id-273:not(:has(.mb-card.mb-loop-job)) .mb-loop-insel {
  display: none;
}

/*
 * Unterseiten-Hero:/*
 * Unterseiten-Hero: Layout/Typo/Rahmen in Global Classes.
 * Child nur Runtime-Lücken: Klasse sitzt auf dem Atomic-img selbst (kein
 * verschachteltes img), Parent-Hover-Zoom (GC-Hover greift nur am Bild),
 * em-Zweitzeile, Fokus, prefers-reduced-motion.
 */
.elementor .e-image-base.mb-subpage-hero-media {
  display: block;
  min-height: 0;
}

.elementor .mb-subpage-hero:hover .mb-subpage-hero-media,
.elementor .mb-subpage-hero:focus-within .mb-subpage-hero-media {
  transform: scale(1.04);
}

.elementor .mb-subpage-hero-panel em {
  color: var(--mb-nav-inaktiv);
  display: block;
  font-style: normal;
  margin-block-start: 8px;
}

.elementor .mb-subpage-hero-panel:focus-visible {
  outline: 2px solid var(--mb-weiss);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .elementor .mb-subpage-hero-media {
    transition: none;
    transform: none;
  }
  .elementor .mb-subpage-hero:hover .mb-subpage-hero-media,
  .elementor .mb-subpage-hero:focus-within .mb-subpage-hero-media {
    transform: none;
  }
}


/* DCE-Grid/Gap/Insel-Breite: Elementor Container + DCE grid_*_gap. */

.mb-leistung-fliesstext h2,
.mb-job-fliesstext h2 {
  color: var(--mb-primaer);
  font-family: var(--mb-schrift-headline);
  font-size: 23px;
  font-weight: 300;
  line-height: 1.25;
  margin: 16px 0 8px;
}

.mb-leistung-fliesstext h3,
.mb-job-fliesstext h3 {
  color: var(--mb-primaer);
  font-family: var(--mb-schrift-headline);
  font-size: 18px;
  font-weight: 300;
  margin: 12px 0 8px;
}

.mb-leistung-fliesstext ul,
.mb-leistung-fliesstext ol,
.mb-job-fliesstext ul,
.mb-job-fliesstext ol {
  margin: 0 0 0.8em;
  padding-inline-start: 1.2em;
}

.mb-leistung-fliesstext a,
.mb-job-fliesstext a {
  color: var(--mb-primaer);
}

.mb-leistung-fliesstext a:hover,
.mb-leistung-fliesstext a:focus-visible,
.mb-job-fliesstext a:hover,
.mb-job-fliesstext a:focus-visible {
  color: var(--mb-primaer-hell);
}

.mb-leistung-fliesstext a:focus-visible,
.mb-job-fliesstext a:focus-visible {
  outline: 2px solid var(--mb-primaer);
  outline-offset: 3px;
}

/* Listen-Einzug + Bullet: Atomic/GC ohne ::before */
.elementor .e-flexbox-base.s-page-list {
  padding-inline-start: 1.1em;
}

/*
 * Fresh-Up Startseite (elementor-8): durchgängiges Band-Blau, Slide-in L→R,
 * weichere CTAs. Tokens only. Kein !important.
 * Warum Child: Bordmittel liefern keine view()-Timeline und keine page-scoped
 * Kontrastfläche ohne lokale Widget-Werte.
 */

/* Sanftes Blau als durchgängige Seitenfläche (stärker als reines Band-Grau) */
/*
 * Unterseiten: Logo-Zahn invertiert weiß als Wasserzeichen rechts unten
 * auf Soft-Blau (unterhalb des weißen Content-Sheets).
 * Warum Child: dekoratives ::after + Maske auf Theme-Asset.
 */
body.home .s-page-intro::after,
body.elementor-page-8 .s-page-intro::after {
	content: none;
}


.elementor .mb-section.s-page-intro,
.elementor .s-page-intro {
	position: relative;
	overflow: visible;
	padding-inline: 16px;
	padding-block-end: 72px; /* war 168 – zu großer Abstand unter Intro-Sheet */
	box-sizing: border-box;
}

/* Warum Child: dekoratives SVG-Wasserzeichen als fixed ::after (Vektor per background-image, nicht Maske: CSS-Mask rasterisiert) – Elementor Motion/BG kann das nicht. */
.elementor .s-page-intro::after {
	content: none;
}

/*
 * Zahn-Wasserzeichen: Inline-SVG (.mb-zahn-wm), nicht ::after-Hintergrund.
 * Warum Child: Pfad-Staffel + Scroll-Parallax sind in Elementor Motion nicht
 * auf einer Deko-Grafik abbildbar. background-image animiert keine Pfade.
 */
.mb-zahn-wm {
	position: fixed;
	right: clamp(4px, 1.5vw, 20px);
	top: 310px;
	width: min(460px, 26vw);
	aspect-ratio: 385.18 / 416.91;
	color: var(--mb-weiss);
	opacity: 0.36;
	pointer-events: none;
	z-index: 0;
	transform: translate3d(0, calc(var(--mb-zahn-lift, 0px) * -1), 0);
}


.mb-zahn-wm__motion {
	animation: mb-zahn-float 16s ease-in-out 2.2s infinite;
}

.mb-zahn-wm svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
	transform-origin: 70% 30%;
	animation: mb-zahn-parallax linear both;
	animation-timeline: scroll();
	animation-range: 0% 80%;
}

.mb-zahn-wm__body {
	-webkit-clip-path: inset(100% 0 0 0);
	clip-path: inset(100% 0 0 0);
	animation: mb-zahn-rise 1.7s cubic-bezier(0.22, 1, 0.36, 1) 0.12s forwards;
}

.mb-zahn-wm__crown {
	opacity: 0;
	transform-box: fill-box;
	transform-origin: center;
	transform: translateY(-18px) scaleX(0.86);
	animation: mb-zahn-crown 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.95s forwards;
}

@keyframes mb-zahn-rise {
	from {
		-webkit-clip-path: inset(100% 0 0 0);
		clip-path: inset(100% 0 0 0);
	}
	to {
		-webkit-clip-path: inset(0 0 0 0);
		clip-path: inset(0 0 0 0);
	}
}

@keyframes mb-zahn-crown {
	from {
		opacity: 0;
		transform: translateY(-18px) scaleX(0.86);
	}
	to {
		opacity: 1;
		transform: translateY(0) scaleX(1);
	}
}

@keyframes mb-zahn-float {
	0%,
	100% {
		transform: translate3d(0, 0, 0) rotate(0deg);
	}
	50% {
		transform: translate3d(-10px, -16px, 0) rotate(-1.6deg);
	}
}

@keyframes mb-zahn-parallax {
	from {
		transform: scale(1) rotate(0deg);
	}
	to {
		transform: scale(1.07) rotate(-5deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.mb-zahn-wm {
		animation: none;
	}

	.mb-zahn-wm__motion,
	.mb-zahn-wm svg,
	.mb-zahn-wm__body,
	.mb-zahn-wm__crown {
		animation: none;
		-webkit-clip-path: none;
		clip-path: none;
		filter: none;
		transform: none;
	}

	.mb-zahn-wm__crown {
		opacity: 1;
	}
}

/* Fixed-Wasserzeichen hinter Hero/Header, sichtbar im Soft-Blau-Rand */
.elementor-location-header {
	position: relative;
	z-index: 3;
}

body[class*="elementor-page"] .elementor:not(.elementor-location-header):not(.elementor-location-footer) > .e-flexbox-base:first-child,
body[class*="elementor-page"] .elementor:not(.elementor-location-header):not(.elementor-location-footer) > .e-con:first-child {
	position: relative;
	z-index: 1;
}

.mb-job-teaser .elementor-widget-text-editor,
.elementor .mb-job-teaser {
	white-space: pre-line;
}

.elementor .s-page-inner {
	position: relative;
	z-index: 1;
}

/*
 * Karten im Content-Sheet: kein zweites Weiß+Schatten (Doppelbox).
 * Stattdessen Inset auf mb-flaeche-band – Struktur bleibt, Stil wechselt.
 */
.elementor .s-page-inner .mb-card,
.elementor .s-page-inner .e-flexbox-base.mb-card {
	background-color: var(--mb-flaeche-band);
	border-color: var(--mb-linie);
	box-shadow: none;
}

.elementor .s-page-inner .mb-card:hover,
.elementor .s-page-inner .mb-card:focus-within,
.elementor .s-page-inner .e-flexbox-base.mb-card:hover,
.elementor .s-page-inner .e-flexbox-base.mb-card:focus-within {
	transform: none;
	box-shadow: none;
}

/*
 * Content-Sheet-Padding: .mb-layout-inner setzt sonst padding 0/16 und
 * gewinnt bei gleicher Spezifität gegen .s-page-inner.
 */
.elementor .s-page-inner.mb-layout-inner,
.elementor .e-flexbox-base.s-page-inner {
	padding-block: 48px 56px;
	padding-inline: 48px;
}

@media (max-width: 767px) {
	.elementor .s-page-inner.mb-layout-inner,
	.elementor .e-flexbox-base.s-page-inner,
	.elementor .s-page-inner {
		padding-block: 32px;
		padding-inline: 24px;
		border-radius: 10px;
	}

	.elementor .mb-section.s-page-intro,
	.elementor .s-page-intro {
		padding-block-end: 56px;
	}

	.elementor .s-page-intro::after,
	.mb-zahn-wm {
		display: none;
	}
}
/* Soft-Blau Seitenfläche siteweit (Seiten + Theme-Builder-Singles) */
body[class*="elementor-page"]:not(.elementor-motion-effects-element-type-background),
body[class*="elementor-page"] > .elementor-motion-effects-container > .elementor-motion-effects-layer,
body[class*="elementor-page"] .site-main,
body[class*="elementor-page"] #content,
body[class*="elementor-page"] .elementor,
body.home,
body.home .site-main,
body.home #content,
.elementor-8 {
	background-color: color-mix(in srgb, var(--mb-flaeche-band) 86%, var(--mb-primaer) 14%);
}

.elementor-8 .e-flexbox-base[data-id="home-info"],
.elementor-8 .e-flexbox-base[data-id="home-teaser"] {
	background-color: transparent;
}

/*
 * Startseite: Page-Root hatte dieselbe Soft-Blau-Fläche wie body, vollbreit
 * in der z-index:1-Content-Insel – der Zahn (z-index 0) war unsichtbar.
 * Fläche bleibt auf body; Carousel-Bilder und Kacheln sind opak und decken
 * den Zahn dort weiterhin zu. Kein höherer z-index am Zahn (würde Bild/Karten überdecken).
 */
body.home .elementor-location-single,
body.home .elementor-8,
body.elementor-page-8 .elementor-location-single,
body.elementor-page-8 .elementor-8 {
	background-color: transparent;
}

.elementor-8 .e-flexbox-base[data-id="home-info"] {
	padding-block-end: 28px;
}

.elementor-8 .e-flexbox-base[data-id="home-teaser"] {
	padding-block: 28px 72px;
}

.elementor-8 .e-flexbox-base[data-id="home-teaser-inner"] {
	align-items: stretch;
	gap: 28px;
}

.elementor-8 .e-flexbox-base[data-id="home-teaser-inner"] > .e-flexbox-base.mb-card--teaser {
	height: auto;
	align-self: stretch;
}

/* Teaser-Bild etwas großzügiger (Fresh-Up), Zoom bleibt */
.elementor-8 .e-image-base.mb-teaser-img,
.elementor-8 .mb-teaser-img img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.elementor .e-button-base.mb-btn--outline {
	border-radius: 10px;
	letter-spacing: 0.04em;
	transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.elementor .e-button-base.mb-btn--outline:hover,
.elementor .e-button-base.mb-btn--outline:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 6px 14px color-mix(in srgb, var(--mb-primaer) 18%, transparent);
}

/*
 * Kacheln: Slide von links, Staffelung L→R.
 * Infokarten: Zeit-Animation beim Laden (sichtbar im First View).
 * Teaser: view()-Timeline; Staffelung über animation-range (Delay + view ist unzuverlässig).
 */
@keyframes mb-reveal-slide {
	from {
		opacity: 0;
		transform: translateX(-36px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.mb-reveal,
.elementor-8 [data-id="home-info-inner"] > .mb-card--info {
	animation: mb-reveal-slide 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.elementor-8 [data-id="home-info-inner"] > .mb-card--info:nth-child(1) {
	animation-delay: 0.05s;
}

.elementor-8 [data-id="home-info-inner"] > .mb-card--info:nth-child(2) {
	animation-delay: 0.18s;
}

.elementor-8 [data-id="home-info-inner"] > .mb-card--info:nth-child(3) {
	animation-delay: 0.31s;
}

.elementor-8 [data-id="home-teaser-inner"] > .mb-card--teaser {
	animation: mb-reveal-slide 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
	animation-timeline: view();
	animation-range: entry 0% cover 36%;
}

.elementor-8 [data-id="home-teaser-inner"] > .mb-card--teaser:nth-child(2) {
	animation-range: entry 12% cover 48%;
}

.elementor-8 [data-id="home-teaser-inner"] > .mb-card--teaser:nth-child(3) {
	animation-range: entry 24% cover 60%;
}

/*
 * Hero-Slider-Controls: explizit Child-CSS (User-Freigabe).
 * Elementor liefert arrows_color/size, aber keine runde Button-Fläche;
 * SVG-fill folgt nicht zuverlässig nur über color.
 */
.elementor .mb-hero-insel .elementor-swiper-button {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background-color: color-mix(in srgb, var(--mb-primaer) 72%, transparent);
	color: var(--mb-weiss);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	z-index: 4;
	box-shadow: 0 2px 10px color-mix(in srgb, var(--mb-primaer) 22%, transparent);
	backdrop-filter: blur(2px);
	/* Swiper zentriert per translateY(-50%). Hover darf das nicht ersetzen. */
	transform: translateY(-50%);
	transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.elementor .mb-hero-insel .elementor-swiper-button-prev {
	left: 16px;
}

.elementor .mb-hero-insel .elementor-swiper-button-next {
	right: 16px;
}

.elementor .mb-hero-insel .elementor-swiper-button:hover,
.elementor .mb-hero-insel .elementor-swiper-button:focus-visible {
	background-color: var(--mb-primaer);
	color: var(--mb-weiss);
	transform: translateY(-50%);
	box-shadow: 0 4px 14px color-mix(in srgb, var(--mb-primaer) 35%, transparent);
}

.elementor .mb-hero-insel .elementor-swiper-button svg,
.elementor .mb-hero-insel .elementor-swiper-button .e-font-icon-svg,
.elementor .mb-hero-insel .elementor-swiper-button i {
	width: 22px;
	height: 22px;
	fill: var(--mb-weiss);
	color: var(--mb-weiss);
}

.elementor .mb-hero-insel .swiper-pagination-bullet {
	background-color: var(--mb-weiss);
	opacity: 0.55;
}

.elementor .mb-hero-insel .swiper-pagination-bullet-active {
	background-color: var(--mb-primaer);
	opacity: 1;
}


@media (prefers-reduced-motion: reduce) {
	.mb-reveal,
	.elementor-8 [data-id="home-info-inner"] > .mb-card--info,
	.elementor-8 [data-id="home-teaser-inner"] > .mb-card--teaser {
		animation: none;
		opacity: 1;
		transform: none;
	}

	.elementor .e-flexbox-base.mb-card.mb-card--info,
	.elementor .e-flexbox-base.mb-card.mb-card--info:hover,
	.elementor .e-flexbox-base.mb-card.mb-card--info:focus-within,
	.elementor .e-button-base.mb-btn--outline,
	.elementor .e-button-base.mb-btn--outline:hover,
	.elementor .e-button-base.mb-btn--outline:focus-visible,
	.mb-hero-insel .elementor-swiper-button {
		transition: none;
		transform: none;
	}
}

/*
 * Single Team: Profil-Layout (Bild | Vita), Rich-Text aus ACF.
 * Warum Child: v3-Single; Vita-Tabelle/Listen nicht über Bordmittel der Heading-Widgets.
 */
body.single-team .mb-team-single.mb-card--person {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%;
	border-radius: 12px;
}

body.single-team .mb-team-single .mb-person-img,
body.single-team .mb-team-single .elementor-widget-image {
	flex: 0 0 320px;
	width: 320px;
	max-width: 40%;
	align-self: flex-start;
	overflow: hidden;
}

body.single-team .mb-team-single .mb-person-img img,
body.single-team .mb-team-single .elementor-widget-image img {
	width: 100%;
	height: auto;
	min-height: 0;
	aspect-ratio: 3 / 4;
	max-height: none;
	object-fit: cover;
	object-position: center top;
}

body.single-team .mb-team-single .mb-card-body {
	flex: 1 1 320px;
	align-items: flex-start;
	text-align: left;
	gap: 16px;
	padding: 32px;
}

body.single-team .mb-team-single .mb-team-kurz {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	line-height: 1.7;
	margin: 0;
}

.mb-team-fliesstext {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	line-height: 1.7;
	width: 100%;
}

.mb-team-fliesstext h2 {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-headline);
	font-size: 23px;
	font-weight: 300;
	line-height: 1.25;
	margin: 24px 0 12px;
}

.mb-team-fliesstext h2:first-child {
	margin-block-start: 8px;
}

.mb-team-fliesstext ul,
.mb-team-fliesstext ol {
	margin: 0 0 0.8em;
	padding-inline-start: 1.2em;
}

.mb-team-fliesstext li {
	margin-block-end: 0.35em;
}

.mb-team-fliesstext a {
	color: var(--mb-primaer);
}

.mb-team-fliesstext a:hover,
.mb-team-fliesstext a:focus-visible {
	color: var(--mb-primaer-hell);
}

.mb-team-fliesstext a:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 3px;
}

.mb-team-fliesstext table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 8px 0 0.5em;
	overflow: hidden;
	border: 1px solid var(--mb-linie);
	border-radius: 10px;
	background: var(--mb-weiss);
}

.mb-team-fliesstext tr:nth-child(even) td {
	background: color-mix(in srgb, var(--mb-flaeche-band) 70%, var(--mb-weiss));
}

.mb-team-fliesstext td {
	vertical-align: top;
	padding: 14px 18px;
	border-block-end: 1px solid var(--mb-linie);
	line-height: 1.55;
}

.mb-team-fliesstext tr:last-child td {
	border-block-end: 0;
}

.mb-team-fliesstext td:first-child {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-text);
	font-weight: 700;
	white-space: nowrap;
	width: 9.5rem;
	padding-inline-end: 12px;
}

.mb-team-fliesstext td:last-child {
	color: var(--mb-text);
}

@media (max-width: 767px) {
	body.single-team .mb-team-single.mb-card--person {
		flex-direction: column;
	}

	body.single-team .mb-team-single .mb-person-img,
	body.single-team .mb-team-single .elementor-widget-image {
		max-width: none;
		width: 100%;
		overflow: hidden;
	}

	body.single-team .mb-team-single .mb-person-img img,
	body.single-team .mb-team-single .elementor-widget-image img {
		min-height: 0;
		aspect-ratio: 3 / 4;
		max-height: 420px;
	}

	body.single-team .mb-team-single .mb-card-body {
		padding: 24px 20px 28px;
	}

	.mb-team-fliesstext td:first-child {
		white-space: normal;
		width: 6.5rem;
	}
}

/*
 * v3-Buttons mit Klasse mb-btn--outline (Loop/Single):
 * Atomic-GC stylt nur .e-button-base – deshalb Child-Äquivalent für .elementor-button.
 */
.elementor-widget-button.mb-btn--outline .elementor-button,
.elementor .mb-btn--outline .elementor-button {
	background-color: var(--mb-weiss);
	color: var(--mb-primaer);
	border: 2px solid var(--mb-primaer);
	border-radius: 8px;
	font-family: var(--mb-schrift-headline);
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	min-height: 46px;
	padding: 12px 28px;
	line-height: 1;
	transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.elementor .elementor-widget-button.mb-btn--outline .elementor-button:hover,
.elementor .elementor-widget-button.mb-btn--outline .elementor-button:focus-visible,
.elementor .mb-btn--outline .elementor-button:hover,
.elementor .mb-btn--outline .elementor-button:focus-visible {
	background-color: var(--mb-primaer);
	color: var(--mb-weiss);
	border-color: var(--mb-primaer);
}

.elementor-widget-button.mb-btn--outline .elementor-button:focus-visible,
.elementor .mb-btn--outline .elementor-button:focus-visible {
	outline: 2px solid var(--mb-primaer);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.elementor-widget-button.mb-btn--outline .elementor-button,
	.elementor .mb-btn--outline .elementor-button {
		transition: none;
	}
}

/*
 * v3-Äquivalente für Typo-Hierarchie auf Singles/Loops.
 * Atomic-GC (s-page-h1, mb-eyebrow) greift nur auf Atomic-Elemente –
 * Heading-Widgets brauchen Selektor auf .elementor-heading-title.
 */
.elementor .s-page-h1 .elementor-heading-title,
.elementor .s-page-h1.elementor-widget-heading .elementor-heading-title,
.elementor h1.elementor-heading-title.s-page-h1 {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-headline);
	font-size: 40px;
	font-weight: 300;
	line-height: 1.2;
	margin: 0;
	padding-block-end: 16px;
	border-block-end: 1px solid var(--mb-linie-kraeftig);
	width: 100%;
}

.elementor .mb-eyebrow .elementor-heading-title,
.elementor .mb-eyebrow.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-text);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.4;
	margin: 0;
	text-transform: none;
}

.elementor .mb-team-kurz .elementor-heading-title,
.elementor .mb-team-kurz.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.7;
	margin: 0;
}

@media (max-width: 767px) {
	.elementor .s-page-h1 .elementor-heading-title,
	.elementor .s-page-h1.elementor-widget-heading .elementor-heading-title {
		font-size: 32px;
	}
}

/*
 * Team-Loop-Kacheln: Hierarchie Name (h2-Preset) → Rolle → Kurztext.
 * mb-eyebrow ist auf Singles unter großem h1 auf 14/700 ausgelegt;
 * in Kacheln unter 23px-Namen wirkt das zu dominant → Loop-Override.
 */
.elementor .mb-loop-team .mb-team-name .elementor-heading-title,
.elementor .mb-loop-team .mb-team-name.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-headline);
	font-size: 23px;
	font-weight: 700;
	line-height: 1.25;
	margin: 0;
}

.elementor .mb-loop-team .mb-eyebrow .elementor-heading-title,
.elementor .mb-loop-team .mb-eyebrow.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-text);
	font-size: 15px;
	font-weight: 400;
	letter-spacing: normal;
	line-height: 1.45;
	margin: 0;
	text-transform: none;
}

.elementor .mb-loop-team .mb-team-kurz .elementor-heading-title,
.elementor .mb-loop-team .mb-team-kurz.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	margin: 0;
}

/*
 * Leistung Loop/Single: Typo-Hierarchie + leere Icon-Widgets ausblenden.
 * Warum Child: v3-Headings fallen sonst auf Kit-Primary (40px) zurück.
 */
.elementor .mb-loop-leistung .mb-leistung-name .elementor-heading-title,
.elementor .mb-loop-leistung .mb-leistung-name.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-headline);
	font-size: 23px;
	font-weight: 700;
	line-height: 1.25;
	margin: 0;
}

.elementor .mb-leistung-teaser .elementor-heading-title,
.elementor .mb-leistung-teaser.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	margin: 0;
}

.elementor .mb-leistung-img:not(:has(img)),
.elementor .mb-leistung-img .elementor-widget-container:empty,
.elementor .elementor-widget-image.mb-leistung-img:not(:has(img)) {
	display: none;
}

.elementor .mb-card.mb-loop-leistung {
	height: 100%;
	border-radius: 12px;
	box-shadow: 0 8px 28px color-mix(in srgb, var(--mb-primaer) 10%, transparent);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.elementor .mb-card.mb-loop-leistung:hover,
.elementor .mb-card.mb-loop-leistung:focus-within {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px color-mix(in srgb, var(--mb-primaer) 16%, transparent);
}

.elementor .mb-loop-leistung .mb-card-body,
.elementor .mb-loop-leistung .e-con.mb-card-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	gap: 12px;
	padding: 28px 24px;
	box-sizing: border-box;
}

.elementor .mb-loop-leistung .elementor-widget-button,
.elementor .mb-loop-leistung .elementor-button-wrapper {
	margin-block-start: auto;
	padding-block-start: 8px;
}

body.single-leistung .mb-card .mb-card-body {
	align-items: flex-start;
	text-align: left;
	gap: 16px;
}

body.single-leistung .mb-leistung-fliesstext {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	line-height: 1.7;
	width: 100%;
	white-space: pre-line;
}

body.single-leistung .mb-leistung-fliesstext ul {
	white-space: normal;
}

@media (prefers-reduced-motion: reduce) {
	.elementor .mb-card.mb-loop-leistung,
	.elementor .mb-card.mb-loop-leistung:hover {
		transition: none;
		transform: none;
	}
}


/* Subfooter */
.elementor-location-footer .mb-footer-nav-insel {
	background-color: #e5e5e5;
}

.elementor .mb-loop-job .mb-job-name .elementor-heading-title,
.elementor .mb-loop-job .mb-job-name.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-primaer);
	font-family: var(--mb-schrift-headline);
	font-size: 23px;
	font-weight: 700;
	line-height: 1.25;
}

.elementor .mb-loop-job .mb-job-teaser .elementor-heading-title,
.elementor .mb-loop-job .mb-job-teaser.elementor-widget-heading .elementor-heading-title {
	color: var(--mb-text);
	font-family: var(--mb-schrift-text);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	white-space: pre-line;
}





/*
 * Zwischenüberschriften (h2) klar über Fließtext-Links.
 * Why: Atomic-GC s-page-h2 / Kit-h2 waren Condensed 300, Links 600 – visuell kopflastig.
 * Gewicht 700 ist das zweite Headline-Schnitt des Tokens mb-schrift-headline.
 */
.elementor .s-page-h2.e-heading-base,
.elementor .s-p-h2.e-heading-base,
.elementor .s-sz-day-h.e-heading-base:is(h2) {
  font-weight: 700;
}

.elementor .s-page-inner a:not(.e-button-base):not(.elementor-button) strong,
.elementor .s-page-inner a:not(.e-button-base):not(.elementor-button) b,
.elementor .s-page-inner strong a:not(.e-button-base):not(.elementor-button),
.elementor .s-page-inner b a:not(.e-button-base):not(.elementor-button),
.mb-leistung-fliesstext a strong,
.mb-job-fliesstext a strong {
  font-weight: 400;
}

/*
 * v3-Loop-Insel: kein mb-section, Padding am Widget war 0.
 * Unterer Abstand zum Footer (Jobs, Team, Leistungen, Kooperationen).
 */
.elementor .mb-loop-insel {
  padding-block-end: 60px;
}


/*
 * Sprechzeiten-Raster kompakter, analog Team-Single-Tabelle
 * (Label links fest, Zeiten rechts, geringe Zeilenhoehe).
 */
.elementor .e-flexbox-base.s-sz-day {
  padding-block: 10px;
  gap: 16px;
}
.elementor .s-sz-day-h.e-heading-base:is(h2) {
  font-size: 16px;
  line-height: 1.35;
  flex: 0 0 9.5rem;
  margin: 0;
}
.elementor .s-sz-times.e-flexbox-base {
  gap: 0 4px;
}
.elementor .s-sz-times .e-paragraph-base {
  line-height: 1.35;
}

/*
 * Service-Kacheln: drei Beitraege als Teaser-Karten.
 */
.elementor .e-flexbox-base.mb-card-stack {
  flex-direction: column;
}
.elementor .e-flexbox-base.mb-service-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 32px;
  margin-block-start: 8px;
  width: 100%;
}
.elementor .e-flexbox-base.mb-service-grid > .e-flexbox-base.mb-card {
  flex: 1 1 calc(33.333% - 22px);
  flex-direction: column;
  align-items: stretch;
  min-width: 240px;
  height: auto;
  overflow: hidden;
  padding: 0;
  background-color: var(--mb-weiss);
}
.elementor .mb-service-grid .e-image-base.mb-teaser-img {
  width: 100%;
  flex: 0 0 auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.elementor .mb-service-grid .mb-card-body {
  width: 100%;
  min-width: 0;
}
@media (max-width: 991px) {
  .elementor .e-flexbox-base.mb-service-grid > .e-flexbox-base.mb-card {
    flex: 1 1 100%;
  }
}

/*
 * Job-Single: Primaer-CTA Bewerbung, Sekundaer Zurueck.
 * v3-Button, daher Child-Aequivalent zu .mb-btn.
 */
.elementor .mb-job-cta .elementor-button {
  background-color: var(--mb-primaer);
  color: var(--mb-weiss);
  font-family: var(--mb-schrift-headline);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  border: 0;
  border-radius: 8px;
  min-height: 46px;
  /* 14/10 statt 12/12: Open-Sans-Condensed-Versalien haben Descent 0, sitzen sonst optisch zu hoch. */
  padding: 14px 28px 10px;
  /* v3-Button ist inline-block; ohne Flex geht die Extra-Hoehe von min-height nach unten. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.elementor .mb-job-cta .elementor-button-content-wrapper {
  align-items: center;
}
.elementor .mb-job-cta .elementor-button:hover,
.elementor .mb-job-cta .elementor-button:focus-visible {
  background-color: var(--mb-primaer-hell);
  color: var(--mb-weiss);
}
.elementor .mb-job-cta .elementor-button:focus-visible {
  outline: 2px solid var(--mb-primaer);
  outline-offset: 3px;
}
.elementor [data-id="sj-back"],
.elementor .elementor-element-sj-back {
  margin-block-start: 12px;
}
.elementor .elementor-element-sj-back .elementor-button.elementor-button-link {
  background-color: transparent;
  border: 0;
  box-shadow: none;
  color: var(--mb-primaer);
  font-family: var(--mb-schrift-text);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  min-height: 0;
  padding: 0;
  text-decoration: none;
  text-transform: none;
}
.elementor .elementor-element-sj-back .elementor-button.elementor-button-link:hover,
.elementor .elementor-element-sj-back .elementor-button.elementor-button-link:focus-visible {
  background-color: transparent;
  color: var(--mb-primaer-hell);
}

/* Impressionen: Galerie in der Content-Card */
.elementor [data-id="imp-card"] .elementor-gallery {
  margin-block-start: 8px;
}

@media (max-width: 767px) {
  .elementor .e-flexbox-base.mb-card--teaser > .e-flexbox-base.mb-card-body {
    padding: 20px 20px 24px;
  }
  .elementor .mb-card--teaser .mb-card-body.e-con {
    padding: 24px 20px 22px;
  }
}