/*
 * Avada-Bausteine ohne Avada (2.88.0): Grundaussehen wie die Avada-Einstellungen von stehle-bewegt.de.
 * Werte als Variablen, damit das eigene CSS aus Avada (Produktfarben) sie wie bisher umstellen kann.
 */
body.sb-fusion-seite {
	--site_width: 1400px;
	--sbf-akzent: var(--primary_color, var(--sb-c-akzent, #2c6b6b));
	--body_typography-font-family: var(--sb-f-text, "Source Sans 3", Arial, Helvetica, sans-serif);
	--body_typography-font-size: calc(17 * var(--sb-px, 1px));
	--body_typography-line-height: var(--sb-text-lh, 1.55);
	--body_typography-color: var(--sb-c-schrift, #2f3434);
	--link_color: var(--sb-c-akzent, #2c6b6b);
	--button_typography-font-family: var(--sb-f-knopf, "Atkinson Hyperlegible", Arial, Helvetica, sans-serif);
	--button_gradient_top_color: var(--sb-c-akzent, #2c6b6b);
	--button_gradient_top_color_hover: var(--sb-c-dunkel, #1f5252);
	--button_accent_color: #fff;
	--button-border-radius-top-left: 999px;
	--button-border-radius-top-right: 999px;
	--button-border-radius-bottom-right: 999px;
	--button-border-radius-bottom-left: 999px;
}

/* Inhalt randlos: die Abschnitte bringen ihre eigenen Abstände mit. */
body.sb-fusion-seite .bewegt-inhalt { padding: 0 !important; overflow-x: clip; }
body.sb-fusion-seite .bewegt-inhalt > .wp-block-post-content { max-width: none; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
body.sb-fusion-seite .wp-block-post-content > .fusion-fullwidth { margin-left: 0 !important; margin-right: 0 !important; }
.wp-block-post-content > .fusion-fullwidth,
.wp-block-post-content > .fusion-container-anchor,
.wp-block-post-content > .sbf-css { margin-top: 0 !important; margin-bottom: 0 !important; max-width: none !important; }

/* Grundschrift wie Avada */
.fusion-fullwidth {
	font-family: var(--body_typography-font-family);
	font-size: var(--body_typography-font-size);
	line-height: var(--body_typography-line-height);
	color: var(--body_typography-color);
	box-sizing: border-box;
	position: relative;
	width: 100%;
}
.fusion-fullwidth *, .fusion-fullwidth *::before, .fusion-fullwidth *::after { box-sizing: border-box; }
.fusion-fullwidth p { margin: 0 0 20px; }
.fusion-text > :last-child { margin-bottom: 0 !important; } /* letzter Absatz ohne Abstand (Pillen, kleine Karten) */
.fusion-fullwidth a:not([class*="knopf"]):not([class*="btn"]):not([class*="button"]):not([class*="pille"]):not([aria-current]):not(.stehle-bewegt a):not(.sb-konto a) { color: var(--link_color); }
.fusion-fullwidth :is(h1, h2, h3, h4, h5, h6) { font-family: var(--sb-f-titel, var(--sb-f-titel, "Barlow Semi Condensed", Arial, Helvetica, sans-serif)); font-weight: 700; line-height: 1.2; letter-spacing: 0; margin-top: 0; }
.fusion-fullwidth h1 { font-size: var(--sb-h1, calc(40 * var(--sb-px, 1px))); font-family: var(--sb-f-h1, inherit); font-weight: var(--sb-h1-w, 700); line-height: var(--sb-h1-lh, 1.2); color: var(--sb-p-akzent, var(--sb-c-dunkel, #1f5252)); margin-bottom: 20px; }
.fusion-fullwidth h2 { font-size: var(--sb-h2, calc(30 * var(--sb-px, 1px))); font-family: var(--sb-f-h2, inherit); font-weight: var(--sb-h2-w, 700); line-height: var(--sb-h2-lh, 1.2); color: var(--sb-p-akzent, var(--sb-c-dunkel, #1f5252)); margin-bottom: 20px; }
.fusion-fullwidth h3 { font-size: var(--sb-h3, calc(22 * var(--sb-px, 1px))); font-family: var(--sb-f-h3, inherit); font-weight: var(--sb-h3-w, 700); line-height: var(--sb-h3-lh, 1.2); color: var(--sb-p-akzent, var(--sb-c-dunkel, #1f5252)); margin-bottom: 16px; }
.fusion-fullwidth h4 { font-size: var(--sb-h4, calc(19 * var(--sb-px, 1px))); font-family: var(--sb-f-h4, inherit); font-weight: var(--sb-h4-w, 700); line-height: var(--sb-h4-lh, 1.2); color: var(--sb-c-schrift, #2f3434); margin-bottom: 16px; }
.fusion-fullwidth h5 { font-size: var(--sb-h5, calc(18 * var(--sb-px, 1px))); color: var(--sb-c-schrift, #2f3434); margin-bottom: 16px; font-family: var(--sb-f-h5, var(--sb-f-knopf, "Atkinson Hyperlegible", Arial, sans-serif)); }
.fusion-fullwidth h6 { font-size: calc(16 * var(--sb-px, 1px)); color: var(--sb-c-schrift, #2f3434); margin-bottom: 16px; font-family: var(--sb-f-knopf, "Atkinson Hyperlegible", Arial, sans-serif); }
.fusion-fullwidth ul, .fusion-fullwidth ol { margin: 0 0 20px; padding-left: 1.4em; }
.fusion-fullwidth img { max-width: 100%; height: auto; }

/* Raster: Reihe mit Spalten (Avada „Flex“) */
.fusion-flex-container > .fusion-builder-row {
	display: flex;
	flex-wrap: wrap;
	align-items: var(--sbf-items, flex-start);
	justify-content: var(--sbf-justify, flex-start);
	width: calc(100% + var(--sbf-abstand, 4%));
	max-width: calc(var(--sbf-reihe, 1400px) + var(--sbf-abstand, 4%));
	margin-left: max(calc(var(--sbf-abstand, 4%) / -2), calc((100% - var(--sbf-reihe, 1400px) - var(--sbf-abstand, 4%)) / 2));
	margin-right: 0;
}
.fusion-builder-row-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	width: calc(100% + var(--sbf-abstand, 4%));
	margin-left: calc(var(--sbf-abstand, 4%) / -2);
	margin-right: calc(var(--sbf-abstand, 4%) / -2);
}
.fusion-column-wrapper .fusion-builder-row-inner { width: calc(100% + var(--sbf-abstand, 4%)); }
.fusion-layout-column { position: relative; display: flex; min-width: 0; }
.fusion-layout-column > .fusion-column-wrapper { display: flex; width: 100%; min-height: 1px; position: relative; }
.fusion-content-layout-column > * { max-width: 100%; }
.fusion-content-layout-column > :is(.fusion-text, .fusion-title, .fusion-imageframe, .fusion-builder-row, .fusion-checklist, .accordian, .fusion-separator, .sbf-knopf-ausr, .sbf-bild-ausr) { width: 100%; }
.fusion-content-layout-column > .fusion-imageframe:not([style*="width"]) { width: auto; align-self: flex-start; }
.fusion-content-layout-column > .fusion-button { align-self: flex-start; }
.sbf-reihe > .fusion-column-wrapper > :is(.fusion-text, .fusion-title, .fusion-builder-row, .fusion-checklist, .accordian, .fusion-separator, .sbf-knopf-ausr, .sbf-bild-ausr) { width: 100%; }
.sbf-reihe > .fusion-column-wrapper > .fusion-builder-row-inner { width: calc(100% + var(--sbf-abstand, 4%)); }
/* 2.98.2: Plugin-Bausteine in Builder-Spalten volle Breite. Sonst misst die umbrechende Flex-Spalte sie schmal aus und sie werden viel zu hoch (Gruppe in der Nähe: lange Leere unter der Karte). */
.fusion-column-wrapper > .sb-baustein { width: 100%; }
.sbf-spalten-link { position: absolute; inset: 0; z-index: 2; }

/* Titel */
.fusion-title { width: 100%; }
.fusion-title .fusion-title-heading { margin: 0; }
.fusion-title + .fusion-text, .fusion-title { margin-bottom: 0; }
.fusion-fullwidth .fusion-title { margin-bottom: 20px; }

/* Knöpfe wie Avada (Kapsel, Atkinson fett) */
.fusion-fullwidth .fusion-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	border: 0 solid var(--button_border_color, var(--sb-c-akzent, #2c6b6b));
	border-radius: 999px;
	background: var(--button_gradient_top_color);
	color: var(--button_accent_color);
	font-family: var(--button_typography-font-family);
	font-weight: 700;
	font-size: calc(16 * var(--sb-px, 1px));
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .2s, color .2s, border-color .2s;
	max-width: 100%;
}
.fusion-fullwidth .fusion-button.button-default:hover { background: var(--button_gradient_top_color_hover); }
.fusion-fullwidth .fusion-button .fusion-button-text { color: inherit; }

/* Bilder */
.fusion-imageframe { display: inline-block; overflow: hidden; line-height: 0; max-width: 100%; vertical-align: top; }
.fusion-imageframe img { display: block; max-width: 100%; height: auto; }

/* Symbole */
.sbf-symbol { width: 1em; height: 1em; display: block; }
.sbf-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 1; flex: none; }
.sbf-icon-link { text-decoration: none; }

/* Checkliste */
.fusion-checklist { list-style: none; padding: 0 !important; margin: 0 0 20px; }
.fusion-checklist .fusion-li-item { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 10px; }
.fusion-checklist .icon-wrapper { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.1em; height: 1.1em; margin-top: .25em; color: var(--sbf-akzent); font-size: .9em; }
.fusion-checklist .icon-wrapper.circle-yes { width: 1.6em; height: 1.6em; border-radius: 50%; padding: .35em; margin-top: 0; }
.fusion-checklist .fusion-li-item-content > :last-child { margin-bottom: 0; }

/* Aufklapper (häufige Fragen) */
.sbf-akkordeon { display: flex; flex-direction: column; gap: 12px; width: 100%; }
.sbf-klapp { border-bottom: 1px solid var(--sb-c-linie, #dfe6e6); }
.sbf-akkordeon.sbf-box .sbf-klapp { border-bottom: 0; }
.sbf-klapp summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; }
.sbf-klapp summary::-webkit-details-marker { display: none; }
.sbf-klapp summary::after { content: "+"; font: 400 calc(24 * var(--sb-px, 1px))/1 Arial, sans-serif; flex: none; }
.sbf-klapp[open] summary::after { content: "–"; }
.sbf-klapp .sbf-klapp-titel { margin: 0 !important; font-size: inherit !important; color: inherit !important; font-family: var(--body_typography-font-family) !important; font-weight: 700; line-height: inherit; }
.sbf-klapp-inhalt { padding: 0 20px 18px; }
.sbf-klapp-inhalt > :last-child { margin-bottom: 0; }

/* Social Links, Trennlinie */
.sbf-social { display: flex; flex-wrap: wrap; align-items: center; }
.sbf-social a { color: inherit; text-decoration: none; display: inline-flex; }
.sbf-social a:hover { opacity: .75; }
.fusion-separator { height: 0; }

/* Handy: Avada stapelt Spalten, wenn nichts anderes eingestellt ist (Breite kommt je Spalte). */
/* 2.117.0: Handy-Größen der Überschriften kommen aus dem Theme (--sb-h1/--sb-h2 werden auf schmalen Schirmen kleiner) */

/* Einheitlicher Stil (2.89.0, ab 2.117.0 aus dem Theme): Überschriftgrößen H1–H4 überall gleich, weiße Karten überall gleich */
.fusion-fullwidth h1.fusion-title-heading, .fusion-text h1:not([class]):not(.stehle-bewegt *) { font-size: var(--sb-h1) !important; }
.fusion-fullwidth h2.fusion-title-heading, .fusion-text h2:not([class]):not(.stehle-bewegt *) { font-size: var(--sb-h2) !important; }
.fusion-fullwidth h3.fusion-title-heading, .fusion-text h3:not([class]):not(.stehle-bewegt *) { font-size: var(--sb-h3) !important; }
.fusion-fullwidth h4.fusion-title-heading, .fusion-text h4:not([class]):not(.stehle-bewegt *) { font-size: var(--sb-h4) !important; }
.sbf-karte > .fusion-column-wrapper { background-color: var(--sb-c-basis, #fff) !important; border-radius: 14px !important; border: 1px solid rgba(47, 52, 52, .08) !important; box-shadow: 0 2px 10px rgba(47, 52, 52, .05) !important; }
.fusion-text :is(h1, h2, h3, h4)[style*="color"]:not(.stehle-bewegt *):not([style*="#fff"]):not([style*="255, 255, 255"]):not([style*="white"]) { color: var(--sb-p-akzent, var(--sb-c-dunkel, #1f5252)) !important; }
/* Handgeschriebene Startseiten-Bausteine (Code-Element) im gleichen Kartenstil */
body.sb-wie-avada :is(.phome-card, .khome-card) { background: var(--sb-c-basis, #fff) !important; border-radius: 14px !important; border: 1px solid rgba(47, 52, 52, .08) !important; box-shadow: 0 2px 10px rgba(47, 52, 52, .05) !important; }
body.sb-wie-avada :is(.phome-section, .khome-section) { background: transparent !important; }
.sbf-karte .sbf-karte > .fusion-column-wrapper { border: 0 !important; box-shadow: none !important; } /* keine Karte in der Karte */
/* Spalte mit fester Breite (z. B. runde Nummer): bleibt quadratisch, Inhalt mittig */
.fusion-layout-column.sbf-fest { flex: none; padding-left: 0 !important; padding-right: 0 !important; }
.sbf-fest > .fusion-column-wrapper { aspect-ratio: 1; min-height: 0 !important; justify-content: center !important; align-items: center !important; padding: 0 !important; }
.sbf-fest .fusion-text, .sbf-fest p { margin: 0 !important; text-align: center; line-height: 1 !important; color: #fff; font-weight: 700; }
.fusion-text > .sb-karte:last-child { margin-bottom: 24px !important; } /* 2.90.0: Karte im Textbaustein braucht Abstand zur nächsten */
