section.m8_logo_overview .mM_row {
	gap: 50px 20px;
}

section.m8_logo_overview .m8_item_content_image_container {
	display: flex;
}

section.m8_logo_overview .m8_item_content_image_container img,
section.m8_logo_overview .m8_item_content_image_container svg {
	width: 60px;
	min-width: 60px;
	height: 60px;
	min-height: 60px;
}

/* Icon-SVGs: bei vielen Icons liegt das Artwork exakt auf der viewBox-Kante
   (bbox == viewBox). SVGs haben per Default overflow:hidden -> die aeussere
   Haelfte der Rand-Strokes wird abgeschnitten und Icons wirken "cut".
   overflow:visible laesst die Strokes voll durchzeichnen (nur ~1px Ueberstand,
   Spalten haben genug Abstand). Gilt fuer alle m8-Icon-SVGs (Grid + vertikale Liste). */
section.m8_logo_overview .m8_item_content_image_container svg,
section.m8_logo_overview .m8_v_icon svg {
	overflow: visible;
}

section.m8_logo_overview .m8_title_container {
	margin-top: 20px;
}
	
/* Logo above Title Start */

section.m8_logo_overview[data-logo-position="logo_above_title"] .m8_item_content_image_container {
	justify-content: center;
}

section.m8_logo_overview[data-logo-position="logo_above_title"] .m8_text,
section.m8_logo_overview[data-logo-position="logo_above_title"] .m8_subtitle,
section.m8_logo_overview[data-logo-position="logo_above_title"].m8_title {
	text-align: center;
}

/* Logo above Title End */

/* Logo besides Title Start */

section.m8_logo_overview[data-logo-position="logo_besides_title"] .m8_item_logo_title_container {
	display: flex;
	align-items: center;
	gap: 25px;
}

/* Logo besides Title End */

/* Logo besides Title and Text Start */

section.m8_logo_overview[data-logo-position="logo_besides_title_and_text"] .m8_item_content_main {
	display: flex;
	gap: 25px;
}

/* Logo besides Title and Text End */


/* =========================================================
   Layout "text_items_text" (hone, Figma "m1_text_UeberUns")
   3 Spalten: Text links (Titel + Button) | Icon-Liste Mitte | Text rechts
   Tokens: dunkel #1f1f1f | gold #a5936f | Linien rgba(31,31,31,.3)
   Font-Sizes in rem, Spacing in px.
   ========================================================= */
section.m8_logo_overview[data-layout="text_items_text"] {
	background-color: #fff;
	/* Vertikal-Abstand kommt aus dem Abstand-Klonfeld (data-innerer-abstand) */
}

/* Headroom: die dunkle m1-Karte darunter ragt 101px in die weisse Flaeche */
section.m8_logo_overview[data-layout="text_items_text"] .mM_container {
	padding-bottom: 101px;
}

section.m8_logo_overview[data-layout="text_items_text"] .m8_three_col {
	display: grid;
	grid-template-columns: minmax(0, 445px) minmax(0, 1fr) minmax(0, 445px);
	column-gap: 62px;
	align-items: stretch;
}

/* Grosse Viewports: Textspalten wachsen mit den Container-Stufen mit */
@media (min-width: 2200px) {
	section.m8_logo_overview[data-layout="text_items_text"] .m8_three_col {
		grid-template-columns: minmax(0, 500px) minmax(0, 1fr) minmax(0, 500px);
	}
}

@media (min-width: 2400px) {
	section.m8_logo_overview[data-layout="text_items_text"] .m8_three_col {
		grid-template-columns: minmax(0, 540px) minmax(0, 1fr) minmax(0, 540px);
	}
}

/* ---------- Titel (per JS injiziert) ---------- */
section.m8_logo_overview[data-layout="text_items_text"] .m8_titel {
	margin: 0;
	line-height: 1;            /* 35px */
	font-weight: 500;          /* Cresta Medium */
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #1f1f1f;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_titel span {
	color: #a5936f;
}

/* Goldene Phrase auf eigener Zeile (ersetzt frueheres <br>) — nur die
   zweizeilig gedachten m8-Titel: Startseite-Default (ohne hone_-Variante),
   hone_leistung_intro, hone_vv_intro. NICHT hone_partner (Gold mittig ->
   bleibt einzeilig) und NICHT bt_hand/bt_nachhaltig (nie zweizeilig gedacht). */
section.m8_logo_overview[data-layout="text_items_text"]:not([class*="hone_"]) .m8_titel span,
section.m8_logo_overview.hone_leistung_intro .m8_titel span,
section.m8_logo_overview.hone_vv_intro .m8_titel span {
	display: block;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_titel_container {
	margin-bottom: 29px;
}

/* ---------- Textspalten ---------- */
section.m8_logo_overview[data-layout="text_items_text"] .m8_text_col {
	font-size: 0.9rem;         /* 18px (Basis 20px) */
	line-height: 1.4444;       /* 26px */
	letter-spacing: 0.45px;
	color: #1f1f1f;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_text_col p {
	margin: 0 0 26px 0;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_text_col p:last-child {
	margin-bottom: 0;
}

/* Rechte Textspalte beginnt auf Hoehe des Textes links (Titel = 2 Zeilen + Abstand) */
section.m8_logo_overview[data-layout="text_items_text"] .m8_col_text_right {
	padding-top: 99px;
}

/* ---------- Button (per JS injiziert): helle Secondary-Variante ---------- */
section.m8_logo_overview[data-layout="text_items_text"] .mM_links {
	margin-top: 56px;
}
section.m8_logo_overview[data-layout="text_items_text"] .mM_links a.button,
section.m8_logo_overview[data-layout="text_items_text"] .mM_links a.mM_button {
	background-color: #fff;
	border: 1px solid rgba(31, 31, 31, 0.3);
	color: #1f1f1f;
}
section.m8_logo_overview[data-layout="text_items_text"] .mM_links a.button:hover,
section.m8_logo_overview[data-layout="text_items_text"] .mM_links a.mM_button:hover {
	background-color: #1f1f1f;
	border-color: #1f1f1f;
	color: #fff;
}

/* ---------- Mittelspalte: Icon-Liste mit Trennlinien ---------- */
section.m8_logo_overview[data-layout="text_items_text"] .m8_col_items {
	border-left: 2px solid rgba(31, 31, 31, 0.3);
	border-right: 2px solid rgba(31, 31, 31, 0.3);
	padding: 0 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

section.m8_logo_overview[data-layout="text_items_text"] .m8_items_vertical {
	display: flex;
	flex-direction: column;
}

section.m8_logo_overview[data-layout="text_items_text"] .m8_v_item {
	display: flex;
	align-items: center;
	gap: 42px;
	padding: 40px 0;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_v_item + .m8_v_item {
	border-top: 2px solid rgba(31, 31, 31, 0.3);
}

section.m8_logo_overview[data-layout="text_items_text"] .m8_v_icon {
	flex: 0 0 55px;
	display: flex;
	align-items: center;
	justify-content: center;
}
section.m8_logo_overview[data-layout="text_items_text"] .m8_v_icon img,
section.m8_logo_overview[data-layout="text_items_text"] .m8_v_icon svg {
	width: 52px;
	height: auto;
	max-height: 52px;
}

section.m8_logo_overview[data-layout="text_items_text"] .m8_v_label {
	font-size: 0.75rem;        /* 15px (Basis 20px) */
	line-height: 1.7333;       /* 26px */
	letter-spacing: 0.45px;
	color: #1f1f1f;
	opacity: .5;
}

/* ---------- Responsive ---------- */
@media screen and (max-width: 1599px) {
	section.m8_logo_overview[data-layout="text_items_text"] .m8_v_item {
		gap: 22px;
	}
	
	section.m8_logo_overview[data-layout="text_items_text"] .m8_v_label {
		hyphens: auto;
	}
}

@media screen and (max-width: 1199px) {
	section.m8_logo_overview[data-layout="text_items_text"] .mM_container {
		padding-bottom: 60px;  /* m1-Karte ragt hier 60px herein */
	}
	section.m8_logo_overview[data-layout="text_items_text"] .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 56px;
	}
	section.m8_logo_overview[data-layout="text_items_text"] .m8_col_items {
		border-left: 0;
		border-right: 0;
		border-top: 2px solid rgba(31, 31, 31, 0.3);
		border-bottom: 2px solid rgba(31, 31, 31, 0.3);
		padding: 12px 0;
	}
	section.m8_logo_overview[data-layout="text_items_text"] .m8_col_text_right {
		padding-top: 0;
	}
	section.m8_logo_overview[data-layout="text_items_text"] .mM_links {
		margin-top: 40px;
	}
}

@media screen and (max-width: 767px) {
	section.m8_logo_overview[data-layout="text_items_text"] .mM_container {
		padding-bottom: 40px;  /* m1-Karte ragt hier 40px herein */
	}
	section.m8_logo_overview[data-layout="text_items_text"] .m8_titel {
	}
	section.m8_logo_overview[data-layout="text_items_text"] .m8_v_item {
		gap: 24px;
		padding: 24px 0;
	}
}

/* =========================================================
   hone Kurzinfo (Wrapper-Klasse "hone_kurzinfo", Layout standard)
   Figma: m_kurzinfo auf 00_Startseite — 5 Spalten auf dunkler
   Flaeche, Trennlinien #6e6e6e links jeder Spalte, Icon gold,
   Titel weiss, Subline gold. Nur additiv — beruehrt weder das
   Standard-Raster anderswo noch text_items_text.
   ========================================================= */

section.m8_logo_overview.hone_kurzinfo {
	background: transparent;
	/* Vertikal-Abstand kommt aus dem Abstand-Klonfeld (data-innerer-abstand) */
}

section.m8_logo_overview.hone_kurzinfo .m8_items {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0;
}

section.m8_logo_overview.hone_kurzinfo .m8_item {
	width: auto !important;
	max-width: none;
	min-height: 300px;
	border-left: 2px solid #6e6e6e;
	padding: 49px 20px 0 34px;
	box-sizing: border-box;
}

/* Icon links-buendig (logo_above_title zentriert sonst) */
section.m8_logo_overview.hone_kurzinfo .m8_item_content_image_container {
	justify-content: flex-start;
}

section.m8_logo_overview.hone_kurzinfo .m8_item_content_image_container img,
section.m8_logo_overview.hone_kurzinfo .m8_item_content_image_container svg {
	width: 58px;
	min-width: 58px;
	height: 58px;
	min-height: 58px;
}

section.m8_logo_overview.hone_kurzinfo .m8_title_container {
	margin-top: 45px;
	min-height: 56px; /* 2 Titelzeilen — Sublines aller Spalten auf einer Linie */
}

section.m8_logo_overview.hone_kurzinfo .m8_title {
	margin: 0;
	font-size: 1.1rem;         /* 22px (Basis 20px) */
	line-height: 1.2727;       /* 28px */
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
	text-align: left;
}

section.m8_logo_overview.hone_kurzinfo .m8_subtitle_container {
	margin-top: 24px;
}

section.m8_logo_overview.hone_kurzinfo .m8_subtitle {
	margin: 0;
	font-size: 0.75rem;        /* 15px (Basis 20px) */
	line-height: 1.7333;       /* 26px */
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #a5936f;
	text-align: left;
}

@media (max-width: 1199px) {
	section.m8_logo_overview.hone_kurzinfo .m8_items {
		grid-template-columns: repeat(3, 1fr);
		row-gap: 40px;
	}

	section.m8_logo_overview.hone_kurzinfo .m8_item {
		min-height: 0;
		padding-bottom: 10px;
	}
}

@media (max-width: 767px) {
	section.m8_logo_overview.hone_kurzinfo .m8_items {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}

	section.m8_logo_overview.hone_kurzinfo .m8_title_container {
		margin-top: 24px;
		min-height: 0;
	}

	section.m8_logo_overview.hone_kurzinfo .m8_subtitle_container {
		margin-top: 10px;
	}
}

/* =========================================================
   hone Partner (Wrapper-Klasse "hone_partner", Layout standard)
   Figma: m_partner auf 00_Startseite — dunklere Flaeche #1f1f1f,
   zentrierter Titel, 2x6 weisse Logo-Karten 277x124 (Grid bricht
   bei grossen Viewports auf 1760px aus). Nur additiv.
   ========================================================= */

section.m8_logo_overview.hone_partner {
	background-color: #1f1f1f;
	/* Vertikal-Abstand kommt aus dem Abstand-Klonfeld (data-innerer-abstand) */
}

section.m8_logo_overview.hone_partner .m8_titel_container {
	margin-bottom: 43px;
}

section.m8_logo_overview.hone_partner .m8_titel {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	text-align: center;
	color: #fff;
}

section.m8_logo_overview.hone_partner .m8_titel span {
	color: #a5936f;
}

section.m8_logo_overview.hone_partner .m8_items {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
}

section.m8_logo_overview.hone_partner .m8_item {
	width: auto !important;
	max-width: none;
}

section.m8_logo_overview.hone_partner .m8_item_content_main {
	background-color: #fff;
	height: 124px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 30px;
	box-sizing: border-box;
}

section.m8_logo_overview.hone_partner .m8_item_content_image_container {
	justify-content: center;
	width: 100%;
}

section.m8_logo_overview.hone_partner .m8_item_content_image_container img,
section.m8_logo_overview.hone_partner .m8_item_content_image_container svg {
	width: 188px;
	max-width: 100%;
	height: 70px;
	min-width: 0;
	min-height: 0;
	object-fit: contain;
	transition: transform .3s ease;
}

/* Hover: Logo leicht vergroessern (auch bei Items ohne Link) */
section.m8_logo_overview.hone_partner .m8_item:hover .m8_item_content_image_container img,
section.m8_logo_overview.hone_partner .m8_item:hover .m8_item_content_image_container svg {
	transform: scale(1.1);
}

/* Breites Grid: ragt je 149px ueber den Container hinaus, nie naeher als 80px an den Rand */
@media (min-width: 1560px) {
	section.m8_logo_overview.hone_partner .m8_items {
		margin-left: clamp(-149px, calc(-50vw + 811px), 0px);
		margin-right: clamp(-149px, calc(-50vw + 811px), 0px);
	}
}

@media (min-width: 2200px) {
	section.m8_logo_overview.hone_partner .m8_items {
		margin-left: clamp(-149px, calc(-50vw + 920px), 0px);  /* Container 1680 */
		margin-right: clamp(-149px, calc(-50vw + 920px), 0px);
	}
}

@media (min-width: 2400px) {
	section.m8_logo_overview.hone_partner .m8_items {
		margin-left: clamp(-149px, calc(-50vw + 980px), 0px);  /* Container 1800 */
		margin-right: clamp(-149px, calc(-50vw + 980px), 0px);
	}
}

@media (max-width: 1399px) {
	section.m8_logo_overview.hone_partner .m8_items {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 991px) {
	section.m8_logo_overview.hone_partner .m8_items {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 767px) {
	section.m8_logo_overview.hone_partner .m8_items {
		grid-template-columns: repeat(2, 1fr);
	}

	section.m8_logo_overview.hone_partner .m8_titel {
		line-height: 1.15;
	}
}

/* Kleine Phones: einspaltig, damit die Partner-Logos nicht zu klein werden */
@media (max-width: 479px) {
	section.m8_logo_overview.hone_partner .m8_items {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
   hone Benefits (Wrapper-Klasse "hone_benefits", Layout standard)
   Figma: "Was wir Ihnen bieten" auf 04_Karriere — 10 Kacheln,
   5 pro Zeile (bricht nach 5 um), Trennlinie #6e6e6e links,
   Icon gold 58px, Titel weiss, Fliesstext weiss (anders als
   hone_kurzinfo: dort Subline gold). Nur additiv.
   ========================================================= */

section.m8_logo_overview.hone_benefits {
	background: transparent;
	/* Vertikal-Abstand kommt aus dem Abstand-Klonfeld (data-innerer-abstand) */
}

section.m8_logo_overview.hone_benefits .m8_titel_container {
	margin-bottom: 96px;
}

section.m8_logo_overview.hone_benefits .m8_titel {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
}

section.m8_logo_overview.hone_benefits .m8_titel span {
	color: #a5936f;
}

section.m8_logo_overview.hone_benefits .m8_items {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 51px 0;               /* Figma: 51px zwischen den Zeilen, Spalten stossen aneinander */
}

section.m8_logo_overview.hone_benefits .m8_item {
	width: auto !important;
	max-width: none;
	min-height: 363px;
	border-left: 2px solid #6e6e6e;
	padding: 49px 30px 40px 34px;
	box-sizing: border-box;
}

/* Icon links-buendig (logo_above_title zentriert sonst) */
section.m8_logo_overview.hone_benefits .m8_item_content_image_container {
	justify-content: flex-start;
}

section.m8_logo_overview.hone_benefits .m8_item_content_image_container img,
section.m8_logo_overview.hone_benefits .m8_item_content_image_container svg {
	width: 58px;
	min-width: 58px;
	height: 58px;
	min-height: 58px;
}

section.m8_logo_overview.hone_benefits .m8_title_container {
	margin-top: 44px;
	min-height: 56px;          /* 2 Titelzeilen — Texte aller Spalten auf einer Linie */
}

section.m8_logo_overview.hone_benefits .m8_title {
	margin: 0;
	font-size: 1.1rem;         /* 22px (Basis 20px) */
	line-height: 1.2727;       /* 28px */
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
	text-align: left;
}

section.m8_logo_overview.hone_benefits .m8_text_container {
	margin-top: 24px;
}

section.m8_logo_overview.hone_benefits .m8_text {
	font-size: 0.75rem;        /* 15px (Basis 20px) */
	line-height: 1.4666;       /* 22px */
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #fff;
	text-align: left;
	max-width: 233px;
}

section.m8_logo_overview.hone_benefits .m8_text p {
	margin: 0;
}

@media (max-width: 1199px) {
	section.m8_logo_overview.hone_benefits .m8_items {
		grid-template-columns: repeat(3, 1fr);
		row-gap: 40px;
	}

	section.m8_logo_overview.hone_benefits .m8_item {
		min-height: 0;
	}

	section.m8_logo_overview.hone_benefits .m8_titel_container {
		margin-bottom: 50px;
	}
}

@media (max-width: 767px) {
	section.m8_logo_overview.hone_benefits .m8_items {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}

	section.m8_logo_overview.hone_benefits .m8_item {
		padding-bottom: 10px;
	}

	section.m8_logo_overview.hone_benefits .m8_title_container {
		margin-top: 24px;
		min-height: 0;
	}

	section.m8_logo_overview.hone_benefits .m8_text_container {
		margin-top: 10px;
	}

	section.m8_logo_overview.hone_benefits .m8_titel {
		line-height: 1.15;
	}
}

/* =========================================================
   Hintergrund-Auswahl (Feld m8_hintergrund) — steht bewusst am
   Dateiende: schlaegt bei gleicher Spezifitaet die Varianten-
   Hintergruende (hone_partner, hone_kurzinfo, text_items_text).
   "standard" setzt keine Klasse (Variante entscheidet).
   ========================================================= */
section.m8_logo_overview.m8_bg_seitenfarbe {
	background-color: #303030;
}

section.m8_logo_overview.m8_bg_dunkel {
	background-color: #1f1f1f;
}

section.m8_logo_overview.m8_bg_hell {
	background-color: #fff;
}

/* =========================================================
   hone Leistung-Intro (Wrapper "hone_leistung_intro", Layout
   text_items_text) — Figma 06_Leistungen: weisse Sektion, links
   Titel+Text+Button (breit), rechts schmale Icon-Liste mit
   linker Trennlinie. 2 Spalten (die mittlere/rechte Textspalte
   des Basis-Layouts entfaellt). Nur additiv.
   ========================================================= */
section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_three_col {
	grid-template-columns: minmax(0, 1fr) minmax(0, 423px);
	column-gap: 62px;
	align-items: start;
}

/* Figma (06_Leistungen-Hausverwaltung, 33:1651): Textblock nur 870px breit ->
   groessere Luecke zur Icon-Liste. Textspalte ist 1fr (fuellt), Inhalt aber auf
   870 begrenzt und linksbuendig; so entsteht Luecke Text->Trennlinie 169px,
   Text->Icon 221px (vorher 134px). */
section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_col_text_left {
	max-width: 870px;
}

/* Kein Ueberlapp darunter (Portfolio ist eine normale dunkle Sektion) */
section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .mM_container {
	padding-bottom: 0;
}

/* rechte Textspalte des Basis-Layouts entfaellt */
section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_col_text_right {
	display: none;
}

/* Icon-Liste: nur linke Trennlinie, an der linken Kante der Spalte */
section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_col_items {
	border-right: 0;
	padding: 0 0 0 50px;   /* Figma: Icon 52px hinter der Trennlinie (Border 2 + 50) */
}

@media screen and (max-width: 1199px) {
	section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_three_col {
		grid-template-columns: 1fr;
	}
	section.m8_logo_overview.hone_leistung_intro[data-layout="text_items_text"] .m8_col_items {
		border-left: 0;
		border-top: 2px solid rgba(31, 31, 31, 0.3);
		border-bottom: 2px solid rgba(31, 31, 31, 0.3);
		padding: 12px 0;
	}
}

/* =========================================================
   hone Leistung-Liste (Wrapper "hone_leistung_liste", Layout standard)
   Figma 06_Facility "Hausmeisterservice" — weisse Sektion:
   Kopf (Titel links + Intro-Text rechts + Gold-Linie), darunter
   3 Spalten mit Icon (gold) + fettem Titel + Text. Nur additiv.
   ========================================================= */
section.m8_logo_overview.hone_leistung_liste {
	background-color: #fff;
	/* Vertikal-Abstand kommt aus dem Abstand-Klonfeld (data-innerer-abstand) */
}

/* ---------- Kopfzeile: Titel links | Intro rechts + Gold-Linie ----------
   Figma-Vertikalmasse: Kopf 160 unter Flaechenkante (97 Klonfeld + 63),
   Intro 50 tiefer als Titel, Linie 108 unter Titel-Oberkante (73 unter
   Titel-Ende), Icons 73 unter der Linie, unten 121 (97 Klonfeld + 24). */
section.m8_logo_overview.hone_leistung_liste .m8_logo_uebersicht_main {
	margin-top: 40px;          /* Klonfeld 120 + 40 = 160 (Figma) */
}

/* Hausmeisterservice (Facility): das darueberliegende hone_rundum-Bild ragt 97px
   in diese Flaeche -> Headline 104px unter der Bild-Unterkante (margin 40 -> 81). */
section.m8_logo_overview.hone_leistung_liste:not(.hone_liste_dunkel) .m8_logo_uebersicht_main {
	margin-top: 81px;
}

section.m8_logo_overview.hone_leistung_liste .m8_leistung_head {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 573px);
	column-gap: 62px;
	align-items: start;
	padding-bottom: 0;
	margin-bottom: 82px; /* Icons 184 unter Kopf-Oberkante (Intro-Hoehe 102 + 82); Linie endet 73 darueber */
}

/* Deko-Linie direkt unter dem Titel verankern (nicht auf feste 108px ab
   Kopf-Oberkante) — sonst haengt sie bei einzeiligem Titel unten am Intro-Text. */
section.m8_logo_overview.hone_leistung_liste .m8_leistung_head_titel {
	position: relative;
}
section.m8_logo_overview.hone_leistung_liste .m8_leistung_head_titel::after {
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	margin-top: 28px;
	width: 70px;
	height: 3px;
	background-color: #a5936f;
}

section.m8_logo_overview.hone_leistung_liste .m8_titel {
	margin: 0;
	line-height: 1.1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #a5936f;
}
section.m8_logo_overview.hone_leistung_liste .m8_titel span {
	color: #2b2b2b;
}

section.m8_logo_overview.hone_leistung_liste .m8_leistung_head_text {
	font-size: 0.9rem;         /* 18px */
	line-height: 1.4444;       /* 26px */
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #2b2b2b;
}
section.m8_logo_overview.hone_leistung_liste .m8_leistung_head_text {
	padding-top: 50px;         /* Figma: Intro beginnt 50px tiefer als der Titel */
}
section.m8_logo_overview.hone_leistung_liste .m8_leistung_head_text p { margin: 0; }

/* ---------- 3 Icon-Spalten ---------- */
section.m8_logo_overview.hone_leistung_liste .m8_items {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px 62px;
	margin-bottom: 60px;       /* mehr Luft nach unten — die Gold-Karte ragt 97 in die Flaeche, so bleiben ~83px sichtbar */
}

section.m8_logo_overview.hone_leistung_liste .m8_item {
	width: auto !important;
	max-width: none;
}

section.m8_logo_overview.hone_leistung_liste .m8_item_content_image_container {
	justify-content: flex-start;
	margin-bottom: 42px;       /* Figma: Icon-Unterkante -> Text 42px */
}
section.m8_logo_overview.hone_leistung_liste .m8_item_content_image_container img,
section.m8_logo_overview.hone_leistung_liste .m8_item_content_image_container svg {
	width: 116px;               /* Figma: Icons 102-116px */
	min-width: 116px;
	height: 116px;
	min-height: 116px;
	object-fit: contain;
}

section.m8_logo_overview.hone_leistung_liste .m8_title_container { margin-top: 0; }
section.m8_logo_overview.hone_leistung_liste .m8_title {
	margin: 0 0 12px 0;
	font-size: 0.9rem;         /* 18px */
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: 0.45px;
	text-transform: none;
	text-align: left;
	color: #2b2b2b;
}

section.m8_logo_overview.hone_leistung_liste .m8_text {
	font-size: 0.9rem;         /* 18px */
	line-height: 1.4444;       /* 26px */
	letter-spacing: 0.45px;
	font-weight: 300;
	text-align: left;
	color: #2b2b2b;
}
section.m8_logo_overview.hone_leistung_liste .m8_text p { margin: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
	section.m8_logo_overview.hone_leistung_liste .m8_leistung_head {
		grid-template-columns: 1fr;
		row-gap: 24px;
	}
	section.m8_logo_overview.hone_leistung_liste .m8_items {
		grid-template-columns: 1fr;
		row-gap: 40px;
	}
}

/* =========================================================
   hone PV Intro (Wrapper "hone_pv_intro", 06_Photovoltaik)
   Weisse Flaeche "Nachhaltige Energie": Titel links (gold,
   span dunkel), Text + Secondary-Button rechts. Nutzt den
   Leistungs-Kopf-Zweig des Templates, ohne Items/Gold-Linie.
   Figma-Vertikal: Text 46 tiefer als Titel, Button 12 unter
   Text, unten 202 bis Flaechenende (120 Klonfeld + 82 — das
   Foto-Band darunter ragt 101 in die Flaeche).
   ========================================================= */
section.m8_logo_overview.hone_pv_intro {
	background-color: #fff;
}

section.m8_logo_overview.hone_pv_intro .m8_logo_uebersicht_main {
	margin-bottom: 82px;
}

section.m8_logo_overview.hone_pv_intro .m8_leistung_head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);   /* 50/50 Titel | Text */
	column-gap: 62px;
	align-items: start;
}

section.m8_logo_overview.hone_pv_intro .m8_titel {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #a5936f;
}
section.m8_logo_overview.hone_pv_intro .m8_titel span {
	color: #2b2b2b;
	display: block;            /* Umbruch nach "Energie" (Figma: Titel 2-zeilig) */
}

section.m8_logo_overview.hone_pv_intro .m8_leistung_head_text {
	padding-top: 46px;         /* Figma: Text beginnt 46px tiefer als der Titel */
	font-size: 0.9rem;         /* 18px */
	line-height: 1.4444;       /* 26px */
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #2b2b2b;
}
section.m8_logo_overview.hone_pv_intro .m8_leistung_head_text p { margin: 0; }

section.m8_logo_overview.hone_pv_intro .m8_leistung_head_text .mM_links {
	margin-top: 55px;          /* mehr Luft zwischen Text und Button */
}
section.m8_logo_overview.hone_pv_intro .mM_links a.button,
section.m8_logo_overview.hone_pv_intro .mM_links a.mM_button {
	background-color: #fff;
	border: 1px solid rgba(31, 31, 31, 0.3);
	color: #1f1f1f;
}
section.m8_logo_overview.hone_pv_intro .mM_links a.button:hover,
section.m8_logo_overview.hone_pv_intro .mM_links a.mM_button:hover {
	background-color: #1f1f1f;
	border-color: #1f1f1f;
	color: #fff;
}

section.m8_logo_overview.hone_pv_intro .m8_items { display: none; }

@media (max-width: 991px) {
	section.m8_logo_overview.hone_pv_intro .m8_leistung_head {
		grid-template-columns: 1fr;
		row-gap: 24px;
	}
	section.m8_logo_overview.hone_pv_intro .m8_leistung_head_text { padding-top: 0; }
	section.m8_logo_overview.hone_pv_intro .m8_logo_uebersicht_main { margin-bottom: 0; }
}

/* =========================================================
   hone PV Planung (Wrapper "hone_pv_planung", 06_Photovoltaik)
   Seitenfarbe: links Titel (weiss) + Gold-Linie + goldene
   Subheadline (erster <p><strong>) + Text + Ghost-Button;
   rechts vertikale Icon-Liste (Labels weiss/50%) mit
   Trennlinien (rgba 255/.1). Layout text_items_text.
   ========================================================= */
section.m8_logo_overview.hone_pv_planung {
	background-color: transparent;
}

section.m8_logo_overview.hone_pv_planung .m8_three_col {
	display: grid;
	grid-template-columns: minmax(0, 573px) minmax(0, 599px);
	justify-content: space-between;
	column-gap: 62px;
	align-items: start;
}

section.m8_logo_overview.hone_pv_planung .m8_col_text_left {
	position: relative;
}
/* Gold-Linie mit konstantem Abstand ueber der Subheadline — an .m8_text_col
   gehaengt (nicht an einer fixen Hoehe ab Spaltenkopf). So wandert sie mit dem
   Text und rutscht nicht bei 1-zeiligem Titel (schmalere Breiten) in den Text. */
section.m8_logo_overview.hone_pv_planung .m8_text_col {
	position: relative;
}
section.m8_logo_overview.hone_pv_planung .m8_text_col::before {
	content: '';
	position: absolute;
	left: 0;
	top: -24px;                 /* Akzentlinie gehoert zur Subheadline darunter,
	                              nicht an den Titel geklebt (Mobil war -40px zu eng) */
	width: 70px;
	height: 3px;
	background-color: #a5936f;
}

/* Desktop: Linie mittig in die 95px-Luecke zwischen Headline und Subheadline setzen */
@media (min-width: 992px) {
	section.m8_logo_overview.hone_pv_planung .m8_text_col::before {
		top: -49px;
	}
}

section.m8_logo_overview.hone_pv_planung .m8_titel {
	margin: 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
}
section.m8_logo_overview.hone_pv_planung .m8_titel span { color: #fff; }

section.m8_logo_overview.hone_pv_planung .m8_text_col {
	margin-top: 95px;          /* Figma: Subheadline 95px unter Titel-Ende */
	font-size: 0.9rem;         /* 18px */
	line-height: 1.4444;
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #fff;
}
section.m8_logo_overview.hone_pv_planung .m8_text_col p { margin: 0; }
/* Subheadline: erster Absatz (nur <strong>) gold, 22px */
section.m8_logo_overview.hone_pv_planung .m8_text_col p:first-child {
	margin-bottom: 26px;
}
section.m8_logo_overview.hone_pv_planung .m8_text_col p:first-child strong {
	font-size: 1.1rem;         /* 22px */
	line-height: 1.4545;       /* 32px */
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #a5936f;
}

section.m8_logo_overview.hone_pv_planung .m8_col_text_left .mM_links {
	margin-top: 51px;
}
section.m8_logo_overview.hone_pv_planung .mM_links a.button,
section.m8_logo_overview.hone_pv_planung .mM_links a.mM_button {
	background-color: transparent;
	border: 1px solid #fff;
	color: #fff;
}
section.m8_logo_overview.hone_pv_planung .mM_links a.button:hover,
section.m8_logo_overview.hone_pv_planung .mM_links a.mM_button:hover {
	background-color: #a5936f;
	border-color: #a5936f;
	color: #fff;
}

/* Rechte Spalte: vertikale Liste mit Linien */
section.m8_logo_overview.hone_pv_planung .m8_col_items {
	border-left: 2px solid rgba(255, 255, 255, 0.1);
}
section.m8_logo_overview.hone_pv_planung .m8_items_vertical {
	padding-left: 247px;
}
section.m8_logo_overview.hone_pv_planung .m8_v_item {
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 42px 0;
	position: relative;
}
section.m8_logo_overview.hone_pv_planung .m8_v_item + .m8_v_item::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background-color: rgba(255, 255, 255, 0.1);
}
section.m8_logo_overview.hone_pv_planung .m8_v_icon {
	width: 52px;
	min-width: 52px;
	height: 52px;
}
section.m8_logo_overview.hone_pv_planung .m8_v_icon svg,
section.m8_logo_overview.hone_pv_planung .m8_v_icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
section.m8_logo_overview.hone_pv_planung .m8_v_label {
	font-size: 0.75rem;        /* 15px */
	letter-spacing: 0.45px;
	color: rgba(255, 255, 255, 0.5);
}

/* Rechte Textspalte im PV-Planung-Layout ungenutzt */
section.m8_logo_overview.hone_pv_planung .m8_col_text_right { display: none; }

@media (max-width: 1399px) {
	section.m8_logo_overview.hone_pv_planung .m8_items_vertical { padding-left: 80px; }
}
@media (max-width: 991px) {
	section.m8_logo_overview.hone_pv_planung .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 40px;
	}
	section.m8_logo_overview.hone_pv_planung .m8_col_items { border-left: 0; }
	section.m8_logo_overview.hone_pv_planung .m8_items_vertical { padding-left: 0; }
	section.m8_logo_overview.hone_pv_planung .m8_text_col { margin-top: 60px; }
}

/* =========================================================
   hone PV Projektmanagement (Wrapper "hone_pv_pm")
   Weisse Flaeche: Titel gold links oben, darunter zwei
   573er-Textspalten (links Intro, rechts Bold-Liste).
   Layout text_items_text ohne Items.
   ========================================================= */
section.m8_logo_overview.hone_pv_pm {
	background-color: #fff;
}

section.m8_logo_overview.hone_pv_pm .m8_three_col {
	display: grid;
	grid-template-columns: 1fr 1fr;    /* 50/50 */
	column-gap: 62px;
	align-items: start;
	/* text_items_text rendert KEIN .m8_logo_uebersicht_main — Offset gehoert hierher.
	   Foto-Band ragt 101 in die Flaeche -> sichtbar ~150 bis zum Titel */
	margin-top: 130px;
}
/* Overlap-Offset (130px) nur solange Band ueberlappt (>=1560); darunter klein */
@media (max-width: 1559px) {
	section.m8_logo_overview.hone_pv_pm .m8_three_col { margin-top: 40px; }
}
section.m8_logo_overview.hone_pv_pm .m8_col_items { display: none; }

section.m8_logo_overview.hone_pv_pm .m8_titel {
	margin: 0 0 28px 0;
	line-height: 1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #a5936f;
}
section.m8_logo_overview.hone_pv_pm .m8_titel span { color: #2b2b2b; }

section.m8_logo_overview.hone_pv_pm .m8_text_col {
	font-size: 0.9rem;
	line-height: 1.4444;
	letter-spacing: 0.45px;
	font-weight: 300;
	color: #2b2b2b;
}
section.m8_logo_overview.hone_pv_pm .m8_text_col p { margin: 0 0 26px 0; }
section.m8_logo_overview.hone_pv_pm .m8_text_col p:last-child { margin-bottom: 0; }
section.m8_logo_overview.hone_pv_pm .m8_text_col strong { font-weight: 700; }

/* Rechte Spalte beginnt auf Hoehe des linken Textes (Titel 35 + 28) */
section.m8_logo_overview.hone_pv_pm .m8_col_text_right { padding-top: 63px; }

@media (max-width: 1559px) {
	section.m8_logo_overview.hone_pv_pm .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}
	section.m8_logo_overview.hone_pv_pm .m8_col_text_right { padding-top: 0; }
	section.m8_logo_overview.hone_pv_pm .m8_logo_uebersicht_main { margin-top: 0; }
}

/* =========================================================
   hone Leistungs-Liste DUNKEL (Wrapper "hone_leistung_liste
   hone_liste_dunkel", 06_Photovoltaik "Uebergabe und Schulung")
   Auf Seitenfarbe: Titel gold + span weiss, Texte weiss,
   3 Spalten je 360px mit Icons 112.
   ========================================================= */
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel {
	background-color: transparent;
}
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_titel { color: #a5936f; }
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_titel span { color: #fff; }
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_leistung_head_text { color: #fff; }
/* Deko-Linie jetzt titel-verankert (Basisregel) — kein fester top-Wert mehr noetig */
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_title { color: #fff; }
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_text { color: #fff; }
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_item_content_image_container img,
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_item_content_image_container svg {
	width: 112px;
	min-width: 112px;
	height: 112px;
	min-height: 112px;
}
@media (min-width: 992px) {
	section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_items {
		grid-template-columns: repeat(3, minmax(0, 360px));
		justify-content: space-between;
	}
}

/* Kein Gold-Karten-Overlap wie bei Facility -> das 60px-margin-bottom auf
   .m8_items entfaellt; stattdessen der normale Section-Abstand unten
   (120 / 60 ≤1199 / 40 ≤600, analog data-innerer-abstand). */
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel .m8_items {
	margin-bottom: 0;
}
section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel {
	padding-bottom: 120px;
}
@media (max-width: 1199px) {
	section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel {
		padding-bottom: 60px;
	}
}
@media (max-width: 600px) {
	section.m8_logo_overview.hone_leistung_liste.hone_liste_dunkel {
		padding-bottom: 40px;
	}
}

/* Overrides gegen die generischen text_items_text-Regeln (stehen frueher in der Datei) */
section.m8_logo_overview.hone_pv_planung .mM_container { padding-bottom: 0; }
section.m8_logo_overview.hone_pv_planung .m8_col_items {
	border-right: 0;
	padding: 0;
}
section.m8_logo_overview.hone_pv_planung .m8_v_item + .m8_v_item { border-top: 0; }
section.m8_logo_overview.hone_pv_pm .mM_container { padding-bottom: 0; }

/* =========================================================
   hone Bautraeger "alles aus einer Hand" (Wrapper "hone_bt_hand",
   06_Bautraeger): Spiegel von hone_pv_planung auf #2b2b2b —
   Icon-Liste LINKS (eingerueckt, Trennlinien, Border rechts),
   Titel gold + Gold-Linie + Text RECHTS. Layout text_items_text;
   visuelle Reihenfolge per grid-column getauscht. Nur additiv.
   ========================================================= */
section.m8_logo_overview.hone_bt_hand {
	background-color: #2b2b2b;
}

/* Figma: 101 zwischen Icon-Liste und Foto-Band (die dunkle Flaeche laeuft
   hinterm Band weiter — siehe hone_bt_band in m3_image.css) */
section.m8_logo_overview.hone_bt_hand .mM_container { padding-bottom: 101px; }

section.m8_logo_overview.hone_bt_hand .m8_three_col {
	display: grid;
	/* Prozentual statt fixer px -> Text beginnt IMMER an der Haelfte (37,9% Icon-
	   Liste + 12,1% Luecke = 50%) und skaliert mit dem Container. */
	grid-template-columns: minmax(0, 37.9%) minmax(0, 39.2%);
	justify-content: start;
	column-gap: 12.1%;
	align-items: start;
	margin-top: 82px; /* Inhalt 202 unter Sektionsbeginn (Klonfeld 120 + 82) */
}

section.m8_logo_overview.hone_bt_hand .m8_col_text_left { grid-column: 2; grid-row: 1; }
section.m8_logo_overview.hone_bt_hand .m8_col_items {
	grid-column: 1;
	grid-row: 1;
	border-left: 0;
	border-right: 2px solid rgba(255, 255, 255, 0.1);
	padding: 0;
	display: block;
}
section.m8_logo_overview.hone_bt_hand .m8_col_text_right { display: none; }

section.m8_logo_overview.hone_bt_hand .m8_titel {
	margin: 0;
	color: #a5936f;
}
section.m8_logo_overview.hone_bt_hand .m8_titel span { color: #fff; }
section.m8_logo_overview.hone_bt_hand .m8_titel_container { margin-bottom: 0; }

/* Gold-Linie zwischen Titel und Text (39 unter Titel, 60 bis Text) */
section.m8_logo_overview.hone_bt_hand .m8_text_col {
	position: relative;
	margin-top: 39px;
	padding-top: 63px;
	color: #fff;
}
section.m8_logo_overview.hone_bt_hand .m8_text_col::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 70px;
	height: 3px;
	background-color: #a5936f;
}
section.m8_logo_overview.hone_bt_hand .m8_text_col p { margin: 0 0 26px 0; }
section.m8_logo_overview.hone_bt_hand .m8_text_col p:last-child { margin-bottom: 0; }

/* Icon-Liste: eingerueckt (Figma 148 vom Containerrand), helle Trennlinien */
section.m8_logo_overview.hone_bt_hand .m8_items_vertical { padding-left: 148px; }
section.m8_logo_overview.hone_bt_hand .m8_v_item {
	display: flex;
	align-items: center;
	gap: 21px;
	padding: 32px 0;
	position: relative;
	border-top: 0; /* generische dunkle Linie neutralisieren */
}
section.m8_logo_overview.hone_bt_hand .m8_v_item:first-child { padding-top: 0; }
section.m8_logo_overview.hone_bt_hand .m8_v_item + .m8_v_item::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 358px;
	max-width: 100%;
	height: 2px;
	background-color: rgba(255, 255, 255, 0.1);
}
section.m8_logo_overview.hone_bt_hand .m8_v_icon {
	flex: 0 0 48px;
	width: 48px;
	min-width: 48px;
	height: 48px;
}
section.m8_logo_overview.hone_bt_hand .m8_v_icon svg,
section.m8_logo_overview.hone_bt_hand .m8_v_icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
section.m8_logo_overview.hone_bt_hand .m8_v_label {
	font-size: 0.75rem;        /* 15px */
	letter-spacing: 0.45px;
	color: rgba(255, 255, 255, 0.5);
}

@media (max-width: 1399px) {
	section.m8_logo_overview.hone_bt_hand .m8_items_vertical { padding-left: 40px; }
}
@media (max-width: 991px) {
	section.m8_logo_overview.hone_bt_hand .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 40px;
		margin-top: 0;
	}
	section.m8_logo_overview.hone_bt_hand .m8_col_text_left { grid-column: 1; grid-row: auto; }
	section.m8_logo_overview.hone_bt_hand .m8_col_items { grid-column: 1; grid-row: auto; border-right: 0; }
	section.m8_logo_overview.hone_bt_hand .m8_items_vertical { padding-left: 0; }
}

/* =========================================================
   hone Bautraeger Nachhaltigkeit (Wrapper "hone_bt_nachhaltig",
   06_Bautraeger): wie hone_pv_pm, aber auf SEITENFARBE —
   Titel gold (span weiss) + Ghost-Button links, Text rechts,
   Spalten 50/50. Layout text_items_text ohne Items.
   ========================================================= */
section.m8_logo_overview.hone_bt_nachhaltig {
	background-color: transparent;
}
section.m8_logo_overview.hone_bt_nachhaltig .mM_container { padding-bottom: 0; }

section.m8_logo_overview.hone_bt_nachhaltig .m8_three_col {
	display: grid;
	grid-template-columns: 1fr 1fr;    /* 50/50 */
	column-gap: 62px;
	align-items: start;
	margin-top: 82px; /* Inhalt 202 unter Sektionsbeginn (Klonfeld 120 + 82) */
}
section.m8_logo_overview.hone_bt_nachhaltig .m8_col_items { display: none; }

section.m8_logo_overview.hone_bt_nachhaltig .m8_titel {
	margin: 0;
	max-width: 425px; /* Figma-Umbruch: 3 Zeilen */
	color: #a5936f;
}
section.m8_logo_overview.hone_bt_nachhaltig .m8_titel span { color: #fff; }
section.m8_logo_overview.hone_bt_nachhaltig .m8_titel_container { margin-bottom: 0; }

section.m8_logo_overview.hone_bt_nachhaltig .m8_text_col { color: #fff; }
section.m8_logo_overview.hone_bt_nachhaltig .m8_text_col p { margin: 0 0 26px 0; }
section.m8_logo_overview.hone_bt_nachhaltig .m8_text_col p:last-child { margin-bottom: 0; }

/* Rechte Spalte beginnt 98px unter Titel-Oberkante (Figma) */
section.m8_logo_overview.hone_bt_nachhaltig .m8_col_text_right { padding-top: 98px; }

/* Ghost-Button unterm Titel */
section.m8_logo_overview.hone_bt_nachhaltig .m8_col_text_left .mM_links { margin-top: 55px; }
section.m8_logo_overview.hone_bt_nachhaltig .mM_links a.button,
section.m8_logo_overview.hone_bt_nachhaltig .mM_links a.mM_button {
	background-color: transparent;
	border: 1px solid #fff;
	color: #fff;
}
section.m8_logo_overview.hone_bt_nachhaltig .mM_links a.button:hover,
section.m8_logo_overview.hone_bt_nachhaltig .mM_links a.mM_button:hover {
	background-color: #a5936f;
	border-color: #a5936f;
	color: #fff;
}

/* Desktop-Offsets (82px Top fuers ueberlappende Foto, 98px rechte Spalte)
   nur solange der Ueberlapp aktiv ist (>=1560). Darunter weg + einspaltig,
   sonst klafft unter dem Foto eine zu grosse Luecke (Foto ragt nicht mehr rein). */
@media (max-width: 1559px) {
	section.m8_logo_overview.hone_bt_nachhaltig .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 32px;
		margin-top: 0;
	}
	section.m8_logo_overview.hone_bt_nachhaltig .m8_col_text_right { padding-top: 0; }
}

/* =========================================================
   hone Vermietung & Verkauf Intro (Wrapper "hone_vv_intro",
   06_Vermietung-Verkauf "Wir bringen Objekt und Mensch
   zusammen."): wie hone_bt_nachhaltig, aber Flaeche #2b2b2b,
   Textspalte rechts 46 unter Titel-Oberkante, kein extra
   Top-Offset. Layout text_items_text ohne Items.
   ========================================================= */
section.m8_logo_overview.hone_vv_intro {
	background-color: #2b2b2b;
}
section.m8_logo_overview.hone_vv_intro .mM_container { padding-bottom: 0; }

section.m8_logo_overview.hone_vv_intro .m8_three_col {
	display: grid;
	grid-template-columns: 1fr 1fr;    /* 50/50 */
	column-gap: 62px;
	align-items: start;
}
section.m8_logo_overview.hone_vv_intro .m8_col_items { display: none; }

section.m8_logo_overview.hone_vv_intro .m8_titel {
	margin: 0;
	max-width: 525px; /* Umbruch vor "und" wie im Figma */
	color: #a5936f;
}
section.m8_logo_overview.hone_vv_intro .m8_titel span { color: #fff; }
section.m8_logo_overview.hone_vv_intro .m8_titel_container { margin-bottom: 0; }

section.m8_logo_overview.hone_vv_intro .m8_text_col { color: #fff; }
section.m8_logo_overview.hone_vv_intro .m8_text_col p { margin: 0 0 26px 0; }
section.m8_logo_overview.hone_vv_intro .m8_text_col p:last-child { margin-bottom: 0; }

/* Rechte Spalte beginnt 46px unter Titel-Oberkante (Figma) */
section.m8_logo_overview.hone_vv_intro .m8_col_text_right { padding-top: 46px; }

/* Ghost-Button unterm Titel */
section.m8_logo_overview.hone_vv_intro .m8_col_text_left .mM_links { margin-top: 49px; }
section.m8_logo_overview.hone_vv_intro .mM_links a.button,
section.m8_logo_overview.hone_vv_intro .mM_links a.mM_button {
	background-color: transparent;
	border: 1px solid #fff;
	color: #fff;
}
section.m8_logo_overview.hone_vv_intro .mM_links a.button:hover,
section.m8_logo_overview.hone_vv_intro .mM_links a.mM_button:hover {
	background-color: #a5936f;
	border-color: #a5936f;
	color: #fff;
}

@media (max-width: 991px) {
	section.m8_logo_overview.hone_vv_intro .m8_three_col {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}
	section.m8_logo_overview.hone_vv_intro .m8_col_text_right { padding-top: 0; }
}