/*
 * KO Technik Projekte – Karten im Stil des Kits „Local Service“.
 * Die Basiswerte entsprechen den Standardwerten der Widget-Controls,
 * damit auch die Shortcodes ohne Elementor-Einstellungen passend aussehen.
 * Farben und Schriften kommen über die globalen Kit-Variablen.
 */

.kt-projekte {
	width: 100%;
}

.kt-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Gemeinsames Raster: Flexbox mit Umbruch.
 * --kt-spalten und --kt-spaltenabstand kommen aus den Widget-Controls,
 * die Breite einer Karte wird daraus berechnet. Damit funktioniert jede
 * Anzahl von Karten ohne Sonderfälle, und die letzte Reihe lässt sich
 * normal, füllend oder zentriert ausrichten.
 */
.kt-grid {
	display: flex;
	flex-wrap: wrap;
	--kt-spalten: 3;
	--kt-spaltenabstand: 5%;
}

.kt-grid > li {
	flex: 0 1 calc((100% - (var(--kt-spalten) - 1) * var(--kt-spaltenabstand)) / var(--kt-spalten));
	max-width: 100%;
}

.kt-grid--fuellen > li {
	flex-grow: 1;
}

.kt-grid--zentriert {
	justify-content: center;
}

@media (max-width: 1024px) {
	.kt-grid {
		--kt-spalten: 2;
		--kt-spaltenabstand: 60px;
	}
}

@media (max-width: 767px) {
	.kt-grid {
		--kt-spalten: 1;
	}
}

/* Kartenfläche: Standard ohne Hintergrund, Rahmen, Radius und Innenabstand. */
.kt-card,
.kt-person,
.kt-leistung {
	background-color: transparent;
	border: 0;
}

/* Raster */
.kt-projekte__grid {
	column-gap: 5%;
	row-gap: 90px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-projekte__item {
	display: flex;
	margin: 0;
	padding: 0;
}

.kt-projekte__item[hidden] {
	display: none;
}

/* Karte: kein Hintergrund, kein Rahmen, kein Schatten, keine Hover-Effekte */
.kt-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	text-align: left;
}

.kt-card__media {
	position: relative;
	aspect-ratio: 3 / 2;
	margin-bottom: 15px;
	overflow: hidden;
}

.kt-card__media .kt-card__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.kt-card__placeholder {
	width: 100%;
	height: 100%;
	background-color: var(--e-global-color-secondary, #F3F5F8);
}

.kt-card__body {
	display: flex;
	flex-direction: column;
}

.kt-projekte .kt-card__kategorie,
.kt-projekte .kt-card__title,
.kt-projekte .kt-card__meta,
.kt-projekte .kt-card__desc {
	margin: 0;
	padding: 0;
	overflow-wrap: break-word;
	hyphens: auto;
}

/* Dachzeile wie die Hero-Dachzeile („Special Title“), nur kleiner */
.kt-projekte .kt-card__kategorie {
	margin-bottom: 10px;
	color: var(--e-global-color-text, #324A6D);
	font-family: "Poppins", sans-serif;
	font-size: 13px;
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: 4px;
	text-transform: uppercase;
	hyphens: manual;
}

/* Titel wie die Kartentitel („Box Title“) */
.kt-projekte .kt-card__title {
	margin-bottom: 15px;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	letter-spacing: 0;
	text-transform: none;
}

/* Meta-Zeile und Beschreibung wie der Kartentext („Body Text“) */
.kt-projekte .kt-card__meta,
.kt-projekte .kt-card__desc {
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-projekte .kt-card__meta + .kt-card__desc {
	margin-top: 10px;
}

/* Button „Alle Projekte ansehen“ wie „Alle Dienstleistungen“ im Template */
.kt-projekte__footer {
	display: flex;
	justify-content: center;
	margin-top: 90px;
}

/* :focus mit aufgeführt, weil der Hello-Reset button:focus einfärbt */
.kt-projekte .kt-button,
.kt-projekte .kt-button:focus {
	display: inline-block;
	padding: 16px 35px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: all 0.3s;
}

.kt-projekte .kt-button:hover,
.kt-projekte .kt-button:focus-visible {
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
}

/* Filter: aktiver Filter gefüllt, übrige als Outline */
.kt-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0 0 60px;
}

.kt-filter[hidden] {
	display: none;
}

/* :focus mit aufgeführt, weil der Hello-Reset button:focus einfärbt */
.kt-projekte .kt-filter__btn,
.kt-projekte .kt-filter__btn:focus {
	display: inline-block;
	width: auto;
	margin: 0;
	padding: 10px 25px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-transform: none;
	white-space: normal;
	cursor: pointer;
	transition: all 0.3s;
}

.kt-projekte .kt-filter__btn:not([aria-pressed="true"]):hover {
	background-color: var(--e-global-color-secondary, #F3F5F8);
	color: var(--e-global-color-accent, #467FF7);
}

.kt-projekte .kt-filter__btn[aria-pressed="true"],
.kt-projekte .kt-filter__btn[aria-pressed="true"]:hover,
.kt-projekte .kt-filter__btn[aria-pressed="true"]:focus {
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
}

.kt-projekte .kt-button:focus-visible,
.kt-projekte .kt-filter__btn:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

/* Tablet (Elementor-Breakpoint 1024 px) */
@media (max-width: 1024px) {
	.kt-projekte__grid {
		column-gap: 60px;
		row-gap: 60px;
	}

	.kt-projekte .kt-card__kategorie {
		font-size: 12px;
	}

	.kt-projekte__footer {
		margin-top: 60px;
	}
}

/* Mobil (Elementor-Breakpoint 767 px) */


@media (prefers-reduced-motion: reduce) {
	.kt-projekte .kt-button,
	.kt-projekte .kt-filter__btn {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * Team / Ansprechpartner
 * --------------------------------------------------------------- */

.kt-team {
	width: 100%;
	--kt-portraet: 220px;
	--kt-portraet-x: 50%;
	--kt-portraet-y: 20%;
}

.kt-team__grid {
	margin: 0;
	padding: 0;
	list-style: none;
	row-gap: 60px;
}

.kt-team--nebeneinander .kt-team__grid {
	display: flex;
	flex-direction: column;
}

.kt-team--raster .kt-team__grid {
	column-gap: 5%;
}

.kt-team__item {
	display: flex;
	margin: 0;
	padding: 0;
}

.kt-person {
	display: flex;
	gap: 40px;
	width: 100%;
	text-align: left;
}

.kt-team--nebeneinander .kt-person {
	flex-direction: row;
	/* „Senkrechte Ausrichtung“ im Widget, ohne Einstellung steht das Porträt mittig. */
	align-items: var(--kt-person-ausrichtung, center);
}

.kt-team--raster .kt-person {
	flex-direction: column;
	align-items: flex-start;
}

.kt-person__media {
	flex: 0 0 auto;
	width: var(--kt-portraet, 220px);
	max-width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 50%;
}

.kt-person__media .kt-person__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: var(--kt-portraet-x, 50%) var(--kt-portraet-y, 20%);
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.kt-person__placeholder {
	width: 100%;
	height: 100%;
	background-color: var(--e-global-color-secondary, #F3F5F8);
}

.kt-person__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
}

.kt-projekte .kt-card__title,
.kt-team .kt-person__name,
.kt-team .kt-person__funktion,
.kt-team .kt-person__text {
	overflow-wrap: break-word;
}

.kt-team .kt-person__name {
	margin: 0 0 6px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
}

.kt-team .kt-person__funktion {
	margin: 0 0 15px;
	padding: 0;
	color: var(--e-global-color-accent, #467FF7);
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
}

.kt-team .kt-person__text {
	margin: 0 0 20px;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-team .kt-person__kontakt {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-team .kt-person__kontaktzeile {
	margin: 0;
	padding: 0;
}

.kt-team .kt-person__label {
	display: inline-block;
	min-width: 4.5em;
}

.kt-team .kt-person__link {
	color: var(--e-global-color-accent, #467FF7);
	text-decoration: none;
}

.kt-team .kt-person__link:hover,
.kt-team .kt-person__link:focus-visible {
	text-decoration: underline;
}

.kt-person__aktion {
	margin-top: 30px;
}

.kt-team__footer {
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.kt-team .kt-button {
	display: inline-block;
	padding: 16px 35px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: all 0.3s;
}

.kt-team .kt-button:hover,
.kt-team .kt-button:focus-visible {
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
}

.kt-team .kt-button:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

@media (max-width: 1024px) {
	.kt-team--raster .kt-team__grid {
		column-gap: 60px;
	}
}

@media (max-width: 767px) {
	/* Auf dem Handy steht das Porträt oben. */
	.kt-team--nebeneinander .kt-person {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (min-width: 768px) {
	/* Schalter „Porträt beim Scrollen oben halten“. Ohne den Schalter bleibt es
	   bei position: static, dann wirkt auch der Abstand von oben nicht. */
	.kt-team--nebeneinander .kt-person__media {
		position: var(--kt-person-sticky, static);
		top: var(--kt-person-sticky-abstand, 24px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.kt-team .kt-button {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * Downloads
 * --------------------------------------------------------------- */

.kt-dokumente {
	display: flex;
	flex-direction: column;
	align-items: var(--kt-ausrichtung, flex-start);
	gap: 8px;
	margin: 15px 0 0;
	padding: 0;
	list-style: none;
}

.kt-dokumente--buttons {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--kt-ausrichtung, flex-start);
}

.kt-dokumente__item {
	margin: 0;
	padding: 0;
	max-width: 100%;
}

.kt-dokument {
	display: inline-flex;
	align-items: flex-start;
	gap: 8px;
	color: var(--e-global-color-accent, #467FF7);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	text-decoration: none;
	overflow-wrap: break-word;
}

.kt-dokument:hover .kt-dokument__titel,
.kt-dokument:focus-visible .kt-dokument__titel {
	text-decoration: underline;
}

.kt-dokument__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	line-height: 1;
}

.kt-dokument__icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.kt-dokument__svg {
	width: 20px;
	height: 20px;
}

.kt-dokument__text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.kt-dokument__meta {
	white-space: nowrap;
}

.kt-dokument__hinweis {
	margin-top: 2px;
	color: var(--e-global-color-text, #324A6D);
	font-size: 0.8em;
}

/* Buttons: gleicher Stil wie die übrigen Buttons */
.kt-dokumente--buttons .kt-button {
	display: inline-flex;
	align-items: center;
	padding: 16px 35px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: left;
	text-decoration: none;
	text-transform: none;
	transition: all 0.3s;
}

.kt-dokumente--buttons .kt-button:hover,
.kt-dokumente--buttons .kt-button:focus-visible {
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
	text-decoration: none;
}

.kt-dokumente--buttons .kt-button:hover .kt-dokument__titel,
.kt-dokumente--buttons .kt-button:focus-visible .kt-dokument__titel {
	text-decoration: none;
}

.kt-dokumente--buttons .kt-dokument__hinweis {
	color: inherit;
	opacity: 0.85;
}

.kt-dokument:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.kt-dokumente--buttons .kt-button {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * Leistungen
 * --------------------------------------------------------------- */

.kt-leistungen {
	column-gap: 5%;
	row-gap: 60px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-leistungen__item {
	display: flex;
	margin: 0;
	padding: 0;
}

/* Karte wie bei den Projekten: ohne Rahmen, ohne Hintergrund, linksbündig */
.kt-leistung {
	display: flex;
	gap: 20px;
	width: 100%;
	text-align: left;
}

.kt-leistungen--icon-oben .kt-leistung {
	flex-direction: column;
	align-items: flex-start;
}

.kt-leistungen--icon-links .kt-leistung {
	flex-direction: row;
	align-items: flex-start;
}

.kt-leistung__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	color: var(--e-global-color-accent, #467FF7);
	font-size: 40px;
	line-height: 1;
}

.kt-leistung__icon i {
	display: block;
	line-height: 1;
}

.kt-leistungen--flaeche .kt-leistung__icon {
	padding: 20px;
	border-radius: 50%;
	background-color: var(--e-global-color-secondary, #F3F5F8);
}

.kt-leistung__body {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.kt-leistungen .kt-leistung__title {
	margin: 0 0 15px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-leistungen .kt-leistung__text {
	margin: 0;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

@media (max-width: 1024px) {
	.kt-leistungen {
		column-gap: 60px;
		row-gap: 50px;
	}
}



/* „Mehr anzeigen“ unter der Projektliste */
.kt-projekte__mehr {
	display: flex;
	justify-content: center;
	margin-top: 60px;
}

.kt-projekte__mehr[hidden] {
	display: none;
}

.kt-projekte .kt-mehr {
	cursor: pointer;
}

/* Fokusring, wenn nach dem Nachladen auf die erste neue Karte gesprungen wird */
.kt-card:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 4px;
}

@media (max-width: 1024px) {
	.kt-projekte__mehr {
		margin-top: 50px;
	}
}

/* ---------------------------------------------------------------
 * Leistungen als Abschnitte
 * --------------------------------------------------------------- */

.kt-abschnitte {
	width: 100%;
}

/* Sprungmarken im Button-Stil, weiches Scrollen ohne JavaScript */
.kt-sprungmarken {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 60px;
}

.kt-sprungmarke {
	display: inline-block;
	padding: 10px 25px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: all 0.3s;
}

.kt-sprungmarke:hover,
.kt-sprungmarke:focus-visible {
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
}

.kt-sprungmarke:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

.kt-abschnitt {
	scroll-margin-top: 100px;
}

.kt-abschnitt + .kt-abschnitt {
	margin-top: 60px;
	padding-top: 60px;
	border-top: 1px solid var(--e-global-color-14ef391, #C8D5DC);
}

.kt-abschnitte .kt-abschnitt__titel {
	display: flex;
	align-items: center;
	gap: 15px;
	margin: 0 0 20px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-abschnitt__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	color: var(--e-global-color-accent, #467FF7);
	font-size: 40px;
	line-height: 1;
}

.kt-abschnitt__icon i {
	display: block;
	line-height: 1;
}

.kt-abschnitt__inhalt {
	display: flex;
	flex-wrap: wrap;
	gap: 50px;
	align-items: flex-start;
}

.kt-abschnitt__text {
	flex: 1 1 320px;
	min-width: 0;
}

.kt-abschnitt--voll .kt-abschnitt__text {
	flex-basis: 100%;
}

.kt-abschnitt__seite {
	flex: 0 1 32%;
	min-width: 0;
}

.kt-abschnitte .kt-abschnitt__text p {
	margin: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-abschnitte .kt-abschnitt__stichpunkte {
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-abschnitte .kt-abschnitt__stichpunkte li {
	position: relative;
	margin: 0 0 8px;
	padding-left: 22px;
}

.kt-abschnitte .kt-abschnitt__stichpunkte li::before {
	content: "";
	position: absolute;
	top: 0.55em;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: var(--e-global-color-accent, #467FF7);
}

.kt-abschnitte .kt-abschnitt__stichpunkte li:last-child {
	margin-bottom: 0;
}

.kt-abschnitt__bild {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 0;
}

@media (max-width: 767px) {
	/* Auf dem Handy alles untereinander */
	.kt-abschnitt__inhalt {
		flex-direction: column;
	}

	.kt-abschnitt__seite {
		flex-basis: auto;
		width: 100%;
	}

	.kt-abschnitte .kt-abschnitt__titel {
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: no-preference) {
	html:has(.kt-sprungmarken) {
		scroll-behavior: smooth;
	}
}

/* ---------------------------------------------------------------
 * HOAI-Leistungsphasen
 * --------------------------------------------------------------- */

.kt-hoai {
	margin: 0;
	padding: 0;
	list-style: none;
	--kt-spalten: 9;
	--kt-spaltenabstand: 10px;
	column-gap: 10px;
	row-gap: 10px;
}

.kt-hoai__item {
	display: flex;
	flex-direction: column;
	/* stretch, damit die Textausrichtung greift */
	align-items: stretch;
	justify-content: flex-start;
	gap: 6px;
	padding: 16px 12px;
	border: 1px solid var(--e-global-color-14ef391, #C8D5DC);
	border-radius: 4px;
	background-color: var(--e-global-color-secondary, #F3F5F8);
	text-align: center;
	/* Lange Wörter wie „Genehmigungsplanung“ sauber trennen */
	hyphens: auto;
	overflow-wrap: break-word;
	word-break: break-word;
}

.kt-hoai__nummer {
	font-family: "Poppins", sans-serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--e-global-color-accent, #467FF7);
	hyphens: manual;
}

.kt-hoai__name {
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-hoai__item--aktiv {
	background-color: var(--e-global-color-accent, #467FF7);
	border-color: var(--e-global-color-accent, #467FF7);
}

.kt-hoai__item--aktiv .kt-hoai__nummer,
.kt-hoai__item--aktiv .kt-hoai__name {
	color: var(--e-global-color-d6cea4e, #FFFFFF);
}

@media (prefers-reduced-motion: reduce) {
	.kt-sprungmarke {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * HOAI als Zeitstrahl
 * --------------------------------------------------------------- */

.kt-zeitstrahl {
	--kt-pro-reihe: 5;
	--kt-punkte: 5;
	--kt-kreis: 38px;
	--kt-randstaerke: 2px;
	--kt-linienstaerke: 2px;
	--kt-kreisflaeche: var(--e-global-color-d6cea4e, #FFFFFF);
	--kt-kreisrand: var(--e-global-color-accent, #467FF7);
	--kt-linienfarbe: var(--e-global-color-14ef391, #C8D5DC);
	--kt-reihenabstand: 50px;
	--kt-punktabstand: 20px;
	width: 100%;
}

.kt-zeitstrahl__reihe {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-zeitstrahl__reihe + .kt-zeitstrahl__reihe {
	margin-top: var(--kt-reihenabstand, 50px);
}

/* Die Linie läuft vom ersten bis zum letzten Kreis der Reihe und liegt dahinter. */
.kt-zeitstrahl__reihe::before {
	content: "";
	position: absolute;
	z-index: 0;
	top: calc(var(--kt-kreis) / 2 - var(--kt-linienstaerke) / 2);
	left: calc(100% / var(--kt-pro-reihe) / 2);
	width: calc((var(--kt-punkte) - 1) * (100% / var(--kt-pro-reihe)));
	height: var(--kt-linienstaerke);
	background-color: var(--kt-linienfarbe);
}

.kt-zeitstrahl__punkt {
	position: relative;
	z-index: 1;
	display: flex;
	flex: 0 0 calc(100% / var(--kt-pro-reihe));
	max-width: calc(100% / var(--kt-pro-reihe));
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 0 8px;
	text-align: center;
	hyphens: auto;
	overflow-wrap: break-word;
}

.kt-zeitstrahl__kreis {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: var(--kt-kreis);
	height: var(--kt-kreis);
	border: var(--kt-randstaerke) solid var(--kt-kreisrand);
	border-radius: 50%;
	background-color: var(--kt-kreisflaeche);
	color: var(--e-global-color-accent, #467FF7);
	font-family: "Poppins", sans-serif;
	/* Die Nummer wächst mit der Kreisgröße mit. */
	font-size: calc(var(--kt-kreis) * 0.45);
	font-weight: 600;
	line-height: 1;
	hyphens: manual;
}

.kt-zeitstrahl__name {
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-zeitstrahl__punkt--aktiv .kt-zeitstrahl__kreis {
	background-color: var(--e-global-color-accent, #467FF7);
	border-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
}

/* Unter 768 px senkrecht: Linie links, Kreise darauf, Bezeichnung rechts daneben. */
@media (max-width: 767px) {
	.kt-zeitstrahl__reihe {
		flex-direction: column;
		gap: var(--kt-punktabstand, 20px);
	}

	.kt-zeitstrahl__reihe::before {
		display: none;
	}

	.kt-zeitstrahl__punkt {
		flex: 0 0 auto;
		max-width: 100%;
		width: 100%;
		flex-direction: row;
		align-items: center;
		gap: 15px;
		padding: 0;
		text-align: left;
	}

	.kt-zeitstrahl__punkt::before {
		content: "";
		position: absolute;
		z-index: -1;
		top: calc(var(--kt-kreis) / 2);
		bottom: calc(-1 * var(--kt-punktabstand, 20px));
		left: calc(var(--kt-kreis) / 2 - var(--kt-linienstaerke) / 2);
		width: var(--kt-linienstaerke);
		background-color: var(--kt-linienfarbe);
	}

	/* Zwischen zwei Reihen den größeren Reihenabstand überbrücken. */
	.kt-zeitstrahl__reihe:not(:last-child) > .kt-zeitstrahl__punkt:last-child::before {
		bottom: calc(-1 * var(--kt-reihenabstand, 50px));
	}

	/* Die Linie endet beim letzten Kreis. */
	.kt-zeitstrahl__reihe:last-child > .kt-zeitstrahl__punkt:last-child::before {
		display: none;
	}
}

/* ---------------------------------------------------------------
 * Merkmale
 * --------------------------------------------------------------- */

.kt-merkmale {
	margin: 0;
	padding: 0;
	list-style: none;
	--kt-spalten: 3;
	--kt-spaltenabstand: 30px;
	column-gap: 30px;
	row-gap: 30px;
}

.kt-merkmale__item {
	display: flex;
	margin: 0;
	padding: 0;
}

.kt-merkmal {
	display: flex;
	gap: 15px;
	width: 100%;
	text-align: left;
	background-color: var(--e-global-color-secondary, #F3F5F8);
	border-radius: 8px;
	padding: 30px;
}

.kt-merkmale--icon-oben .kt-merkmal {
	flex-direction: column;
}

.kt-merkmale--icon-links .kt-merkmal {
	flex-direction: row;
	align-items: flex-start;
}

.kt-merkmal__icon {
	flex: 0 0 auto;
	color: var(--e-global-color-accent, #467FF7);
	font-size: 40px;
	line-height: 1;
}

.kt-merkmal__icon i {
	display: inline-block;
	line-height: 1;
}

.kt-merkmal__body {
	min-width: 0;
}

.kt-merkmale .kt-merkmal__title {
	margin: 0 0 10px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

/* Ohne Text bleibt unter dem Titel kein Abstand stehen. */
.kt-merkmale .kt-merkmal__title:last-child {
	margin-bottom: 0;
}

.kt-merkmale .kt-merkmal__text {
	margin: 0;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

/* Nummer als Marker in den Merkmalen */
.kt-merkmal__marker {
	flex: 0 0 auto;
	line-height: 1;
}

.kt-merkmal__nummer {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: "Poppins", sans-serif;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
}

/* ---------------------------------------------------------------
 * Kontaktwege
 * --------------------------------------------------------------- */

.kt-kontaktwege {
	margin: 0;
	padding: 0;
	list-style: none;
	--kt-spalten: 3;
	--kt-spaltenabstand: 30px;
	column-gap: 30px;
	row-gap: 30px;
}

.kt-kontaktwege__item {
	display: flex;
	margin: 0;
	padding: 0;
}

.kt-kontaktweg {
	display: flex;
	flex-direction: column;
	gap: 15px;
	width: 100%;
	text-align: left;
	background-color: var(--e-global-color-secondary, #F3F5F8);
	border-radius: 8px;
	padding: 30px;
}

.kt-kontaktweg__icon {
	flex: 0 0 auto;
	color: var(--e-global-color-accent, #467FF7);
	font-size: 36px;
	line-height: 1;
}

.kt-kontaktweg__icon i {
	display: inline-block;
	line-height: 1;
}

.kt-kontaktweg__icon svg {
	width: 36px;
	height: 36px;
	fill: currentColor;
}

.kt-kontaktweg__body {
	min-width: 0;
}

.kt-kontaktwege .kt-kontaktweg__titel {
	margin: 0 0 8px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-kontaktwege .kt-kontaktweg__wert {
	margin: 0 0 6px;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

/* Ohne Zusatzzeile bleibt unter dem Wert kein Abstand stehen. */
.kt-kontaktwege .kt-kontaktweg__wert:last-child {
	margin-bottom: 0;
}

.kt-kontaktwege .kt-kontaktweg__link,
.kt-kontakt__link {
	color: var(--e-global-color-accent, #467FF7);
	text-decoration: none;
}

.kt-kontaktwege .kt-kontaktweg__link:hover,
.kt-kontaktwege .kt-kontaktweg__link:focus-visible,
.kt-kontakt__link:hover,
.kt-kontakt__link:focus-visible {
	text-decoration: underline;
}

.kt-kontaktwege .kt-kontaktweg__zusatz {
	margin: 0;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: 14px;
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	opacity: 0.75;
	overflow-wrap: break-word;
}

/* Ausrichtung innerhalb der Team-Karte */
.kt-team--ausrichtung-zentriert .kt-person__body {
	align-items: center;
	text-align: center;
}

.kt-team--ausrichtung-zentriert.kt-team--raster .kt-person {
	align-items: center;
}

.kt-team--ausrichtung-zentriert .kt-person__kontakt {
	align-items: center;
}

.kt-team--ausrichtung-zentriert .kt-person__aktion {
	align-self: center;
}

/* ---------------------------------------------------------------
 * Direktkontakt
 * --------------------------------------------------------------- */

.kt-direktkontakt {
	background-color: var(--e-global-color-secondary, #F3F5F8);
	border-radius: 8px;
	padding: 30px;
}

.kt-direktkontakt .kt-direktkontakt__titel {
	margin: 0 0 10px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-direktkontakt .kt-direktkontakt__text {
	margin: 0 0 20px;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

/* Umriss-Variante als Voreinstellung */
.kt-direktkontakt .kt-direktkontakt__button,
.kt-direktkontakt .kt-direktkontakt__button:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 28px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 6px;
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	overflow-wrap: anywhere;
	transition: all 0.3s;
}

.kt-direktkontakt .kt-direktkontakt__button:hover,
.kt-direktkontakt .kt-direktkontakt__button:focus-visible {
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
}

.kt-direktkontakt .kt-direktkontakt__button:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

.kt-direktkontakt__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	line-height: 1;
}

.kt-direktkontakt__icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
	.kt-direktkontakt .kt-direktkontakt__button {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * Anfahrt
 * --------------------------------------------------------------- */

.kt-anfahrt {
	background-color: var(--e-global-color-secondary, #F3F5F8);
	border-radius: 8px;
	padding: 30px;
}

.kt-anfahrt .kt-anfahrt__titel {
	margin: 0 0 10px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-anfahrt .kt-anfahrt__anschrift {
	margin: 0 0 20px;
	padding: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

.kt-anfahrt .kt-anfahrt__link {
	color: var(--e-global-color-accent, #467FF7);
	text-decoration: none;
}

.kt-anfahrt .kt-anfahrt__link:hover,
.kt-anfahrt .kt-anfahrt__link:focus-visible {
	text-decoration: underline;
}

.kt-anfahrt .kt-anfahrt__hinweise {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kt-anfahrt__hinweis {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 0;
}

/* Über dem ersten Eintrag steht keine Linie. */
.kt-anfahrt__hinweis + .kt-anfahrt__hinweis {
	margin-top: 12px;
	padding-top: 12px;
}

.kt-anfahrt__hinweise--linien .kt-anfahrt__hinweis + .kt-anfahrt__hinweis {
	border-top: 1px solid var(--e-global-color-14ef391, #C8D5DC);
}

.kt-anfahrt__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	color: var(--e-global-color-accent, #467FF7);
	font-size: 20px;
	line-height: 1.5;
}

.kt-anfahrt__icon svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.kt-anfahrt .kt-anfahrt__text {
	min-width: 0;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

.kt-anfahrt__aktion {
	display: flex;
	justify-content: flex-start;
	margin-top: 25px;
}

.kt-anfahrt .kt-anfahrt__button,
.kt-anfahrt .kt-anfahrt__button:focus {
	display: inline-block;
	padding: 16px 35px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	transition: all 0.3s;
}

.kt-anfahrt .kt-anfahrt__button:hover,
.kt-anfahrt .kt-anfahrt__button:focus-visible {
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
}

.kt-anfahrt .kt-anfahrt__button:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.kt-anfahrt .kt-anfahrt__button {
		transition: none;
	}
}

/* ---------------------------------------------------------------
 * Downloads: weitere Darstellungen
 * --------------------------------------------------------------- */

/* Kompakte Zeilen: ganze Zeile ist der Link, Linie oben und unten */
.kt-dokumente--kompakt {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

.kt-dokumente--kompakt .kt-dokumente__item {
	max-width: none;
	border-top: 1px solid var(--e-global-color-14ef391, #C8D5DC);
}

.kt-dokumente--kompakt .kt-dokumente__item:last-child {
	border-bottom: 1px solid var(--e-global-color-14ef391, #C8D5DC);
}

.kt-dokumente--kompakt .kt-dokument {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 12px 0;
}

.kt-dokumente--kompakt .kt-dokument__icon {
	font-size: 16px;
}

.kt-dokumente--kompakt .kt-dokument__svg {
	width: 16px;
	height: 16px;
}

.kt-dokumente--kompakt .kt-dokument__titel {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: anywhere;
}

.kt-dokumente--kompakt .kt-dokument__rechts {
	display: flex;
	flex: 0 0 auto;
	align-items: baseline;
	gap: 12px;
	white-space: nowrap;
}

.kt-dokumente--kompakt .kt-dokument__meta {
	color: var(--e-global-color-text, #324A6D);
	font-size: 0.85em;
	opacity: 0.8;
}

.kt-dokumente--kompakt .kt-dokument__aktion {
	text-decoration: underline;
}

/* Kacheln: Raster mit gleich hohen Karten */
.kt-dokumente--kacheln {
	flex-direction: row;
	align-items: stretch;
	gap: 0;
	column-gap: 20px;
	row-gap: 20px;
	--kt-spalten: 3;
	--kt-spaltenabstand: 20px;
}

.kt-dokumente--kacheln .kt-dokumente__item {
	display: flex;
	max-width: none;
}

.kt-dokumente--kacheln .kt-dokument {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	height: 100%;
	padding: 24px;
	border-radius: 8px;
	background-color: var(--e-global-color-secondary, #F3F5F8);
}

.kt-dokumente--kacheln .kt-dokument__icon {
	font-size: 28px;
}

.kt-dokumente--kacheln .kt-dokument__svg {
	width: 28px;
	height: 28px;
}

.kt-dokumente--kacheln .kt-dokument__titel {
	font-weight: 600;
	overflow-wrap: anywhere;
}

.kt-dokumente--kacheln .kt-dokument__hinweis {
	color: var(--e-global-color-text, #324A6D);
	font-size: 0.9em;
	opacity: 0.85;
}

/* Fuß unten fixieren, damit alle Kacheln gleich wirken */
.kt-dokumente--kacheln .kt-dokument__fuss {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--e-global-color-14ef391, #C8D5DC);
	font-size: 0.85em;
}

.kt-dokumente--kacheln .kt-dokument__aktion {
	text-decoration: underline;
	white-space: nowrap;
}

/* Chips: umbrechende Pillen, nicht gestreckt */
.kt-dokumente--chips {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.kt-dokumente--chips .kt-dokumente__item {
	flex: 0 0 auto;
	max-width: 100%;
}

.kt-dokumente--chips .kt-dokument {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	border: 1px solid var(--e-global-color-14ef391, #C8D5DC);
	border-radius: 100px;
	background-color: var(--e-global-color-secondary, #F3F5F8);
	font-size: 0.95em;
}

.kt-dokumente--chips .kt-dokument__icon {
	font-size: 14px;
}

.kt-dokumente--chips .kt-dokument__svg {
	width: 14px;
	height: 14px;
}

.kt-dokumente--chips .kt-dokument__meta {
	color: var(--e-global-color-text, #324A6D);
	font-size: 0.85em;
	opacity: 0.7;
}

/* Aufklappbar: ohne eigenes JavaScript */
.kt-dokumente-aufklappbar {
	width: 100%;
}

.kt-dokumente__summary {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: 600;
	line-height: var(--e-global-typography-text-line-height, 1.5);
	cursor: pointer;
	list-style: none;
}

/* Standardmarkierung des Browsers entfernen */
.kt-dokumente__summary::-webkit-details-marker {
	display: none;
}

.kt-dokumente__summary::marker {
	content: "";
}

.kt-dokumente__anzahl {
	color: var(--e-global-color-text, #324A6D);
	font-weight: 300;
	font-size: 0.9em;
	opacity: 0.8;
}

.kt-dokumente__pfeil {
	display: inline-flex;
	margin-left: auto;
	color: var(--e-global-color-accent, #467FF7);
	transition: transform 0.2s;
}

.kt-dokumente-aufklappbar[open] .kt-dokumente__pfeil {
	transform: rotate(180deg);
}

.kt-dokumente__summary:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

/* Dokumente in der Personenkarte */
.kt-person__dokumente {
	width: 100%;
	margin-top: 20px;
	padding-top: 15px;
	border-top: 1px solid var(--e-global-color-14ef391, #C8D5DC);
}

.kt-team .kt-person__dokumente-titel {
	margin: 0 0 6px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: 0.9em;
	font-weight: 600;
	line-height: var(--e-global-typography-text-line-height, 1.5);
}

.kt-person__dokumente .kt-dokumente--kompakt .kt-dokument {
	padding: 8px 0;
}

@media (prefers-reduced-motion: reduce) {
	.kt-dokumente__pfeil {
		transition: none;
	}
}

/* ==========================================================================
   Karte mit Zustimmung
   Vor dem Klick nur ein Platzhalter, das iframe wird erst danach eingesetzt.
   ========================================================================== */

.kt-karte {
	background-color: var(--e-global-color-secondary, #F3F5F8);
	border-radius: 8px;
	padding: 30px;
}

.kt-karte__flaeche {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	min-height: var(--kt-karte-hoehe, 284px);
	overflow: hidden;
	border-radius: inherit;
}

.kt-karte__platzhalter {
	width: 100%;
}

.kt-karte .kt-karte__anschrift {
	margin: 0 0 10px;
	padding: 0;
	color: var(--e-global-color-primary, #1C244B);
	font-family: var(--e-global-typography-392b9e0-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-392b9e0-font-size, 22px);
	font-weight: var(--e-global-typography-392b9e0-font-weight, 600);
	line-height: var(--e-global-typography-392b9e0-line-height, 1.2);
	text-transform: none;
	overflow-wrap: break-word;
}

.kt-karte .kt-karte__hinweis {
	margin: 0;
	padding: 0;
	max-width: 420px;
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
	font-weight: var(--e-global-typography-text-font-weight, 300);
	line-height: var(--e-global-typography-text-line-height, 1.5);
	overflow-wrap: break-word;
}

.kt-karte .kt-karte__link {
	color: var(--e-global-color-accent, #467FF7);
	text-decoration: underline;
}

.kt-karte .kt-karte__link:hover,
.kt-karte .kt-karte__link:focus-visible {
	text-decoration: none;
}

.kt-karte__aktion {
	display: flex;
	justify-content: flex-start;
	margin-top: 25px;
}

/* Ohne JavaScript bleibt der Knopf verborgen, dann greift der noscript-Link. */
.kt-karte:not(.kt-karte--bereit) .kt-karte__button:not(.kt-karte__button--extern) {
	display: none;
}

.kt-karte .kt-karte__button,
.kt-karte .kt-karte__button:focus {
	display: inline-block;
	padding: 16px 35px;
	border: 1px solid var(--e-global-color-accent, #467FF7);
	border-radius: 100px;
	background-color: var(--e-global-color-accent, #467FF7);
	color: var(--e-global-color-d6cea4e, #FFFFFF);
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 16px);
	font-weight: var(--e-global-typography-accent-font-weight, 400);
	line-height: var(--e-global-typography-accent-line-height, 1);
	text-align: center;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	transition: all 0.3s;
}

.kt-karte .kt-karte__button:hover,
.kt-karte .kt-karte__button:focus-visible {
	background-color: transparent;
	color: var(--e-global-color-accent, #467FF7);
}

.kt-karte .kt-karte__button:focus-visible {
	outline: 2px solid var(--e-global-color-accent, #467FF7);
	outline-offset: 3px;
}

/* Nach dem Klick füllt das iframe die Fläche. */
.kt-karte--geladen .kt-karte__flaeche {
	display: block;
}

.kt-karte__iframe {
	display: block;
	width: 100%;
	height: var(--kt-karte-hoehe, 284px);
	border: 0;
}

.kt-karte--leer {
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-text-font-size, 16px);
}


/* --------------------------------------------------------------------------
   Karte mit Zustimmung: Variante mit Hintergrundbild
   Das Bild liegt unscharf hinter einer halbtransparenten Fläche, der Inhalt
   steht mittig auf einer weißen Karte. Ohne Bild greift nichts hiervon.
   -------------------------------------------------------------------------- */

.kt-karte--bild .kt-karte__flaeche {
	position: relative;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

/* Das Bild ragt um ein Vielfaches der Unschärfe über die Fläche hinaus und ist
   zusätzlich leicht vergrößert. Sonst entsteht an den Rändern ein heller Saum. */
.kt-karte__hintergrund {
	position: absolute;
	inset: calc(var(--kt-karte-unschaerfe, 4px) * -4);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	filter: blur(var(--kt-karte-unschaerfe, 4px));
	transform: scale(1.06);
	pointer-events: none;
}

.kt-karte__schleier {
	position: absolute;
	inset: 0;
	background-color: var(--e-global-color-secondary, #F3F5F8);
	opacity: 0.4;
	pointer-events: none;
}

.kt-karte--bild .kt-karte__platzhalter {
	position: relative;
	display: flex;
	width: 100%;
	justify-content: center;
}

.kt-karte__kasten {
	max-width: 520px;
	width: 100%;
	padding: 24px 28px;
	border-radius: 8px;
	background-color: var(--e-global-color-d6cea4e, #FFFFFF);
	box-shadow: 0 2px 14px rgba(28, 36, 75, 0.14);
	text-align: center;
}

.kt-karte--bild .kt-karte__hinweis {
	margin-left: auto;
	margin-right: auto;
}

.kt-karte--bild .kt-karte__aktion {
	justify-content: center;
}

.kt-karte__nachweis {
	position: absolute;
	right: 10px;
	bottom: 8px;
	z-index: 1;
	margin: 0;
	padding: 2px 8px;
	border-radius: 4px;
	background-color: rgba(255, 255, 255, 0.75);
	color: var(--e-global-color-text, #324A6D);
	font-family: var(--e-global-typography-text-font-family, "Poppins"), sans-serif;
	font-size: 11px;
	line-height: 1.4;
}

.kt-karte__nachweis-link {
	color: inherit;
	text-decoration: underline;
}

.kt-karte__nachweis-link:hover,
.kt-karte__nachweis-link:focus-visible {
	text-decoration: none;
}

/* Auf schmalen Bildschirmen wächst die Fläche mit dem Inhalt, damit nichts
   abgeschnitten wird. Die eingestellte Höhe bleibt die Mindesthöhe. */
@media (max-width: 767px) {
	.kt-karte--bild .kt-karte__flaeche {
		height: auto;
		padding: 14px;
	}

	.kt-karte__kasten {
		max-width: 100%;
		padding: 18px 16px;
	}

	.kt-karte__nachweis {
		position: static;
		margin-top: 10px;
		align-self: flex-end;
		background-color: transparent;
		padding: 0;
	}

	.kt-karte--bild .kt-karte__flaeche {
		flex-direction: column;
	}
}

@media (prefers-reduced-motion: reduce) {
	.kt-karte .kt-karte__button {
		transition: none;
	}
}