/* ──────────────────────────────────────────────────────────────────────────
   MTP Manufaktur — Komponenten
   Umsetzung von design.md §4. Manufaktur-Ästhetik: wenig Rundung (2-4 px),
   reduzierte Schatten, Brass sparsam als Akzent.
   ────────────────────────────────────────────────────────────────────────── */

/* ── Caps-Label (Sektions-Titel, Footer-Heads) — surface-aware ───────────── */
/* Eyebrow (Instrument-Serif-italic) + .mtp-meta (Mono) liegen in surfaces.css. */

.mtp-label-caps {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	font-weight: 500;
	letter-spacing: var(--mtp-tracking-mono);
	text-transform: uppercase;
	color: var(--mtp-fg-quiet);
}

/* ── Artikelnummern (E00013, MTP102001) — surface-aware ───────────────────── */

.mtp-sku {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-sm);
	letter-spacing: var(--mtp-tracking-normal);
	color: var(--mtp-fg-muted);
}

/* ── Buttons (flach & leise — design.md §10) ─────────────────────────────── */
/* Padding md: 12px 24px. Radius sm (2 px). KEIN Verlauf, KEIN Glow. Surface-aware. */

.mtp-btn,
.entry-content .mtp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--mtp-space-2);
	padding: 12px 24px;
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-base);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.01em;
	border-radius: var(--mtp-radius-sm);
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: background-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				color var(--mtp-duration-fast) var(--mtp-ease-standard),
				border-color var(--mtp-duration-fast) var(--mtp-ease-standard);
}

.mtp-btn--sm { padding: 8px 16px; font-size: var(--mtp-text-sm); }
.mtp-btn--lg { padding: 16px 32px; font-size: var(--mtp-text-lg); }

/* Primary: glänzender Brass-Verlauf + Glow (design.md §10, Mockup-Override
   2026-05-21 — ersetzt das frühere „flach & leise"). Dunkler Text für Kontrast
   auf dem hellen Verlauf; auf beiden Surfaces gleich. */
.mtp-btn--primary {
	background: linear-gradient(180deg, #e3ca77 0%, var(--mtp-brass-500) 55%, var(--mtp-brass-deep) 100%);
	color: #1a1408;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.4) inset,
		0 -1px 0 rgba(0, 0, 0, 0.25) inset,
		0 12px 32px -14px rgba(216, 196, 104, 0.55);
	transition: transform var(--mtp-duration-fast) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-base) var(--mtp-ease-standard);
}
.mtp-btn--primary:hover,
.mtp-btn--primary:focus {
	color: #1a1408;
	transform: translateY(-1px);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.5) inset,
		0 -1px 0 rgba(0, 0, 0, 0.25) inset,
		0 16px 38px -14px rgba(216, 196, 104, 0.65);
}

/* Secondary: Outline in der Vordergrundfarbe (kippt mit der Surface). */
.mtp-btn--secondary {
	background-color: transparent;
	color: var(--mtp-fg-strong);
	border-color: var(--mtp-rule-strong);
}
.mtp-btn--secondary:hover,
.mtp-btn--secondary:focus {
	border-color: var(--mtp-fg-strong);
	color: var(--mtp-fg-strong);
}

/* Ghost: nur Brass-Text, dezenter Hover (surface-aware). */
.mtp-btn--ghost {
	background-color: transparent;
	color: var(--mtp-accent);
}
.mtp-btn--ghost:hover,
.mtp-btn--ghost:focus {
	color: var(--mtp-accent-hover);
}

/* Danger: Form-State (unverändert). */
.mtp-btn--danger {
	background-color: var(--mtp-danger);
	color: #ffffff;
}
.mtp-btn--danger:hover,
.mtp-btn--danger:focus {
	background-color: #7e2424;
	color: #ffffff;
}

/* ── Cards ───────────────────────────────────────────────────────────────── */

.mtp-card {
	background-color: var(--mtp-surface-card);
	border: 1px solid var(--mtp-rule);
	border-radius: var(--mtp-radius-md);
	padding: var(--mtp-space-4);
	transition: border-color var(--mtp-duration-base) var(--mtp-ease-standard),
				transform var(--mtp-duration-base) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-base) var(--mtp-ease-standard);
}
@media (min-width: 640px) {
	.mtp-card { padding: var(--mtp-space-6); }
}
.mtp-card:hover {
	border-color: var(--mtp-rule-strong);
	transform: translateY(-2px);
	box-shadow: var(--mtp-shadow-card);
}
.mtp-card__title {
	font-family: var(--mtp-font-display);
	font-size: var(--mtp-text-2xl);
	font-weight: 400;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-fg-strong);
	margin-block-end: var(--mtp-space-2);
}
.mtp-card__meta {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-sm);
	color: var(--mtp-fg-muted);
	margin-block-end: var(--mtp-space-3);
}

/* ── Forms ───────────────────────────────────────────────────────────────── */
/* Astra/Spectra-Forms überschreiben — höhere Spezifität via body. */

body input[type="text"],
body input[type="email"],
body input[type="url"],
body input[type="password"],
body input[type="search"],
body input[type="tel"],
body input[type="number"],
body input[type="date"],
body textarea,
body select {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-base);
	color: var(--mtp-fg-strong);
	background-color: var(--mtp-surface-card);
	border: 1px solid var(--mtp-rule-strong);
	border-radius: var(--mtp-radius-sm);
	padding: 12px 16px;
	transition: border-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-fast) var(--mtp-ease-standard);
}

body input[type="text"]:focus,
body input[type="email"]:focus,
body input[type="url"]:focus,
body input[type="password"]:focus,
body input[type="search"]:focus,
body input[type="tel"]:focus,
body input[type="number"]:focus,
body input[type="date"]:focus,
body textarea:focus,
body select:focus {
	border-color: var(--mtp-accent);
	box-shadow: 0 0 0 2px rgba(176, 151, 16, 0.25);
	outline: none;
}

body label,
body .form-label {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	font-weight: 500;
	color: var(--mtp-fg-muted);
	letter-spacing: var(--mtp-tracking-wide);
	display: block;
	margin-block-end: var(--mtp-space-1);
}

.mtp-form-error {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	color: var(--mtp-danger);
	margin-block-start: var(--mtp-space-1);
}

/* ── Header / Navigation — adaptiver Dark→Light-Swap (design.md §10) ──────── */
/* Default-Look HELL (Funktions-/Rechtsseiten + Fallback). Auf Dark-Hero-Seiten
   (body.mtp-has-dark-hero) startet der Header DUNKEL und wird HELL, sobald
   sticky-header.js .is-light setzt (Sentinel in der Naht). KEINE background-color-
   Transition (Chrome stockt bei sticky + backdrop-filter): harter Swap, nur
   border/shadow/color animiert. Logo wächst bei .is-scrolled (Chef-Wunsch). */

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	/* Default: HELL */
	background-color: rgba(250, 248, 242, 0.92);
	backdrop-filter: saturate(160%) blur(12px);
	-webkit-backdrop-filter: saturate(160%) blur(12px);
	border-bottom: 1px solid transparent;
	box-shadow: 0 10px 28px -22px rgba(23, 22, 23, 0.35);
	transition:
		border-color 250ms var(--mtp-ease-standard),
		box-shadow 250ms var(--mtp-ease-standard),
		color 250ms var(--mtp-ease-standard);
	will-change: transform;
}
.site-header::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 1px;
	pointer-events: none;
	background: linear-gradient(90deg,
		rgba(23, 22, 23, 0),
		rgba(23, 22, 23, 0.16) 18%,
		rgba(23, 22, 23, 0.10) 82%,
		rgba(23, 22, 23, 0));
	opacity: 0.8;
}

/* Homepage-v2 header geometry: Vorlage nutzt 88px Chrome, schwarze Brand-Zone
   und eine breite, ruhige Zeile ohne Astra-Default-Padding. */
.site-header .main-header-bar,
.site-header .ast-primary-header-bar {
	min-height: var(--mtp-header-h);
	padding-block: 0 !important;
}
.site-header .main-header-container,
.site-header .ast-container {
	min-height: var(--mtp-header-h);
}
#masthead .ast-container,
#masthead .ast-header-breadcrumb .ast-container {
	max-width: var(--mtp-maxw);
	padding-inline: var(--mtp-gutter);
}
.site-header .ast-flex.main-header-container {
	align-items: center;
}

/* Astras innere Bars transparent — der BG kommt von .site-header. */
.ast-primary-header-bar,
.site-header .main-header-bar,
.site-header .ast-primary-header-bar {
	background: transparent !important;
	border-bottom: 0 !important;
}

/* Dark-Hero-Seiten: Header startet DUNKEL über dem Hero (bis JS .is-light setzt). */
body.mtp-has-dark-hero .site-header:not(.is-light) {
	background-color: var(--mtp-ink-0);
	border-bottom-color: transparent;
	box-shadow: 0 18px 44px -38px rgba(0, 0, 0, 0.9);
}
body.mtp-has-dark-hero .site-header:not(.is-light)::after {
	background: linear-gradient(90deg,
		rgba(216, 196, 104, 0),
		rgba(216, 196, 104, 0.24) 20%,
		rgba(232, 226, 207, 0.10) 50%,
		rgba(216, 196, 104, 0.24) 80%,
		rgba(216, 196, 104, 0));
	opacity: 0.62;
}

/* Nav-/Branding-Typo + Default-Farbe (Light-Header). */
.main-header-menu > .menu-item > .menu-link,
.main-navigation ul li a,
.ast-builder-menu .menu-link,
.site-header .site-title a {
	font-family: var(--mtp-font-ui);
	font-weight: 500;
	font-size: var(--mtp-text-base);
	color: var(--mtp-ink-700);
	letter-spacing: var(--mtp-tracking-normal);
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.main-header-menu > .menu-item > .menu-link:hover,
.main-header-menu > .menu-item.current-menu-item > .menu-link,
.main-navigation ul li a:hover,
.ast-builder-menu .menu-link:hover {
	color: var(--mtp-ink-900);
}

/* Dark-Header: Nav-Text hell, Hover/aktiv Brass-Light. */
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item > .menu-link,
body.mtp-has-dark-hero .site-header:not(.is-light) .main-navigation ul li a,
body.mtp-has-dark-hero .site-header:not(.is-light) .ast-builder-menu .menu-link,
body.mtp-has-dark-hero .site-header:not(.is-light) .site-title a {
	color: var(--mtp-paper);
}
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item > .menu-link:hover,
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item.current-menu-item > .menu-link,
body.mtp-has-dark-hero .site-header:not(.is-light) .main-navigation ul li a:hover,
body.mtp-has-dark-hero .site-header:not(.is-light) .ast-builder-menu .menu-link:hover {
	color: var(--mtp-brass-light);
}

/* Header-Bar bleibt beim Scrollen schlank; nur das Logo animiert leicht größer. */
.site-header .main-header-bar,
.site-header .ast-primary-header-bar {
	transition: padding-block 280ms var(--mtp-ease-standard);
}
.site-header.is-scrolled .main-header-bar,
.site-header.is-scrolled .ast-primary-header-bar {
	padding-block: 0 !important;
}

/* Logo wächst beim Scrollen (bestehendes Sticky-Header-Verhalten), bleibt aber
   im neuen Header-Lockup vertikal sauber ausgerichtet. */
.site-header .custom-logo {
	max-height: 60px !important;
	width: auto !important;
	height: auto !important;
	transition:
		max-height 280ms var(--mtp-ease-standard),
		transform 280ms var(--mtp-ease-standard);
}
.site-header.is-scrolled .custom-logo {
	max-height: 60px !important;
}
@media (max-width: 921px) {
	.site-header .custom-logo { max-height: 48px !important; }
	.site-header.is-scrolled .custom-logo {
		max-height: 48px !important;
	}
}

/* WP-Admin-Bar Offset (für eingeloggte Editoren). */
body.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) {
	body.admin-bar .site-header { top: 46px; }
}

/* Nav-Items: subtle underline-grow on hover (surface-aware Brass). */
.site-header .main-header-menu > .menu-item > .menu-link {
	position: relative;
	padding-block: 0 3px !important;
}
.site-header .main-header-menu {
	gap: clamp(22px, 2.5vw, 36px);
	align-items: center;
}
.site-header .main-header-menu > .menu-item {
	display: flex;
	align-items: center;
}
.site-header .main-header-menu > .menu-item > .menu-link {
	display: inline-flex !important;
	align-items: center;
	height: auto !important;
	min-height: 0 !important;
	padding-inline: 0 !important;
	font-size: 14px;
	line-height: 1.15 !important;
}
.site-header .main-header-menu > .menu-item.mtp-template-nav-item > .menu-link::after {
	bottom: 0;
}
.site-header .main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: var(--mtp-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 320ms var(--mtp-ease-standard);
}
.site-header .main-header-menu > .menu-item > .menu-link:hover::after,
.site-header .main-header-menu > .menu-item.current-menu-item > .menu-link::after,
.site-header .main-header-menu > .menu-item.current-menu-ancestor > .menu-link::after {
	transform: scaleX(1);
}
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item > .menu-link::after {
	background: var(--mtp-brass-light);
}

/* Aktiver Nav-Eintrag: Brass-Farbe + dauerhafte Underline (Vorlage .is-active).
   current-menu-ancestor deckt das Eltern-Item ab, wenn eine Subseite aktiv ist. */
.site-header .main-header-menu > .menu-item.current-menu-item > .menu-link,
.site-header .main-header-menu > .menu-item.current-menu-ancestor > .menu-link {
	color: var(--mtp-brass-deep);
}
.site-header .main-header-menu > .menu-item.current-menu-item > .menu-link::after,
.site-header .main-header-menu > .menu-item.current-menu-ancestor > .menu-link::after {
	background: var(--mtp-brass-deep);
}
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item.current-menu-item > .menu-link,
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu > .menu-item.current-menu-ancestor > .menu-link {
	color: var(--mtp-brass-light);
}

/* Reduce-Motion-Friendly */
@media (prefers-reduced-motion: reduce) {
	.site-header,
	.site-header .custom-logo,
	.site-header .custom-logo-link,
	.site-header .main-header-bar,
	.site-header .ast-primary-header-bar,
	.site-header .main-header-menu > .menu-item > .menu-link::after { transition: none; }
}

/* ── Header-End-Zone: DE/EN-Indikator + B2B-Login (rechts, abgesetzt) ──────── */
/* Liegen im selben #primary-menu wie die Nav (per wp_nav_menu_items), sind aber
   eigene Items: kein Underline-Grow, eigener Look. margin-left auf dem ersten
   End-Item setzt die Zone von den Nav-Labels ab (Vorlage homepage-v2). */
.site-header .main-header-menu > .menu-item.mtp-header-extra {
	display: flex;
	align-items: center;
}
.site-header .main-header-menu > .menu-item.mtp-header-lang {
	margin-left: clamp(18px, 3vw, 42px);
}
.site-header .main-header-menu > .menu-item.mtp-header-login {
	margin-left: clamp(14px, 1.6vw, 24px);
}
.site-header .mtp-lang {
	font-family: var(--mtp-font-mono);
	font-size: 11.5px;
	letter-spacing: 0.06em;
	color: var(--mtp-ink-muted);
	white-space: nowrap;
	transition: color 250ms var(--mtp-ease-standard);
}
.site-header .mtp-login-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-family: var(--mtp-font-ui);
	font-weight: 500;
	font-size: 14px;
	border-bottom: 1px solid currentColor;
	padding: 0 0 3px !important;
	height: auto !important;
	min-height: 0 !important;
	line-height: 1.15 !important;
	white-space: nowrap;
	transition: color 250ms var(--mtp-ease-standard);
}
.site-header .mtp-login-link__arrow {
	position: relative;
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-left: 1px;
	font-size: 0;
	color: currentColor;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: translateY(-1px);
}
.site-header .mtp-login-link__arrow::after {
	content: "";
	position: absolute;
	right: -1px;
	top: 1px;
	width: 11px;
	height: 1.5px;
	background: currentColor;
	transform: rotate(-45deg);
	transform-origin: right center;
}

/* Login-Farbe braucht Nav-Ketten-Spezifität, sonst gewinnt Astras
   `.main-navigation ul li a` (gleiche Klassen-Tiefe, mehr Element-Selektoren)
   und färbt den Link paper statt Brass. */
.site-header .main-header-menu .mtp-header-login .mtp-login-link {
	color: var(--mtp-brass-deep);
}
.site-header .main-header-menu .mtp-header-login .mtp-login-link:hover {
	color: var(--mtp-brass-deeper);
}

/* Dark-Header (über dunklem Hero, vor dem Light-Swap). */
body.mtp-has-dark-hero .site-header:not(.is-light) .mtp-lang {
	color: var(--mtp-paper-muted);
}
body.mtp-has-dark-hero .site-header:not(.is-light) .main-header-menu .mtp-header-login .mtp-login-link {
	color: var(--mtp-brass-light);
}

/* Mobile (Astra-Burger, < 921px): End-Items erscheinen im Off-Canvas-Menü —
   margin-left zurücknehmen, damit sie bündig in der Liste sitzen. */
@media (max-width: 921px) {
	.site-header .main-header-menu > .menu-item.mtp-header-lang { margin-left: 0; }
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
/* Modern minimalistisch: Brand-Spalte + Service + Company/Social, getrennte
   Below-Bar mit Copyright + Rechts-Links. Astras Default-Footer-Bar wird
   in functions.php via astra_footer_html-Action ersetzt. */

.site-footer,
.ast-footer-overlay,
.mtp-footer {
	background-color: var(--mtp-surface-contrast) !important;
	color: var(--mtp-ink-200);
}

.site-footer a,
.site-footer .widget-title,
.ast-footer-overlay a,
.mtp-footer a {
	color: var(--mtp-ink-100);
}

.site-footer a:hover,
.ast-footer-overlay a:hover,
.mtp-footer a:hover {
	color: var(--mtp-brass-300);
}

.mtp-footer {
	padding-block: clamp(48px, 6vw, 80px) 28px;
	padding-inline: clamp(20px, 4vw, 48px);
}

.mtp-footer__container {
	max-width: var(--mtp-container-wide, 1200px);
	margin-inline: auto;
}

.mtp-footer__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	padding-block-end: 56px;
}
@media (min-width: 768px) {
	.mtp-footer__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
	.mtp-footer__grid {
		grid-template-columns: 1.6fr 1fr 1fr;
		gap: 64px;
	}
}

.mtp-footer__brand-logo {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	text-decoration: none;
	margin-block-end: 20px;
}
.mtp-footer__brand-logo img {
	height: 44px;
	width: auto;
}
.mtp-footer__brand-mark {
	display: flex;
	flex-direction: column;
	line-height: 1;
}
.mtp-footer__brand-mark .mark-name {
	font-family: var(--mtp-font-heading);
	font-size: 20px;
	color: var(--mtp-ink-100) !important;
	letter-spacing: 0.02em;
}
.mtp-footer__brand-mark .mark-sub {
	font-family: var(--mtp-font-mono);
	font-size: 9px;
	margin-top: 6px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--mtp-ink-400) !important;
}

.mtp-footer__tagline {
	font-size: 14px;
	color: var(--mtp-ink-300);
	max-width: 36ch;
	margin-block: 0 22px;
	line-height: 1.65;
}

.mtp-footer__address {
	font-style: normal;
	font-size: 14px;
	color: var(--mtp-ink-300);
	line-height: 1.7;
	margin-block-end: 16px;
}

.mtp-footer__contact-links {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.mtp-footer__contact-links a {
	font-size: 14px;
	text-decoration: none;
	transition: color 220ms ease;
}

.mtp-footer__col-title {
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mtp-ink-400) !important;
	margin-block: 0 20px;
}
.mtp-footer__col-title:not(:first-of-type) {
	margin-block-start: 32px;
}

.mtp-footer__nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.mtp-footer__nav a {
	font-size: 14px;
	text-decoration: none;
	transition: color 220ms ease;
}

.mtp-footer__social {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 12px;
}
.mtp-footer__social a {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--mtp-ink-600);
	color: var(--mtp-ink-300) !important;
	transition: border-color 220ms ease, color 220ms ease, background-color 220ms ease;
}
.mtp-footer__social a:hover {
	border-color: var(--mtp-brass-500);
	color: var(--mtp-brass-300) !important;
}
.mtp-footer__social svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

.mtp-footer__bottom {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding-block-start: 28px;
	border-top: 1px solid var(--mtp-ink-700);
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mtp-ink-400);
}
@media (min-width: 640px) {
	.mtp-footer__bottom {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
}
.mtp-footer__legal {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
}
.mtp-footer__legal a {
	text-decoration: none;
	color: var(--mtp-ink-300);
	transition: color 220ms ease;
}
.mtp-footer__legal a:hover { color: var(--mtp-ink-100); }

/* Astras Default-Footer ausblenden (wir rendern unseren eigenen). */
.footer-sml-layout-1,
.footer-sml-layout-2,
.ast-footer-copyright,
.site-info,
.ast-footer-overlay,
.site-footer:not(.mtp-footer) {
	display: none !important;
}

/* Astra-Default-Page-Wrapper: 64px Margin top/bottom raus, weil unsere
   Patterns selbst ihre Section-Paddings mitbringen und Hero auf alignfull
   sonst von Paper-Streifen umgeben wäre. */
.page #primary,
.single-page #primary,
.home #primary,
body.page #primary,
body.home #primary {
	margin-block: 0;
}

/* Auch der Astra-Container hat 20px padding-block — auf Pattern-Pages weg. */
body.page .site-content > .ast-container,
body.home .site-content > .ast-container {
	padding-block: 0;
}

/* Dark-Hero-Seiten: dunkler Auftakt sitzt bündig unter dem Header — kein
   Paper-Streifen. Die statische Front-Page bekommt body.page (NICHT body.home —
   das hat /news/), daher hier über body.mtp-has-dark-hero robust greifen und
   jedes Astra-Wrapper-Top-Spacing (content/primary/container/entry) nullen. */
body.mtp-has-dark-hero #content,
body.mtp-has-dark-hero #primary,
body.mtp-has-dark-hero .site-content > .ast-container,
body.mtp-has-dark-hero .entry-content {
	padding-block-start: 0 !important;
	margin-block-start: 0 !important;
}
/* Astras .ast-separate-container rendert den Artikel als weiße Karte mit ~6vw
   Top-Padding + Box-Shadow — genau der weiße Streifen über dem Hero. Auf
   Dark-Hero-Seiten: Top-Padding + Karte weg, Paper als Grund der Light-Zone. */
body.mtp-has-dark-hero .ast-article-single {
	padding-block-start: 0 !important;
	background: var(--mtp-surface-paper) !important;
	box-shadow: none !important;
}

/* ── Container-Limits (Page-Builder + klassische Pages) ──────────────────── */

/* Astras Page-Builder-Template lässt .site-content auf 100% — wir begrenzen
   den Standard-Content auf 1200 px, aber lassen Hero-Sections opt-in mit
   .alignfull/.alignwide volle Breite gehen (Gutenberg/Spectra-Konvention). */
body.ast-page-builder-template .site-content > .ast-container,
body.ast-plain-container .site-content > .ast-container,
body.ast-page-builder-template .entry-content > :not(.alignfull):not(.alignwide),
body.ast-page-builder-template .entry-content .wp-block-group:not(.alignfull):not(.alignwide) {
	max-width: var(--mtp-container-content);
	margin-inline: auto;
}

/* .alignwide = etwas breiter als Content, schmaler als full */
body.ast-page-builder-template .entry-content > .alignwide {
	max-width: var(--mtp-container-wide);
	margin-inline: auto;
}

/* ── Spectra-Block-Container-Defaults (Sections) ─────────────────────────── */

.wp-block-uagb-container:not(.uagb-is-root-container),
.wp-block-uagb-section:not(.uagb-is-root-container) {
	max-width: var(--mtp-container-content);
}

/* Gutenberg-Block-Editor inherited paddings auf unsere Spacing-Skala. */
.wp-block-buttons .wp-block-button__link {
	border-radius: var(--mtp-radius-sm);
	padding: 12px 24px;
	font-family: var(--mtp-font-ui);
	font-weight: 600;
}

/* ── Block-Styles für core/button (in functions.php registriert) ─────────── */
/* Spiegeln die .mtp-btn-Varianten, surface-aware (design.md §10). Primary
   glänzend (Verlauf + Glow, Mockup-Override 2026-05-21), Secondary/Ghost leise. */

.wp-block-button.is-style-mtp-primary .wp-block-button__link {
	background: linear-gradient(180deg, #e3ca77 0%, var(--mtp-brass-500) 55%, var(--mtp-brass-deep) 100%);
	color: #1a1408;
	border: 1px solid transparent;
	padding: 16px 26px;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.4) inset,
		0 -1px 0 rgba(0, 0, 0, 0.25) inset,
		0 12px 32px -14px rgba(216, 196, 104, 0.55);
	transition: transform var(--mtp-duration-fast) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-base) var(--mtp-ease-standard);
}
.wp-block-button.is-style-mtp-primary .wp-block-button__link:hover,
.wp-block-button.is-style-mtp-primary .wp-block-button__link:focus {
	color: #1a1408;
	transform: translateY(-1px);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.5) inset,
		0 -1px 0 rgba(0, 0, 0, 0.25) inset,
		0 16px 38px -14px rgba(216, 196, 104, 0.65);
}

.wp-block-button.is-style-mtp-secondary .wp-block-button__link {
	background-color: transparent;
	color: var(--mtp-fg-strong);
	border: 1px solid var(--mtp-rule-strong);
	transition: border-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.wp-block-button.is-style-mtp-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-mtp-secondary .wp-block-button__link:focus {
	border-color: var(--mtp-fg-strong);
	color: var(--mtp-fg-strong);
}

.wp-block-button.is-style-mtp-ghost .wp-block-button__link {
	background-color: transparent;
	color: var(--mtp-accent);
	padding-inline: 0;
	border: none;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.wp-block-button.is-style-mtp-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-mtp-ghost .wp-block-button__link:focus {
	color: var(--mtp-accent-hover);
}

/* ── Site-Branding: Logo + Mono-Brand-Lockup ─────────────────────────────── */
/* Astras Site-Title-Schriftzug ist per astra_logo-Filter (functions.php) durch
   ein zweizeiliges Mono-Lockup ersetzt: „Manufaktur / Dettenhausen · DE",
   abgesetzt mit Brass-getöntem Trenner links (Vorlage homepage-v2). Tagline aus. */

.site-header .ast-site-identity {
	display: flex;
	align-items: center;
	gap: 16px;
}
.site-header .site-description {
	display: none !important;
}

.site-header .mtp-brand-lockup {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	padding-left: 16px;
	border-left: 1px solid var(--mtp-rule-l-strong);
	font-family: var(--mtp-font-mono);
	font-size: 10.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	line-height: 1.5;
	color: var(--mtp-ink-muted);
	transition:
		color 250ms var(--mtp-ease-standard),
		border-color 250ms var(--mtp-ease-standard);
}
.site-header .mtp-brand-lockup__loc {
	opacity: 0.82;
}

/* Dark-Header (über dunklem Hero, vor dem Light-Swap): Lockup hell-gedämpft. */
body.mtp-has-dark-hero .site-header:not(.is-light) .mtp-brand-lockup {
	color: var(--mtp-paper-muted);
	border-left-color: var(--mtp-rule-d-strong);
}

@media (max-width: 921px) {
	.site-header .ast-site-identity { gap: 12px; }
}
@media (max-width: 600px) {
	.site-header .mtp-brand-lockup { display: none; }
}

/* Custom-Logo-Link: saubere Vertikal-Alignment. */
.site-header .custom-logo-link {
	display: inline-flex;
	align-items: center;
	transform: scale(1) !important;
	transform-origin: left center;
	transition: transform 280ms var(--mtp-ease-standard);
}
.site-header.is-scrolled .custom-logo-link {
	transform: scale(1.12) !important;
}
@media (max-width: 921px) {
	.site-header.is-scrolled .custom-logo-link {
		transform: scale(1.1) !important;
	}
}

/* ── Händlerkarte (Shortcode [mtp-haendlerkarte]) ────────────────────────── */
/* Code adaptiert aus archive/web-astro/src/components/HaendlerMap.astro. */

.mtp-hmap {
	position: relative;
	background-color: var(--mtp-surface-sunken);
	border: 1px solid var(--mtp-ink-200);
	border-radius: var(--mtp-radius-md);
	overflow: hidden;
}
.mtp-hmap__canvas {
	position: absolute;
	inset: 0;
}
.mtp-hmap .leaflet-container {
	background: var(--mtp-surface-sunken);
	font-family: var(--mtp-font-body);
}
.mtp-hmap__loading {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	color: var(--mtp-ink-400);
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}
.mtp-hmap.is-ready .mtp-hmap__loading {
	display: none;
}

/* Brass-Pin (CSS-only, kein Bild). */
.mtp-hmap__pin {
	width: 28px;
	height: 28px;
	margin-left: -14px;
	margin-top: -28px;
	position: relative;
}
.mtp-hmap__pin::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--mtp-brass-500);
	border: 2px solid var(--mtp-ink-800);
	border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg);
	transform-origin: center;
	box-shadow: 0 2px 6px rgba(23, 22, 23, 0.35);
}
.mtp-hmap__pin::after {
	content: "";
	position: absolute;
	width: 8px;
	height: 8px;
	margin: auto;
	background: var(--mtp-ink-800);
	border-radius: 50%;
	top: 4px;
	left: 0;
	right: 0;
	z-index: 1;
}

/* Cluster-Bubbles (Markercluster Default-Styling überschreiben). */
.mtp-hmap .marker-cluster {
	background-color: transparent;
}
.mtp-hmap .marker-cluster div {
	background-color: var(--mtp-brass-500);
	color: var(--mtp-ink-900);
	font-family: var(--mtp-font-mono);
	font-weight: 500;
	border: 2px solid var(--mtp-ink-800);
	box-shadow: 0 2px 8px rgba(23, 22, 23, 0.25);
}
.mtp-hmap .marker-cluster-small div  { background-color: var(--mtp-brass-300); }
.mtp-hmap .marker-cluster-medium div { background-color: var(--mtp-brass-400); }
.mtp-hmap .marker-cluster-large div  {
	background-color: var(--mtp-brass-600);
	color: var(--mtp-surface-paper);
}

/* Popup-Style. */
.mtp-hmap .leaflet-popup-content-wrapper {
	background: var(--mtp-surface-canvas);
	color: var(--mtp-ink-700);
	border-radius: var(--mtp-radius-md);
	box-shadow: var(--mtp-shadow-lg);
	padding: 4px;
}
.mtp-hmap .leaflet-popup-tip {
	background: var(--mtp-surface-canvas);
}
.mtp-hmap .leaflet-popup-content {
	margin: 14px 18px;
	font-size: var(--mtp-text-sm);
	line-height: 1.55;
}
.mtp-hmap__popup-country {
	font-family: var(--mtp-font-mono);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--mtp-ink-400);
	margin-block-end: 6px;
	display: block;
}
.mtp-hmap__popup-name {
	font-family: var(--mtp-font-heading);
	font-size: 17px;
	line-height: 1.2;
	color: var(--mtp-ink-800);
	margin-block-end: 6px;
}
.mtp-hmap__popup-addr {
	color: var(--mtp-ink-600);
}
.mtp-hmap__popup-meta {
	margin-block-start: 8px;
	font-size: var(--mtp-text-sm);
}
.mtp-hmap__popup-meta a {
	color: var(--mtp-brass-700);
	text-decoration: none;
	border-bottom: 1px solid var(--mtp-brass-300);
}
.mtp-hmap__popup-meta a:hover {
	color: var(--mtp-brass-800);
}
.mtp-hmap__popup-label {
	font-family: var(--mtp-font-mono);
	font-size: 10px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--mtp-ink-400);
	margin-inline-end: 6px;
}

/* Leaflet-Controls auf Brand-Look. */
.mtp-hmap .leaflet-control-zoom a {
	background: var(--mtp-surface-canvas);
	color: var(--mtp-ink-700);
	border-color: var(--mtp-ink-200);
}
.mtp-hmap .leaflet-control-zoom a:hover {
	background: var(--mtp-surface-sunken);
}
.mtp-hmap .leaflet-control-attribution {
	background: rgba(250, 248, 242, 0.85);
	font-size: 10px;
	color: var(--mtp-ink-500);
}
.mtp-hmap .leaflet-control-attribution a {
	color: var(--mtp-ink-600);
}

/* ── News-Archive (home.php) ─────────────────────────────────────────────── */
/* /news/ — Posts-Page mit 3-Spalten-Cards-Grid. Astra rendert home.php innerhalb
   .ast-container (max-width: 1200 px aus Customizer). */

.mtp-news-archive {
	padding-block: clamp(40px, 6vw, 72px) clamp(48px, 7vw, 96px);
}

.mtp-news-archive__hero {
	max-width: 760px;
	margin-block-end: clamp(32px, 4vw, 56px);
}

.mtp-news-archive__title {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(40px, 5.5vw, 64px);
	line-height: 1.08;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-fg-strong);
	margin-block: 14px 18px;
}

.mtp-news-archive__intro {
	font-size: var(--mtp-text-lg);
	line-height: 1.6;
	color: var(--mtp-fg-muted);
	max-width: 60ch;
	margin: 0;
}

.mtp-news-archive__empty {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-lg);
	color: var(--mtp-fg-quiet);
	padding-block: var(--mtp-space-16);
	text-align: center;
}

/* ── News-Cards-Grid (gemeinsam für home.php + Home-Pattern) ─────────────── */

.mtp-news-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(28px, 3vw, 40px);
}
@media (min-width: 640px) {
	.mtp-news-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 960px) {
	.mtp-news-grid { grid-template-columns: repeat(3, 1fr); }
}

/* core/post-template als Grid-Cards-Layout. WP-Core kann `is-flex-container
   columns-N`-Klassen aus alter displayLayout-API anhängen — Selektor-Spezifität
   hoch genug, um display:grid durchzusetzen, statt mit !important zu kämpfen. */
.wp-block-query .wp-block-post-template.mtp-news-grid,
.mtp-news-section__loop .wp-block-post-template.mtp-news-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(28px, 3vw, 40px);
	padding: 0;
	list-style: none;
	margin: 0;
}
@media (min-width: 640px) {
	.wp-block-query .wp-block-post-template.mtp-news-grid,
	.mtp-news-section__loop .wp-block-post-template.mtp-news-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (min-width: 960px) {
	.wp-block-query .wp-block-post-template.mtp-news-grid,
	.mtp-news-section__loop .wp-block-post-template.mtp-news-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
/* Astras post_class() hängt .ast-article-single an jedes <li> der Query-Loop —
   bringt unerwartet ~6vw padding mit. Innerhalb des News-Grids resetten.
   WP-Core .has-global-padding nutzt sehr hohe Specificity via CSS-Variablen,
   daher hier !important auf der Reset-Schicht — sauberer als sich gegen das
   Spec-Layering zu verheben. */
.wp-block-post-template.mtp-news-grid > li {
	margin: 0 !important;
	padding: 0 !important;
	min-width: 0;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}
.wp-block-post-template.mtp-news-grid > li > .mtp-news-card,
.wp-block-post-template.mtp-news-grid .mtp-news-card {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0;
}
.wp-block-post-template.mtp-news-grid .mtp-news-card > .wp-block-group__inner-container {
	width: 100%;
	max-width: none;
}

.mtp-news-card {
	background: transparent;
	border: none;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.mtp-news-card__media {
	display: block;
	overflow: hidden;
	border-radius: var(--mtp-radius-sm);
	background: var(--mtp-surface-sunken);
	aspect-ratio: 4 / 3;
}
.mtp-news-card__media img,
.mtp-news-card__img,
.mtp-news-card .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 480ms cubic-bezier(0.2, 0.7, 0.2, 1);
}
.mtp-news-card .wp-block-post-featured-image {
	margin: 0;
	overflow: hidden;
	border-radius: var(--mtp-radius-sm);
	aspect-ratio: 4 / 3;
	background: var(--mtp-surface-sunken);
}
.mtp-news-card .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}
.mtp-news-card:hover .mtp-news-card__img,
.mtp-news-card:hover .wp-block-post-featured-image img {
	transform: scale(1.03);
}

.mtp-news-card__body {
	padding-top: 20px;
}

.mtp-news-card__date,
.mtp-news-card .wp-block-post-date,
.mtp-news-card .wp-block-post-date time {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	letter-spacing: var(--mtp-tracking-mono);
	text-transform: uppercase;
	color: var(--mtp-fg-muted);
	display: block;
	margin: 0;
}

.mtp-news-card__title,
.mtp-news-card .wp-block-post-title {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(24px, 2.2vw, 30px);
	line-height: 1.12;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-fg-strong);
	margin: 10px 0 12px;
}
.mtp-news-card__title a,
.mtp-news-card .wp-block-post-title a {
	color: inherit;
	text-decoration: none;
	background-image: linear-gradient(var(--mtp-accent), var(--mtp-accent));
	background-size: 0 1px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size 320ms cubic-bezier(0.2, 0.7, 0.2, 1), color 200ms ease;
}
.mtp-news-card:hover .mtp-news-card__title a,
.mtp-news-card:hover .wp-block-post-title a,
.mtp-news-card__title a:hover,
.mtp-news-card .wp-block-post-title a:hover {
	color: var(--mtp-accent);
	background-size: 100% 1px;
}

.mtp-news-card__excerpt,
.mtp-news-card .wp-block-post-excerpt,
.mtp-news-card .wp-block-post-excerpt__excerpt {
	font-size: var(--mtp-text-base);
	line-height: 1.6;
	color: var(--mtp-fg-muted);
	margin: 0;
}

.mtp-news-card__cta,
.mtp-news-card .wp-block-post-excerpt__more-link,
.mtp-news-card .wp-block-read-more {
	display: inline-block;
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	font-weight: 600;
	color: var(--mtp-accent);
	text-decoration: none;
	border: none;
	background: transparent;
	margin-top: 14px;
	padding: 0;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-news-card__cta:hover,
.mtp-news-card .wp-block-post-excerpt__more-link:hover,
.mtp-news-card .wp-block-read-more:hover {
	color: var(--mtp-accent-hover);
}

/* ── Pagination unter dem News-Grid ──────────────────────────────────────── */

.mtp-news-pagination {
	margin-block-start: clamp(40px, 5vw, 64px);
	padding-block-start: 28px;
	border-top: 1px solid var(--mtp-ink-200);
}
.mtp-news-pagination .nav-links,
.mtp-news-pagination .wp-block-query-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	align-items: center;
}
.mtp-news-pagination .page-numbers {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-sm);
	letter-spacing: 0.08em;
	padding: 10px 16px;
	color: var(--mtp-ink-600);
	border: 1px solid transparent;
	text-decoration: none;
	min-width: 44px;
	text-align: center;
	transition: border-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-news-pagination a.page-numbers:hover {
	color: var(--mtp-ink-900);
	border-color: var(--mtp-ink-300);
}
.mtp-news-pagination .page-numbers.current {
	color: var(--mtp-ink-900);
	border-color: var(--mtp-brass-500);
	background: var(--mtp-brass-50);
}
.mtp-news-pagination .page-numbers.dots {
	border: none;
}

/* ── Single-News (single.php) — Dark→Light (design.md §10, artikel-v4) ────── */
/* Dark-Auftakt (Eyebrow · Title · Meta · Lede) → Waterline → Naht → Light-Reading.
   Die Dark-Zonen brechen via vw-Technik auf volle Breite aus dem Astra-Container. */

.mtp-single-news {
	width: 100%;
}

/* Full-bleed der Dark-Zonen (aus dem 1200px-Container). */
.mtp-single-news__top,
.mtp-single-news__waterline,
.mtp-single-news__seam {
	margin-inline: calc(50% - 50vw);
	width: 100vw;
}

/* Dark-Auftakt. */
.mtp-single-news__top {
	padding-block: clamp(56px, 9vw, 128px) clamp(32px, 4vw, 56px);
}
.mtp-single-news__top-inner {
	max-width: calc(var(--mtp-measure) + 2 * var(--mtp-gutter));
	margin-inline: auto;
	padding-inline: var(--mtp-gutter);
}

.mtp-single-news__title {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(48px, 6.2vw, 88px);
	line-height: 1.0;
	letter-spacing: -0.02em;
	color: var(--mtp-fg-strong);
	margin-block: 18px 20px;
}

.mtp-single-news__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	letter-spacing: var(--mtp-tracking-mono);
	text-transform: uppercase;
	color: var(--mtp-fg-quiet);
}
.mtp-single-news__divider {
	color: var(--mtp-fg-quiet);
	opacity: 0.6;
}
.mtp-single-news__cat {
	color: var(--mtp-accent);
}

.mtp-single-news__lede {
	margin-block-start: clamp(20px, 2.5vw, 32px);
	font-size: clamp(19px, 1.9vw, 22px);
	line-height: 1.6;
	color: var(--mtp-fg-muted);
	max-width: 60ch;
}

/* Waterline (auf Dark, vor der Naht) — Inner kommt aus surfaces.css. */
.mtp-single-news__waterline {
	padding-block-end: 28px;
}
.mtp-single-news__waterline .mtp-waterline__inner {
	max-width: calc(var(--mtp-measure) + 2 * var(--mtp-gutter));
}

/* Light-Reading. */
.mtp-single-news__reading {
	padding-block: clamp(40px, 5vw, 72px) clamp(48px, 7vw, 96px);
}

.mtp-single-news__hero {
	margin: 0 auto clamp(32px, 4vw, 56px);
	max-width: var(--mtp-container-content);
	border-radius: var(--mtp-radius-sm);
	overflow: hidden;
	background: var(--mtp-surface-sunken);
}
.mtp-single-news__hero-img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 600px;
	object-fit: cover;
}
.mtp-single-news__hero-caption {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	color: var(--mtp-fg-muted);
	font-style: italic;
	padding: 10px 14px 0;
	background: transparent;
}

.mtp-single-news__content {
	max-width: var(--mtp-measure);
	margin-inline: auto;
	font-size: 17.5px;
	line-height: 1.72;
	color: var(--mtp-fg);
}
.mtp-single-news__content p {
	margin-block: 0 1.2em;
}
.mtp-single-news__content h2 {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(28px, 3.4vw, 42px);
	letter-spacing: -0.012em;
	color: var(--mtp-fg-strong);
	margin-block: 1.6em 0.5em;
	line-height: 1.12;
}
.mtp-single-news__content h3 {
	font-family: var(--mtp-font-ui);
	font-weight: 600;
	font-size: var(--mtp-text-xl);
	color: var(--mtp-fg-strong);
	margin-block: 1.6em 0.6em;
}
.mtp-single-news__content a {
	color: var(--mtp-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: color-mix(in srgb, var(--mtp-accent) 45%, transparent);
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard),
				text-decoration-color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-single-news__content a:hover {
	color: var(--mtp-accent-hover);
	text-decoration-color: var(--mtp-accent-hover);
}
.mtp-single-news__content blockquote {
	border-left: 2px solid var(--mtp-accent);
	padding: 6px 0 6px 24px;
	margin: 1.6em 0;
	font-family: var(--mtp-font-display);
	font-size: clamp(22px, 2.2vw, 28px);
	line-height: 1.3;
	color: var(--mtp-fg-strong);
	font-style: italic;
}
.mtp-single-news__content img,
.mtp-single-news__content .wp-block-image img {
	border-radius: var(--mtp-radius-sm);
}
.mtp-single-news__content figcaption {
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	color: var(--mtp-fg-muted);
	font-style: italic;
	text-align: center;
	margin-block-start: 8px;
}
.mtp-single-news__content ul,
.mtp-single-news__content ol {
	padding-inline-start: 1.6em;
	margin-block: 0 1.2em;
}
.mtp-single-news__content li {
	margin-block: 0.3em;
}

.mtp-single-news__footer {
	max-width: var(--mtp-measure);
	margin: clamp(40px, 5vw, 64px) auto 0;
	padding-block-start: 28px;
	border-top: 1px solid var(--mtp-rule-strong);
}

.mtp-single-news__back {
	display: inline-block;
	font-family: var(--mtp-font-ui);
	font-size: var(--mtp-text-sm);
	font-weight: 600;
	color: var(--mtp-accent);
	text-decoration: none;
	margin-block-end: 28px;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-single-news__back:hover {
	color: var(--mtp-accent-hover);
}

.mtp-single-news__nav {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
@media (min-width: 640px) {
	.mtp-single-news__nav {
		grid-template-columns: 1fr 1fr;
		gap: 24px;
	}
}
.mtp-single-news__nav-link {
	display: block;
	padding: 18px 20px;
	border: 1px solid var(--mtp-rule-strong);
	border-radius: var(--mtp-radius-sm);
	text-decoration: none;
	color: var(--mtp-fg);
	transition: border-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				background-color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-single-news__nav-link:hover {
	border-color: var(--mtp-accent);
	background-color: var(--mtp-bg-2);
	color: var(--mtp-fg-strong);
}
.mtp-single-news__nav-link--next {
	text-align: right;
	grid-column: -1;
}
.mtp-single-news__nav-label {
	display: block;
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	letter-spacing: var(--mtp-tracking-mono);
	text-transform: uppercase;
	color: var(--mtp-fg-quiet);
	margin-block-end: 6px;
}
.mtp-single-news__nav-title {
	display: block;
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: var(--mtp-text-xl);
	line-height: 1.2;
	color: var(--mtp-fg-strong);
}

/* ── News-Section-Pattern auf Home (news-loop-card) — Light ──────────────── */
/* Eyebrow + H2 + „Alle News"-CTA als Header, dann core/query-Grid darunter. */

.mtp-news-section {
	background: var(--mtp-bg);
	border-top: 1px solid var(--mtp-rule) !important;
}

.mtp-news-section__head {
	margin-block-end: clamp(24px, 3vw, 32px);
	align-items: end;
	gap: 16px 32px;
}
.mtp-news-section__head h2 {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(32px, 4.5vw, 56px);
	line-height: 1.08;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-fg-strong);
}

/* ── News auf Home als Zeilen-Liste (Vorlage .news-list/.news-item) ───────── */
/* Datum · Titel+Auszug · Weiterlesen, Trennlinien, kein Bild. Eigene Klassen,
   damit das /news/-Archiv (.mtp-news-card/-grid) unberührt bleibt. */
.mtp-news-section__loop .mtp-news-list {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--mtp-fg-strong);
}
.mtp-news-section__loop .mtp-news-list > li {
	margin: 0 !important;
	padding: 0 !important;
	min-width: 0;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}
/* WP (Query-Loop) wickelt den Group-Inhalt in .wp-block-group__inner-container —
   via display:contents werden Datum/Content/More direkte Grid-Items der Zeile. */
.mtp-news-row > .wp-block-group__inner-container {
	display: contents;
}
.mtp-news-row {
	display: grid;
	grid-template-columns: 200px 1fr 180px;
	gap: 48px;
	align-items: start;
	padding-block: 30px 34px;
	border-bottom: 1px solid var(--mtp-rule);
	transition: background var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-news-row:hover {
	background: rgba(176, 151, 16, 0.04);
}
.mtp-news-row__date {
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	letter-spacing: var(--mtp-tracking-mono);
	text-transform: uppercase;
	color: var(--mtp-fg-muted);
	margin: 0;
	padding-block-start: 6px;
}
.mtp-news-row__content {
	min-width: 0;
}
.mtp-news-row__title,
.mtp-news-row .wp-block-post-title {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(24px, 2.4vw, 30px);
	line-height: 1.1;
	letter-spacing: -0.012em;
	color: var(--mtp-fg-strong);
	margin: 0 0 10px;
}
.mtp-news-row__title a {
	color: inherit;
	text-decoration: none;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-news-row:hover .mtp-news-row__title a,
.mtp-news-row__title a:hover {
	color: var(--mtp-accent);
}
.mtp-news-row__excerpt {
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--mtp-fg-muted);
	margin: 0;
	max-width: 56ch;
}
.mtp-news-row__more {
	justify-self: end;
	padding-block-start: 8px;
	font-family: var(--mtp-font-ui);
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
}
.mtp-news-row__more,
.mtp-news-row__more a,
.mtp-news-row__more .wp-block-read-more {
	color: var(--mtp-accent);
	text-decoration: none;
	border: none;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-news-row:hover .mtp-news-row__more,
.mtp-news-row:hover .mtp-news-row__more a {
	color: var(--mtp-accent-hover);
}
@media (max-width: 781px) {
	.mtp-news-row {
		grid-template-columns: 1fr;
		gap: 8px;
		padding-block: 24px 26px;
	}
	.mtp-news-row__more {
		justify-self: start;
		padding-block-start: 4px;
	}
}

/* ── Polish-Schicht (Instrumentenlicht §10) ──────────────────────────────── */
/* Hero + Trust sitzen in .mtp-dark → semantische Tokens kippen automatisch auf
   Dunkel; Pillar/Section-Header/News bleiben Light. Eine Regel, beide Surfaces. */

/* ─ Hero (Dark, Brass-Glow) — full-bleed Marken-Auftakt (design.md §10 / Vorlage
     homepage-v2-instrumentenlicht): Detailfoto läuft rechts aus, Content links,
     Meta-Rail unten. Bricht via vw-Technik aus Astras 1200er-Container aus —
     alignfull verlässt unter useRootPaddingAwareAlignments nur das Root-Padding,
     nicht den Astra-Container. Dieselbe Technik wie .mtp-single-news__top. ─ */
.mtp-hero {
	position: relative;
	padding: 0 !important;
	min-height: clamp(640px, 88vh, 880px);
	overflow: hidden;
	margin-inline: calc(50% - 50vw + var(--mtp-scrollbar-w-half, 0px)) !important;
	width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
	max-width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
	background: var(--mtp-ink-0);
	isolation: isolate;
}

.mtp-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	opacity: 0.5;
	pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 3px);
}

/* Detailfoto als Hintergrund (rechts, 56 %), weich auslaufende Radial-Maske. */
.mtp-hero__photo {
	position: absolute;
	inset: 0 0 0 auto;
	width: 56%;
	z-index: 1;
	background-size: cover;
	background-position: 50% 45%;
	-webkit-mask-image: radial-gradient(70% 80% at 62% 50%, #000 0%, rgba(0, 0, 0, 0.85) 40%, rgba(0, 0, 0, 0.25) 75%, rgba(0, 0, 0, 0) 100%);
	        mask-image: radial-gradient(70% 80% at 62% 50%, #000 0%, rgba(0, 0, 0, 0.85) 40%, rgba(0, 0, 0, 0.25) 75%, rgba(0, 0, 0, 0) 100%);
}

/* Tint über dem Foto: dunkelt links + oben/unten, damit Text und Glow tragen. */
.mtp-hero__tint {
	position: absolute;
	inset: 0 0 0 auto;
	width: 56%;
	z-index: 2;
	pointer-events: none;
	background:
		linear-gradient(90deg, rgba(23, 22, 23, 0.85) 0%, rgba(23, 22, 23, 0.35) 25%, rgba(23, 22, 23, 0) 55%),
		linear-gradient(180deg, rgba(23, 22, 23, 0.6) 0%, rgba(23, 22, 23, 0) 18%, rgba(23, 22, 23, 0) 82%, rgba(23, 22, 23, 0.6) 100%);
}

/* Content-Wrap: maxw + Gutter, linksbündig; Luft für Header oben + Rail unten. */
.mtp-hero__content {
	position: relative;
	z-index: 4;
	max-width: var(--mtp-maxw);
	margin-inline: auto;
	padding-inline: var(--mtp-gutter);
	padding-block: clamp(120px, 14vw, 168px) clamp(96px, 12vw, 140px);
}
.mtp-hero__content > * {
	max-width: 720px;
}

.mtp-hero h1 {
	font-family: var(--mtp-font-display) !important;
	font-weight: 400 !important;
	font-size: clamp(72px, 9.5vw, 140px) !important;
	line-height: 0.94 !important;
	letter-spacing: -0.025em !important;
	color: var(--mtp-fg-strong);
	margin-block: 28px 0 !important;
	text-wrap: pretty;
}
.mtp-hero h1 em {
	font-style: italic;
	color: var(--mtp-accent);
}

/* Lede: schmal, hell (nicht muted — wie Vorlage), leicht. */
.mtp-hero__content > p:not(.mtp-eyebrow) {
	max-width: 520px;
	margin-block-start: clamp(28px, 3vw, 44px);
	color: var(--mtp-fg);
	font-weight: 300;
}

/* Sekundär-CTA im Hero als unterstrichener Ghost-Link (Vorlage .btn-ghost) —
   überschreibt den globalen Outline-Look von .is-style-mtp-secondary nur hier. */
.mtp-hero .wp-block-button.is-style-mtp-secondary .wp-block-button__link {
	background: transparent;
	border: none;
	border-bottom: 1px solid rgba(232, 226, 207, 0.45);
	border-radius: 0;
	padding: 14px 4px;
	color: var(--mtp-paper);
}
.mtp-hero .wp-block-button.is-style-mtp-secondary .wp-block-button__link:hover,
.mtp-hero .wp-block-button.is-style-mtp-secondary .wp-block-button__link:focus {
	color: var(--mtp-brass-light);
	border-bottom-color: var(--mtp-brass-light);
}

/* Meta-Rail unten (Vorlage .hero-rail): §-Index · Instrumenten-Kürzel · scroll. */
.mtp-hero__rail {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 32px;
	z-index: 4;
	max-width: var(--mtp-maxw);
	margin-inline: auto;
	padding-inline: var(--mtp-gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

/* Naht auf der Startseite ebenfalls full-bleed (Single-News nutzt dafür den
   .mtp-single-news__seam-Wrapper, daher hier ein eigener Modifier). */
.mtp-seam--bleed {
	margin-inline: calc(50% - 50vw + var(--mtp-scrollbar-w-half, 0px)) !important;
	width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
	max-width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
}

@media (max-width: 880px) {
	.mtp-hero {
		min-height: 600px;
	}
	.mtp-hero__photo,
	.mtp-hero__tint {
		width: 82%;
	}
	.mtp-hero__photo {
		opacity: 0.5;
	}
	.mtp-hero__content > * {
		max-width: 100%;
	}
	.mtp-hero__rail .mtp-hero__keys {
		display: none;
	}
}

/* ─ Trust-Bar (Dark, erhöhtes Panel): 132px-Zahlen + 72px Brass-Hairline ─ */
.mtp-trust-bar {
	background: var(--mtp-bg-2);
	padding-block: clamp(48px, 5.5vw, 80px) !important;
	border-block: 1px solid var(--mtp-rule) !important;
	margin-inline: calc(50% - 50vw + var(--mtp-scrollbar-w-half, 0px)) !important;
	width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
	max-width: calc(100vw - var(--mtp-scrollbar-w, 0px)) !important;
}
.mtp-trust-bar .wp-block-column h3,
.mtp-trust-bar .wp-block-column .has-heading-font-family {
	font-family: var(--mtp-font-display) !important;
	font-size: clamp(64px, 8vw, 132px) !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	letter-spacing: -0.035em !important;
	color: var(--mtp-fg-strong);
	position: relative;
	padding-block-end: 22px;
	margin-block-end: 18px !important;
}
.mtp-trust-bar .wp-block-column h3::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 72px;
	height: 1px;
	background: var(--mtp-accent);
}
.mtp-trust-bar .wp-block-column .mtp-label-caps {
	font-size: 12px;
	color: var(--mtp-fg-muted);
}

/* Zellen linksbündig mit vertikalen Trennlinien (Vorlage .trust-cell). */
.mtp-trust-bar .wp-block-column {
	padding-inline: 28px;
}
.mtp-trust-bar .wp-block-column:first-child {
	padding-inline-start: 0;
}
.mtp-trust-bar .wp-block-column + .wp-block-column {
	border-inline-start: 1px solid var(--mtp-rule);
}
.mtp-trust-bar .mtp-trust-tag {
	margin-block-start: 10px;
}
/* Gestapelte Spalten (<782px, WP-Core-Breakpoint): Trenner horizontal. */
@media (max-width: 781px) {
	.mtp-trust-bar .wp-block-column {
		padding-inline: 0;
		padding-block-start: 32px;
	}
	.mtp-trust-bar .wp-block-column:first-child {
		padding-block-start: 0;
	}
	.mtp-trust-bar .wp-block-column + .wp-block-column {
		border-inline-start: none;
		border-block-start: 1px solid var(--mtp-rule);
	}
}

/* ─ Schwerpunkte: weiße Karten (Vorlage .card) — Bild oben flush, Body mit
   Mono-Index, Display-Titel, Text und „Mehr →" am Kartenfuß; Hover-Lift. ─ */
.mtp-pillar-trio .wp-block-columns {
	align-items: stretch;
}
.mtp-pillar-trio .wp-block-columns > .wp-block-column {
	background: var(--mtp-surface-card);
	border: 1px solid var(--mtp-rule);
	border-radius: var(--mtp-radius-md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color var(--mtp-duration-base) var(--mtp-ease-standard),
				transform var(--mtp-duration-base) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-base) var(--mtp-ease-standard);
}
.mtp-pillar-trio .wp-block-columns > .wp-block-column:hover {
	border-color: var(--mtp-rule-strong);
	transform: translateY(-2px);
	box-shadow: var(--mtp-shadow-card);
}
/* Bild flush am Kartenkopf (4/3), Hover-Zoom. */
.mtp-pillar-trio .wp-block-image {
	margin: 0;
	overflow: hidden;
	border-radius: 0;
}
.mtp-pillar-trio .wp-block-image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 0;
	transition: transform var(--mtp-duration-slower) var(--mtp-ease-standard);
}
.mtp-pillar-trio .wp-block-columns > .wp-block-column:hover .wp-block-image img {
	transform: scale(1.03);
}
/* Karten-Body: füllt die Resthöhe, „Mehr" klebt am Kartenfuß. */
.mtp-pillar-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	padding: 32px 32px 36px;
}
/* Inner-Container transparent schalten, damit „Mehr →" (margin-top:auto) am
   Kartenfuß sitzt statt im Inner-Container gefangen zu bleiben. */
.mtp-pillar-card__body > .wp-block-group__inner-container {
	display: contents;
}
.mtp-pillar-card__nr {
	color: var(--mtp-accent);
	margin-block-end: 4px;
}
.mtp-pillar-trio h3 {
	font-family: var(--mtp-font-display);
	font-weight: 400;
	font-size: clamp(26px, 2.6vw, 34px) !important;
	line-height: 1.05 !important;
	letter-spacing: -0.012em;
	color: var(--mtp-fg-strong);
	margin-block: 0 12px !important;
}
.mtp-pillar-trio p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--mtp-fg-muted);
	margin: 0;
}
.mtp-pillar-card__body .wp-block-buttons {
	margin-block-start: auto;
	padding-block-start: 22px;
}
.mtp-pillar-trio .wp-block-button.is-style-mtp-ghost .wp-block-button__link {
	padding: 0;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.01em;
	color: var(--mtp-accent);
	border: none;
	border-radius: 0;
	background-color: transparent;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-pillar-trio .wp-block-button.is-style-mtp-ghost .wp-block-button__link:hover,
.mtp-pillar-trio .wp-block-button.is-style-mtp-ghost .wp-block-button__link:focus {
	color: var(--mtp-accent-hover);
	background-color: transparent;
}

/* ─ Section-Header (Schwerpunkte / Aus der Werkstatt) etwas kräftiger ─ */
.mtp-section-header h2 {
	font-size: clamp(32px, 4vw, 52px) !important;
	line-height: 1.08 !important;
	letter-spacing: -0.02em !important;
	color: var(--mtp-fg-strong);
}

/* ─ News-Cards: Hover-Lift + stärkerer Brass-Akzent im CTA ─ */
.mtp-news-card {
	transition: transform var(--mtp-duration-base) var(--mtp-ease-standard);
}
.mtp-news-card:hover {
	transform: translateY(-3px);
}
.mtp-news-card .wp-block-post-featured-image,
.mtp-news-card__media {
	overflow: hidden;
	border-radius: 4px;
}
.mtp-news-card .wp-block-post-featured-image img,
.mtp-news-card__media img {
	transition: transform var(--mtp-duration-slower) var(--mtp-ease-standard);
}
.mtp-news-card:hover .wp-block-post-featured-image img,
.mtp-news-card:hover .mtp-news-card__media img {
	transform: scale(1.03);
}

/* ─ Process-Steps (Manufaktur-Detail-Page) ─
   4-Spalten-Grid mit Counter-Indizes (01–04), Hero-artige Bilder oben.
   Bricht auf Tablet auf 2 Spalten, Mobil auf 1 Spalte. */
.mtp-process-steps .wp-block-columns {
	counter-reset: mtp-step;
}
.mtp-process-steps .wp-block-columns > .wp-block-column {
	counter-increment: mtp-step;
	position: relative;
	padding-block-start: 36px;
}
.mtp-process-steps .wp-block-columns > .wp-block-column::before {
	content: counter(mtp-step, decimal-leading-zero);
	position: absolute;
	top: 0;
	left: 0;
	font-family: var(--mtp-font-mono);
	font-size: 13px;
	letter-spacing: 0.18em;
	color: var(--mtp-brass-600);
	font-weight: 500;
}
.mtp-process-steps .wp-block-columns > .wp-block-column::after {
	content: "";
	position: absolute;
	top: 8px;
	left: 36px;
	width: 56px;
	height: 1px;
	background: var(--mtp-brass-300);
}
.mtp-process-steps .wp-block-image {
	overflow: hidden;
	border-radius: 4px;
	margin: 0;
}
.mtp-process-steps .wp-block-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 4px;
	transition: transform var(--mtp-duration-slower) var(--mtp-ease-standard);
}
.mtp-process-steps .wp-block-columns > .wp-block-column:hover .wp-block-image img {
	transform: scale(1.03);
}
.mtp-process-steps h3 {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(22px, 2vw, 28px) !important;
	line-height: 1.15 !important;
	letter-spacing: -0.005em;
	color: var(--mtp-ink-800);
	margin-block-start: 20px !important;
	margin-block-end: 8px !important;
}
.mtp-process-steps p {
	font-size: 15px;
	line-height: 1.55;
	color: var(--mtp-ink-600);
}

/* ─ Galerie (3-spaltige Bild-Reihe, ohne Cards) ─ */
.mtp-gallery .wp-block-image {
	overflow: hidden;
	border-radius: 4px;
	margin: 0;
}
.mtp-gallery .wp-block-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 4px;
	transition: transform var(--mtp-duration-slower) var(--mtp-ease-standard);
}
.mtp-gallery .wp-block-image:hover img {
	transform: scale(1.03);
}

/* ─ CTA-Block (Schluss-CTA mit Brass-Hintergrund-Hauch) ─ */
.mtp-cta-block {
	text-align: center;
}
.mtp-cta-block h2 {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(28px, 3.5vw, 44px) !important;
	line-height: 1.12 !important;
	letter-spacing: -0.015em !important;
	color: var(--mtp-ink-800);
	margin-block-end: 16px !important;
}
.mtp-cta-block p {
	max-width: 560px;
	margin-inline: auto;
	font-size: 17px;
	line-height: 1.6;
	color: var(--mtp-ink-600);
}
.mtp-cta-block .wp-block-buttons {
	justify-content: center;
}

/* ─ Standortkarte (Kontakt-Seite, Single-Marker) ─ */
.mtp-standortkarte {
	position: relative;
	background-color: var(--mtp-surface-sunken);
	border: 1px solid var(--mtp-ink-200);
	border-radius: var(--mtp-radius-md);
	overflow: hidden;
}
.mtp-standortkarte__canvas {
	position: absolute;
	inset: 0;
}
.mtp-standortkarte .leaflet-container {
	background: var(--mtp-surface-sunken);
	font-family: var(--mtp-font-body);
}
.mtp-standortkarte__loading {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	color: var(--mtp-ink-400);
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}
.mtp-standortkarte__pin {
	background: transparent;
	border: 0;
}
.mtp-standortkarte .leaflet-popup-content-wrapper {
	border-radius: var(--mtp-radius-sm);
	box-shadow: var(--mtp-shadow-md);
	padding: 6px;
}
.mtp-standortkarte .leaflet-popup-content {
	margin: 10px 14px;
	font-family: var(--mtp-font-body);
	color: var(--mtp-ink-800);
}
.mtp-standortkarte__popup-title {
	font-weight: 600;
	font-size: 14px;
	color: var(--mtp-ink-900);
}
.mtp-standortkarte__popup-subtitle {
	font-size: 13px;
	color: var(--mtp-ink-500);
	margin-top: 2px;
}

/* ─ Kontakt-Layout (Adresse links, Karte rechts) ─ */
.mtp-kontakt-grid .wp-block-columns {
	align-items: stretch;
}
.mtp-kontakt-grid .wp-block-column {
	display: flex;
	flex-direction: column;
}
.mtp-kontakt-card {
	background: var(--mtp-surface-canvas);
	border: 1px solid var(--mtp-ink-200);
	border-radius: var(--mtp-radius-md);
	padding: clamp(20px, 2.5vw, 32px);
	box-shadow: var(--mtp-shadow-sm);
}
.mtp-kontakt-card h3 {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: 22px;
	line-height: 1.2;
	color: var(--mtp-ink-800);
	margin: 0 0 14px 0;
}
.mtp-kontakt-card p {
	font-size: 15px;
	line-height: 1.65;
	color: var(--mtp-ink-700);
	margin: 0 0 12px 0;
}
.mtp-kontakt-card p:last-child {
	margin-bottom: 0;
}
.mtp-kontakt-card a {
	color: var(--mtp-brass-700);
	border-bottom: 1px solid var(--mtp-brass-300);
	text-decoration: none;
}
.mtp-kontakt-card a:hover {
	color: var(--mtp-brass-800);
	border-bottom-color: var(--mtp-brass-700);
}

/* ─ Legal-Pages (AGB, Impressum, Garantiebedingungen, Datenschutz) ─
   Schmaler Lese-Container (720 px), Cormorant-Hierarchie, Inter-Body. */
.mtp-legal-content {
	font-family: var(--mtp-font-body);
	font-size: 16px;
	line-height: 1.72;
	color: var(--mtp-ink-700);
}
.mtp-legal-content > h1,
.mtp-legal-content :is(h1):first-of-type {
	display: none;
}
.mtp-legal-content h2 {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(24px, 2.4vw, 32px);
	line-height: 1.2;
	letter-spacing: -0.005em;
	color: var(--mtp-ink-800);
	margin-block-start: 48px;
	margin-block-end: 16px;
	padding-block-start: 24px;
	border-top: 1px solid var(--mtp-ink-200);
}
.mtp-legal-content h2:first-child {
	margin-block-start: 0;
	padding-block-start: 0;
	border-top: 0;
}
.mtp-legal-content h3 {
	font-family: var(--mtp-font-body);
	font-size: 17px;
	font-weight: 600;
	letter-spacing: 0.005em;
	color: var(--mtp-ink-800);
	margin-block-start: 32px;
	margin-block-end: 8px;
}
.mtp-legal-content p {
	margin-block-end: 16px;
}
.mtp-legal-content a {
	color: var(--mtp-brass-700);
	border-bottom: 1px solid var(--mtp-brass-300);
	text-decoration: none;
}
.mtp-legal-content a:hover {
	color: var(--mtp-brass-800);
	border-bottom-color: var(--mtp-brass-700);
}
.mtp-legal-content hr {
	height: 1px;
	border: 0;
	background: var(--mtp-ink-200);
	margin-block: 32px;
}
.mtp-legal-content b,
.mtp-legal-content strong {
	font-weight: 600;
	color: var(--mtp-ink-800);
}
.mtp-legal-content ul,
.mtp-legal-content ol {
	padding-inline-start: 24px;
	margin-block: 16px 16px;
}
.mtp-legal-content li {
	margin-block-end: 8px;
}

/* ── Suchformular (searchform.php) ───────────────────────────────────────── */
/* Inter-Input mit Brass-Focus-Ring + Brass-Submit. Genutzt auf 404 + Search. */
.mtp-search-form {
	display: flex;
	gap: 10px;
	max-width: 480px;
}
.mtp-search-form__input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 12px 16px;
	font-family: var(--mtp-font-body);
	font-size: var(--mtp-text-base);
	color: var(--mtp-ink-800);
	background: var(--mtp-surface-paper);
	border: 1px solid var(--mtp-ink-300);
	border-radius: var(--mtp-radius-sm);
	transition: border-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-search-form__input::placeholder {
	color: var(--mtp-ink-400);
}
.mtp-search-form__input:focus {
	outline: none;
	border-color: var(--mtp-brass-500);
	box-shadow: 0 0 0 3px var(--mtp-brass-100);
}
.mtp-search-form__submit {
	flex: 0 0 auto;
	padding: 12px 24px;
	font-family: var(--mtp-font-body);
	font-size: var(--mtp-text-base);
	font-weight: 500;
	line-height: 1.2;
	color: var(--mtp-surface-paper);
	background: var(--mtp-brass-500);
	border: 1px solid transparent;
	border-radius: var(--mtp-radius-sm);
	cursor: pointer;
	transition: background-color var(--mtp-duration-fast) var(--mtp-ease-standard),
				box-shadow var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-search-form__submit:hover,
.mtp-search-form__submit:focus {
	background: var(--mtp-brass-600);
	box-shadow: var(--mtp-shadow-brass);
}

/* ── 404-Fehlerseite (404.php) ───────────────────────────────────────────── */
.mtp-error-404 {
	max-width: 720px;
	margin-inline: auto;
	padding-block: clamp(48px, 8vw, 112px);
}
.mtp-error-404__title {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(40px, 6vw, 72px);
	line-height: 1.08;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-ink-800);
	margin-block: 16px 20px;
}
.mtp-error-404__lead {
	font-family: var(--mtp-font-body);
	font-size: var(--mtp-text-lg);
	line-height: 1.6;
	color: var(--mtp-ink-600);
	max-width: 560px;
	margin-block-end: clamp(28px, 4vw, 40px);
}
.mtp-error-404__search {
	margin-block-end: clamp(28px, 4vw, 40px);
}
.mtp-error-404__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

/* ── Suchergebnisse (search.php) ─────────────────────────────────────────── */
.mtp-search {
	max-width: 820px;
	margin-inline: auto;
	padding-block: clamp(32px, 5vw, 56px) clamp(48px, 7vw, 80px);
}
.mtp-search__hero {
	margin-block-end: clamp(32px, 4vw, 48px);
}
.mtp-search__title {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(32px, 4.5vw, 52px);
	line-height: 1.12;
	letter-spacing: var(--mtp-tracking-tight);
	color: var(--mtp-ink-800);
	margin-block: 14px 12px;
	overflow-wrap: anywhere;
}
.mtp-search__count {
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--mtp-ink-500);
	margin-block-end: clamp(24px, 3vw, 32px);
}
.mtp-search__form {
	max-width: 480px;
}

.mtp-search__results {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--mtp-ink-200);
}
.mtp-search-result {
	margin: 0;
	border-bottom: 1px solid var(--mtp-ink-200);
}
.mtp-search-result__link {
	display: block;
	padding-block: 24px;
	text-decoration: none;
	transition: padding-inline-start var(--mtp-duration-base) var(--mtp-ease-standard);
}
.mtp-search-result__link:hover {
	padding-inline-start: 8px;
}
.mtp-search-result__kind {
	display: inline-block;
	font-family: var(--mtp-font-mono);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--mtp-brass-700);
	margin-block-end: 8px;
}
.mtp-search-result__title {
	font-family: var(--mtp-font-heading);
	font-weight: 500;
	font-size: clamp(22px, 2.4vw, 28px);
	line-height: 1.2;
	color: var(--mtp-ink-800);
	margin: 0 0 6px;
	transition: color var(--mtp-duration-fast) var(--mtp-ease-standard);
}
.mtp-search-result__link:hover .mtp-search-result__title {
	color: var(--mtp-brass-700);
}
.mtp-search-result__excerpt {
	font-family: var(--mtp-font-body);
	font-size: var(--mtp-text-base);
	line-height: 1.6;
	color: var(--mtp-ink-600);
	margin: 0 0 8px;
}
.mtp-search-result__url {
	display: block;
	font-family: var(--mtp-font-mono);
	font-size: var(--mtp-text-xs);
	color: var(--mtp-ink-400);
	overflow-wrap: anywhere;
}

.mtp-search__empty {
	padding-block: clamp(24px, 4vw, 40px);
}
.mtp-search__empty-lead {
	font-family: var(--mtp-font-body);
	font-size: var(--mtp-text-lg);
	color: var(--mtp-ink-600);
	margin-block-end: 20px;
}