/* =========================================================================
   Formulare (20.10.2026)
   Schadenmeldung in drei Schritten (Kontakt, Formularkarte), das Formular „Bilder und
   Dokumente nachreichen“ (/bilder-nachreichen/, Seite aus den Bausteinen der
   Kontaktseite), das Fenster „Rückruf
   anfordern“ wie new. (auf allen Seiten, HTML im Fußbereich) und die Danke-Seite
   der Schadenmeldung wie new. (/danke-schadenmeldung/). Die alte Bestätigungsseite
   nach Vercel ist seit 20.10.2026 spätabends weg.
   Zuerst Nachbau von kfz-biesterfeldt.vercel.app (Vercels forms.css: Feld, Auswahl,
   Upload, Meldung; Schrittanzeige, Formularkarte), Vercels Klassen bf-* heißen hier
   fm-*. Seit 20.10.2026 Stück für Stück wie new.: Maße von new., Schrift und Farben
   von final., Knöpfe immer rund.
   Verhalten in formulare.js. Das HTML steht in Elementor (HTML-Bausteine).

   Versand seit 20.10.2026 nachts wie new. (Plugin „Pixel Kreativ Formulare“), mit
   Fortschrittsbalken und Fortschritt je Kärtchen. Die Knöpfe sind die vorhandenen
   „knopf“-Bausteine.
   ========================================================================= */

:root {
	--fm-blau: #0349ae;             /* brand-primary */
	--fm-aktion: #0a5ac4;           /* brand-action */
	--fm-navy: #03183d;             /* text-strong */
	--fm-text: #434b5b;             /* text-body */
	--fm-grau: #5a6272;             /* text-muted */
	--fm-platzhalter: #6b7383;
	--fm-linie: #d9e0ea;            /* border-subtle */
	--fm-linie-kachel: #bcc5d2;     /* border-default */
	--fm-linie-feld: #858e9e;       /* border-control */
	--fm-linie-stark: #434b5b;      /* border-strong */
	--fm-halo: rgba(28, 106, 208, .22);
	--fm-fokus: #1c6ad0;
	--fm-rot: #dc1416;
	--fm-rot-text: #b01015;
	--fm-rot-50: #fdeeee;
	--fm-rot-200: #f5b8b9;
	--fm-blau-50: #eef4fd;
	--fm-blau-100: #dce7f9;
	--fm-blau-200: #b9cff3;
	--fm-blau-300: #88aee8;
	--fm-hell: #f9fafd;             /* slate-25 */
	--fm-schatten-sm: 0 1px 2px rgba(3, 24, 61, .06), 0 3px 10px -3px rgba(3, 24, 61, .10);
	--fm-weich: cubic-bezier(.16, 1, .3, 1);
}

@keyframes fm-pop {
	0% { transform: scale(.6); opacity: 0; }
	100% { transform: scale(1); opacity: 1; }
}
@keyframes fm-runter {
	0% { transform: translateY(-6px); opacity: 0; }
	100% { transform: none; opacity: 1; }
}

/* ------------------------------------------------------------- Grundlagen */
/* Zeilenhöhe als Faktor wie Vercels body (--lh-body 1.62): final. vererbt sie
   sonst in Pixeln (29,16 px), kleinere Schrift bekäme zu hohe Zeilen */
.fm,
.fm-dialog,
.fm-danke { line-height: 1.62; }
.fm {
	font-family: var(--b-schrift, "Archivo", "Helvetica Neue", Arial, sans-serif);
	color: var(--fm-text);
}
.fm [hidden],
.fm[hidden],
.fm-dialog-hg[hidden],
.fm-danke [hidden] { display: none !important; }
.fm *,
.fm *::before,
.fm *::after { box-sizing: border-box; }
/* Astra setzt label und legend auf 14 px/500/20 px; hier gilt die Schrift des Formulars */
.fm label,
.fm legend {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}
/* Umbruch wie Vercel (base.css): Absätze und Listen „pretty“, Überschriften „balance“ */
.fm p,
.fm li,
.fm-dialog p,
.fm-danke p { text-wrap: pretty; }
.fm h2,
.fm h3,
.fm-dialog h2,
.fm-danke h1 { text-wrap: balance; }
.fm .fm-unsichtbar {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.fm .fm-nowrap { white-space: nowrap; }
.fm a:not(.knopf):not(.fm-textknopf) {
	color: var(--fm-blau);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .2em;
	transition: color .16s var(--ease-standard, ease), text-decoration-thickness .16s var(--ease-standard, ease);
}
.fm a:not(.knopf):not(.fm-textknopf):hover {
	color: #053b8c;
	text-decoration-thickness: 2px;
}
.fm .fm-form {
	container-type: inline-size;    /* Kacheln und Knopfreihe richten sich nach der Formularbreite */
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin: 0;
}
.fm .fm-teil {
	display: flex;
	flex-direction: column;
	gap: 22px;
	animation: fm-runter .24s var(--fm-weich);
}
.fm .fm-zwei {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: 22px 18px;
}

/* ---------------------------------------------------------------- Felder */
.fm .fm-feld,
.fm .fm-feld-huelle {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.fm .fm-label {
	display: block;
	margin: 0;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--fm-navy);
}
.fm .fm-pflicht { margin-left: 2px; color: var(--fm-blau); }
.fm .fm-optional { font-weight: 400; color: var(--fm-grau); }
.fm .fm-hinweis {
	margin: 0;
	font-size: .875rem;
	line-height: 1.45;
	color: var(--fm-grau);
}
.fm .fm-steuer {
	position: relative;
	display: flex;
	align-items: center;
}
.fm .fm-steuer .fm-eingabe {
	width: 100%;
	height: auto;
	min-height: 52px;
	margin: 0;
	padding: 12px 16px;
	border: 1.5px solid var(--fm-linie-feld);
	border-radius: 8px;
	background: #fff;
	box-shadow: none;
	font-family: inherit;
	font-size: var(--b-fs-body, clamp(1.0625rem, 1.037rem + .11vw, 1.125rem));
	font-weight: 400;
	line-height: 1.4;
	color: var(--fm-navy);
	-webkit-appearance: none;
	appearance: none;
	transition: border-color .16s var(--ease-standard, ease), box-shadow .16s var(--ease-standard, ease), background-color .16s;
}
.fm .fm-steuer .fm-eingabe::placeholder { color: var(--fm-platzhalter); opacity: 1; }
.fm .fm-steuer .fm-eingabe:hover { border-color: var(--fm-linie-stark); }
.fm .fm-steuer .fm-eingabe:focus {
	outline: none;
	border-color: var(--fm-aktion);
	box-shadow: 0 0 0 4px var(--fm-halo);
}
.fm .fm-steuer .fm-eingabe--text {
	min-height: 148px;
	padding-top: 14px;
	resize: vertical;
}
.fm .fm-steuer .fm-eingabe--auswahl { padding-right: 48px; cursor: pointer; }
/* Noch nichts gewählt („Bitte auswählen“): grau wie die Platzhalter der anderen Felder
   (Auftraggeber 20.10.2026); die Einträge der Liste bleiben dunkel */
.fm .fm-steuer .fm-eingabe--auswahl:has(option[value=""]:checked) { color: var(--fm-platzhalter); }
.fm .fm-steuer .fm-eingabe--auswahl option { color: var(--fm-navy); }
.fm .fm-steuer .fm-eingabe--auswahl option[value=""] { color: var(--fm-platzhalter); }
.fm .fm-symbol,
.fm .fm-status,
.fm .fm-pfeil {
	position: absolute;
	display: inline-flex;
	pointer-events: none;
}
.fm .fm-symbol { left: 15px; color: var(--fm-grau); }
.fm .fm-feld--symbol .fm-steuer .fm-eingabe { padding-left: 46px; }
.fm .fm-pfeil { right: 16px; color: var(--fm-text); }
.fm .fm-status { right: 15px; animation: fm-pop .24s var(--fm-weich); }
.fm .fm-feld--auswahl .fm-status { right: 44px; }
.fm .fm-feld--text .fm-status { top: 14px; }
.fm .fm-feld.is-error .fm-steuer .fm-eingabe {
	padding-right: 46px;
	border-color: var(--fm-rot);
}
.fm .fm-feld--auswahl.is-error .fm-steuer .fm-eingabe { padding-right: 72px; }
.fm .fm-feld.is-error .fm-steuer .fm-eingabe:focus { box-shadow: 0 0 0 4px rgba(220, 20, 22, .16); }
.fm .fm-feld.is-error .fm-status { color: var(--fm-rot); }
.fm .fm-meldung {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	margin: 0;
	font-size: .875rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--fm-rot-text);
	animation: fm-runter .24s var(--fm-weich);
}
.fm .fm-meldung svg { flex: none; margin-top: 1px; }

/* -------------------------------------------- Auswahl: Kacheln und Pillen */
.fm .fm-auswahl {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}
.fm .fm-auswahl-titel {
	float: none;
	width: auto;
	margin: 0 0 4px;
	padding: 0;
	border: 0;
}
.fm .fm-auswahl-raster {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--fm-kachel-min, 180px)), 1fr));
	gap: 12px;
	margin-top: 8px;
}
.fm .fm-kachel {
	position: relative;
	display: block;
	margin: 0;
	cursor: pointer;
}
.fm .fm-kachel-eingabe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}
.fm .fm-kachel-karte {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	padding: 16px 44px 14px 16px;
	border: 1.5px solid var(--fm-linie-kachel);
	border-radius: 8px;
	background: #fff;
	transition: border-color .16s, background-color .16s, box-shadow .16s;
}
.fm .fm-kachel-symbol { display: inline-flex; margin-bottom: 2px; color: var(--fm-blau); }
.fm .fm-kachel-titel {
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--fm-navy);
}
.fm .fm-kachel-text {
	font-size: .875rem;
	line-height: 1.4;
	color: var(--fm-grau);
}
.fm .fm-kachel-haken {
	position: absolute;
	top: 14px;
	right: 14px;
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border: 1.5px solid var(--fm-linie-feld);
	border-radius: 50%;
	background: #fff;
	color: transparent;
	transition: background-color .16s, border-color .16s;
}
.fm .fm-kachel:hover .fm-kachel-karte {
	border-color: var(--fm-blau-300);
	background: var(--fm-hell);
}
.fm .fm-kachel-eingabe:checked + .fm-kachel-karte {
	border-color: var(--fm-aktion);
	background: var(--fm-blau-50);
	box-shadow: inset 0 0 0 1px var(--fm-aktion);
}
.fm .fm-kachel-eingabe:checked + .fm-kachel-karte .fm-kachel-haken {
	border-color: var(--fm-aktion);
	background: var(--fm-aktion);
	color: #fff;
	animation: fm-pop .24s var(--fm-weich);
}
.fm .fm-kachel-eingabe:focus-visible + .fm-kachel-karte {
	outline: 3px solid var(--fm-fokus);
	outline-offset: 2px;
}
.fm .fm-auswahl.is-error .fm-kachel-karte { border-color: var(--fm-rot-200); }
.fm .fm-auswahl--zeile .fm-auswahl-raster {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.fm .fm-auswahl--zeile .fm-kachel-karte {
	flex-direction: row;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 8px 18px 8px 12px;
	border-radius: 999px;
}
.fm .fm-auswahl--zeile .fm-kachel-haken { position: static; order: -1; }
.fm .fm-auswahl--zeile .fm-kachel-titel { font-weight: 500; }
.fm .fm-auswahl .fm-meldung { margin-top: 8px; }

/* ------------------------------ Schadenmeldung Schritt 2 wie new. (20.10.2026) */
/* Kacheln „Worum geht es?“ und „Ist das Fahrzeug noch fahrbereit?“: Auswahlpunkt oben links,
   Symbol und Text mittig; Maße von new., Schrift und Farben wie final. */
.fm .fm-auswahl--new .fm-auswahl-raster {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}
.fm .fm-auswahl--new .fm-kachel-karte {
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 120px;
	padding: 14px 12px 12px;
	border: 1px solid var(--fm-linie);
	text-align: center;
	color: var(--fm-text);
	transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s;
}
.fm .fm-auswahl--new .fm-kachel-symbol { margin: 0; color: inherit; }
.fm .fm-auswahl--new .fm-kachel-titel {
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
	color: inherit;
}
.fm .fm-auswahl--new .fm-kachel-text {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	min-height: 34px;
	max-width: 220px;
	font-size: 12px;
	line-height: 17px;
	color: var(--fm-grau);
}
.fm .fm-auswahl--new .fm-kachel-punkt {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 14px;
	height: 14px;
	border: 1.5px solid var(--fm-linie-feld);
	border-radius: 50%;
	background: #fff;
	box-shadow: inset 0 0 0 3px #fff;
	transition: background-color .2s, border-color .2s;
}
.fm .fm-auswahl--new .fm-kachel:hover .fm-kachel-karte {
	color: var(--fm-aktion);
	background: var(--fm-blau-50);
	border-color: var(--fm-blau-300);
	box-shadow: 0 2px 10px rgba(10, 90, 196, .1);
}
.fm .fm-auswahl--new .fm-kachel-eingabe:checked + .fm-kachel-karte {
	color: var(--fm-aktion);
	background: var(--fm-blau-50);
	border-color: var(--fm-aktion);
	box-shadow: 0 0 0 1px var(--fm-aktion);
}
.fm .fm-auswahl--new .fm-kachel-eingabe:checked + .fm-kachel-karte .fm-kachel-punkt {
	border-color: var(--fm-aktion);
	background: var(--fm-aktion);
}
.fm .fm-auswahl--new .fm-kachel-eingabe:focus-visible + .fm-kachel-karte {
	outline: 3px solid rgba(10, 90, 196, .22);
	outline-offset: 2px;
}
.fm .fm-auswahl--new.is-error .fm-kachel-karte { border-color: var(--fm-rot-200); }
/* „Bin mir nicht sicher“ über die ganze Breite, Symbol und Text in einer Zeile */
.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child { grid-column: 1 / -1; }
.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-karte {
	flex-direction: row;
	justify-content: flex-start;
	gap: 12px;
	min-height: 0;
	padding: 15px 18px 15px 42px;
	text-align: left;
}
.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-symbol svg { width: 24px; height: 24px; }
.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-text {
	align-items: center;
	min-height: 0;
	max-width: none;
}
/* „fahrbereit?“: drei gleich breite Felder, Punkt links */
.fm .fm-auswahl--zeile.fm-auswahl--new .fm-auswahl-raster { display: grid; }
.fm .fm-auswahl--zeile.fm-auswahl--new .fm-kachel-karte {
	flex-direction: row;
	justify-content: flex-start;
	min-height: 47px;
	padding: 11px 14px 11px 42px;
	border-radius: 8px;
	text-align: left;
	color: var(--fm-navy);
}
.fm .fm-auswahl--zeile.fm-auswahl--new .fm-kachel-titel {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
}
.fm .fm-auswahl--zeile.fm-auswahl--new .fm-kachel-punkt {
	top: 50%;
	left: 16px;
	margin-top: -7px;
	border-width: 1px;
	border-color: var(--fm-linie-kachel);
}
@container (max-width: 599.98px) {
	.fm .fm-auswahl--new:not(.fm-auswahl--zeile) .fm-auswahl-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (max-width: 419.98px) {
	.fm .fm-auswahl--new .fm-auswahl-raster,
	.fm .fm-auswahl--new:not(.fm-auswahl--zeile) .fm-auswahl-raster { grid-template-columns: 1fr; gap: 10px; }
	.fm .fm-auswahl--new:not(.fm-auswahl--zeile) .fm-kachel-karte { min-height: 0; padding: 16px 12px 14px; }
	.fm .fm-auswahl--new .fm-kachel-text { min-height: 0; }
	.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-karte {
		flex-direction: column;
		justify-content: center;
		gap: 6px;
		padding: 16px 12px 14px;
		text-align: center;
	}
	.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-symbol svg { width: 26px; height: 26px; }
	.fm [data-feld="leistung"].fm-auswahl--new .fm-kachel:last-child .fm-kachel-text { justify-content: center; text-align: center; }
}
/* Kennzeichen, Schadendatum, Schadenort nebeneinander */
.fm .fm-drei {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 22px 18px;
}
/* Kennzeichen mit EU-Streifen wie new. Der Streifen trägt denselben (durchsichtigen) 1,5-px-Rahmen wie das
   Feld und malt nur innerhalb davon: so rundet der Browser beide Rahmen gleich (bei 150 % Anzeige z. B. auf
   1,33 px) und es bleibt oben kein weißer Spalt (Auftraggeber 20.10.2026: „oben ist ein kleiner weißer Streifen“) */
.fm .fm-feld--kennzeichen .fm-steuer::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 0;
	bottom: 0;
	left: 0;
	width: 29.5px;
	border: 1.5px solid transparent;
	border-right: 0;
	border-radius: 8px 0 0 8px;
	background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%2245%22%20viewBox%3D%220%200%2026%2045%22%3E%3Crect%20width%3D%2226%22%20height%3D%2245%22%20fill%3D%22%23003399%22%2F%3E%3Cg%20fill%3D%22%23FFCC00%22%3E%3Cpolygon%20points%3D%2213%2C7.85%2013.36%2C8.9%2014.47%2C8.92%2013.59%2C9.59%2013.91%2C10.65%2013%2C10.02%2012.09%2C10.65%2012.41%2C9.59%2011.53%2C8.92%2012.64%2C8.9%22%2F%3E%3Cpolygon%20points%3D%2215.8%2C8.6%2016.16%2C9.65%2017.27%2C9.67%2016.39%2C10.34%2016.71%2C11.4%2015.8%2C10.77%2014.89%2C11.4%2015.21%2C10.34%2014.33%2C9.67%2015.44%2C9.65%22%2F%3E%3Cpolygon%20points%3D%2217.85%2C10.65%2018.21%2C11.7%2019.32%2C11.72%2018.44%2C12.39%2018.76%2C13.45%2017.85%2C12.82%2016.94%2C13.45%2017.26%2C12.39%2016.38%2C11.72%2017.49%2C11.7%22%2F%3E%3Cpolygon%20points%3D%2218.6%2C13.45%2018.96%2C14.5%2020.07%2C14.52%2019.19%2C15.19%2019.51%2C16.25%2018.6%2C15.62%2017.69%2C16.25%2018.01%2C15.19%2017.13%2C14.52%2018.24%2C14.5%22%2F%3E%3Cpolygon%20points%3D%2217.85%2C16.25%2018.21%2C17.3%2019.32%2C17.32%2018.44%2C17.99%2018.76%2C19.05%2017.85%2C18.42%2016.94%2C19.05%2017.26%2C17.99%2016.38%2C17.32%2017.49%2C17.3%22%2F%3E%3Cpolygon%20points%3D%2215.8%2C18.3%2016.16%2C19.35%2017.27%2C19.37%2016.39%2C20.04%2016.71%2C21.1%2015.8%2C20.47%2014.89%2C21.1%2015.21%2C20.04%2014.33%2C19.37%2015.44%2C19.35%22%2F%3E%3Cpolygon%20points%3D%2213%2C19.05%2013.36%2C20.1%2014.47%2C20.12%2013.59%2C20.79%2013.91%2C21.85%2013%2C21.22%2012.09%2C21.85%2012.41%2C20.79%2011.53%2C20.12%2012.64%2C20.1%22%2F%3E%3Cpolygon%20points%3D%2210.2%2C18.3%2010.56%2C19.35%2011.67%2C19.37%2010.79%2C20.04%2011.11%2C21.1%2010.2%2C20.47%209.29%2C21.1%209.61%2C20.04%208.73%2C19.37%209.84%2C19.35%22%2F%3E%3Cpolygon%20points%3D%228.15%2C16.25%208.51%2C17.3%209.62%2C17.32%208.74%2C17.99%209.06%2C19.05%208.15%2C18.42%207.24%2C19.05%207.56%2C17.99%206.68%2C17.32%207.79%2C17.3%22%2F%3E%3Cpolygon%20points%3D%227.4%2C13.45%207.76%2C14.5%208.87%2C14.52%207.99%2C15.19%208.31%2C16.25%207.4%2C15.62%206.49%2C16.25%206.81%2C15.19%205.93%2C14.52%207.04%2C14.5%22%2F%3E%3Cpolygon%20points%3D%228.15%2C10.65%208.51%2C11.7%209.62%2C11.72%208.74%2C12.39%209.06%2C13.45%208.15%2C12.82%207.24%2C13.45%207.56%2C12.39%206.68%2C11.72%207.79%2C11.7%22%2F%3E%3Cpolygon%20points%3D%2210.2%2C8.6%2010.56%2C9.65%2011.67%2C9.67%2010.79%2C10.34%2011.11%2C11.4%2010.2%2C10.77%209.29%2C11.4%209.61%2C10.34%208.73%2C9.67%209.84%2C9.65%22%2F%3E%3C%2Fg%3E%3Ctext%20x%3D%2213%22%20y%3D%2238.5%22%20text-anchor%3D%22middle%22%20font-family%3D%22Arial%2CHelvetica%2Csans-serif%22%20font-size%3D%2212%22%20font-weight%3D%22700%22%20fill%3D%22%23FFFFFF%22%3ED%3C%2Ftext%3E%3C%2Fsvg%3E") center / 100% 100% no-repeat padding-box;
	pointer-events: none;
}
.fm .fm-feld--kennzeichen .fm-steuer .fm-eingabe {
	padding-left: 42px;
	letter-spacing: .4px;
	font-variant-numeric: tabular-nums;
}
/* Schadendatum wie new.: leer grauer Beispieltext statt „tt.mm.jjjj“ (formulare.js setzt hat-datum/tippt) */
.fm .fm-feld--datum .fm-steuer .fm-eingabe { cursor: pointer; }
.fm .fm-datum-beispiel {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 46px;
	right: 16px;
	overflow: hidden;
	font-size: var(--b-fs-body, clamp(1.0625rem, 1.037rem + .11vw, 1.125rem));
	line-height: 1.4;
	color: var(--fm-platzhalter);
	white-space: nowrap;
	text-overflow: ellipsis;
	transform: translateY(-50%);
	pointer-events: none;
}
.fm .fm-datum.hat-datum ~ .fm-datum-beispiel,
.fm .fm-datum.tippt ~ .fm-datum-beispiel { display: none; }
.fm .fm-datum:not(.hat-datum):not(.tippt) { color: transparent; }
.fm .fm-datum:not(.hat-datum):not(.tippt)::-webkit-datetime-edit { opacity: 0; }
.fm .fm-datum:not(.hat-datum):not(.tippt)::-webkit-calendar-picker-indicator { opacity: 0; }

/* ---------------------------------------------------------------- Upload */
.fm .fm-upload {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.fm .fm-upload-flaeche {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 28px 20px;
	border: 2px dashed var(--fm-linie-kachel);
	border-radius: 8px;
	background: var(--fm-hell);
	text-align: center;
	cursor: pointer;
	transition: border-color .16s, background-color .16s;
}
.fm .fm-upload-flaeche:hover,
.fm .fm-upload.is-drag .fm-upload-flaeche {
	border-color: var(--fm-aktion);
	background: var(--fm-blau-50);
}
.fm .fm-upload-eingabe:focus-visible + .fm-upload-flaeche {
	outline: 3px solid var(--fm-fokus);
	outline-offset: 2px;
}
.fm .fm-upload-symbol {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 4px;
	border-radius: 50%;
	background: #fff;
	color: var(--fm-blau);
	box-shadow: var(--fm-schatten-sm);
	transition: transform .24s var(--fm-weich);
}
.fm .fm-upload.is-drag .fm-upload-symbol { transform: translateY(-3px); }
.fm .fm-upload-titel { font-weight: 600; color: var(--fm-navy); }
.fm .fm-upload.is-error .fm-upload-flaeche { border-color: var(--fm-rot); }
.fm .fm-upload-liste {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 6px 0 0;
	padding: 0;
	list-style: none;
}

/* ------------------------------ Schadenmeldung Schritt 3 wie new. (20.10.2026) */
/* Upload-Fläche: gestrichelt, Wolke, „Dateien auswählen“; darunter Vorschaukärtchen.
   Maße von new., Schrift und Farben wie final. Gilt auch für „Bilder nachreichen“; die
   Dateiliste nach Vercel (mit HEIC) ist seit 20.10.2026 abends raus. */
.fm .fm-upload--new { gap: 0; }
.fm .fm-upload--new > .fm-meldung { margin-top: 10px; }
.fm .fm-upload--new .fm-upload-flaeche {
	justify-content: center;
	gap: 2px;
	min-height: 150px;
	padding: 26px 20px;
	border: 2px dashed var(--fm-blau-200);
	border-radius: 10px;
	background: var(--fm-blau-50);
	transition: border-color .2s, background-color .2s;
}
.fm .fm-upload--new .fm-upload-flaeche:hover { border-color: var(--fm-blau-300); background: var(--fm-blau-50); }
.fm .fm-upload--new.is-drag .fm-upload-flaeche { border-color: var(--fm-aktion); background: var(--fm-blau-100); }
.fm .fm-upload--new .fm-upload-eingabe:focus-visible + .fm-upload-flaeche { border-color: var(--fm-aktion); }
.fm .fm-upload--new .fm-upload-symbol {
	display: inline-flex;
	width: auto;
	height: auto;
	margin: 0 0 8px;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--fm-aktion);
}
.fm .fm-upload--new .fm-upload-titel {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--fm-navy);
}
.fm .fm-upload--new .fm-upload-oder { margin-top: 4px; font-size: 13.5px; line-height: 1.4; color: var(--fm-platzhalter); }
/* „Dateien auswählen“: rund wie alle Knöpfe auf final. (auf new. 8 px Ecken) */
.fm .fm-upload--new .fm-upload-knopf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 8px;
	padding: 11px 26px;
	border: 1px solid var(--fm-linie-kachel);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--fm-aktion);
	transition: border-color .2s, background-color .2s;
}
.fm .fm-upload--new .fm-upload-flaeche:hover .fm-upload-knopf { border-color: var(--fm-aktion); background: #f3f8ff; }
.fm .fm-upload--new .fm-upload-typen { margin-top: 8px; font-size: 12.5px; line-height: 1.4; color: var(--fm-platzhalter); }
.fm .fm-upload-meldung { margin: 12px 0 0; font-size: 13px; line-height: 1.5; color: var(--fm-rot-text); }
.fm .fm-upload--new .fm-upload-liste {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 16px 0 0;
}
.fm .fm-upload-karte {
	position: relative;
	min-width: 0;
	margin: 0;
	overflow: hidden;
	border: 1px solid var(--fm-linie);
	border-radius: 10px;
	background: #fff;
	animation: fm-runter .24s var(--fm-weich);
}
.fm .fm-upload-karte-bild {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 10;
	max-width: 100%;
	overflow: hidden;
	background: var(--fm-blau-50);
}
.fm .fm-upload-karte-bild img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fm .fm-upload-karte-bild.ist-dokument { color: var(--fm-platzhalter); }
.fm .fm-upload-karte-weg {
	position: absolute;
	top: 8px;
	right: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 4px rgba(3, 24, 61, .25);
	color: var(--fm-navy);
	cursor: pointer;
	transition: background-color .15s, color .15s;
}
.fm .fm-upload-karte-weg:hover,
.fm .fm-upload-karte-weg:focus-visible { background: var(--fm-aktion); color: #fff; }
/* Fußzeile wie new.: Name, darunter Größe; beim Senden Balken und Prozent, fertig grüner Haken */
.fm .fm-upload-karte-fuss {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	padding: 10px 12px;
}
.fm .fm-upload-karte-text { flex: 1 1 auto; min-width: 0; }
.fm .fm-upload-karte-name {
	display: block;
	overflow: hidden;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--fm-navy);
	text-overflow: ellipsis;
	white-space: nowrap;
}
.fm .fm-upload-karte-zeile {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	margin-top: 3px;
}
.fm .fm-upload-karte-groesse { flex: none; font-size: 12.5px; line-height: 1.4; color: var(--fm-platzhalter); }
.fm .fm-upload-karte-schiene {
	display: none;
	flex: 1 1 auto;
	min-width: 0;
	height: 6px;
	overflow: hidden;
	border-radius: 3px;
	background: var(--fm-blau-100);
}
.fm .fm-upload-karte-balken {
	display: block;
	width: 0;
	height: 100%;
	border-radius: 3px;
	background: var(--fm-aktion);
	transition: width .15s ease;
}
.fm .fm-upload-karte-prozent {
	display: none;
	flex: none;
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--fm-aktion);
	font-variant-numeric: tabular-nums;
}
.fm .fm-upload-karte-haken { display: none; flex: none; width: 22px; height: 22px; color: #16a34a; }
.fm .fm-upload-karte-haken svg { display: block; width: 100%; height: 100%; }
.fm .fm-upload-karte.is-laeuft .fm-upload-karte-schiene,
.fm .fm-upload-karte.is-laeuft .fm-upload-karte-prozent { display: block; }
.fm .fm-upload-karte.is-fertig .fm-upload-karte-haken { display: block; }
/* Während des Sendens: keine Dateien dazu oder weg */
.fm .fm-upload.is-sendet .fm-upload-flaeche { cursor: progress; }
.fm .fm-upload-karte-weg:disabled { cursor: progress; opacity: .45; }
.fm .fm-upload-karte-weg:disabled:hover { background: #fff; color: var(--fm-navy); }

/* Fortschritt beim Absenden wie new. (nur mit Dateien): über den Knöpfen, ab 100 % „Wird verarbeitet …“ */
.fm .fm-fortschritt { width: 100%; }
.fm .fm-fortschritt-kopf {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 7px;
}
.fm .fm-fortschritt-text { font-size: 13.5px; font-weight: 600; line-height: 1.4; color: var(--fm-navy); }
.fm .fm-fortschritt-zahl {
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--fm-aktion);
	font-variant-numeric: tabular-nums;
}
.fm .fm-fortschritt-schiene {
	height: 8px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--fm-blau-100);
}
.fm .fm-fortschritt-balken {
	width: 0;
	height: 100%;
	border-radius: 4px;
	background: var(--fm-aktion);
	transition: width .18s ease;
}
/* Knopf während des Sendens („Wird gesendet …“) */
.elementor .seite .fm .fm-form .knopf:disabled { cursor: progress; opacity: .75; }
/* Meldung, wenn das Senden scheitert (unter dem Knopf, Text von new.) */
.fm .fm-sendefehler { outline: none; }
.fm .fm-sendefehler a { font-weight: 600; }
/* Schmal wie new. (Bildschirm bis 560 px): Kärtchen als Liste – Bild, Name und Größe, ×.
   Die Spalten sind fest zugewiesen, sonst rückt das × (im Aufbau vor dem Namen) in die breite Spalte. */
@media (max-width: 560px) {
	.fm .fm-upload--new .fm-upload-liste { grid-template-columns: 1fr; gap: 10px; }
	.fm .fm-upload-karte {
		display: grid;
		grid-template-columns: 56px 1fr auto;
		align-items: center;
		column-gap: 12px;
		padding: 8px;
		border-radius: 8px;
	}
	.fm .fm-upload-karte-bild { grid-column: 1; grid-row: 1; aspect-ratio: 1 / 1; border-radius: 6px; }
	.fm .fm-upload-karte-bild.ist-dokument svg { width: 24px; height: 24px; }
	.fm .fm-upload-karte-fuss { grid-column: 2; grid-row: 1; padding: 0; }
	.fm .fm-upload-karte-name { overflow: visible; white-space: normal; word-break: break-word; }
	.fm .fm-upload-karte-weg { grid-column: 3; grid-row: 1; position: static; background: var(--fm-blau-50); box-shadow: none; }
}
@container (max-width: 559.98px) {
	.fm .fm-nur-breit { display: none; }
}
/* „Ihre Dateien werden geschützt übertragen …“ */
.fm .fm-upload-vertraulich {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-size: 13.5px;
	line-height: 1.4;
	color: var(--fm-platzhalter);
}
.fm .fm-upload-vertraulich svg { flex: none; color: var(--fm-aktion); }
/* Häkchen zur Datenschutzerklärung (Pflicht) */
.fm .fm-zustimmung { display: flex; flex-direction: column; gap: 8px; }
.fm .fm-zustimmung-zeile {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	cursor: pointer;
}
.fm .fm-zustimmung-eingabe {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	margin: 2px 0 0;
	border: 1.5px solid var(--fm-linie-kachel);
	border-radius: 5px;
	background: #fff center / 13px auto no-repeat;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: background-color .15s, border-color .15s;
}
.fm .fm-zustimmung-eingabe:hover { border-color: var(--fm-blau-300); }
.fm .fm-zustimmung-eingabe:checked {
	border-color: var(--fm-aktion);
	background-color: var(--fm-aktion);
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22white%22 stroke-width=%223%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12.5l5 5L19 7%22/%3E%3C/svg%3E");
}
.fm .fm-zustimmung-eingabe:focus-visible { outline: 3px solid rgba(10, 90, 196, .22); outline-offset: 2px; }
.fm .fm-zustimmung.is-error .fm-zustimmung-eingabe { border-color: var(--fm-rot); }
.fm .fm-zustimmung-text { font-size: 13.5px; line-height: 1.55; color: var(--fm-text); }

/* ------------------------------------------------- Meldungen und Hinweise */
.fm .fm-notiz {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	padding: 18px 20px;
	border: 1px solid;
	border-radius: 8px;
	animation: fm-runter .24s var(--fm-weich);
}
.fm .fm-notiz-symbol { display: inline-flex; padding-top: 1px; }
.fm .fm-notiz-text { display: flex; flex-direction: column; gap: 4px; }
.fm .fm-notiz-titel {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--fm-navy);
}
.fm .fm-notiz-inhalt {
	margin: 0;
	font-size: .9375rem;
	line-height: 1.5;
	color: var(--fm-text);
}
.fm .fm-notiz--fehler { background: var(--fm-rot-50); border-color: var(--fm-rot-200); }
.fm .fm-notiz--fehler .fm-notiz-symbol { color: var(--fm-rot); }
.fm .fm-notiz--info { background: var(--fm-blau-50); border-color: var(--fm-blau-200); }
.fm .fm-notiz--info .fm-notiz-symbol { color: var(--fm-blau); }
.fm .fm-fehlerbox { outline: none; }

/* ------------------------------------------- Schadenmeldung: Schrittanzeige */
.fm.fm-anfrage {
	display: flex;
	flex-direction: column;
	gap: 24px;
	scroll-margin-top: 110px;
}
.fm .fm-schritte {
	container-type: inline-size;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.fm .fm-schrittliste {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.fm .fm-schritt {
	flex: 0 1 auto;
	min-width: 0;
	margin: 0;
}
.fm .fm-schritt-linie {
	flex: 1 1 24px;
	min-width: 16px;
	height: 4px;
	margin: 22px 0 0;
	border-radius: 999px;
	background: var(--fm-blau-100);
	transition: background-color .36s;
}
.fm .fm-schritt-linie.ist-aktiv { background: var(--fm-blau); }
.fm .fm-schritt-knopf {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 14px;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-family: inherit;
	line-height: inherit;
	text-align: left;
	color: inherit;
	cursor: default;
}
.fm .fm-schritt-knopf:not(:disabled) { cursor: pointer; }
.fm .fm-schritt-knopf:hover,
.fm .fm-schritt-knopf:focus { background: transparent; color: inherit; }
.fm .fm-schritt-kreis {
	flex: none;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--fm-blau-50);
	color: var(--fm-navy);
	font-size: 1.125rem;
	font-weight: 700;
	transition: background-color .24s, color .24s;
}
.fm .fm-schritt.ist-aktiv .fm-schritt-kreis,
.fm .fm-schritt.ist-erledigt .fm-schritt-kreis { background: var(--fm-blau); color: #fff; }
.fm .fm-schritt-haken,
.fm .fm-schritt.ist-erledigt .fm-schritt-nr { display: none; }
.fm .fm-schritt.ist-erledigt .fm-schritt-haken { display: block; }
.fm .fm-schritt-name {
	min-width: 0;
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.25;
	white-space: normal;
	overflow-wrap: break-word;
	color: var(--fm-navy);
}
.fm .fm-schritt.ist-aktiv .fm-schritt-name { color: var(--fm-blau); }
/* Schmal: Beschriftung unter dem Kreis (wie Vercel: Formular < 660 px oder Bildschirm ≤ 700 px) */
@container (max-width: 659.98px) {
	.fm .fm-schritt-knopf { flex-direction: column; gap: 6px; text-align: center; }
	.fm .fm-schritt-name { font-size: .8125rem; }
}
@media (max-width: 700px) {
	.fm .fm-schritt-knopf { flex-direction: column; gap: 6px; text-align: center; }
	.fm .fm-schritt-name { font-size: .8125rem; }
}
@container (max-width: 269.98px) {
	.fm .fm-schrittliste { gap: 4px; }
	.fm .fm-schritt-linie { flex: 0 0 8px; min-width: 0; }
	.fm .fm-schritt { min-width: auto; }
	.fm .fm-schritt-name { font-size: .75rem; }
}
.fm .fm-info {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 29px;
	overflow: hidden;
	font-size: .9375rem;
	color: var(--fm-grau);
}
.fm .fm-schritt-text { outline: none; }
.fm .fm-pflicht-hinweis { position: relative; }
.fm .fm-pflicht-hinweis::before {
	content: "";
	position: absolute;
	left: -15px;
	top: 50%;
	width: 1px;
	height: 22px;
	margin-top: -11px;
	background: var(--fm-linie);
}

/* ------------------------------------- Schadenmeldung: Spamfalle und Knöpfe */
.fm .fm-falle {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.fm .fm-aktionen {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.fm .fm-fuss {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 4px 16px;
}
/* Knöpfe in den Formularen schlanker wie new. (Auftraggeber 20.10.2026: „die buttons nicht so
   wuchtig“): 48 statt 52–60 px hoch, Schrift 15 px, Symbole 16 px; rund bleiben sie */
.elementor .seite .fm .fm-form .knopf {
	min-height: 48px;
	padding: 8px 24px;
	gap: 9px;
	font-size: .9375rem;
}
.elementor .seite .fm .fm-form .knopf::before,
.elementor .seite .fm .fm-form .knopf::after,
.elementor .seite .fm .fm-form .knopf svg { width: 16px; height: 16px; }
/* Ab Schritt 2 „Zurück“ und „Weiter“ nebeneinander wie new.; bei schmalem Formular untereinander */
.fm .fm-knopfreihe {
	display: flex;
	gap: 12px;
}
.elementor .seite .fm .fm-knopfreihe > .knopf {
	flex: 1 1 0;
	width: auto;
	min-width: 0;
}
@container (max-width: 639.98px) {
	.fm .fm-knopfreihe { flex-direction: column; }
	.elementor .seite .fm .fm-knopfreihe > .knopf { flex: 0 0 auto; width: 100%; }
}
.fm .fm-vertraulich {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: .9375rem;
	color: var(--fm-grau);
}
.fm .fm-vertraulich svg { flex: none; }

/* ------------------------------------------ Bestätigung nach dem Absenden */
/* Wie new. bei „Bilder nachreichen“ und Rückruf: heller Kasten unter dem Knopf, blauer Haken,
   Überschrift, Satz */
.fm .fm-erfolg {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 20px 22px;
	border-radius: 14px;
	background: var(--fm-blau-50);
	outline: none;
	animation: fm-runter .24s var(--fm-weich);
}
.fm .fm-erfolg-haken {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	color: var(--fm-aktion);
}
.fm .fm-erfolg-text { display: flex; flex-direction: column; min-width: 0; }
.fm .fm-erfolg-titel {
	margin: 1px 0 5px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--fm-blau);
}
.fm .fm-erfolg-satz {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--fm-text);
}
.fm .fm-erfolg a.fm-erfolg-link,
.fm .fm-erfolg a.fm-erfolg-link:hover {
	align-self: flex-start;
	margin-top: 12px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fm-blau);
	text-decoration: none;
}
.fm .fm-erfolg a.fm-erfolg-link:hover { text-decoration: underline; text-decoration-thickness: 1px; }
@container (max-width: 479.98px) {
	.fm .fm-erfolg { gap: 13px; padding: 18px; }
	.fm .fm-erfolg-haken { flex-basis: 36px; width: 36px; height: 36px; }
	.fm .fm-erfolg-titel { font-size: 17px; }
}

/* --------------------------------------------------- Kontakt: Formularkarte */
/* Die Karte zeigt die Schadenmeldung (Anker #schadenmeldung). „Bilder & Dokumente
   nachreichen“ ist seit 20.10.2026 abends eine eigene Seite wie bei new. */
.elementor .seite .formular-panel {
	display: flex;
	flex-direction: column;
	gap: 28px;
	padding: 0;
	outline: none;
}

/* ------------------------------- Seite „Bilder und Dokumente nachreichen“ */
/* Seit 20.10.2026 spätabends aus den Bausteinen der Kontaktseite gebaut (Kopfbereich, Formularkarte,
   Seitenspalte; baum-nachreichen.php). Hier nur der Sprung von „Dateien hochladen“ unter den Kopfbereich. */
.elementor .seite #nachreichen { scroll-margin-top: 100px; }
/* Angemeldet rückt der Kopf um die WordPress-Leiste nach unten (--b-leiste aus bausteine.css) */
.admin-bar .fm.fm-anfrage { scroll-margin-top: calc(110px + var(--b-leiste, 0px)); }
.admin-bar .elementor .seite #nachreichen { scroll-margin-top: calc(100px + var(--b-leiste, 0px)); }

/* -------------------------------------------- Fenster „Rückruf anfordern“ */
/* Wie new.s Rückruf-Fenster (Post 188 dort, 20.10.2026 abends): 900 px breit, links eine dunkle Spalte
   (39 %) mit Logo, Hörer, „Wir rufen Sie zurück.“ und drei Vorteilen, rechts das Formular mit der
   Beschriftung im Kasten. Maße von new., Schrift und Farben von final.
   Der HTML-Baustein im Fußbereich selbst bleibt unsichtbar (kein Abstand im Fußbereich);
   formulare.js hängt das Fenster ans Ende von <body>. Gescrollt wird der Hintergrund, nicht das
   Fenster: so reicht die dunkle Spalte immer bis unten. */
.fm-dialog-baustein { display: none !important; }
.fm-dialog-wurzel,
.fm-dialog-wurzel > .seite { display: contents; }
.fm-dialog-hg {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	padding: 16px;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: rgba(3, 24, 61, .55);
}
.fm-dialog {
	position: relative;
	display: flex;
	width: min(900px, 100%);
	margin: auto;
	overflow: hidden;
	border-radius: 11px;
	background: #fff;
	box-shadow: 0 4px 8px rgba(3, 24, 61, .05), 0 24px 56px -16px rgba(3, 24, 61, .30);
	outline: none;
	text-align: left;
	font-family: var(--b-schrift, "Archivo", "Helvetica Neue", Arial, sans-serif);
	animation: fm-runter .24s var(--fm-weich);
}
.fm-dialog .fm-dialog-zu {
	position: absolute;
	top: 5px;
	right: 5px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	box-shadow: none;
	color: var(--fm-platzhalter);
	cursor: pointer;
	transition: color .16s, background-color .16s;
}
.fm-dialog .fm-dialog-zu:hover,
.fm-dialog .fm-dialog-zu:focus {
	background: var(--fm-blau-50);
	color: var(--fm-navy);
}
.fm-dialog .fm-dialog-zu:focus-visible { outline: 3px solid var(--fm-fokus); outline-offset: 2px; }
/* Linke Spalte */
.fm-dialog .fm-rk-links {
	display: flex;
	flex-direction: column;
	flex: 0 0 39%;
	min-width: 0;
	padding: 40px 32px 38px;
	background: var(--navy-950, #03183d);
	color: #fff;
}
.fm-dialog .fm-rk-logo {
	display: block;
	width: 95%;
	max-width: none;
	height: auto;
	margin: 0 0 40px;
}
.fm-dialog .fm-rk-kreis {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 100px;
	height: 100px;
	margin: 0 0 30px;
	border-radius: 50%;
	background: var(--fm-aktion);
	color: #fff;
	/* drei feine Ringe wie new.: deckende Spaltenfarbe, dahinter je 1 px heller */
	box-shadow: 0 0 0 12px var(--navy-950, #03183d), 0 0 0 13px rgba(255, 255, 255, .14),
		0 0 0 28px var(--navy-950, #03183d), 0 0 0 29px rgba(255, 255, 255, .09),
		0 0 0 46px var(--navy-950, #03183d), 0 0 0 47px rgba(255, 255, 255, .055);
}
.fm-dialog .fm-rk-h {
	margin: 0 0 16px;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.14;
	color: #fff;
}
.fm-dialog .fm-rk-text {
	margin: 0 0 24px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--blue-200, #b9cff3);
}
.fm-dialog .fm-rk-vorteile {
	display: flex;
	flex-direction: column;
	gap: 22px;
	margin: auto 0 0;
	padding: 26px 0 0;
	border-top: 1px solid rgba(255, 255, 255, .14);
	list-style: none;
}
.fm-dialog .fm-rk-vorteil {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 0;
	padding: 0;
}
.fm-dialog .fm-rk-vsym {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 54px;
	height: 54px;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 50%;
	background: rgba(255, 255, 255, .06);
	color: #fff;
}
.fm-dialog .fm-rk-vtext {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.fm-dialog .fm-rk-vtext b {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	color: #fff;
}
.fm-dialog .fm-rk-vtext span {
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--blue-200, #b9cff3);
}
/* Rechte Spalte */
.fm-dialog .fm-rk-rechts {
	flex: 1 1 61%;
	min-width: 0;
	padding: 34px 34px 28px;
}
.fm-dialog .fm.fm-rueckruf {
	display: flex;
	flex-direction: column;
}
.fm-dialog .fm-rk-kopf { margin: 0 0 20px; }
.fm-dialog .fm-rk-marke {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--fm-blau);
}
.fm-dialog .fm-rk-titel {
	margin: 0 0 12px;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.15;
	color: var(--fm-navy);
}
.fm-dialog .fm-rk-sub {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--fm-grau);
}
.fm-dialog .fm-rueckruf .fm-fehlerbox:not([hidden]) { margin-bottom: 14px; }
.fm-dialog .fm-form--rk { gap: 12px; }
.fm-dialog .fm-form--rk .fm-zustimmung { margin-top: 6px; }
.fm-dialog .fm-form--rk .knopf { margin-top: 4px; }
.fm-dialog .fm-form--rk .fm-erfolg { margin-top: 2px; padding: 16px 18px; gap: 14px; border-radius: 12px; }
.fm-dialog .fm-form--rk .fm-erfolg-haken { flex-basis: 38px; width: 38px; height: 38px; }
.fm-dialog .fm-form--rk .fm-erfolg-titel { margin-bottom: 4px; font-size: 17px; }
.fm-dialog .fm-form--rk .fm-erfolg-satz { font-size: 14px; }
.fm-dialog .fm-rk-fuss {
	margin: 16px 0 0;
	font-size: 14px;
	line-height: 1.5;
	text-align: center;
	color: var(--fm-grau);
}
.fm-dialog .fm .fm-rk-fuss a {
	font-weight: 700;
	color: var(--fm-blau);
	text-decoration: none;
}
.fm-dialog .fm .fm-rk-fuss a:hover { text-decoration: underline; }
/* Feld mit Beschriftung im hellen Kasten, Symbol links (40 px wie new.) */
.fm .fm-kasten {
	position: relative;
	padding: 11px 16px 12px 74px;
	border: 1px solid var(--fm-blau-100);
	border-radius: 8px;
	background: var(--fm-blau-50);
	transition: border-color .16s, background-color .16s;
}
.fm .fm-kasten:focus-within {
	border-color: var(--fm-blau-300);
	background: #fff;
}
.fm .fm-feld--kasten.is-error .fm-kasten { border-color: var(--fm-rot); }
.fm .fm-kasten-symbol {
	position: absolute;
	top: 50%;
	left: 19px;
	display: flex;
	transform: translateY(-50%);
	color: var(--fm-navy);
	pointer-events: none;
}
.fm .fm-feld--text .fm-kasten-symbol { top: 11px; transform: none; }
.fm .fm-kasten .fm-label {
	font-size: 13.5px;
	line-height: 1.2;
}
.fm .fm-feld--kasten .fm-steuer .fm-eingabe {
	display: block;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-size: 14px;
	line-height: 1.3;
}
.fm .fm-feld--kasten .fm-steuer .fm-eingabe:focus { box-shadow: none; }
.fm .fm-feld--kasten .fm-steuer .fm-eingabe--text { min-height: 62px; resize: vertical; }
.fm .fm-feld--kasten.is-error .fm-steuer .fm-eingabe { padding-right: 30px; }
.fm .fm-feld--kasten.is-error .fm-steuer .fm-eingabe:focus { box-shadow: none; }
.fm .fm-feld--kasten .fm-status { right: 0; }
/* Auswahl im Kasten („Gewünschter Rückrufzeitraum“): der ganze Kasten öffnet die Liste, nicht nur die
   Textzeile (Auftraggeber 23.10.2026). Gegenrand und Innenabstand ziehen das Feld über Symbol, Ränder
   und Beschriftung (am Handy zweizeilig: 11 px + 2 × 16,2 px), der Text bleibt an seiner Stelle.
   overflow: clip kappt den Überstand bei einzeiliger Beschriftung am Kastenrand (clip statt hidden:
   kein Scrollbereich, der Fokus verschiebt nichts). */
.fm .fm-kasten:has(.fm-eingabe--auswahl) { overflow: clip; }
.fm .fm-feld--kasten .fm-steuer .fm-eingabe--auswahl {
	position: relative;
	width: calc(100% + 90px);
	margin: -43.4px -16px -12px -74px;
	padding: 43.4px 16px 12px 74px;
}
.fm .fm-feld--kasten.is-error .fm-steuer .fm-eingabe--auswahl { padding-right: 46px; }
/* Schmal wie new. (bis 820 px): untereinander, links nur Logo, Hörer und Überschrift */
@media (max-width: 820px) {
	.fm-dialog { flex-direction: column; }
	.fm-dialog .fm-rk-links {
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-areas: "logo logo" "kreis titel";
		align-items: center;
		column-gap: 16px;
		flex: 0 0 auto;
		padding: 20px 20px 22px;
	}
	.fm-dialog .fm-rk-logo { grid-area: logo; width: 150px; margin: 0 0 16px; }
	.fm-dialog .fm-rk-kreis { grid-area: kreis; width: 60px; height: 60px; margin: 0; box-shadow: none; }
	.fm-dialog .fm-rk-kreis svg { width: 28px; height: 28px; }
	.fm-dialog .fm-rk-h { grid-area: titel; margin: 0; font-size: 23px; }
	.fm-dialog .fm-rk-text,
	.fm-dialog .fm-rk-vorteile { display: none; }
	.fm-dialog .fm-rk-rechts { flex: 0 0 auto; padding: 24px 22px 22px; }
	.fm-dialog .fm-rk-titel { font-size: 26px; }
	.fm-dialog .fm-dialog-zu,
	.fm-dialog .fm-dialog-zu:hover,
	.fm-dialog .fm-dialog-zu:focus { color: var(--blue-100, #dce7f9); }
	.fm-dialog .fm-dialog-zu:hover,
	.fm-dialog .fm-dialog-zu:focus { background: rgba(255, 255, 255, .12); }
}

/* --------------------------------------- Danke-Seite der Schadenmeldung */
/* Wie new.s /danke-schadenmeldung/ (Kit-CSS „pdanke“, 20.10.2026): weiße Karte auf hellem Grund,
   Kopf mit Haken, Leiste mit den Angaben (nur nach dem Absenden), drei Schritte mit Punktlinie,
   Datenschutzzeile, Knöpfe und Telefon. Maße von new., Schrift und Farben von final., Knöpfe rund
   und schlank wie in den Formularen. */
.elementor .seite .fm-danke {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 56px var(--gutter, 20px) 80px;
	background: var(--fm-blau-50);
	font-family: var(--b-schrift, "Archivo", "Helvetica Neue", Arial, sans-serif);
	color: var(--fm-grau);
}
.elementor .seite .fm-danke-karte {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1120px;
	padding: 40px 42px 38px;
	border: 1px solid var(--fm-linie);
	border-radius: 16px;
	background: #fff;
}
/* Kopf: Text links, Haken rechts */
.elementor .seite .fm-danke-kopf {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px 28px;
}
.elementor .seite .fm-danke-kopftext {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	flex: 1 1 420px;
	min-width: 0;
}
.elementor .seite .fm-danke-marke {
	margin: 0;
	font-size: 12px;
	font-weight: 700;
	line-height: 2.2;               /* Zeile 26,4 px wie new. */
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--fm-blau);
}
.elementor .seite .fm-danke-titel {
	margin: 10px 0 0;
	font-size: clamp(26px, 3vw, 36px);
	font-weight: 700;
	line-height: 1.18;
	color: var(--fm-navy);
}
.elementor .seite .fm-danke-text {
	margin: 14px 0 0;
	font-size: 16.5px;
	line-height: 1.6;
}
.elementor .seite .fm-danke-haken {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 68px;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	background: linear-gradient(90deg, #1c6ad0 0%, #0349ae 50%, #053b8c 100%);
	color: #fff;
	box-shadow: 0 8px 20px -8px rgba(10, 90, 196, .6);
}
/* Leiste mit Anliegen, Einsatzort und Eingangszeit (füllt formulare.js) */
.elementor .seite .fm-danke-leiste {
	display: flex;
	align-items: center;
	margin-top: 26px;
	padding: 18px 22px;
	border-radius: 12px;
	background: var(--fm-blau-50);
}
.elementor .seite .fm-danke-leiste > svg {
	flex: 0 0 26px;
	margin-inline-end: 20px;
	color: var(--fm-blau);
}
.elementor .seite .fm-danke-teile {
	display: flex;
	flex-wrap: wrap;
	flex: 1 1 auto;
	min-width: 0;
	gap: 14px 28px;
	padding-inline-start: 20px;
	border-inline-start: 1px solid var(--fm-linie);
}
.elementor .seite .fm-danke-teil {
	display: flex;
	flex-direction: column;
	flex: 1 1 190px;
	min-width: 0;
	gap: 3px;
}
.elementor .seite .fm-danke-teil-k {
	font-size: 14px;
	line-height: 1.35;
}
.elementor .seite .fm-danke-teil-w {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--fm-navy);
	overflow-wrap: anywhere;
}
/* So geht es weiter */
.elementor .seite .fm-danke-weiter {
	margin: 32px 0 0;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--fm-navy);
}
.elementor .seite .fm-danke-schritte {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 18px;
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}
.elementor .seite .fm-danke-schritt {
	display: flex;
	align-items: flex-start;
	flex: 1 1 250px;
	min-width: 0;
	gap: 12px;
	margin: 0;
}
/* Punktlinie als Flex-Kind im Schritt: wandert beim Umbruch mit, schmal entfällt sie */
.elementor .seite .fm-danke-schritt + .fm-danke-schritt::before {
	content: "";
	flex: 0 0 20px;
	height: 0;
	margin: 14px 4px 0 0;
	border-top: 2px dotted var(--fm-linie-kachel);
}
.elementor .seite .fm-danke-nr {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--fm-blau-50);
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	color: var(--fm-blau);
	font-variant-numeric: tabular-nums;
}
.elementor .seite .fm-danke-schritt > svg {
	flex: 0 0 34px;
	color: var(--fm-blau);
}
.elementor .seite .fm-danke-stext {
	display: flex;
	flex-direction: column;
	min-width: 0;
	gap: 3px;
}
.elementor .seite .fm-danke-stext b {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--fm-navy);
}
.elementor .seite .fm-danke-stext span {
	font-size: 14px;
	line-height: 1.5;
}
/* Datenschutzzeile */
.elementor .seite .fm-danke-hinweis {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: 28px;
	padding: 16px 20px;
	border-radius: 12px;
	background: var(--fm-blau-50);
}
.elementor .seite .fm-danke-hinweis > svg {
	flex: 0 0 22px;
	color: var(--fm-blau);
}
.elementor .seite .fm-danke-hinweis p {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.5;
}
/* Fußzeile der Karte: zwei Knöpfe, rechts das Telefon */
.elementor .seite .fm-danke-fuss {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px;
	margin-top: 28px;
}
.elementor .seite .fm-danke .fm-danke-knopf {
	flex: 0 1 auto;
	min-height: 48px;
	padding: 8px 24px;
	gap: 9px;
	font-size: .9375rem;
}
.elementor .seite .fm-danke .fm-danke-knopf svg {
	flex: 0 0 16px;
	transition: transform .2s var(--ease-standard, ease);
}
.elementor .seite .fm-danke .knopf-sekundaer.fm-danke-knopf svg { color: var(--fm-blau); }
.elementor .seite .fm-danke .knopf-sekundaer.fm-danke-knopf:hover svg { transform: translateX(-3px); }
.elementor .seite .fm-danke .knopf-primaer.fm-danke-knopf:hover svg { transform: translateY(-3px); }
.elementor .seite .fm-danke-ruf,
.elementor .seite .fm-danke-ruf:hover {
	display: flex;
	align-items: center;
	gap: 13px;
	margin-inline-start: auto;
	color: var(--fm-blau);
	text-decoration: none;
	transition: transform .2s var(--ease-standard, ease);
}
.elementor .seite .fm-danke-ruf:hover,
.elementor .seite .fm-danke-ruf:focus-visible { transform: translateX(5px); }
.elementor .seite .fm-danke-ruf > svg { flex: 0 0 22px; }
.elementor .seite .fm-danke-ruftext {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.elementor .seite .fm-danke-rufk {
	font-size: 14px;
	line-height: 1.35;
	color: var(--fm-grau);
}
.elementor .seite .fm-danke-rufnr {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
}
@media (max-width: 767px) {
	.elementor .seite .fm-danke { padding-block: 40px 56px; }
	.elementor .seite .fm-danke-karte { padding: 28px 22px 26px; }
	/* Haken über dem Text statt allein in einer Zeile (wie new.) */
	.elementor .seite .fm-danke-kopf {
		flex-direction: column-reverse;
		flex-wrap: nowrap;
		gap: 18px;
	}
	.elementor .seite .fm-danke-kopftext { flex: 1 1 auto; }
	.elementor .seite .fm-danke-haken { flex-basis: 56px; width: 56px; height: 56px; }
	.elementor .seite .fm-danke-haken svg { width: 27px; height: 27px; }
	.elementor .seite .fm-danke-leiste {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
		padding: 18px 20px;
	}
	.elementor .seite .fm-danke-leiste > svg { margin-inline-end: 0; }
	.elementor .seite .fm-danke-teile {
		gap: 14px 24px;
		padding-inline-start: 0;
		border-inline-start: 0;
	}
	.elementor .seite .fm-danke-schritt { flex-basis: 100%; }
	.elementor .seite .fm-danke-schritt + .fm-danke-schritt::before { display: none; }
	.elementor .seite .fm-danke-ruf { margin-inline-start: 0; }
}
@media (max-width: 560px) {
	.elementor .seite .fm-danke .fm-danke-knopf { flex: 1 1 100%; }
	.elementor .seite .fm-danke-teil { flex-basis: 100%; }
	.elementor .seite .fm-danke-text { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.elementor .seite .fm-danke-ruf:hover,
	.elementor .seite .fm-danke-ruf:focus-visible,
	.elementor .seite .fm-danke .knopf-sekundaer.fm-danke-knopf:hover svg,
	.elementor .seite .fm-danke .knopf-primaer.fm-danke-knopf:hover svg { transform: none; }
}