/*
Theme Name:        MainFacility
Description:       Block-Theme für mainfacility.eu nach Entwurf „A · Ingenieur-Präzision“ (September 2026). Farben, Schriften und Abstände stehen in theme.json; hier nur, was theme.json nicht abbilden kann.
Version:           1.0.4
Requires at least: 6.7
Requires PHP:      8.1
Author:            MainFacility GmbH
License:           GPL-2.0-or-later
Text Domain:       mainfacility
*/

/* ---------- Grundlagen ---------- */

html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { -webkit-font-smoothing: antialiased; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--akzent);
	outline-offset: 3px;
}

.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--weiss);
	color: var(--wp--preset--color--tinte);
	z-index: 1000;
}

.wp-site-blocks > main { margin-block-start: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* Abschnitte schließen ohne Lücke aneinander an */
.wp-block-post-content > .alignfull,
main > .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }

/* Formular auf dunklem Grund: Überschrift bleibt dunkel auf der weißen Karte */
.mf-formular .mf-formular__titel { color: var(--wp--preset--color--tinte); }
.mf-formular p:where(:not(.mf-formular__meldung)) { color: var(--wp--preset--color--grau-dunkel); }
.mf-formular a { color: var(--wp--preset--color--blau); }

.mf-mono, .mf-kicker, .mf-karte__nr, .mf-probleme__nr, .mf-schritt__nr, .mf-ablauf__nr, .mf-adresse {
	font-family: var(--wp--preset--font-family--mono);
}

/* ---------- Abschnitte ---------- */

.mf-abschnitt {
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}

.mf-dunkel { background-color: var(--wp--preset--color--nacht); color: var(--wp--preset--color--weiss); }
.mf-mittel { background-color: var(--wp--preset--color--nacht-2); color: var(--wp--preset--color--weiss); }
.mf-hell { background-color: var(--wp--preset--color--hell); color: var(--wp--preset--color--tinte); }

.mf-dunkel :where(h1, h2, h3, h4),
.mf-mittel :where(h1, h2, h3, h4) { color: var(--wp--preset--color--weiss); }

.mf-dunkel a:where(:not(.wp-element-button)),
.mf-mittel a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--blau-hell); }
.mf-dunkel a:where(:not(.wp-element-button)):hover,
.mf-mittel a:where(:not(.wp-element-button)):hover { color: var(--wp--preset--color--weiss); }

.mf-raster {
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
	background-size: 54px 54px;
	background-position: -1px -1px;
}

.mf-abschnitt h2 { max-width: 18ch; }
h1, h2 { overflow-wrap: break-word; hyphens: manual; }

.mf-kicker {
	margin: 0 0 1.6rem;
	font-size: 0.8rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--blau-hell);
}

.mf-hell .mf-kicker, .mf-weiss .mf-kicker { color: var(--wp--preset--color--blau); }

.mf-kicker--linie::before {
	content: "";
	display: inline-block;
	width: 44px;
	height: 1px;
	margin-right: 16px;
	vertical-align: middle;
	background: currentColor;
}

.mf-lead {
	max-width: 38em;
	margin-top: 1.8rem;
	font-size: var(--wp--preset--font-size--gross);
	color: var(--wp--preset--color--grau);
}

.mf-hell .mf-lead, .mf-weiss .mf-lead { color: var(--wp--preset--color--grau-dunkel); }

.mf-zwei {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(40px, 6vw, 110px);
}

.mf-zwei--mitte { align-items: center; }
.mf-zwei > * { margin-block-start: 0 !important; min-width: 0; }

/* Text auf dunklen Flächen */
.mf-dunkel p:where(:not(.mf-kicker):not(.mf-kennzahl__wert)),
.mf-mittel p:where(:not(.mf-kicker):not(.mf-kennzahl__wert)) { color: var(--wp--preset--color--grau); }

/* ---------- Knöpfe ---------- */

.wp-block-button__link { transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease; }

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.35);
	color: var(--wp--preset--color--weiss);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: transparent;
	border-color: var(--wp--preset--color--weiss);
}

.mf-hell .wp-block-button.is-style-outline > .wp-block-button__link,
.mf-weiss .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: var(--wp--preset--color--tinte);
	color: var(--wp--preset--color--tinte);
}

.mf-knoepfe { margin-top: 2.6rem !important; gap: 16px; }
.mf-pfeil .wp-block-button__link::after { content: " →"; }

/* ---------- Kopf ---------- */

/* WordPress legt den Kopf in <header class="wp-block-template-part">; nur dieser kann „kleben“. */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 32px); }

.mf-kopf {
	/* Kein backdrop-filter: Er würde das mobile Menü (position: fixed) auf den Kopf begrenzen. */
	background: rgba(8, 17, 31, 0.97);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	color: var(--wp--preset--color--weiss);
}


.mf-kopf__innen { min-height: 78px; gap: 32px; }
.mf-kopf__innen > * { margin: 0 !important; }

.mf-logo { display: block; line-height: 0; }
.mf-logo img { width: 150px; height: auto; }

.mf-hauptmenue { margin-left: auto !important; margin-right: auto !important; }
.mf-hauptmenue .wp-block-navigation-item__content { color: #dbe3ee; }
.mf-hauptmenue .wp-block-navigation-item__content:hover,
.mf-hauptmenue .current-menu-item > .wp-block-navigation-item__content { color: var(--wp--preset--color--weiss); }

.mf-kopf__tel { font-family: var(--wp--preset--font-family--mono); font-size: 0.92rem; white-space: nowrap; }
.mf-kopf__tel a { color: var(--wp--preset--color--grau); text-decoration: none; }
.mf-kopf__tel a:hover { color: var(--wp--preset--color--weiss); }
.mf-kopf__knopf .wp-block-button__link { padding: 0.8em 1.4em; white-space: nowrap; }

.mf-hauptmenue .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--weiss); border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 3px; padding: 8px; }

.mf-hauptmenue .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--nacht);
	color: var(--wp--preset--color--weiss);
	padding: 24px clamp(16px, 4.5vw, 72px);
}

.mf-hauptmenue .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start !important; gap: 0; }
.mf-hauptmenue .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }

.mf-hauptmenue .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.4rem;
	padding: 14px 0;
	color: var(--wp--preset--color--weiss);
}

.mf-hauptmenue .mf-nur-mobil { display: none; }

@media (max-width: 1280px) {
	.mf-kopf__tel { display: none !important; }
}

@media (max-width: 1080px) {
	.mf-kopf__knopf { display: none !important; }
	.mf-hauptmenue { margin-right: 0 !important; --wp--style--block-gap: 18px; font-size: 0.92rem !important; }
	.mf-hauptmenue .mf-nur-mobil { display: block; }
}

@media (max-width: 720px) {
	.mf-kopf__innen { min-height: 66px; }
	.mf-logo img { width: 128px; }
}

/* ---------- Hero ---------- */

.mf-hero {
	position: relative;
	overflow: hidden;
	min-height: min(820px, calc(100vh - 78px));
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.mf-hero > * { margin-block-start: 0 !important; }

.mf-hero__bild { position: absolute; inset: 0 0 0 50%; margin: 0 !important; }
.mf-hero__bild img { width: 100%; height: 100%; object-fit: cover; object-position: left top; display: block; }
.mf-hero__bild::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, var(--wp--preset--color--nacht) 0%, rgba(8, 17, 31, 0) 30%); }

.mf-hero__text { position: relative; z-index: 2; width: 100%; padding-top: 100px; padding-bottom: 110px; }

.mf-hero__titel {
	max-width: 6.4em;
	font-size: var(--wp--preset--font-size--riesig);
	line-height: 0.98;
	letter-spacing: -0.035em;
}

.mf-hero .mf-lead { color: #b6c2d3 !important; }

.mf-status {
	position: absolute;
	z-index: 2;
	top: 8%;
	right: 5%;
	width: min(340px, 80%);
	padding: 22px 26px;
	background: rgba(12, 20, 34, 0.88);
	border: 1px solid rgba(255, 255, 255, 0.12);
	backdrop-filter: blur(6px);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.9rem;
}

.mf-status__titel { margin: 0 0 12px; color: var(--wp--preset--color--blau-hell); text-transform: uppercase; letter-spacing: 0.06em; display: flex; align-items: center; gap: 8px; }
.mf-status__punkt { width: 7px; height: 7px; border-radius: 50%; background: var(--wp--preset--color--blau-hell); animation: mf-puls 2s infinite; }
@keyframes mf-puls { 50% { opacity: 0.3; } }
.mf-status dl { margin: 0; }
.mf-status dl div { display: flex; justify-content: space-between; padding: 4px 0; }
.mf-status dt { color: #c9d3e0; }
.mf-status dd { margin: 0; font-weight: 700; }
.mf-status .mf-gruen { color: #3ecf8e; }

/* Kleiner Seitenkopf der Unterseiten */
.mf-seitenkopf { padding-top: clamp(64px, 8vw, 130px); padding-bottom: clamp(56px, 7vw, 110px); }
.mf-seitenkopf h1 { max-width: 16ch; }

/* ---------- Kennzahlen ---------- */

.mf-kennzahlen {
	background: #0a1526;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	color: var(--wp--preset--color--weiss);
}

.mf-kennzahlen__raster { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 1480px; margin: 0 auto; }
.mf-kennzahlen__raster > * { margin: 0 !important; padding: 34px clamp(16px, 4.5vw, 72px) 40px; border-left: 1px solid rgba(255, 255, 255, 0.1); }
.mf-kennzahlen__raster > :first-child { border-left: 0; }
.mf-kennzahl__wert { margin: 0; font-size: clamp(2rem, 3.4vw, 3.6rem); font-weight: 700; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; color: var(--wp--preset--color--weiss); }
.mf-kennzahl__text { margin: 8px 0 0; font-size: 0.95rem; color: var(--wp--preset--color--grau); }

/* ---------- Herausforderung ---------- */

.mf-probleme { border-top: 1px solid rgba(255, 255, 255, 0.1); }
.mf-probleme > * { margin: 0 !important; display: grid; grid-template-columns: 100px 1fr; padding: 38px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.mf-probleme > * > * { margin: 0 !important; grid-column: 2; }
.mf-probleme__nr { grid-column: 1 !important; grid-row: 1 / span 2; padding-top: 6px; font-size: 0.95rem; color: #e5534b !important; }
.mf-probleme h3 { font-size: clamp(1.25rem, 1.8vw, 1.55rem); }
.mf-probleme p:where(:not(.mf-probleme__nr)) { margin-top: 10px !important; font-size: 1.05rem; }

/* ---------- Kopfzeile mit Text rechts ---------- */

.mf-kopfzeile { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 64px; }
.mf-kopfzeile > * { margin: 0 !important; }
.mf-kopfzeile > :first-child { flex: 1; }
.mf-kopfzeile h2 { max-width: 20ch; }
.mf-kopfzeile__text { max-width: 30em; font-size: 1.05rem; line-height: 1.7; color: var(--wp--preset--color--grau-dunkel); }

.mf-textlink a { font-weight: 700; text-decoration: none; color: var(--wp--preset--color--tinte); border-bottom: 2px solid var(--wp--preset--color--akzent); padding-bottom: 4px; white-space: nowrap; }

/* ---------- Leistungskacheln ---------- */

.mf-leistungen {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--wp--preset--color--linie);
	border: 1px solid var(--wp--preset--color--linie);
}

.mf-leistungen > .mf-karte { margin: 0 !important; }

.mf-karte {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 280px;
	padding: 56px 56px 50px;
	background: var(--wp--preset--color--weiss);
	color: var(--wp--preset--color--tinte);
}

.mf-karte > * { margin: 0 !important; }
.mf-karte h3 { margin-top: 90px !important; font-size: clamp(1.35rem, 1.9vw, 1.75rem); }
.mf-karte p:where(:not(.mf-karte__nr)) { margin-top: 14px !important; color: var(--wp--preset--color--grau-dunkel); }
.mf-karte__nr { position: absolute; top: 56px; right: 56px; font-size: 0.8rem; letter-spacing: 0.04em; text-transform: uppercase; color: #6b7687; }

.mf-karte::before {
	content: "";
	position: absolute;
	top: 56px;
	left: 56px;
	width: 38px;
	height: 38px;
	background: var(--wp--preset--color--blau);
	-webkit-mask: var(--mf-icon) center / contain no-repeat;
	mask: var(--mf-icon) center / contain no-repeat;
}

.mf-karte--dunkel { background: var(--wp--preset--color--nacht); color: var(--wp--preset--color--weiss); }
.mf-karte--dunkel h3 { color: var(--wp--preset--color--weiss); }
.mf-karte--dunkel p:where(:not(.mf-karte__nr)) { color: #b6c2d3; }
.mf-karte--dunkel .mf-karte__nr { color: var(--wp--preset--color--blau-hell); }
.mf-karte--dunkel::before { background: var(--wp--preset--color--blau-hell); }

.mf-karte--blau { background: var(--wp--preset--color--blau); color: var(--wp--preset--color--weiss); }
.mf-karte--blau h3 { color: var(--wp--preset--color--weiss); }
.mf-karte--blau p:where(:not(.mf-karte__nr)) { color: #e6f0fc; }
.mf-karte--blau .mf-karte__nr { color: #d6e7fb; }
.mf-karte--blau::before { background: var(--wp--preset--color--weiss); }

/* Symbole als Masken (Linienzeichnungen, keine externe Schrift) */
.mf-icon-haus { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V10l8-6 8 6v11M10 21v-6h4v6'/%3E%3C/svg%3E"); }
.mf-icon-pruefung { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12v7a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h9M8 11l3 3 9-9'/%3E%3C/svg%3E"); }
.mf-icon-werkzeug { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0 5 5l-9.4 9.4a2 2 0 0 1-2.8-2.8z'/%3E%3Cpath d='M14.7 6.3 17 4l3 3-2.3 2.3'/%3E%3C/svg%3E"); }
.mf-icon-schild { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6zM9 12l2 2 4-4'/%3E%3C/svg%3E"); }
.mf-icon-pflanze { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21v-9M12 12c0-4 3-7 8-7 0 5-3 7-8 7zM12 14c0-3-2-5-6-5 0 4 2 5 6 5z'/%3E%3C/svg%3E"); }
.mf-icon-schluessel { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7.5' cy='16.5' r='3.5'/%3E%3Cpath d='M10 14l9-9M16 8l2 2M18 6l2 2'/%3E%3C/svg%3E"); }
.mf-icon-auge { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.mf-icon-schnee { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M4 7l16 10M20 7L4 17M9 3l3 3 3-3M9 21l3-3 3 3'/%3E%3C/svg%3E"); }
.mf-icon-telefon { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 3h4l2 5-2.5 1.5a11 11 0 0 0 6 6L16 13l5 2v4a2 2 0 0 1-2 2A17 17 0 0 1 3 5a2 2 0 0 1 2-2'/%3E%3C/svg%3E"); }
.mf-icon-daten { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19V9M10 19V5M16 19v-7M22 19H2'/%3E%3C/svg%3E"); }
.mf-icon-blatt { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19c0-9 6-14 15-14 0 9-5 15-14 15M5 19l7-7'/%3E%3C/svg%3E"); }
.mf-icon-chip { --mf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='6' width='12' height='12' rx='1'/%3E%3Cpath d='M9 2v4M15 2v4M9 18v4M15 18v4M2 9h4M2 15h4M18 9h4M18 15h4'/%3E%3C/svg%3E"); }

/* ---------- Digital ---------- */

.mf-funktionen { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 40px; margin-top: 3rem !important; }
.mf-funktionen > * { margin: 0 !important; }
.mf-funktionen > * > * { margin: 0 !important; }
.mf-funktionen h3 { font-size: 1.3rem; }
.mf-funktionen p { margin-top: 8px !important; }

.mf-portal { margin: 0; background: #fff; color: var(--wp--preset--color--tinte); border-radius: 8px; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45); }
.mf-portal__leiste { display: flex; align-items: center; gap: 10px; padding: 18px 26px; background: #f1f4f9; border-bottom: 1px solid var(--wp--preset--color--linie); }
.mf-portal__leiste i { width: 13px; height: 13px; border-radius: 50%; background: #ec6a5e; }
.mf-portal__leiste i:nth-child(2) { background: #f4bf4f; }
.mf-portal__leiste i:nth-child(3) { background: #61c554; }
.mf-portal__leiste span { margin-left: 22px; font-family: var(--wp--preset--font-family--mono); font-size: 0.88rem; color: #4c5667; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mf-portal__inhalt { padding: 26px; }
.mf-portal__kacheln { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.mf-portal__kacheln div { border: 1px solid var(--wp--preset--color--linie); border-radius: 4px; padding: 20px 20px 16px; }
.mf-portal__kacheln span { display: block; font-size: 0.85rem; color: var(--wp--preset--color--grau-dunkel); }
.mf-portal__kacheln strong { font-size: 2.3rem; letter-spacing: -0.02em; }
.mf-portal__kacheln em { margin-left: 6px; font-style: normal; font-size: 0.95rem; color: #9a6400; letter-spacing: 0; }
.mf-portal__tabelle { margin-top: 26px; border: 1px solid var(--wp--preset--color--linie); border-radius: 4px; overflow-x: auto; }
.mf-portal table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.mf-portal th { text-align: left; font: 600 0.74rem var(--wp--preset--font-family--mono); letter-spacing: 0.08em; text-transform: uppercase; color: #5b6676; background: #f5f7fb; padding: 16px 14px; }
.mf-portal td { padding: 18px 14px; border-top: 1px solid #e6ebf2; white-space: nowrap; }
.mf-portal td:nth-child(2) { white-space: normal; min-width: 180px; }
.mf-portal td:first-child { font-family: var(--wp--preset--font-family--mono); color: #5b6676; }
.mf-tag { font-size: 0.82rem; font-weight: 700; padding: 5px 10px; border-radius: 3px; }
.mf-tag--rot { background: #fde6e5; color: #b0291f; }
.mf-tag--gelb { background: #fdf1d6; color: #885800; }
.mf-tag--gruen { background: #dff5e8; color: #146c3d; }
.mf-portal__hinweis { margin: 14px 0 0; font-size: 0.8rem; color: #5b6676; }

/* ---------- Ansatz ---------- */

.mf-ansatz-kopf { grid-template-columns: 1.25fr 1fr; }
.mf-prozente { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; justify-self: end; }
.mf-prozente > * { margin: 0 !important; }
.mf-prozente > * > * { margin: 0 !important; }
.mf-prozent__wert { color: var(--wp--preset--color--akzent) !important; font-size: clamp(3.4rem, 6.5vw, 7rem); font-weight: 700; letter-spacing: -0.04em; line-height: 1; }
.mf-prozent__text { margin-top: 12px !important; font-size: 0.95rem; max-width: 20em; }

.mf-schritte { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin-top: 110px !important; }
.mf-schritte > * { margin: 0 !important; padding-top: 38px; border-top: 2px solid #1b4b7e; }
.mf-schritte > :first-child { border-color: var(--wp--preset--color--akzent); }
.mf-schritte > * > * { margin: 0 !important; }
.mf-schritt__nr { font-size: 0.92rem; text-transform: uppercase; color: var(--wp--preset--color--blau-hell) !important; }
.mf-schritte h3 { margin: 14px 0 18px !important; font-size: clamp(1.25rem, 1.8vw, 1.55rem); }
.mf-hell .mf-schritte > * { border-color: var(--wp--preset--color--linie); }
.mf-hell .mf-schritte > :first-child { border-color: var(--wp--preset--color--akzent); }
.mf-hell .mf-schritt__nr { color: var(--wp--preset--color--blau) !important; }
.mf-hell .mf-schritte p { color: var(--wp--preset--color--grau-dunkel); }

/* ---------- Kontaktbereich ---------- */

.mf-ablauf { display: grid; gap: 22px; margin-top: 3rem !important; }
.mf-ablauf > * { margin: 0 !important; display: grid; grid-template-columns: 52px 1fr; }
.mf-ablauf > * > * { margin: 0 !important; grid-column: 2; }
.mf-ablauf__nr { grid-column: 1 !important; grid-row: 1 / span 2; padding-top: 3px; color: var(--wp--preset--color--akzent) !important; }
.mf-ablauf h3 { font-size: 1.15rem; }

.mf-adresse { margin-top: 44px !important; padding-top: 34px; border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.98rem; line-height: 2.05; color: #c9d3e0 !important; }
.mf-weiss .mf-adresse, .mf-hell .mf-adresse { color: var(--wp--preset--color--grau-dunkel) !important; border-color: var(--wp--preset--color--linie); }

/* ---------- Werte, Standards (Über uns, Leistungen) ---------- */

.mf-raster-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 56px); }
.mf-raster-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(28px, 3vw, 40px); }
.mf-raster-3 > *, .mf-raster-4 > * { margin: 0 !important; }
.mf-raster-3 > * > *, .mf-raster-4 > * > * { margin: 0 !important; }

.mf-punkt { position: relative; padding-top: 70px; border-top: 1px solid var(--wp--preset--color--linie); }
.mf-dunkel .mf-punkt, .mf-mittel .mf-punkt { border-color: rgba(255, 255, 255, 0.12); }
.mf-punkt::before {
	content: "";
	position: absolute;
	top: 26px;
	left: 0;
	width: 30px;
	height: 30px;
	background: var(--wp--preset--color--blau);
	-webkit-mask: var(--mf-icon) center / contain no-repeat;
	mask: var(--mf-icon) center / contain no-repeat;
}
.mf-dunkel .mf-punkt::before, .mf-mittel .mf-punkt::before { background: var(--wp--preset--color--blau-hell); }
.mf-punkt h3 { font-size: 1.3rem; }
.mf-punkt p { margin-top: 10px !important; }
.mf-hell .mf-punkt p, .mf-weiss .mf-punkt p { color: var(--wp--preset--color--grau-dunkel); }

.mf-fliesstext { max-width: 46em; }
.mf-fliesstext p { font-size: 1.1rem; line-height: 1.75; }

/* ---------- Kontaktaufruf ---------- */

.mf-aufruf .mf-zwei { align-items: end; }
.mf-aufruf .wp-block-buttons { justify-content: flex-end; }

/* ---------- Rechtstexte (Standardseite) ---------- */

.mf-rechtstext { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--70); }
/* Lesebreite begrenzen, linksbündig an der Kante des Seitenkopfs */
.mf-rechtstext > * { max-width: 780px !important; margin-left: max(0px, calc((100% - 1480px) / 2)) !important; }
.mf-rechtstext h2 { font-size: 1.6rem; margin-top: 2.6rem; max-width: none; }
.mf-rechtstext h3 { font-size: 1.2rem; margin-top: 1.8rem; }
.mf-rechtstext p, .mf-rechtstext li { color: var(--wp--preset--color--grau-dunkel); }

/* ---------- Fuß ---------- */

.mf-fuss { background: var(--wp--preset--color--nacht); color: var(--wp--preset--color--grau); border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.95rem; }
.mf-fuss__oben { padding-top: 56px; padding-bottom: 40px; gap: 40px; }
.mf-fuss__oben > * { margin: 0 !important; }
.mf-fuss__unten { padding-top: 26px; padding-bottom: 36px; border-top: 1px solid rgba(255, 255, 255, 0.08); gap: 20px; }
.mf-fuss__unten > * { margin: 0 !important; }
.mf-fuss p { margin: 0; color: var(--wp--preset--color--grau); }
.mf-fuss a { color: #c9d3e0; text-decoration: none; }
.mf-fuss a:hover { color: var(--wp--preset--color--weiss); text-decoration: underline; }
.mf-fuss__links { display: flex; flex-wrap: wrap; gap: 14px 38px; }
.mf-fuss .mf-adresse { margin: 0 !important; padding: 0; border: 0; line-height: 1.9; }

/* ---------- Tablet ---------- */

@media (max-width: 1080px) {
	.mf-zwei, .mf-ansatz-kopf { grid-template-columns: 1fr; }
	.mf-prozente { justify-self: start; }
	.mf-schritte, .mf-raster-4 { grid-template-columns: 1fr 1fr; margin-top: 70px !important; }
	.mf-leistungen { grid-template-columns: 1fr 1fr; }
	.mf-raster-3 { grid-template-columns: 1fr; }
	.mf-karte { padding: 44px 40px 40px; }
	.mf-karte::before { top: 44px; left: 40px; }
	.mf-karte__nr { top: 44px; right: 40px; }
	.mf-aufruf .wp-block-buttons { justify-content: flex-start; }
}

/* ---------- Mobil ---------- */

@media (max-width: 720px) {
	.mf-hero { display: block; min-height: 0; }
	.mf-hero__bild { position: relative; inset: auto; height: 240px; margin-left: calc(var(--wp--style--root--padding-left) * -1) !important; margin-right: calc(var(--wp--style--root--padding-right) * -1) !important; }
	.mf-hero__bild img { object-position: center bottom; }
	.mf-hero__bild::before { background: linear-gradient(0deg, var(--wp--preset--color--nacht) 0%, rgba(8, 17, 31, 0) 60%); }
	.mf-status { display: none; }
	.mf-hero__text { padding-top: 10px; padding-bottom: 48px; }
	.mf-hero .mf-kicker--linie::before { display: none; }
	.mf-hero .wp-block-button { width: 100%; }
	.mf-hero .wp-block-button__link { width: 100%; }
	.mf-hero .wp-block-button.is-style-outline { display: none; }
	.mf-kennzahlen__raster { grid-template-columns: 1fr 1fr; }
	.mf-kennzahlen__raster > * { padding: 26px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
	.mf-kennzahlen__raster > :nth-child(3) { border-left: 0; }
	.mf-probleme > * { grid-template-columns: 64px 1fr; padding: 26px 0; }
	.mf-kopfzeile { flex-direction: column; align-items: flex-start; margin-bottom: 36px; }
	/* Leistungen als kompakte Liste wie im mobilen Entwurf */
	.mf-leistungen { grid-template-columns: 1fr; }
	.mf-karte { min-height: 0; padding: 16px 18px; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; }
	.mf-karte::before, .mf-karte p:where(:not(.mf-karte__nr)) { display: none; }
	.mf-karte h3 { margin: 0 !important; font-size: 1rem; }
	.mf-karte__nr { position: static; order: 2; font-size: 0.72rem; }
	.mf-funktionen { grid-template-columns: 1fr; gap: 22px; }
	.mf-portal__inhalt { padding: 18px; }
	.mf-portal__kacheln { grid-template-columns: 1fr; gap: 10px; }
	.mf-portal__kacheln strong { font-size: 1.8rem; }
	.mf-prozente { gap: 20px; }
	.mf-schritte, .mf-raster-4 { grid-template-columns: 1fr; gap: 32px; }
	.mf-schritte > * { padding-top: 24px; }
	.mf-fuss__unten { flex-direction: column; align-items: flex-start; }
}