/*
 * Die Umzugsmacher – Design-System
 * Farben, Schriften und Überschriftengrößen kommen aus theme.json.
 * Diese Datei regelt Layout, Komponenten und Abstände.
 */

/* ---------- Schriften (lokal, keine Google-Server) ---------- */
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/outfit-600.woff2") format("woff2"); }
@font-face { font-family: "Mada"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/mada-400.woff2") format("woff2"); }
@font-face { font-family: "Mada"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/mada-700.woff2") format("woff2"); }

/* ---------- Grundwerte ---------- */
:root {
	--um-blau: var(--wp--preset--color--blau, #0000ee);
	--um-blau-dunkel: var(--wp--preset--color--blau-dunkel, #0000b0);
	--um-tinte: var(--wp--preset--color--tinte, #0c141f);
	--um-text: var(--wp--preset--color--text, #3b4252);
	--um-sand: var(--wp--preset--color--sand, #f4f1eb);
	--um-gelb: var(--wp--preset--color--gelb, #ffff00);
	--um-linie: var(--wp--preset--color--linie, #e3ddd2);
	--um-weiss: #fff;
	--um-head: var(--wp--preset--font-family--outfit, Outfit, Arial, sans-serif);
	--um-body: var(--wp--preset--font-family--mada, Mada, Arial, sans-serif);
	--um-pad: clamp(1rem, 4vw, 2rem);
	--um-content: 780px;
	--um-wide: 1200px;
	--um-radius: 14px;
	--um-section: clamp(3.25rem, 7vw, 6.5rem);
	--um-header-h: 76px;
	--um-shadow: 0 1px 2px rgba(12, 20, 31, .06), 0 12px 32px -12px rgba(12, 20, 31, .18);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--um-header-h) + 1rem); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; overflow-x: clip; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
a { text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--um-blau); outline-offset: 3px; border-radius: 4px; }
p, ul, ol, figure, table, details { margin-top: 0; }
h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5em; text-wrap: balance; }
p { text-wrap: pretty; }
strong, b { font-weight: 700; color: var(--um-tinte); }
::selection { background: var(--um-gelb); color: var(--um-tinte); }

.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.um-skip { position: absolute; left: 1rem; top: -100px; z-index: 1000; background: var(--um-tinte); color: #fff; padding: .75rem 1rem; border-radius: 8px; }
.um-skip:focus { top: 1rem; }

.um-wrap { width: 100%; max-width: calc(var(--um-wide) + 2 * var(--um-pad)); margin-inline: auto; padding-inline: var(--um-pad); }

.um-icon { width: 1.25em; height: 1.25em; flex: none; vertical-align: -.25em; }

/* ---------- Buttons ---------- */
.um-btn,
.wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	min-height: 52px; padding: .8em 1.4em; border: 2px solid var(--um-blau); border-radius: 10px;
	background: var(--um-blau); color: #fff; font-family: var(--um-head); font-weight: 600; font-size: 1.0625rem; line-height: 1.2;
	text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s, transform .15s;
}
.um-btn:hover, .wp-block-button__link:hover { background: var(--um-blau-dunkel); border-color: var(--um-blau-dunkel); color: #fff; text-decoration: none; }
.um-btn:active, .wp-block-button__link:active { transform: translateY(1px); }
.um-btn--ghost, .is-style-outline .wp-block-button__link { background: transparent; color: var(--um-blau); }
.um-btn--ghost:hover, .is-style-outline .wp-block-button__link:hover { background: var(--um-blau); color: #fff; }
.um-btn--gelb, .is-style-hell .wp-block-button__link { background: var(--um-gelb); border-color: var(--um-gelb); color: var(--um-tinte); }
.um-btn--gelb:hover, .is-style-hell .wp-block-button__link:hover { background: #fff; border-color: #fff; color: var(--um-tinte); }
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.wp-block-buttons .wp-block-button { margin: 0; }

/* ---------- Kopfzeile ---------- */
.um-header { position: sticky; top: 0; z-index: 100; background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--um-linie); }
.admin-bar .um-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .um-header { top: 0; } }
@supports (backdrop-filter: blur(8px)) { .um-header { background: rgba(255, 255, 255, .9); backdrop-filter: saturate(1.4) blur(10px); } }
.um-header__inner { display: flex; align-items: center; gap: 1.5rem; min-height: var(--um-header-h); }
.um-logo { display: inline-flex; align-items: center; flex: none; color: var(--um-tinte); text-decoration: none; }
.um-logo svg, .um-logo img { width: auto; height: 54px; }
.um-logo__text { font-family: var(--um-head); font-weight: 600; font-size: 1.375rem; }

.um-hauptnav { margin-left: auto; }
.um-hauptnav ul { list-style: none; margin: 0; padding: 0; }
.um-hauptnav > ul { display: flex; align-items: center; gap: .25rem; }
.um-hauptnav a { display: block; padding: .6rem .8rem; border-radius: 8px; color: var(--um-tinte); font-family: var(--um-head); font-weight: 600; font-size: 1rem; text-decoration: none; white-space: nowrap; }
.um-hauptnav a:hover, .um-hauptnav .current-menu-item > a, .um-hauptnav .current-menu-ancestor > a { color: var(--um-blau); background: var(--um-sand); }
.um-hauptnav .menu-item-has-children { position: relative; }
.um-hauptnav .menu-item-has-children > a::after { content: ""; display: inline-block; width: .45em; height: .45em; margin-left: .45em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-.2em) rotate(45deg); }
.um-hauptnav .sub-menu { position: absolute; left: -.5rem; top: 100%; min-width: 260px; padding: .5rem; background: #fff; border: 1px solid var(--um-linie); border-radius: 12px; box-shadow: var(--um-shadow); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .15s, transform .15s, visibility .15s; }
.um-hauptnav .menu-item-has-children:hover > .sub-menu,
.um-hauptnav .menu-item-has-children:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.um-hauptnav .sub-menu a { font-family: var(--um-body); font-weight: 700; }

.um-header__cta { display: flex; align-items: center; gap: .6rem; flex: none; }
.um-header__tel { display: inline-flex; align-items: center; gap: .45rem; color: var(--um-tinte); font-family: var(--um-head); font-weight: 600; text-decoration: none; white-space: nowrap; }
.um-header__tel .um-icon { color: var(--um-blau); }
.um-header__tel:hover { color: var(--um-blau); }
.um-header .um-btn { min-height: 46px; padding: .6em 1.1em; font-size: 1rem; }
.um-burger { display: none; align-items: center; justify-content: center; width: 48px; height: 48px; margin-right: -.5rem; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--um-tinte); cursor: pointer; }
.um-burger .um-icon { width: 28px; height: 28px; }
.um-burger .um-icon--zu { display: none; }
.um-menu-offen .um-burger .um-icon--auf { display: none; }
.um-menu-offen .um-burger .um-icon--zu { display: block; }

@media (max-width: 1180px) {
	.um-header__tel span { display: none; }
}
@media (max-width: 1060px) {
	:root { --um-header-h: 66px; }
	.um-logo svg, .um-logo img { height: 42px; }
	.um-burger { display: inline-flex; }
	.um-header__inner { gap: .75rem; }
	.um-header__cta { margin-left: auto; }
	.um-header__cta .um-btn { display: none; }
	.um-header__tel { width: 48px; height: 48px; justify-content: center; border-radius: 10px; background: var(--um-sand); }
	.um-hauptnav { position: fixed; inset: var(--um-header-h) 0 0 0; z-index: 99; margin: 0; padding: 1rem var(--um-pad) 7rem; background: #fff; overflow-y: auto; overscroll-behavior: contain; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .2s, visibility .2s; }
	.admin-bar .um-hauptnav { inset-block-start: calc(var(--um-header-h) + 46px); }
	.um-menu-offen .um-hauptnav { visibility: visible; opacity: 1; pointer-events: auto; }
	.um-hauptnav > ul { flex-direction: column; align-items: stretch; gap: 0; }
	.um-hauptnav a { padding: 1rem .25rem; border-radius: 0; border-bottom: 1px solid var(--um-linie); font-size: 1.1875rem; white-space: normal; }
	.um-hauptnav a:hover { background: transparent; }
	.um-hauptnav .menu-item-has-children > a::after { display: none; }
	.um-hauptnav .sub-menu { position: static; min-width: 0; padding: 0 0 0 1rem; border: 0; box-shadow: none; opacity: 1; visibility: inherit; transform: none; }
	.um-hauptnav .sub-menu a { font-size: 1.0625rem; }
	.um-menu-offen { overflow: hidden; }
}
@media (max-width: 380px) {
	.um-logo svg, .um-logo img { height: 36px; }
}

/* ---------- Brotkrümel ---------- */
.um-crumbs { font-size: .9375rem; }
.um-crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin: 0; padding: 1rem 0 0; }
.um-crumbs li { display: inline-flex; align-items: center; gap: .5rem; }
.um-crumbs li + li::before { content: "/"; opacity: .5; }
.um-crumbs a { color: inherit; }
.um-crumbs [aria-current] { opacity: .8; }
.um-crumbs--hero { background: var(--um-blau); color: rgba(255, 255, 255, .88); }
.um-crumbs--hero ol { padding-top: 1.25rem; }

/* ---------- Inhaltsbereich ---------- */
.um-main { display: block; }
.um-content > * { max-width: var(--um-content); margin-inline: auto; padding-inline: 0; }
.um-content > :where(:not(.alignfull):not(.alignwide)) { width: calc(100% - 2 * var(--um-pad)); }
.um-content > .alignwide { max-width: var(--um-wide); width: calc(100% - 2 * var(--um-pad)); }
.um-content > .alignfull { max-width: none; width: 100%; padding-inline: var(--um-pad); }
.um-content > :where(:not(.alignfull)) + :where(:not(.alignfull)) { margin-top: 1.25rem; }
.um-content > :where(h2, h3) { margin-top: 2.5rem; }
.um-content > :where(:not(.alignfull)):first-child { margin-top: var(--um-section); }
.um-content > :where(:not(.alignfull)):last-child { margin-bottom: var(--um-section); }
.um-content > .alignfull + :where(:not(.alignfull)) { margin-top: var(--um-section); }
.um-content > :where(:not(.alignfull)) + .alignfull { margin-top: var(--um-section); }

/* Flussabstände innerhalb von Gruppen und Spalten */
.um-content :where(.wp-block-group, .wp-block-column, .wp-block-details) > * { margin-block: 0; }
.um-content :where(.wp-block-group, .wp-block-column) > * + * { margin-top: 1.1rem; }
.um-content :where(.wp-block-group, .wp-block-column) > * + :where(h2, h3) { margin-top: 2rem; }
.um-content :where(.wp-block-group, .wp-block-column) > :where(h2, h3) + * { margin-top: .9rem; }
.um-content :where(.wp-block-group, .wp-block-column) > .is-style-dachzeile + :where(h1, h2, h3) { margin-top: .6rem; }
.um-content :where(.wp-block-group, .wp-block-column) > * + .wp-block-buttons { margin-top: 1.75rem; }

/* Abschnitte (volle Breite) */
.um-content > .wp-block-group.alignfull { padding-block: var(--um-section); }
.um-content .alignfull > :where(*) { max-width: var(--um-content); margin-inline: auto; }
.um-content .alignfull > .alignwide,
.um-content .alignfull > .wp-block-columns,
.um-content .alignfull > .um-grid { max-width: var(--um-wide); }
.um-content .alignfull > .um-zentriert { text-align: center; }
.is-style-sand { background: var(--um-sand); }
.is-style-blau { background: var(--um-blau); color: rgba(255, 255, 255, .92); }
.is-style-blau :where(h1, h2, h3, h4, strong) { color: #fff; }
.is-style-blau a:not(.wp-block-button__link) { color: #fff; }
.is-style-blau .wp-block-button__link { background: var(--um-gelb); border-color: var(--um-gelb); color: var(--um-tinte); }
.is-style-blau .wp-block-button__link:hover { background: #fff; border-color: #fff; }
.is-style-blau .is-style-outline .wp-block-button__link { background: transparent; border-color: rgba(255, 255, 255, .7); color: #fff; }
.is-style-blau .is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--um-blau); }

/* Dachzeile mit gelbem Pfeil (aus dem Logo) */
.is-style-dachzeile { display: block; font-family: var(--um-head); font-weight: 600; font-size: .9375rem; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: var(--um-blau); }
.is-style-dachzeile::after { content: ""; display: inline-block; width: 3.25rem; height: 10px; margin-left: .7rem; vertical-align: .05em; background: currentColor; clip-path: polygon(0 35%, 80% 35%, 80% 0, 100% 50%, 80% 100%, 80% 65%, 0 65%); }
.is-style-blau .is-style-dachzeile, .um-hero .is-style-dachzeile { color: var(--um-gelb); }
.has-text-align-center.is-style-dachzeile, .um-zentriert .is-style-dachzeile { text-align: center; }

/* Einleitung / Lead */
.um-lead { font-size: var(--wp--preset--font-size--gross, 1.375rem); line-height: 1.5; }

/* Kurz-gesagt-Box (für schnelle Antworten – auch für KI-Suchen) */
.is-style-kurz-gesagt { position: relative; padding: 1.25rem 1.4rem 1.25rem 1.6rem; border-radius: 12px; background: #fff; border: 1px solid var(--um-linie); box-shadow: inset 5px 0 0 var(--um-blau); }
.is-style-sand .is-style-kurz-gesagt { background: #fff; }
.um-content > .is-style-kurz-gesagt { background: var(--um-sand); border-color: transparent; }

/* Haken-Liste */
.is-style-haken { list-style: none; padding-left: 0; }
.is-style-haken li { position: relative; padding-left: 2rem; }
.is-style-haken li + li { margin-top: .55rem; }
.is-style-haken li::before { content: ""; position: absolute; left: 0; top: .2em; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: var(--um-blau) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center / 72% no-repeat; }
.is-style-blau .is-style-haken li::before, .um-hero .is-style-haken li::before { background-color: var(--um-gelb); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c141f' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E"); }
.um-content ul:not(.is-style-haken), .um-content ol { padding-left: 1.3rem; }
.um-content li + li { margin-top: .4rem; }
.um-content li::marker { color: var(--um-blau); font-weight: 700; }

/* ---------- Hero ---------- */
.um-content > .um-hero.alignfull { position: relative; overflow: hidden; padding-block: clamp(2.5rem, 5vw, 4.5rem) clamp(3rem, 6vw, 5.5rem); background: var(--um-blau); color: rgba(255, 255, 255, .92); isolation: isolate; }
.um-hero::before { content: ""; position: absolute; z-index: -1; right: -12rem; bottom: -14rem; width: 38rem; height: 38rem; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .09), rgba(255, 255, 255, 0) 70%); }
.um-hero :where(h1, h2, strong) { color: #fff; }
.um-hero a:not(.wp-block-button__link) { color: #fff; }
.um-hero h1 { max-width: 15ch; }
.um-hero .um-lead { color: rgba(255, 255, 255, .9); }
.um-content .um-hero > .wp-block-columns { max-width: var(--um-wide); }
.um-hero .wp-block-columns { align-items: center; gap: clamp(2rem, 5vw, 4.5rem); }
.um-hero .wp-block-column:first-child { flex: 1 1 52%; }
.um-hero .wp-block-column:last-child { flex: 1 1 48%; }
.um-hero .wp-block-button__link { background: var(--um-gelb); border-color: var(--um-gelb); color: var(--um-tinte); }
.um-hero .wp-block-button__link:hover { background: #fff; border-color: #fff; }
.um-hero .is-style-outline .wp-block-button__link { background: transparent; border-color: rgba(255, 255, 255, .7); color: #fff; }
.um-hero .is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--um-blau); }
.um-hero .is-style-haken { font-size: 1.0625rem; }
.um-hero--schlicht h1 { max-width: 22ch; }
.um-hero--schlicht.alignfull > * { max-width: var(--um-wide); }

/* ---------- Spalten ---------- */
.wp-block-columns { display: flex; flex-wrap: wrap; gap: clamp(1.5rem, 4vw, 3.5rem); }
.wp-block-column { flex: 1 1 0; min-width: 0; }
@media (max-width: 860px) {
	.wp-block-columns { flex-direction: column; }
	.wp-block-column { flex-basis: auto !important; width: 100%; }
	.um-hero .wp-block-column:last-child { flex-basis: auto; }
}
.um-text-bild { align-items: center; }
.um-text-bild .wp-block-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--um-radius); }
.um-text-bild--umgekehrt { flex-direction: row-reverse; }
@media (max-width: 860px) { .um-text-bild--umgekehrt { flex-direction: column; } }

/* ---------- Bilder ---------- */
:where(.wp-block-image) { margin: 0; }
.wp-block-image img { border-radius: var(--um-radius); }
.wp-block-image figcaption { margin-top: .6rem; font-size: .9375rem; color: #6b7280; }

/* ---------- Karten-Raster ---------- */
.um-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: clamp(1rem, 2.4vw, 1.5rem); }
.um-content :where(.wp-block-group) > .um-grid { margin-top: 2.25rem; }
.um-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); }
.um-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
@media (min-width: 1000px) { .um-grid--3 { grid-template-columns: repeat(3, 1fr); } .um-grid--4 { grid-template-columns: repeat(4, 1fr); } }
.um-content .um-grid > * { margin: 0; max-width: none; }

.is-style-karte { position: relative; display: flex; flex-direction: column; padding: clamp(1.25rem, 3vw, 1.75rem); background: #fff; border: 1px solid var(--um-linie); border-radius: var(--um-radius); }
.is-style-sand .is-style-karte { border-color: transparent; }
.is-style-blau .is-style-karte { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .18); }
.is-style-karte :where(h3, h4) { margin: 0; }
.is-style-karte > * + * { margin-top: .75rem; }
.is-style-karte > .wp-block-image:first-child { margin: calc(-1 * clamp(1.25rem, 3vw, 1.75rem)) calc(-1 * clamp(1.25rem, 3vw, 1.75rem)) 1.1rem; }
.is-style-karte > .wp-block-image:first-child img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--um-radius) var(--um-radius) 0 0; }
.is-style-karte :where(h3, h4) a { color: var(--um-tinte); text-decoration: none; }
.is-style-karte :where(h3, h4) a::after { content: ""; position: absolute; inset: 0; border-radius: var(--um-radius); }
.is-style-karte:has(h3 a, h4 a) { transition: transform .2s, box-shadow .2s; }
.is-style-karte:has(h3 a, h4 a):hover { transform: translateY(-3px); box-shadow: var(--um-shadow); }
.is-style-karte:has(h3 a, h4 a):hover :where(h3, h4) a { color: var(--um-blau); }
.is-style-karte .um-mehr { margin-top: auto; padding-top: .5rem; font-family: var(--um-head); font-weight: 600; color: var(--um-blau); }
.is-style-karte .um-mehr::after { content: " →"; }
.is-style-karte ul { font-size: 1rem; }

/* Nummerierte Schritte */
.um-schritte { counter-reset: schritt; }
.um-schritte > .is-style-karte { counter-increment: schritt; padding-top: 4.25rem; }
.um-schritte > .is-style-karte::before { content: counter(schritt); position: absolute; top: 1.25rem; left: clamp(1.25rem, 3vw, 1.75rem); display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--um-gelb); color: var(--um-tinte); font-family: var(--um-head); font-weight: 600; font-size: 1.125rem; }
.is-style-sand .um-schritte > .is-style-karte::before { background: var(--um-blau); color: #fff; }

/* ---------- FAQ (Details-Block) ---------- */
.wp-block-details { border-bottom: 1px solid var(--um-linie); }
.um-content * + .wp-block-details { margin-top: 0; }
.um-content :where(h2, p) + .wp-block-details { margin-top: 1.5rem; }
.wp-block-details:first-of-type { border-top: 1px solid var(--um-linie); }
.wp-block-details summary { position: relative; display: block; padding: 1.15rem 3rem 1.15rem 0; cursor: pointer; list-style: none; font-family: var(--um-head); font-weight: 600; font-size: var(--wp--preset--font-size--gross, 1.25rem); line-height: 1.35; color: var(--um-tinte); }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: ""; position: absolute; right: .35rem; top: 50%; width: 1.6rem; height: 1.6rem; margin-top: -.8rem; border-radius: 50%; background: var(--um-sand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230000ee' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 60% no-repeat; transition: transform .2s; }
.is-style-sand .wp-block-details summary::after { background-color: #fff; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details summary:hover { color: var(--um-blau); }
.wp-block-details > :not(summary) { padding-bottom: 1.25rem; padding-right: 2.5rem; }
.wp-block-details > :not(summary) + :not(summary) { margin-top: -.5rem; }

/* ---------- Tabelle ---------- */
:where(.wp-block-table) { margin: 0; }
.wp-block-table { overflow-x: auto; }
.wp-block-table table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 1rem; }
.wp-block-table th, .wp-block-table td { padding: .75rem .9rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--um-linie); }
.wp-block-table thead th { background: var(--um-sand); border-bottom: 2px solid var(--um-blau); color: var(--um-tinte); font-family: var(--um-head); font-weight: 600; }

/* ---------- Abschluss-Aufruf ---------- */
.um-cta.alignfull { text-align: center; }
.um-cta .wp-block-buttons { justify-content: center; }
.um-cta .um-cta__kontakt { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.5rem; font-family: var(--um-head); font-weight: 600; }

/* ---------- Formular ---------- */
.um-form { position: relative; padding: clamp(1.25rem, 3vw, 2rem); background: #fff; color: var(--um-text); border-radius: 18px; box-shadow: 0 30px 60px -30px rgba(0, 0, 60, .55); text-align: left; }
.is-style-sand .um-form, .um-content > .um-form { border: 1px solid var(--um-linie); box-shadow: var(--um-shadow); }
.um-form__title { margin: 0 0 1rem; font-family: var(--um-head); font-weight: 600; font-size: clamp(1.3125rem, 1.2rem + .48vw, 1.625rem); line-height: 1.25; color: var(--um-tinte); }
.um-form__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 0 0 1.25rem; padding: 0; list-style: none; font-size: .875rem; color: #6b7280; }
.um-form__steps li { display: flex; align-items: center; gap: .45rem; margin: 0 !important; padding-top: .55rem; border-top: 3px solid var(--um-linie); }
.um-form__steps li span { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; flex: none; border-radius: 50%; background: var(--um-sand); font-weight: 700; font-size: .8125rem; color: var(--um-tinte); }
.um-form__steps li.is-active, .um-form__steps li.is-done { border-color: var(--um-blau); color: var(--um-tinte); }
.um-form__steps li.is-active span, .um-form__steps li.is-done span { background: var(--um-blau); color: #fff; }
.um-form form { margin: 0; }
.um-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.um-step { display: none; }
.um-step.is-active { display: block; }
.no-js .um-step { display: block; }
.no-js .um-step + .um-step { margin-top: 1.25rem; }
.no-js .um-next, .no-js .um-prev { display: none; }
.um-step > * + * { margin-top: .9rem; }
.um-row { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
@media (max-width: 520px) { .um-row { grid-template-columns: 1fr; } }
.um-field { display: block; }
.um-field > span { display: block; margin-bottom: .3rem; font-weight: 700; font-size: .9375rem; color: var(--um-tinte); }
.um-form input[type="text"], .um-form input[type="tel"], .um-form input[type="email"], .um-form select, .um-form textarea {
	width: 100%; min-height: 50px; padding: .7rem .85rem; border: 1px solid #cfc8bb; border-radius: 10px; background: #fff; color: var(--um-tinte);
	font: inherit; font-size: 1rem; line-height: 1.3; transition: border-color .15s, box-shadow .15s;
}
.um-form select { appearance: none; padding-right: 2.5rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c141f' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right .75rem center / 1.1rem no-repeat; }
.um-form textarea { min-height: 96px; resize: vertical; }
.um-form :is(input, select, textarea):focus { outline: none; border-color: var(--um-blau); box-shadow: 0 0 0 3px rgba(0, 0, 238, .18); }
.um-form .is-invalid { border-color: #c0262d !important; box-shadow: 0 0 0 3px rgba(192, 38, 45, .15) !important; }
.um-form input[type="file"] { width: 100%; padding: .6rem; border: 1px dashed #cfc8bb; border-radius: 10px; background: var(--um-sand); font-size: .9375rem; }
.um-checks { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .9rem; }
@media (max-width: 520px) { .um-checks { grid-template-columns: 1fr; } }
.um-checks label, .um-consent { display: flex; gap: .55rem; align-items: flex-start; font-size: .9375rem; line-height: 1.4; cursor: pointer; }
.um-form input[type="checkbox"] { flex: none; width: 1.15rem; height: 1.15rem; margin: .12rem 0 0; accent-color: var(--um-blau); }
.um-consent a { color: var(--um-blau); }
.um-form .um-btn { width: 100%; }
.um-form .um-schritt-nav { display: grid; grid-template-columns: auto 1fr; gap: .6rem; margin-left: 0; }
.um-form .um-schritt-nav .um-btn--ghost { width: auto; }
.um-form__msg:empty { display: none; }
.um-form__msg { margin: .9rem 0 0; padding: .75rem .9rem; border-radius: 10px; background: #fdecec; color: #8a1c21; font-size: .9375rem; }
.um-form__error { margin: 0 0 1rem; padding: .75rem .9rem; border-radius: 10px; background: #fdecec; color: #8a1c21; font-size: .9375rem; }
.um-form__done { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem; border-radius: 12px; background: #eef7ee; color: #1d4d24; }
.um-form__done .um-icon { width: 2rem; height: 2rem; color: #1f7a34; }
.um-form__done p { margin: 0; }
.um-form.is-sending button[type="submit"] { opacity: .7; pointer-events: none; }
.um-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Ratgeber ---------- */
.um-artikel-kopf { padding-block: 0 clamp(2rem, 4vw, 3rem); background: var(--um-sand); }
.um-artikel-kopf .um-crumbs { color: var(--um-text); }
.um-artikel-kopf__inner { max-width: var(--um-content); margin-inline: auto; padding-top: clamp(1.5rem, 3vw, 2.5rem); }
.um-artikel-kopf h1 { margin-top: .6rem; }
.um-meta { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: 0; font-size: .9375rem; color: #5b6170; }
.um-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.um-artikel-bild { max-width: var(--um-wide); margin: clamp(-1.5rem, -2vw, -1rem) auto 0; padding-inline: var(--um-pad); }
.um-artikel-bild img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--um-radius); }
.um-artikel-kopf + .um-artikel-bild { margin-top: 0; padding-top: 0; }
.single .um-content > :where(:not(.alignfull)):first-child { margin-top: clamp(2rem, 4vw, 3rem); }
.um-autor { display: flex; gap: 1rem; align-items: flex-start; max-width: var(--um-content); width: calc(100% - 2 * var(--um-pad)); margin: 0 auto var(--um-section); padding: 1.25rem 1.4rem; border-radius: var(--um-radius); background: var(--um-sand); font-size: 1rem; }
.um-autor .um-icon { width: 2.25rem; height: 2.25rem; color: var(--um-blau); }
.um-autor p { margin: 0; }
.um-autor p + p { margin-top: .35rem; }

.um-archiv-kopf { padding-block: clamp(1.5rem, 3vw, 2.5rem) clamp(2.5rem, 5vw, 4rem); background: var(--um-blau); color: rgba(255, 255, 255, .9); }
.um-archiv-kopf h1 { color: #fff; margin-top: .75rem; max-width: 22ch; }
.um-archiv-kopf .um-crumbs { color: rgba(255, 255, 255, .85); }
.um-archiv-kopf .um-crumbs ol { padding-top: 0; }
.um-archiv-kopf p { max-width: 60ch; margin-bottom: 0; }
.um-archiv { padding-block: var(--um-section); }
.um-archiv .is-style-karte p { font-size: 1rem; }
.um-archiv .is-style-karte h2 { margin: 0; font-size: clamp(1.3125rem, 1.2rem + .48vw, 1.625rem); line-height: 1.3; }
.um-archiv .is-style-karte h2 a { color: var(--um-tinte); text-decoration: none; }
.um-archiv .is-style-karte h2 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--um-radius); }
.um-archiv .is-style-karte:hover { box-shadow: var(--um-shadow); }
.um-archiv .is-style-karte:hover h2 a { color: var(--um-blau); }
.um-archiv-kopf .is-style-dachzeile { margin: 1.75rem 0 0; color: var(--um-gelb); }
.um-archiv-kopf h1 { margin-top: .5rem; }
.um-pagination { margin-top: 2.5rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.um-pagination .page-numbers { display: inline-grid; place-items: center; min-width: 46px; height: 46px; padding: 0 .75rem; border: 1px solid var(--um-linie); border-radius: 10px; color: var(--um-tinte); text-decoration: none; font-weight: 700; }
.um-pagination .current { background: var(--um-blau); border-color: var(--um-blau); color: #fff; }

/* ---------- 404 ---------- */
.um-404 { padding-block: var(--um-section); text-align: center; }

.um-404 .wp-block-buttons, .um-404__links { justify-content: center; }
.um-404__links { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: 2rem; padding: 0; list-style: none; }

/* ---------- Fußzeile ---------- */
.um-footer { background: var(--um-tinte); color: rgba(255, 255, 255, .78); font-size: 1rem; }
.um-footer a { color: #fff; text-decoration: none; }
.um-footer a:hover { text-decoration: underline; }
.um-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1.4fr 1fr; gap: clamp(2rem, 4vw, 3.5rem); padding-block: clamp(3rem, 6vw, 5rem); }
@media (max-width: 1000px) { .um-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .um-footer__grid { grid-template-columns: 1fr; } }
.um-footer__titel { margin: 0 0 1rem; color: #fff; font-family: var(--um-head); font-weight: 600; font-size: 1.125rem; }
.um-footer ul { list-style: none; margin: 0; padding: 0; }
.um-footer li + li { margin-top: .5rem; }
.um-footer__marke .um-logo { padding: .6rem .8rem; background: #fff; border-radius: 10px; }
.um-footer__marke .um-logo svg, .um-footer__marke .um-logo img { height: 46px; }
.um-footer__marke p { margin: 1rem 0 0; }
.um-footer address { font-style: normal; }
.um-footer__nap li { display: flex; gap: .6rem; align-items: flex-start; }
.um-footer__nap .um-icon { margin-top: .15em; color: var(--um-gelb); }
.um-footer__orte { line-height: 1.7; }
.um-footer__orte p { margin: 0 0 .75rem; }
.um-footer__orte strong { color: #fff; }
.um-footer__unten { border-top: 1px solid rgba(255, 255, 255, .12); }
.um-footer__unten .um-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 2rem; padding-block: 1.25rem; font-size: .9375rem; }
.um-footer__recht { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.um-footer__recht li + li { margin-top: 0; }
.um-footer__recht button { padding: 0; border: 0; background: none; color: #fff; font: inherit; cursor: pointer; }
.um-footer__recht button:hover { text-decoration: underline; }
.um-footer__credit a { color: rgba(255, 255, 255, .78); }

/* ---------- Cookie-Banner ---------- */
.um-consent-banner { position: fixed; z-index: 200; left: 1rem; right: 1rem; bottom: 1rem; max-width: 560px; padding: 1.25rem 1.4rem; background: #fff; color: var(--um-text); border: 1px solid var(--um-linie); border-radius: 16px; box-shadow: 0 20px 50px -15px rgba(12, 20, 31, .35); font-size: .9375rem; line-height: 1.5; }
.um-consent-banner[hidden] { display: none; }
.um-consent-banner p { margin: 0 0 .9rem; }
.um-consent-banner__title { font-family: var(--um-head); font-weight: 600; font-size: 1.125rem; color: var(--um-tinte); margin-bottom: .5rem !important; }
.um-consent-banner__actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.um-consent-banner .um-btn { min-height: 46px; padding: .6em .8em; font-size: 1rem; }
@media (max-width: 420px) { .um-consent-banner__actions { grid-template-columns: 1fr; } }

/* ---------- Druck ---------- */
@media print {
	.um-header, .um-footer, .um-aktion, .um-consent-banner, .um-form { display: none !important; }
	.um-hero.alignfull, .is-style-blau { background: none !important; color: #000 !important; }
	.um-hero :where(h1, h2, strong), .is-style-blau :where(h1, h2, h3) { color: #000 !important; }
}

/* Gleichfarbige Abschnitte direkt hintereinander: kein doppelter Abstand */
.um-content > .alignfull:not([class*="is-style-"]):not(.um-hero) + .alignfull:not([class*="is-style-"]):not(.um-hero),
.um-content > .alignfull.is-style-sand + .alignfull.is-style-sand,
.um-content > .alignfull.is-style-blau + .alignfull.is-style-blau { padding-top: 0; }

/* Karten in blauen Bereichen */
.um-hero .is-style-karte { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .2); }
.um-hero .is-style-karte p { margin: 0; }
.um-hero .is-style-karte * + p { margin-top: .4rem; }
.um-content h2.um-h3 { font-size: clamp(1.1875rem, 1.12rem + .29vw, 1.375rem); }
.is-style-karte.um-karte--blau { background: var(--um-blau); border-color: var(--um-blau); color: rgba(255, 255, 255, .92); }
.um-karte--blau :where(h3, strong) { color: #fff; }
.um-karte--blau .wp-block-buttons { margin-top: auto; padding-top: 1rem; }
.um-karte--blau .wp-block-button__link { background: var(--um-gelb); border-color: var(--um-gelb); color: var(--um-tinte); }
.um-karte--blau .is-style-outline .wp-block-button__link { background: transparent; border-color: rgba(255, 255, 255, .7); color: #fff; }
.is-style-karte.um-karte--sand { background: var(--um-sand); border-color: transparent; }
.um-content > .um-karte--sand { margin-top: var(--um-section); padding: clamp(1.5rem, 4vw, 2.25rem); }
.um-content > .um-verlinkung { padding-top: 1.5rem; border-top: 1px solid var(--um-linie); font-size: 1rem; }
.um-content > .um-verlinkung > * + * { margin-top: .5rem; }

/* Formular in blauen Bereichen behält seine eigenen Farben */
.um-hero .um-form a, .is-style-blau .um-form a { color: var(--um-blau); }
.um-hero .um-form strong, .is-style-blau .um-form strong { color: inherit; }
/* Mobil: kein backdrop-filter, sonst bezieht sich das fixierte Menü auf die Kopfzeile */
@media (max-width: 1060px) { .um-header { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; } }

/* ---------- Hero mit Bild (Block „Cover“) ---------- */
.um-content > .wp-block-cover.um-hero { display: block; min-height: 0; padding: clamp(2.5rem, 5vw, 4.5rem) var(--um-pad) clamp(3rem, 6vw, 5.5rem); background: var(--um-tinte); border-bottom: 6px solid var(--um-blau); }
.um-has-hero .um-crumbs--hero { background: var(--um-tinte); }
.um-hero.wp-block-cover .wp-block-cover__image-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; z-index: 0; border-radius: 0; }
.um-hero.wp-block-cover .wp-block-cover__background { position: absolute; inset: 0; z-index: 1; opacity: 1 !important; background: linear-gradient(90deg, rgba(6, 10, 34, .94) 0%, rgba(6, 10, 34, .84) 45%, rgba(6, 10, 34, .62) 100%) !important; }
.um-hero.wp-block-cover .wp-block-cover__inner-container { position: relative; z-index: 2; width: 100%; color: inherit; }
.um-hero.wp-block-cover .wp-block-cover__inner-container > .wp-block-columns { max-width: var(--um-wide); margin-inline: auto; }
.um-hero.wp-block-cover::before { display: none; }
@media (max-width: 860px) {
	.um-hero.wp-block-cover .wp-block-cover__background { background: linear-gradient(180deg, rgba(6, 10, 34, .72) 0%, rgba(6, 10, 34, .84) 30%, rgba(6, 10, 34, .9) 100%) !important; }
}
.um-hero.wp-block-cover > .wp-block-cover__image-background,
.um-hero.wp-block-cover > .wp-block-cover__background,
.um-hero.wp-block-cover > .wp-block-cover__inner-container { max-width: none; margin: 0; }

/* =========================================================================
 * Feinschliff 1.0.2: keine Unterstreichungen, Farben, Handy
 * ====================================================================== */

/* Links ohne Unterstreichung – erkennbar an Farbe und Stärke */
body a, body a:hover, body a:focus, body a:where(:not(.wp-element-button)) { text-decoration: none; }
.um-content a:not(.wp-block-button__link), .um-autor a, .um-form a, .um-consent-banner a { color: var(--um-blau); font-weight: 700; transition: color .15s; }
.um-content a:not(.wp-block-button__link):hover, .um-autor a:hover, .um-form a:hover, .um-consent-banner a:hover { color: var(--um-blau-dunkel); }
.is-style-blau a:not(.wp-block-button__link), .um-hero a:not(.wp-block-button__link), .um-karte--blau a:not(.wp-block-button__link) { color: var(--um-gelb); }
.is-style-blau a:not(.wp-block-button__link):hover, .um-hero a:not(.wp-block-button__link):hover { color: #fff; }
.um-hero .um-form a { color: var(--um-blau); }
.um-content .is-style-karte :where(h3, h4) a, .um-archiv .is-style-karte h2 a { font-weight: inherit; color: var(--um-tinte); }
.um-content .is-style-karte:hover :where(h3, h4) a { color: var(--um-blau); }
.um-crumbs a { font-weight: 400; color: inherit; opacity: .85; }
.um-crumbs a:hover { opacity: 1; color: inherit; }
.um-footer a:hover { text-decoration: none; color: var(--um-gelb); }
.um-footer__recht button:hover { text-decoration: none; color: var(--um-gelb); }
.um-footer__credit a:hover { color: var(--um-gelb); }

/* Schritt-Nummern: blau auf hellem Grund, gelb nur auf Blau */
.um-schritte > .is-style-karte::before { background: var(--um-blau); color: #fff; }
.is-style-blau .um-schritte > .is-style-karte::before { background: var(--um-gelb); color: var(--um-tinte); }

/* Raster mit fester Spaltenzahl (gerade Anzahl Karten bleibt symmetrisch) */
.um-grid--2 { grid-template-columns: 1fr; }
.um-grid--4 { grid-template-columns: 1fr; }
.um-grid--3 { grid-template-columns: 1fr; }
@media (min-width: 640px) {
	.um-grid--2, .um-grid--3, .um-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1000px) {
	.um-grid--3 { grid-template-columns: repeat(3, 1fr); }
	.um-grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* Rechtstexte: ruhigere Überschriften */
body:not(.um-has-hero) .um-content > h2 { font-size: clamp(1.375rem, 1.2rem + .7vw, 1.75rem); margin-top: 2.25rem; }
body:not(.um-has-hero) .um-content > h3 { font-size: clamp(1.1875rem, 1.12rem + .29vw, 1.375rem); }
.single .um-content > h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem); }

/* Handy */
@media (max-width: 600px) {
	:root { --um-section: 3rem; }
	.is-style-dachzeile { font-size: .8125rem; letter-spacing: .04em; }
	.is-style-dachzeile::after { width: 2.5rem; }
	h1, h2, h3 { hyphens: manual; -webkit-hyphens: manual; overflow-wrap: break-word; }
	.um-content .wp-block-buttons { display: grid; grid-template-columns: 1fr; gap: .6rem; }
	.um-content .wp-block-buttons .wp-block-button, .um-content .wp-block-buttons .wp-block-button__link { width: 100%; }
	.um-hero .is-style-haken { font-size: 1rem; }
	.um-hero .wp-block-columns { gap: 2rem; }
	.um-content > .wp-block-cover.um-hero { padding-top: 2rem; padding-bottom: 2.5rem; }
	.um-form { padding: 1.25rem 1rem; border-radius: 16px; }
	.um-form__steps { font-size: .8125rem; }
	.is-style-karte { padding: 1.25rem; }
	.is-style-karte > .wp-block-image:first-child { margin: -1.25rem -1.25rem 1rem; }
	.um-schritte > .is-style-karte { padding-top: 4rem; }
	.um-schritte > .is-style-karte::before { left: 1.25rem; }
	.wp-block-details summary { font-size: 1.0625rem; padding-right: 2.5rem; }
	.wp-block-details > :not(summary) { padding-right: 0; }
	.um-footer li + li { margin-top: .7rem; }
	.um-footer__unten .um-wrap { flex-direction: column; align-items: flex-start; }
	.um-crumbs { font-size: .875rem; }
	/* Tabellen als Karten statt seitlichem Scrollen */
	.wp-block-table table { min-width: 0; }
	.wp-block-table thead { display: none; }
	.wp-block-table tr { display: block; padding: .8rem 0; border-bottom: 1px solid var(--um-linie); }
	.um-content .wp-block-table td, .um-content .wp-block-table th { display: block; padding: .15rem 0; border: 0; }
	.wp-block-table td:first-child { font-weight: 700; color: var(--um-tinte); }
}

/* Tabellen: nur waagerechte Linien */
.um-content .wp-block-table th, .um-content .wp-block-table td { border: 0; border-bottom: 1px solid var(--um-linie); }
.um-content .wp-block-table thead th { border-bottom: 2px solid var(--um-blau); }
.um-content .wp-block-table table { border: 0; }
@media (max-width: 600px) { .um-content .wp-block-table th, .um-content .wp-block-table td { border: 0; } }

/* =========================================================================
 * Layout 1.0.3: einheitliche Kante, ruhigere Farben, Zweispalter, Chips
 * ====================================================================== */
:root { --um-nacht: var(--wp--preset--color--nacht, #0b1238); --um-text-w: 46rem; }

/* Abschnitte: alles beginnt an derselben linken Kante wie Raster und Karten */
.um-content > .wp-block-group.alignfull > * { max-width: var(--um-wide); margin-left: auto; margin-right: auto; }
.um-content > .wp-block-group.alignfull > :is(p, h2, h3, ul, ol, .wp-block-details) { padding-right: max(0px, calc(min(100%, var(--um-wide)) - var(--um-text-w))); }
.um-content > .wp-block-group.alignfull > .wp-block-columns { margin-top: 0; }
.um-content > .wp-block-group.alignfull > * + .um-grid,
.um-content > .wp-block-group.alignfull > * + .wp-block-columns { margin-top: clamp(2rem, 4vw, 3rem); }

/* Dunkle Abschnitte: Nachtblau statt greller Fläche */
.is-style-blau { background: radial-gradient(900px 420px at 88% 0%, rgba(0, 0, 238, .38), rgba(0, 0, 238, 0) 70%), var(--um-nacht); color: rgba(255, 255, 255, .86); }
.is-style-blau .is-style-karte { background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); }
.is-style-blau .is-style-karte p { color: rgba(255, 255, 255, .8); }

/* Akzentstrich über Kartentiteln ohne Bild */
.is-style-karte > :is(h2, h3):first-child::before { content: ""; display: block; width: 2.25rem; height: 4px; margin-bottom: 1rem; border-radius: 2px; background: var(--um-blau); }
.is-style-blau .is-style-karte > :is(h2, h3):first-child::before, .um-hero .is-style-karte > :is(h2, h3):first-child::before { background: var(--um-gelb); }
.um-schritte > .is-style-karte > :is(h2, h3):first-child::before, .um-karte--blau > h3:first-child::before { display: none; }

/* Zweispalter: Überschrift links, Inhalt rechts */
.um-split { align-items: flex-start; gap: clamp(2rem, 6vw, 6rem); }
.um-split > .wp-block-column:first-child { flex: 0 0 34%; }
.um-split > .wp-block-column:last-child { flex: 1 1 0; }
@media (min-width: 861px) { .um-split > .wp-block-column:first-child { position: sticky; top: calc(var(--um-header-h) + 2rem); } }
.um-split > .wp-block-column:first-child h2 { margin-top: .6rem; }
.um-split > .wp-block-column:last-child > h3 { font-size: clamp(1.125rem, 1.08rem + .2vw, 1.25rem); }
.um-split > .wp-block-column:last-child > * + h3 { margin-top: 2rem; }
.um-split .is-style-karte > .wp-block-image:first-child img { aspect-ratio: 16 / 9; }
.um-faq .um-split > .wp-block-column:last-child > .wp-block-details:first-child { border-top: 1px solid var(--um-linie); }
.um-content :where(.wp-block-column) > .wp-block-details + .wp-block-details { margin-top: 0; }

/* Schlagwörter (Orte, Leistungen) */
.um-content ul.is-style-chips { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; list-style: none; }
.is-style-chips li { margin: 0 !important; padding: .45rem .95rem; border: 1px solid var(--um-linie); border-radius: 999px; background: #fff; color: var(--um-tinte); font-size: .9375rem; line-height: 1.4; }
.is-style-chips li:has(a) { padding: 0; }
.um-content .is-style-chips a { display: block; padding: .45rem .95rem; color: var(--um-tinte); font-weight: 700; }
.um-content .is-style-chips a:hover { color: var(--um-blau); }
.is-style-chips li:has(a:hover) { border-color: var(--um-blau); }

/* Abschluss-Aufruf als Karte */
.um-content > .um-cta.alignfull { background: transparent; text-align: center; }
.um-cta__karte { position: relative; overflow: hidden; padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1.25rem, 5vw, 4rem); border-radius: 24px; background: var(--um-blau); color: rgba(255, 255, 255, .9); }
.um-cta__karte::after { content: ""; position: absolute; inset: auto -10% -60% auto; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 65%); pointer-events: none; }
.um-cta__karte > * { position: relative; z-index: 1; max-width: 44rem; margin-left: auto; margin-right: auto; }
.um-cta__karte h2 { color: #fff; }
.um-content .um-cta__karte > * + * { margin-top: 1rem; }
.um-content .um-cta__karte > * + .wp-block-buttons { margin-top: 2rem; }
.um-cta__karte .wp-block-buttons { justify-content: center; }
.um-cta__karte .wp-block-button__link { background: var(--um-gelb); border-color: var(--um-gelb); color: var(--um-tinte); }
.um-cta__karte .wp-block-button__link:hover { background: #fff; border-color: #fff; }
.um-cta__karte .is-style-outline .wp-block-button__link { background: transparent; border-color: rgba(255, 255, 255, .7); color: #fff; }
.um-cta__karte .is-style-outline .wp-block-button__link:hover { background: #fff; color: var(--um-blau); }

/* Text in Karten etwas kompakter */
.is-style-karte p, .is-style-karte li { font-size: 1.0625rem; }
.um-footer .um-footer__recht li + li { margin-top: 0; }

/* Kontaktseite */
.um-hero--kontakt h1 { max-width: 18ch; font-size: clamp(2rem, 1.5rem + 2vw, 3.25rem); }
.um-content ul.is-style-kontakt { display: grid; gap: .9rem; margin-top: 1.75rem; padding: 0; list-style: none; }
.is-style-kontakt li { position: relative; display: flex; flex-direction: column; min-height: 2.75rem; justify-content: center; margin: 0 !important; padding-left: 3.75rem; font-size: 1.0625rem; line-height: 1.45; }
.is-style-kontakt li strong { font-family: var(--um-head); font-weight: 600; font-size: .875rem; letter-spacing: .04em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.is-style-kontakt li::before { content: ""; position: absolute; left: 0; top: 50%; width: 2.75rem; height: 2.75rem; margin-top: -1.375rem; border-radius: 12px; background: rgba(255, 255, 255, .1) center / 1.35rem no-repeat; }
.is-style-kontakt li:nth-child(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffff00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E"); }
.is-style-kontakt li:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffff00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E"); }
.is-style-kontakt li:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffff00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E"); }
.is-style-kontakt li:nth-child(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffff00' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.um-hero .is-style-kontakt a { color: #fff; font-weight: 700; font-size: 1.1875rem; }
.um-hero .is-style-kontakt a:hover { color: var(--um-gelb); }
.um-hero--kontakt .wp-block-buttons { margin-top: 2rem; }

/* Einheitliche Hero-Höhe und gleiche Abstände oben/unten */
.um-content > .wp-block-cover.um-hero { padding-top: clamp(3rem, 6vw, 5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
@media (min-width: 1000px) {
	.um-content > .wp-block-cover.um-hero { display: flex; align-items: center; min-height: 860px; }
}
@media (max-width: 600px) {
	.um-content > .wp-block-cover.um-hero { padding-top: 2.5rem; padding-bottom: 2.5rem; }
}
.um-content ul.is-style-kontakt { gap: .7rem; margin-top: 1.25rem; }
.um-hero--kontakt .wp-block-buttons { margin-top: 1.5rem; }
/* Kontaktseite mobil: Formular zuerst, Kontaktdaten und Buttons danach */
@media (max-width: 781px) {
	.um-hero--kontakt .wp-block-columns { gap: 0; }
	.um-hero--kontakt .wp-block-column:first-child { display: contents; }
	.um-hero--kontakt .wp-block-column:first-child > * { order: 1; width: 100%; }
	.um-hero--kontakt .wp-block-column:last-child { order: 2; margin-top: 1.75rem; }
	.um-hero--kontakt .wp-block-column:first-child > .is-style-kontakt { order: 3; margin-top: 2.25rem; }
	.um-hero--kontakt .wp-block-column:first-child > .wp-block-buttons { order: 4; }
}

/* FAQ: als Aufklapp-Element erkennbar, nicht wie ein Link */
.wp-block-details summary:hover { color: var(--um-tinte); }
.wp-block-details summary::after { width: 2rem; height: 2rem; margin-top: -1rem; background: var(--um-blau) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 55% no-repeat; }
.is-style-sand .wp-block-details summary::after { background-color: var(--um-blau); }
.wp-block-details summary:hover::after { background-color: var(--um-blau-dunkel); }
.wp-block-details[open] summary::after { background-color: var(--um-tinte); }
.wp-block-details summary:focus-visible { outline-offset: 4px; }

/* 1.0.4: Hero mobil kompakter, damit das Formular früher sichtbar ist */
@media (max-width: 600px) {
	.um-hero:not(.um-hero--kontakt) .wp-block-buttons .is-style-outline { display: none; }
	.um-hero .is-style-haken { margin-top: 1.25rem; }
	.um-hero .is-style-haken li + li { margin-top: .35rem; }
	.um-hero .um-lead { font-size: 1.0625rem; }
}

/* Quellenangaben in Ratgeber-Artikeln */
.um-content .um-quellen { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--um-linie); font-size: .9375rem; line-height: 1.6; }

/* 1.0.5: H1 im Hero am Desktop zweizeilig (Ortsname in einer Zeile) */
@media (min-width: 1000px) {
	.um-hero h1, .um-hero--kontakt h1 { max-width: none; font-size: clamp(2.5rem, .9rem + 2.65vw, 3.25rem); }
}

/* 1.0.6: Am Handy nur die ersten 2 Vorteile im Hero, damit das Formular früher sichtbar ist */
@media (max-width: 600px) {
	.um-hero .is-style-haken li:nth-child(n+3) { display: none; }
}

/* 1.0.7: Ratgeber-Karten neben der Überschrift kompakter */
.um-split .um-grid--2 .is-style-karte h3 { font-size: clamp(1.125rem, 1.08rem + .2vw, 1.25rem); }

/* 1.1.0: Animationen – dezent, nur ohne „Bewegung reduzieren“, keine Layout-Verschiebung */
.um-header { transition: box-shadow .25s; }
.um-gescrollt .um-header { box-shadow: 0 8px 24px -16px rgba(12, 20, 31, .35); }
.wp-block-details summary::after { transition: transform .25s, background-color .2s; }
@media (prefers-reduced-motion: no-preference) {
	.um-reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s cubic-bezier(.2, .7, .2, 1), transform .6s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--um-delay, 0s); }
	.um-reveal.um-sichtbar { opacity: 1; transform: none; }
	.um-content > .wp-block-cover.um-hero .wp-block-cover__image-background { animation: um-zoom 1.8s cubic-bezier(.2, .7, .2, 1) both; }
	.um-hero .um-form { animation: um-hoch .7s .15s cubic-bezier(.2, .7, .2, 1) both; }
	@keyframes um-zoom { from { transform: scale(1.06); } to { transform: none; } }
	@keyframes um-hoch { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
	.wp-block-button__link, .um-btn { transition: background-color .15s, border-color .15s, color .15s, transform .2s, box-shadow .2s; }
	.wp-block-button__link:hover, .um-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 20px -12px rgba(0, 0, 60, .45); }
	.is-style-karte:has(h3 a, h4 a) .wp-block-image { overflow: hidden; }
	.is-style-karte:has(h3 a, h4 a) .wp-block-image img { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
	.is-style-karte:has(h3 a, h4 a):hover .wp-block-image img { transform: scale(1.04); }
	.is-style-chips li { transition: border-color .15s, transform .2s; }
	.is-style-chips li:has(a:hover) { transform: translateY(-2px); }
	.wp-block-details { interpolate-size: allow-keywords; }
	.wp-block-details::details-content { height: 0; overflow: clip; transition: height .3s ease, content-visibility .3s allow-discrete; }
	.wp-block-details[open]::details-content { height: auto; }
}
@media print { .um-reveal { opacity: 1 !important; transform: none !important; } }

/* 1.2.0 Grafiken: Symbole auf Karten (automatisch nach Überschrift vergeben) */
.um-ic::after { content: ""; order: -1; flex: none; width: 3rem; height: 3rem; margin-bottom: .25rem; border-radius: 14px; background: #eceeff var(--ic) center / 1.55rem no-repeat; }
.is-style-sand .um-ic::after { background-color: #fff; }
.is-style-blau .um-ic::after { background-color: rgba(255, 255, 255, .16); filter: brightness(0) invert(1); }
.um-schritte .um-ic::after { display: none; }
@media (prefers-reduced-motion: no-preference) { .um-ic::after { transition: transform .25s; } .um-ic:hover::after { transform: rotate(-6deg) scale(1.06); } }
.um-ic--lupe { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="6.5"/><path d="m16 16 4.5 4.5"/></svg>'); }
.um-ic--plan { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9 4V2.8h6V4M8.5 10h7M8.5 14h7M8.5 18h4"/></svg>'); }
.um-ic--kiste { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M3 8 12 4l9 4v9l-9 4-9-4z"/><path d="m3 8 9 4 9-4M12 12v9"/></svg>'); }
.um-ic--werkzeug { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14.5 6.5a4 4 0 0 0-5.3 5.2L3.8 17.1a1.8 1.8 0 0 0 2.6 2.6l5.4-5.4a4 4 0 0 0 5.2-5.3l-2.4 2.4-2.4-.6-.6-2.4z"/></svg>'); }
.um-ic--schild { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3 5 6v5.5c0 4.3 3 7.7 7 9.5 4-1.8 7-5.2 7-9.5V6z"/><path d="m9 12 2.2 2.2L15.5 10"/></svg>'); }
.um-ic--team { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="8" r="3"/><path d="M3.5 19a5.5 5.5 0 0 1 11 0"/><circle cx="17" cy="9" r="2.4"/><path d="M15.5 14.2A4.5 4.5 0 0 1 21 18.5"/></svg>'); }
.um-ic--lkw { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h11v10H3zM14 9h4l3 3v4h-7"/><circle cx="7" cy="17.5" r="1.8"/><circle cx="17" cy="17.5" r="1.8"/></svg>'); }
.um-ic--server { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="4" width="16" height="6" rx="1.5"/><rect x="4" y="14" width="16" height="6" rx="1.5"/><path d="M8 7h.01M8 17h.01"/></svg>'); }
.um-ic--recycling { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M7 19H4.5a1.5 1.5 0 0 1-1.3-2.2L5 13.5M12 4.5l1.3 2.2M17 19h2.5a1.5 1.5 0 0 0 1.3-2.2L19 13.5"/><path d="M9 19h6M5.8 9.8 8.5 5.2a1.5 1.5 0 0 1 2.6 0M18.2 9.8l-1.5-2.6"/><path d="m3.5 11 2.3-1.2 1.2 2.3M13 19l2 2M13 19l2-2M15 5.2l1.7 2.6-2.7.4"/></svg>'); }
.um-ic--halteverbot { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="8.5"/><path d="m6 6 12 12M18 6 6 18"/></svg>'); }
.um-ic--uhr { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="8.5"/><path d="M12 7.5V12l3 2"/></svg>'); }
.um-ic--euro { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M17 6.5A6.5 6.5 0 1 0 17 17.5"/><path d="M4.5 10.5h8M4.5 13.5h8"/></svg>'); }
.um-ic--herz { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20s-7.5-4.6-7.5-10A4.5 4.5 0 0 1 12 7a4.5 4.5 0 0 1 7.5 3c0 5.4-7.5 10-7.5 10z"/></svg>'); }
.um-ic--person { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8" r="3.5"/><path d="M5 20a7 7 0 0 1 14 0"/></svg>'); }
.um-ic--pin { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z"/><circle cx="12" cy="9.5" r="2.5"/></svg>'); }
.um-ic--buero { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="3" width="11" height="18" rx="1"/><path d="M15 9h5v12h-5M8 7h3M8 11h3M8 15h3"/></svg>'); }
.um-ic--haus { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 11 12 4l8 7v9H4z"/><path d="M10 20v-6h4v6"/></svg>'); }
.um-ic--hand { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M7 11V6.5a1.5 1.5 0 0 1 3 0V11m0-5.5V4.5a1.5 1.5 0 0 1 3 0V11m0-5a1.5 1.5 0 0 1 3 0v5.5m0-3a1.5 1.5 0 0 1 3 0V14a7 7 0 0 1-7 7h-.5a6.5 6.5 0 0 1-5.4-2.9L4 14.6a1.6 1.6 0 0 1 2.6-1.8L7 13.3"/></svg>'); }
.um-ic--stern { --ic: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230000ee" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="m12 3.5 2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.9 6.8 19.6l1-5.8L3.5 9.7l5.9-.9z"/></svg>'); }
.um-ic > :is(h2, h3):first-child::before { display: none; }