/*
Theme Name: Elternweiser
Template: basis
Author: digital encore
Author URI: https://digitalencore.agency/
Description: Child-Theme für elternweiser.de: Farben, Schrift, Logo, Vorlagen und Muster. Braucht Basis ab 0.2.0; Funktionen liefert das Kern-Plugin Elternweiser.
Version: 0.1.14
Requires at least: 7.0
Tested up to: 7.1
Requires PHP: 8.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: elternweiser
Tags: full-site-editing, block-patterns, custom-colors
*/

/*
 * Gestaltung, die nicht in theme.json passt. Werte aus marke/DESIGN_2026-09-22.md.
 * Breiten: S bis 600 px, M 601–1023 px, L ab 1024 px.
 * Die Klassen ew-… der Kern-Blöcke sind im HTML-Vertrag festgelegt (vertrag/HTML-VERTRAG.md im Repository).
 */

/* ---------- Token ---------- */
:root {
	--ew-text: var(--wp--preset--color--text);
	--ew-muted: var(--wp--preset--color--text-leise);
	--ew-brand: var(--wp--preset--color--akzent);
	--ew-line: var(--wp--preset--color--linie);
	--ew-grau: var(--wp--preset--color--flaeche);
	--ew-focus: var(--wp--preset--color--fokus);
	--ew-r: 8px;
	--ew-r-gross: 12px;
	--ew-rand: 32px;
}
/* Bereichsfarbe: dunkel (c), Fläche (c-t), Schmuck (c-s). Standard Geld; der Kern setzt ew-bereich-… an body. */
body,
.ew-c-geld,
.ew-bereich-geld { --ew-c: var(--wp--preset--color--geld); --ew-c-t: var(--wp--preset--color--geld-flaeche); --ew-c-s: var(--wp--preset--color--geld-schmuck); }
.ew-c-kita,
.ew-bereich-kita { --ew-c: var(--wp--preset--color--kita); --ew-c-t: var(--wp--preset--color--kita-flaeche); --ew-c-s: var(--wp--preset--color--kita-schmuck); }
.ew-c-kind,
.ew-bereich-kind { --ew-c: var(--wp--preset--color--kind); --ew-c-t: var(--wp--preset--color--kind-flaeche); --ew-c-s: var(--wp--preset--color--kind-schmuck); }
.ew-c-reisen,
.ew-bereich-reisen { --ew-c: var(--wp--preset--color--reisen); --ew-c-t: var(--wp--preset--color--reisen-flaeche); --ew-c-s: var(--wp--preset--color--reisen-schmuck); }
.ew-c-kueche,
.ew-bereich-kueche { --ew-c: var(--wp--preset--color--kueche); --ew-c-t: var(--wp--preset--color--kueche-flaeche); --ew-c-s: var(--wp--preset--color--kueche-schmuck); }
.ew-c-leben,
.ew-bereich-leben { --ew-c: var(--wp--preset--color--leben); --ew-c-t: var(--wp--preset--color--leben-flaeche); --ew-c-s: var(--wp--preset--color--leben-schmuck); }

/* ---------- Grundgerüst ---------- */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
a { text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
/* Fokus (O-062, Code-Feinschliff 1): 2 px Rahmen in Textfarbe (15,6 : 1 gegen Weiß, WCAG 2.4.7/2.4.13) mit 2 px
   Abstand; der Schatten füllt nur diesen Abstand gelb (kleiner Halo, vorher 3 + 3 px). Der Rahmen trägt den Kontrast. */
:root { --ew-fokus-rahmen: 2px solid var(--ew-text); --ew-fokus-abstand: 2px; --ew-fokus-halo: 0 0 0 4px var(--ew-focus); }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--ew-fokus-rahmen);
	outline-offset: var(--ew-fokus-abstand);
	border-radius: 4px;
	box-shadow: var(--ew-fokus-halo);
}
.ew-wrap { box-sizing: border-box; max-width: 1180px; margin-inline: auto; padding-inline: var(--ew-rand); }
.skip-link.screen-reader-text:focus { min-height: 44px; }

/* ---------- Seitenkopf ---------- */
.ew-kopf { position: relative; background: #fff; }
.ew-farbband { display: flex; height: 5px; }
.ew-farbband i { flex: 1; background: var(--ew-c-s); }
.ew-kopf-zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 20px; padding-top: 20px; }
.ew-kopf-zeile > * { margin: 0; }
.ew-marke { --ls: 2rem; display: block; min-height: 44px; margin-bottom: 14px; color: var(--ew-text); text-decoration: none; }
.ew-marke:hover { text-decoration: none; }

/* Wortmarke als Text mit Schild (DESIGN 5) */
.ew-wortmarke { display: inline-block; font-size: var(--ls, 2rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; color: var(--ew-text); }
.ew-idot { position: relative; }
/* Echtes „i“ (Name bleibt „Elternweiser“ für Screenreader und WCAG 2.5.3); sein Punkt wird abgeschnitten, das Schild steht an seiner Stelle.
   Alles inline, sonst setzt der Browser Leerzeichen in den Namen. Werte für Figtree 800 gemessen (Inhaltsbereich 1,2 em): Punkt 0,21–0,38 em, Stamm ab 0,45 em; Schild an marke/logo/logo-wortmarke.svg angeglichen. */
.ew-i { clip-path: inset(0.415em -0.2em -0.3em -0.2em); }
.ew-idot svg { position: absolute; left: 50%; top: 0.12em; width: 0.4em; height: 0.22em; transform: translateX(-35%); fill: var(--ew-brand); }
.ew-claim { display: block; padding-left: calc(var(--ls, 2rem) * 0.06 - 0.08em); margin-top: 5px; font-size: 0.875rem; font-weight: 500; letter-spacing: 0; color: var(--ew-muted); }

/* Suchfeld als Pille (Kopf, mobiles Menü, Suche, 404) */
.ew-suche .wp-block-search__inside-wrapper { display: flex; border: 0; padding: 0; }
.ew-suche .wp-block-search__input { box-sizing: border-box; min-height: 46px; padding: 8px 16px; font: inherit; font-size: 1rem; color: var(--ew-text); background: #fff; border: 2px solid var(--ew-muted); border-right: 0; border-radius: 999px 0 0 999px; }
.ew-suche .wp-block-search__button { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; min-height: 46px; margin: 0; padding: 0 12px; color: #fff; background: var(--ew-brand); border: 2px solid var(--ew-brand); border-radius: 0 999px 999px 0; cursor: pointer; }
.ew-suche .wp-block-search__button svg { width: 22px; height: 22px; fill: currentColor; }
.ew-suche-kopf { margin-bottom: 14px; }
.ew-suche-kopf .wp-block-search__input { width: 280px; }
.ew-suche-menue { display: none; }

/* Lupe und Menü-Knopf (M, S) */
.ew-lupe,
.ew-hauptmenue .wp-block-navigation__responsive-container-open { box-sizing: border-box; display: none; align-items: center; justify-content: center; gap: 6px; min-width: 46px; min-height: 46px; padding: 0 12px; font: inherit; font-weight: 700; color: var(--ew-brand); background: #fff; border: 2px solid var(--ew-brand); border-radius: 999px; cursor: pointer; }
.ew-lupe { margin-bottom: 14px; margin-left: auto; }

/* ---------- Hauptmenü (L) ---------- */
.ew-menue-teil { flex-basis: 100%; order: 10; border-top: 1px solid var(--ew-line); }
.ew-hauptmenue { font-size: 1.0625rem; }
.ew-hauptmenue .wp-block-navigation-item__content { box-sizing: border-box; }
.ew-hauptmenue .wp-block-navigation__container { gap: 0; width: 100%; flex-wrap: nowrap; }
.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 12px 2px 12px 14px; font-weight: 650; color: var(--ew-text); text-decoration: none; }
.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item:first-child > .wp-block-navigation-item__content { padding-left: 0; }
.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ew-c-s); }
.ew-hauptmenue .ew-menue-quer > .wp-block-navigation-item__content::before,
.ew-hauptmenue .ew-menue-rechner > .wp-block-navigation-item__content::before { border-radius: 2px !important; }
.ew-hauptmenue .ew-menue-quer { margin-left: auto; }
.ew-hauptmenue .ew-menue-rechner > .wp-block-navigation-item__content { padding-right: 0 !important; }
.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover { color: var(--ew-c); text-decoration: underline; }
.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current] { color: var(--ew-c); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 8px; }
.ew-hauptmenue .wp-block-navigation-submenu__toggle { min-width: 44px; min-height: 48px; margin-left: -6px; padding: 0 8px; color: var(--ew-muted); background: none; border: 0; cursor: pointer; }
.ew-hauptmenue .wp-block-navigation-submenu__toggle svg { width: 14px; height: 14px; stroke: currentColor; }
.ew-hauptmenue .wp-block-navigation-submenu__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.ew-hauptmenue .wp-block-navigation__submenu-container { min-width: 250px !important; padding: 8px 0 !important; background: #fff !important; border: 0 !important; border-top: 4px solid var(--ew-c-s) !important; border-radius: 0 0 var(--ew-r) var(--ew-r); box-shadow: 0 10px 28px rgba(20, 35, 58, 0.15); }
.ew-hauptmenue .ew-menue-quer > .wp-block-navigation__submenu-container { left: auto !important; right: 0 !important; }
/* 1024–1279 px: Bereichsnamen einzeilig (E-061, „Küche & Feste“ brach sonst wie „Geld & Leistungen“ um). Gemessen: 16 px Luft bei 1024 px. */
@media (min-width: 1024px) and (max-width: 1279px) {
	.ew-hauptmenue { font-size: 0.9375rem; }
	.ew-hauptmenue .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { white-space: nowrap; gap: 6px; padding-left: 10px; }
}
.ew-hauptmenue .wp-block-navigation__submenu-container .wp-block-navigation-item__content { display: flex; align-items: center; min-height: 44px; padding: 10px 18px !important; color: var(--ew-text); text-decoration: none; }
.ew-hauptmenue .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--ew-c); background: var(--ew-c-t); }
.ew-hauptmenue .ew-alle-themen .wp-block-navigation-item__label { font-weight: 700; }
/* Aufklappen nur über den Pfeil (aria-expanded), nicht beim Durchtabben. Maus: WordPress setzt beim Überfahren ebenfalls aria-expanded. */
.ew-hauptmenue .has-child:not(.open-on-click):focus-within > .wp-block-navigation-submenu__toggle[aria-expanded="false"] ~ .wp-block-navigation__submenu-container,
.ew-hauptmenue .has-child:not(.open-on-click):hover > .wp-block-navigation-submenu__toggle[aria-expanded="false"] ~ .wp-block-navigation__submenu-container { visibility: hidden; opacity: 0; width: 0; height: 0; overflow: hidden; }

/* ---------- Inhalt: Grundlagen ---------- */
.ew-haupt { padding-bottom: 28px; }
.ew-brotkruemel { padding-top: 18px; font-size: 0.875rem; color: var(--ew-muted); }
.ew-brotkruemel a { display: inline-flex; align-items: center; min-height: 32px; color: var(--ew-muted); }
.ew-brotkruemel ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; margin: 0; padding: 0; list-style: none; }
.ew-brotkruemel li { display: inline-flex; align-items: center; min-height: 32px; }
.ew-brotkruemel li + li::before { content: "›"; margin-right: 6px; }
/* Yoast gibt die Brotkrümel als Spans aus; Trennzeichen „›“ in den Yoast-Einstellungen */
.ew-brotkruemel .yoast-breadcrumbs,
.ew-brotkruemel .yoast-breadcrumbs > span { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; }
.ew-brotkruemel .breadcrumb_last { display: inline-flex; align-items: center; min-height: 32px; }
.ew-seitenkopf { padding: 18px 0 8px; }
.ew-seitenkopf h1 { max-width: 26ch; margin: 0; }
.ew-seitenkopf .ew-chip { margin: 0 0 12px; }
.ew-seitenkopf .wp-block-search { margin-top: 16px; max-width: 560px; }
.ew-seitenkopf .wp-block-search__input { flex: 1; width: 100%; }
.is-style-lead,
.ew-lead { font-size: 1.2rem; color: var(--ew-muted); }
.ew-inhalt > .is-style-lead:first-child { margin-top: 2px; }

.ew-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; grid-template-areas: "inhalt spalte"; gap: 48px; align-items: start; padding-bottom: 28px; }
.ew-layout > .ew-prose { grid-area: inhalt; }
.ew-layout > .ew-seitenspalte { grid-area: spalte; position: sticky; top: 16px; }
.ew-layout > .ew-seitenspalte:empty { display: none; }
.ew-prose { min-width: 0; }
.ew-prose .ew-inhalt > :where(p, ul, ol, h2, h3, h4, blockquote, .ew-kurzantwort, .ew-faq, .ew-verweise--mehr, .ew-beratung, .ew-quellen, .ew-kasten-ab, .ew-hinweis-kasten, .ew-korrekturen),
.ew-prose > .ew-stand,
.ew-einspaltig .ew-inhalt > :where(p, ul, ol, h2, h3, h4) { max-width: 72ch; }
.ew-schmal { max-width: 46rem; }
/* Lebenslage und Rechner: ganze Spalte höchstens 72 Zeichen (Entwurf „layout one“). Bereich und Übersicht nutzen die volle Breite. */
.ew-vorlage-lebenslage .ew-prose,
.ew-vorlage-rechner .ew-prose { max-width: 72ch; }
.ew-vorlage-bereich .ew-inhalt > :not(p),
.ew-vorlage-uebersicht .ew-inhalt > :not(p) { max-width: none; }
.ew-inhalt > * { margin-block: 0 18px; } /* E-102: Blockabstand 18 px (vorher 12) */
.ew-inhalt ul:not([class]), .ew-inhalt ol:not([class]) { padding-left: 1.2em; }
.ew-inhalt li { margin-bottom: 8px; }
.ew-inhalt > h2,
.ew-inhalt > .wp-block-heading:is(h2) { margin: 56px 0 12px; font-size: var(--wp--preset--font-size--sehr-gross); scroll-margin-top: 16px; } /* E-102: 56 px, bis 600 px 48 px */
.ew-inhalt > h3 { margin: 32px 0 8px; } /* E-102 */
.ew-inhalt > h2:first-child { margin-top: 12px; }

/* Etikett (Kurzantwort, Kasten) und Chip */
.ew-etikett { margin: 0 0 6px; font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: var(--ew-c); }
.ew-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 8px; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.02em; color: var(--ew-c); background: var(--ew-c-t); border-radius: 999px; }
.ew-chip::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--ew-c-s); }

/* Kurzantwort */
.ew-kurzantwort { margin: 8px 0 20px; padding: 18px 22px; font-size: 1.125rem; background: var(--ew-c-t); border-left: 6px solid var(--ew-c-s); border-radius: var(--ew-r); }
.ew-kurzantwort p { margin: 0 0 12px; }
.ew-kurzantwort p:last-child { margin-bottom: 0; }

/* Kennwert-Karten */
.ew-karten { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0 0 16px; padding: 0; }
.ew-karte { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; background: #fff; border: 2px solid var(--ew-c-t); border-radius: var(--ew-r); }
.ew-karte dt { font-weight: 700; }
.ew-karte dd { margin: 0; }
.ew-karte dt a { color: var(--ew-text); text-decoration: none; }
.ew-karte dt a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ew-karte:has(dt a):hover { box-shadow: inset 0 0 0 2px var(--ew-c); }
.ew-karte:has(dt a):hover dt a { text-decoration: underline; }
.ew-karte:has(dt a:focus-visible) { outline: var(--ew-fokus-rahmen); outline-offset: var(--ew-fokus-abstand); box-shadow: var(--ew-fokus-halo); }
.ew-karte dt a:focus-visible { outline: none; box-shadow: none; }
.ew-wert { font-size: 1.6rem; font-weight: 750; line-height: 1.2; color: var(--ew-c); font-variant-numeric: tabular-nums; }
.ew-wert > span { white-space: nowrap; }
.ew-wert small { display: block; font-size: 0.95rem; font-weight: 500; color: var(--ew-text); }
.ew-karte-meta { margin-top: auto !important; padding-top: 6px; font-size: 0.875rem; color: var(--ew-muted); }
.ew-karte-meta a { position: relative; z-index: 1; }
.ew-karte--leer .ew-wert { font-size: 1rem; font-weight: 500; color: var(--ew-text); }
/* Startseite und Bereich: Fläche, drei Spalten, gleich hoch */
.ew-karten--flaeche { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 16px; }
.ew-karten--flaeche .ew-karte { height: 100%; box-sizing: border-box; padding: 20px 22px 18px; background: var(--ew-c-t); border: 0; }
.ew-karten--flaeche .ew-wert { margin-top: 4px; font-size: 1.5rem; }
.ew-karten--flaeche .ew-karte-meta { padding-top: 10px; }
.ew-karten .ew-karte--leer .ew-wert { font-size: 1rem; font-weight: 500; color: var(--ew-text); }

/* Kasten „Ab 1.1.“ */
.ew-kasten-ab { margin: 0 0 20px; padding: 16px 20px; background: #FFFBEA; border: 2px solid var(--wp--preset--color--leben-schmuck); border-radius: var(--ew-r); }
.ew-kasten-ab .ew-etikett { color: var(--wp--preset--color--leben); }
.ew-kasten-ab-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.ew-kasten-ab .ew-wert { font-size: 1.35rem; color: var(--ew-text); }
.ew-status { display: inline-block; padding: 2px 10px; font-size: 0.8125rem; font-weight: 700; white-space: nowrap; color: var(--wp--preset--color--leben); background: var(--wp--preset--color--leben-flaeche); border-radius: 999px; }
/* Viele Werte oder mehrere Daten (O-072, 1593): Liste in normaler Schrift, Plakette rechts, Datum als Zwischenzeile. */
.ew-kasten-ab--liste .ew-kasten-ab-zeile { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 4px 14px; padding: 6px 0; border-top: 1px solid rgba(20, 35, 58, 0.1); }
.ew-kasten-ab--liste .ew-wert { font-size: 1rem; font-weight: 500; line-height: 1.45; }
.ew-kasten-ab p.ew-kasten-ab-datum { margin: 14px 0 2px; font-size: 0.9375rem; font-weight: 700; color: var(--ew-text); }
.ew-kasten-ab .ew-etikett + p.ew-kasten-ab-datum { margin-top: 4px; }
.ew-kasten-ab p { margin: 6px 0 0; font-size: 0.9375rem; color: var(--ew-muted); }
/* Hinweis-Kasten (Interessenkonflikt, B2): neutral, ohne Bereichsfarbe. */
.ew-hinweis-kasten { margin: 0 0 20px; padding: 14px 18px; background: var(--ew-grau); border-left: 6px solid var(--ew-muted); border-radius: var(--ew-r); }
.ew-hinweis-kasten .ew-etikett { color: var(--ew-text); }
.ew-hinweis-kasten p:last-child { margin-bottom: 0; }
/* A–Z und Korrekturliste (B2) */
.ew-az-sprung ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 24px; padding: 0; list-style: none; }
.ew-az-sprung a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-weight: 700; color: var(--ew-brand); border: 1px solid var(--ew-line); border-radius: var(--ew-r); text-decoration: none; }
.ew-az-sprung a:hover { background: var(--ew-grau); }
.ew-az-gruppe h2 { margin: 28px 0 8px; }
.ew-az { columns: 2 16rem; column-gap: 32px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 1024px) { .ew-az { columns: 3 16rem; } } /* E-145 Nr. 4, O-072: Desktop drei Spalten, nur CSS */
.ew-az li { break-inside: avoid; }
.ew-az a { display: inline-flex; align-items: center; min-height: 44px; }
.ew-korrekturen { margin: 0; padding: 0; list-style: none; }
.ew-korrekturen li { padding: 10px 0; border-bottom: 1px solid var(--ew-line); }
.ew-korrekturen time { font-weight: 700; margin-right: 6px; }

/* Tabellen: Kennwert-Tabelle und Tabellen im Text */
.ew-tabelle,
.wp-block-table { margin: 8px 0 12px; }
.ew-tabelle table,
.wp-block-table table { width: 100%; border-collapse: collapse; font-size: 1rem; font-variant-numeric: tabular-nums; }
.ew-tabelle caption,
.wp-block-table caption,
.wp-block-table figcaption { margin-bottom: 8px; font-weight: 700; text-align: left; caption-side: top; }
.ew-tabelle :is(th, td),
.wp-block-table :is(th, td) { padding: 10px 12px; text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--ew-line); }
.ew-tabelle thead th,
.wp-block-table thead th { font-weight: 700; color: var(--ew-text); background: var(--ew-c-t); border-bottom: 2px solid var(--ew-c-s); }
.wp-block-table thead { border-bottom: 0; }
.ew-tabelle tbody th,
.wp-block-table tbody th { font-weight: 600; }
.ew-tabelle .ew-zahl { text-align: right; }
.ew-tabelle tbody tr:hover { background: #F7F9FB; }
/* Zeilen-Anker (O-072): Ziel einer Sprungmarke (#jahr-25) markiert, mit Luft nach oben. */
.wp-block-table tbody tr[id] { scroll-margin-top: 16px; }
.wp-block-table tbody tr:target { background: var(--ew-c-t); box-shadow: inset 4px 0 0 var(--ew-c-s); }
.ew-tabelle--matrix { overflow-x: auto; }
.ew-tabelle--matrix :is(th, td) { border-left: 1px solid var(--ew-line); }
.ew-tabelle--matrix :is(th, td):first-child { border-left: 0; }
.ew-tabelle--matrix thead th { border-left-color: #fff; }
.ew-tabelle--matrix tbody tr:nth-child(even) { background: #F7F9FB; }

/* Häufige Fragen */
.ew-faq { margin: 0 0 8px; border-top: 1px solid var(--ew-line); }
.ew-frage { padding: 14px 0; border-bottom: 1px solid var(--ew-line); scroll-margin-top: 16px; }
.ew-frage h3 { margin: 0 0 6px; font-size: 1.125rem; }
.ew-antwort p { margin: 0 0 8px; }
.ew-antwort p:last-child { margin-bottom: 0; }

/* Verweislisten */
.ew-verweise { display: grid; gap: 10px; margin: 0 0 12px; padding: 0 !important; list-style: none; }
.ew-verweise li { position: relative; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 2px 16px; min-height: 48px; margin: 0; padding: 14px 18px; border: 1px solid var(--ew-line); border-left: 6px solid var(--ew-c-s); border-radius: var(--ew-r); }
.ew-verweise a { font-weight: 700; color: var(--ew-text); text-decoration: none; }
.ew-verweise a::after { content: ""; position: absolute; inset: 0; }
.ew-verweis-text { flex-basis: 100%; order: 2; font-size: 0.9375rem; color: var(--ew-muted); }
.ew-pfeil { font-weight: 700; color: var(--ew-c); white-space: nowrap; }
.ew-verweise li:hover { border-color: var(--ew-c); border-left-color: var(--ew-c-s); box-shadow: 0 0 0 1px var(--ew-c); }
.ew-verweise li:hover a { color: var(--ew-c); text-decoration: underline; }
.ew-verweise li:has(a:focus-visible),
.ew-raster li:has(a:focus-visible) > a { outline: var(--ew-fokus-rahmen); outline-offset: var(--ew-fokus-abstand); box-shadow: var(--ew-fokus-halo); }
.ew-verweise a:focus-visible { outline: none; box-shadow: none; }
/* Variante Bereich: Kacheln mit Oberkante */
.ew-verweise--bereich { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ew-verweise--bereich li { display: block; min-height: 0; padding: 14px 16px; border-left-width: 1px; border-top: 4px solid var(--ew-c-s); }
.ew-verweise--bereich li:hover { border-top-color: var(--ew-c-s); border-left-color: var(--ew-c); }
.ew-verweise--bereich a { font-size: 1.0625rem; }
.ew-verweise--bereich .ew-verweis-text { display: block; margin-top: 2px; font-size: 0.9rem; }

/* Rechner-Hinweis im Text */
.ew-rechner-hinweis { position: relative; display: flex; align-items: center; gap: 16px; margin: 0 0 12px; padding: 16px 20px; background: var(--ew-c-t); border-radius: var(--ew-r); }
.ew-rechner-hinweis a { font-weight: 700; color: var(--ew-brand); }
.ew-rechner-hinweis a::after { content: ""; position: absolute; inset: 0; }
.ew-rechner-hinweis .ew-verweis-text { display: block; font-size: 0.9rem; }
.ew-rechner-hinweis .ew-symbol { background: #fff; }
.ew-symbol { flex: none; display: grid; place-items: center; width: 48px; height: 48px; background: var(--ew-c-t); border-radius: var(--ew-r-gross); }
.ew-symbol-flaeche { fill: var(--ew-c-s); }
.ew-symbol-linie { stroke: var(--ew-c); }

/* Beratungsgrenze */
.ew-beratung { margin-top: 40px; padding: 4px 22px 16px; border: 2px solid var(--ew-line); border-radius: var(--ew-r); }
.ew-beratung h2 { margin: 18px 0 12px; font-size: var(--wp--preset--font-size--sehr-gross); }
.ew-beratung ul { margin: 0; padding-left: 1.2em; }
.ew-beratung li { margin-bottom: 8px; }

/* Quellen */
.ew-quellen { margin: 0 0 12px; padding: 0 !important; list-style: none; counter-reset: ew-q; }
.ew-quellen li { counter-increment: ew-q; display: grid; grid-template-columns: 28px 1fr; gap: 4px 10px; margin: 0; padding: 10px 0; font-size: 0.9375rem; border-bottom: 1px solid var(--ew-line); }
.ew-quellen li::before { content: counter(ew-q); grid-row: 1 / 3; font-weight: 700; color: var(--ew-muted); }
.ew-quelle-art { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ew-muted); }

/* Stand-Block (E-070): ohne Fläche, dünne Linie darüber, kleiner grauer Text, Links bleiben Links */
.ew-stand { margin-top: 36px; padding: 12px 0 0; font-size: 0.875rem; color: var(--ew-muted); border-top: 1px solid var(--ew-line); }
.ew-stand p { margin: 0 0 4px; }
.ew-stand p:last-child { margin-bottom: 0; }
.ew-herkunft { color: var(--ew-muted); }

/* Anzeige: grau, ohne Bereichsfarbe */
.ew-anzeige { margin: 32px 0; padding: 12px 18px 18px; background: var(--ew-grau); border: 1px solid #C9D1DB; border-radius: var(--ew-r); }
.ew-anzeige-etikett { margin: 0 0 10px; }
.ew-anzeige-etikett span { padding: 3px 8px; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #fff; background: var(--ew-muted); border-radius: 4px; }
.ew-anzeige-inhalt { display: flex; gap: 18px; align-items: flex-start; }
.ew-anzeige-logo { flex: none; display: grid; place-items: center; width: 72px; height: 72px; overflow: hidden; font-size: 0.75rem; color: var(--ew-muted); background: #fff; border: 1px solid #C9D1DB; border-radius: var(--ew-r); }
.ew-anzeige-logo img { max-width: 100%; height: auto; }
.ew-anzeige-titel { margin: 0 0 4px; font-weight: 700; }
.ew-anzeige-inhalt p { margin: 0 0 10px; }
.ew-anzeige-knopf { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; font-weight: 700; color: var(--ew-text) !important; text-decoration: none; border: 2px solid var(--ew-text); border-radius: 999px; }

/* Knöpfe und Formularzeilen */
.ew-knopf,
.ew-rechner button[type="submit"] { min-height: 48px; padding: 10px 22px; font: inherit; font-weight: 700; color: #fff; background: var(--ew-brand); border: 2px solid var(--ew-brand); border-radius: 999px; cursor: pointer; }
.ew-knopf-zweit { min-height: 48px; padding: 10px 22px; font: inherit; font-weight: 700; color: var(--ew-c); background: #fff; border: 2px solid var(--ew-c); border-radius: 999px; cursor: pointer; }
.ew-auswahl { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; }
.ew-auswahl input { width: 24px; height: 24px; margin: 2px 0 0; accent-color: var(--ew-brand); }
.ew-auswahl label { margin: 0; font-weight: 600; cursor: pointer; }
.ew-hinweis { display: block; margin-top: 2px; font-size: 0.9rem; font-weight: 400; color: var(--ew-muted); }
.ew-fehler { margin: 8px 0 0; font-weight: 600; color: var(--wp--preset--color--kind); }

/* Kontaktformular (M9, HTML-Vertrag formular) */
.ew-formular { margin: 6px 0 24px; }
.ew-formular-form { max-width: 40rem; padding: 22px 24px; background: var(--ew-grau); border-radius: var(--ew-r-gross); }
.ew-formular-seite { margin: 0 0 16px; font-weight: 600; }
.ew-formular .ew-feld > label .ew-hinweis { display: inline; margin: 0 0 0 6px; }
.ew-formular .ew-formular-form .ew-feld input[type="email"],
.ew-formular .ew-formular-form .ew-feld input[type="text"],
.ew-formular .ew-formular-form .ew-feld select { max-width: 28rem; }
.ew-formular textarea { box-sizing: border-box; display: block; width: 100%; min-height: 10rem; margin-top: 6px; padding: 10px 12px; font: inherit; color: var(--ew-text); background: #fff; border: 2px solid var(--ew-muted); border-radius: var(--ew-r); resize: vertical; }
.ew-formular [aria-invalid="true"] { border-color: var(--wp--preset--color--kind) !important; }
.ew-formular-datenschutz { margin: 4px 0 18px; }
.ew-formular-meldung { max-width: 40rem; margin: 0 0 16px; padding: 12px 16px; font-weight: 600; background: #fff; border: 2px solid var(--wp--preset--color--kind); border-radius: var(--ew-r); }
.ew-formular-meldung p { margin: 0; }
.ew-formular-meldung--ok { border-color: var(--ew-brand); }
.ew-formular-falle { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* KI-Hinweis an Bildern im Inhalt (M10, E-069 Nr. 9) */
.ew-bild-rahmen--inhalt { display: inline-block; max-width: 100%; vertical-align: top; background: none; }

/* Rechner */
.ew-rechner-form { margin: 6px 0 20px; padding: 22px 24px; background: var(--ew-c-t); border-radius: var(--ew-r-gross); }
.ew-feld { margin-bottom: 16px; }
.ew-feld > label { display: block; font-weight: 700; }
.ew-feld input:not([type="checkbox"]):not([type="radio"]),
.ew-feld select { box-sizing: border-box; width: 100%; max-width: 260px; min-height: 48px; margin-top: 6px; padding: 8px 12px; font: inherit; color: var(--ew-text); background: #fff; border: 2px solid var(--ew-muted); border-radius: var(--ew-r); }
.ew-ergebnis { margin-top: 18px; padding: 16px 18px; background: #fff; border: 2px solid var(--ew-c-s); border-radius: var(--ew-r); }
.ew-ergebnis dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.ew-ergebnis dt { font-size: 0.875rem; color: var(--ew-muted); }
.ew-ergebnis dd { margin: 2px 0 0; font-size: 1.3rem; font-weight: 750; color: var(--ew-c); font-variant-numeric: tabular-nums; }
.ew-ergebnis p { margin: 10px 0 0; font-size: 0.9375rem; }
.ew-ergebnis[hidden] { display: none; }
.ew-rechner-meta { font-size: 0.9rem; color: var(--ew-muted); }
.ew-rechner-meta p { margin: 0 0 6px; }
/* Rechner 1–3 (M11, E-074): Wahl als Optionsfelder, Status, Ergebnis mit Liste und Jahresreihe */
.ew-wahl { min-width: 0; margin: 0 0 16px; padding: 0; border: 0; }
.ew-wahl legend { margin-bottom: 8px; padding: 0; font-weight: 700; }
.ew-wahl .ew-auswahl { margin-bottom: 8px; }
.ew-rechner-status { margin: 0 0 16px; padding: 10px 14px; font-weight: 600; background: #fff; border-left: 6px solid var(--ew-muted); border-radius: var(--ew-r); }
.ew-ergebnis:focus { outline: 3px solid var(--ew-brand); outline-offset: 2px; }
.ew-rechner .ew-ergebnis dd { font-size: 1.125rem; }
.ew-ergebnis-titel { margin: 0 0 10px !important; font-size: 1rem !important; font-weight: 700; }
.ew-ergebnis ul { margin: 8px 0 0; padding-left: 1.2em; font-size: 0.9375rem; }
.ew-rechner-reihe { width: 100%; max-width: 30rem; margin-top: 14px; font-size: 0.9375rem; border-collapse: collapse; }
.ew-rechner-reihe caption { margin-bottom: 6px; font-weight: 700; text-align: left; }
.ew-rechner-reihe th,
.ew-rechner-reihe td { padding: 6px 8px; text-align: left; border-bottom: 1px solid var(--ew-line); }
.ew-rechner-reihe thead th { font-size: 0.875rem; color: var(--ew-muted); }
.ew-rechner-reihe tbody th { font-weight: 600; }
.ew-rechner-reihe .ew-aktuell > * { font-weight: 750; background: var(--ew-c-t); }

/* Zeitleiste (Lebenslage) */
.ew-zeitleiste .ew-phase { position: relative; margin: 8px 0 0; padding: 14px 0; font-size: 1.25rem; border-top: 1px solid var(--ew-line); }
.ew-zeitleiste .ew-phase::before { content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 10px; vertical-align: 1px; background: var(--wp--preset--color--leben-schmuck); border-radius: 3px; }
.ew-schritte { position: relative; margin: 8px 0 0; padding: 0; list-style: none; }
.ew-schritte::before { content: ""; position: absolute; left: 11px; top: 6px; bottom: 6px; width: 3px; background: var(--wp--preset--color--leben-flaeche); border-radius: 2px; }
.ew-schritte > li { position: relative; margin: 0; padding: 0 0 22px 44px; }
.ew-schritte > li::before { content: ""; position: absolute; left: 1px; top: 4px; box-sizing: border-box; width: 23px; height: 23px; background: #fff; border: 4px solid var(--wp--preset--color--leben-schmuck); border-radius: 50%; }
.ew-wann { display: inline-block; margin-bottom: 4px; padding: 2px 10px; font-size: 0.8125rem; font-weight: 700; color: var(--wp--preset--color--leben); background: var(--wp--preset--color--leben-flaeche); border-radius: 999px; }
.ew-schritte h4 { margin: 2px 0 4px; font-size: 1.15rem; }
.ew-schritte p { margin: 0 0 4px; }
.ew-ohne-ziel .ew-hinweis { font-size: 0.9375rem; }

/* Rezept */
.ew-rezept-einleitung { max-width: 72ch; margin: 0 0 16px; }
.ew-rezept-bild { margin: 6px 0 8px; }
.ew-bild-rahmen { position: relative; overflow: hidden; border-radius: var(--ew-r); background: var(--wp--preset--color--kueche-flaeche); }
.ew-bild-rahmen img { display: block; width: 100%; height: auto; }
.ew-rezept-bild .ew-bild-rahmen { aspect-ratio: 16 / 9; }
.ew-rezept-bild img { height: 100%; object-fit: cover; }
/* KI-Hinweis dezenter (E-072): kleiner, halbtransparent; 65 % Deckkraft hält Weiß auf hellem Bild bei ≥ 4,5 : 1 */
.ew-ki-hinweis { position: absolute; left: 0; bottom: 0; padding: 2px 8px; font-size: 0.75rem; line-height: 1.4; color: #fff; background: rgba(20, 35, 58, 0.65); border-radius: 0 6px 0 0; }
.ew-rezept-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 10px 0 20px; padding: 12px 0; border-top: 1px solid var(--ew-line); border-bottom: 1px solid var(--ew-line); }
.ew-rezept-meta div { font-size: 0.9375rem; }
.ew-rezept-meta b { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ew-muted); }
.ew-rezept-spalten { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 36px; margin-bottom: 12px; }
.ew-rezept-spalten h2 { margin: 0 0 10px; font-size: 1.4rem; scroll-margin-top: 16px; }
.ew-rezept-spalten h3 { margin: 16px 0 6px; font-size: 1.05rem; }
.ew-zutaten { margin: 0; padding: 0; list-style: none; }
.ew-zutaten li { display: grid; grid-template-columns: 90px 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--ew-line); }
.ew-zutaten b { text-align: right; font-variant-numeric: tabular-nums; }
.ew-schritte-rezept { margin: 0; padding: 0; list-style: none; counter-reset: ew-s; }
.ew-schritte-rezept li { position: relative; counter-increment: ew-s; padding: 0 0 16px 46px; }
.ew-schritte-rezept li::before { content: counter(ew-s); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 32px; height: 32px; font-weight: 800; color: var(--ew-c); background: var(--ew-c-t); border-radius: 50%; }

/* Rezept-Raster */
.ew-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; }
.ew-filter-name { min-width: 70px; margin-right: 6px; font-weight: 700; }
.ew-filter-knopf { min-height: 44px; padding: 6px 16px; font: inherit; font-size: 0.9375rem; color: var(--ew-text); background: #fff; border: 2px solid #8A94A3; border-radius: 999px; cursor: pointer; }
.ew-filter-knopf[aria-pressed="true"] { color: #fff; background: var(--wp--preset--color--kueche); border-color: var(--wp--preset--color--kueche); }
.ew-zaehler { font-size: 0.9375rem; color: var(--ew-muted); }
.ew-leer { margin-top: 14px; padding: 16px 18px; border: 2px solid var(--ew-c-s); border-radius: var(--ew-r); }
.ew-leer[hidden], .ew-mehr-rezepte[hidden], .ew-filter[hidden] { display: none; }
.ew-leer p { margin: 0; }
.ew-rezept-karten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 18px 0 0; padding: 0 !important; list-style: none; }
.ew-rezept-karten li { position: relative; margin: 0; overflow: hidden; background: #fff; border: 1px solid var(--ew-line); border-radius: var(--ew-r); }
.ew-rezept-karten li[hidden], .ew-rezept-karten li.ew-ueber { display: none; }
.ew-rezept-karten li:hover { box-shadow: 0 0 0 2px var(--wp--preset--color--kueche); }
.ew-rezept-karten .ew-bild-rahmen { aspect-ratio: 4 / 3; border-radius: 0; }
.ew-rezept-karten .ew-bild-rahmen img { height: 100%; object-fit: cover; }
/* E-151: im Raster und in Rezeptkarten deutlich zurückgenommen; die Kennzeichnung steht zusätzlich im Alt-Text. */
.ew-rezept-karten .ew-ki-hinweis { padding: 1px 6px; font-size: 0.625rem; background: rgba(20, 35, 58, 0.35); text-shadow: 0 0 2px rgba(0, 0, 0, 0.6); }
.ew-rezept-karte-text { padding: 12px 16px 14px; }
.ew-rezept-karte-text a { font-size: 1.0625rem; font-weight: 700; color: var(--ew-text); text-decoration: none; }
.ew-rezept-karte-text a::after { content: ""; position: absolute; inset: 0; }
.ew-rezept-karten li:hover a { color: var(--wp--preset--color--kueche); text-decoration: underline; }
.ew-rezept-karten li:has(a:focus-visible) { outline: var(--ew-fokus-rahmen); outline-offset: var(--ew-fokus-abstand); box-shadow: var(--ew-fokus-halo); }
.ew-rezept-karten a:focus-visible { outline: none; box-shadow: none; }
.ew-rezept-karte-meta { margin: 4px 0 0; font-size: 0.875rem; color: var(--ew-muted); }
.ew-mehr-rezepte { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 18px 0 0; }

/* Inhaltsverzeichnis */
.ew-toc { padding: 4px 0 4px 16px; font-size: 0.9375rem; border-left: 3px solid var(--ew-c-s); }
.ew-toc p { margin: 0 0 6px; font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ew-muted); }
.ew-toc ol { margin: 0; padding: 0; list-style: none; }
.ew-toc a { position: relative; display: flex; align-items: center; min-height: 44px; padding: 4px 0; color: var(--ew-text); text-decoration: none; }
.ew-toc a:hover { color: var(--ew-c); text-decoration: underline; }
/* E-070: Aktiv-Balken 12 px breit, beginnt auf der Linie (3 px), danach 7 px Abstand zum Text */
.ew-toc a[aria-current] { font-weight: 700; color: var(--ew-c); }
.ew-toc a[aria-current]::before { content: ""; position: absolute; top: 4px; bottom: 4px; left: -19px; width: 12px; background: var(--ew-c); border-radius: 0 2px 2px 0; }
.ew-toc-mobil { display: none; margin: 0 0 18px; border: 1px solid var(--ew-line); border-radius: var(--ew-r); }
/* Vorlage Rechtliches (einspaltig): Inhaltsverzeichnis in jeder Breite einklappbar über dem Text (E-088, ab 10 H2). */
.ew-vorlage-rechtliches .ew-toc { display: none; }
.ew-vorlage-rechtliches .ew-toc-mobil { display: block; margin-bottom: 28px; }
.ew-toc-mobil summary { display: flex; align-items: center; min-height: 48px; padding: 0 16px; font-weight: 700; cursor: pointer; }
.ew-toc-mobil ol { margin: 0; padding: 0 16px 10px 34px; }
/* O-080, E-124 Nr. 2: Überschriften tragen schon Nummern („1. Verantwortlicher“), keine zweite Zählung. */
.ew-toc-mobil ol.ew-toc-nummeriert { padding-left: 16px; list-style: none; }
.ew-toc-mobil a { display: flex; align-items: center; min-height: 44px; color: var(--ew-text); }

/* ---------- Startseite ---------- */
.ew-held { padding: 44px 0 36px; }
.ew-held h1 { margin: 0; font-size: var(--wp--preset--font-size--start); }
.ew-held p { margin: 14px 0 0; font-size: 1.3rem; color: var(--ew-muted); }
/* Startseite: H1 aus dem Seitentitel (Vorlage), der erste Absatz des Inhalts ist der Lead darunter. */
.ew-vorlage-start > .ew-held { padding-bottom: 0; }
.ew-vorlage-start > .ew-inhalt > p:first-child { margin: 14px 0 0; padding-bottom: 36px; font-size: 1.3rem; color: var(--ew-muted); }
.ew-abschnitt { padding: 30px 0; }
.ew-abschnitt > h2,
.ew-abschnitt-kopf h2 { margin: 0; font-size: var(--wp--preset--font-size--sehr-gross); }
.ew-abschnitt > h2 { margin-bottom: 18px; }
.ew-abschnitt-kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.ew-abschnitt-kopf > * { margin: 0 !important; }
.ew-mehr a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.ew-raster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0 !important; list-style: none; }
.ew-raster li { margin: 0; }
.ew-raster li > a { box-sizing: border-box; display: flex; align-items: flex-start; gap: 14px; height: 100%; min-height: 44px; color: var(--ew-text); text-decoration: none; }
.ew-raster li > a:focus-visible { outline: none; box-shadow: none; }
.ew-raster li > a > :not(.ew-symbol) { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; hyphens: auto; } /* O-072: lange Wörter („Schwangerschaftswoche“) bleiben in der Kachel */
.ew-raster b { display: block; font-size: 1.0625rem; }
/* O-072, E-164: Kachel-Raster im Inhalt mit Abstand zum Folgenden (Satz, „Alle Rechner“); .ew-raster setzt sonst margin: 0. */
.ew-inhalt > .ew-raster { margin-bottom: 18px; }
.ew-raster b + span { font-size: 0.9375rem; color: var(--ew-muted); }
.ew-lebenslagen { --ew-c: var(--wp--preset--color--leben); --ew-c-t: var(--wp--preset--color--leben-flaeche); --ew-c-s: var(--wp--preset--color--leben-schmuck); }
.ew-lebenslagen li > a { padding: 18px 18px 18px 16px; background: var(--ew-c-t); border-radius: var(--ew-r); }
.ew-lebenslagen li > a:hover { box-shadow: inset 0 0 0 2px var(--ew-c); }
.ew-lebenslagen .ew-symbol { width: 28px; height: 28px; margin-top: 0; background: none; } /* O-072: mittig zur ersten Titelzeile (27,2 px), vorher 3,4 px zu tief */
.ew-rechner-kacheln li > a { padding: 20px; background: #fff; border: 2px solid var(--ew-line); border-radius: var(--ew-r); }
.ew-rechner-kacheln li > a:hover { border-color: var(--ew-brand); }
.ew-rechner-kacheln b { color: var(--ew-brand); }
.ew-eingabe { display: block; margin-top: 6px; font-size: 0.875rem; color: var(--ew-text); }
.ew-kurz-beantwortet { display: grid; gap: 12px; margin: 0; padding: 0 !important; list-style: none; }
.ew-kurz-beantwortet li { position: relative; display: grid; grid-template-columns: 170px 1fr auto; gap: 4px 24px; align-items: baseline; margin: 0; padding: 18px 22px; background: #fff; border: 1px solid var(--ew-line); border-left: 6px solid var(--ew-c-s); border-radius: var(--ew-r); }
.ew-kurz-beantwortet li:hover { border-color: var(--ew-c); border-left-color: var(--ew-c-s); box-shadow: 0 0 0 1px var(--ew-c); }
.ew-kurz-beantwortet .ew-chip { grid-row: 1 / 3; justify-self: start; }
.ew-kurz-beantwortet h3 { margin: 0; font-size: 1.2rem; }
.ew-kurz-beantwortet h3 a { color: var(--ew-text); text-decoration: none; }
.ew-kurz-beantwortet h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ew-kurz-beantwortet li:hover h3 a { color: var(--ew-c); text-decoration: underline; }
.ew-kurz-beantwortet li:has(h3 a:focus-visible) { outline: var(--ew-fokus-rahmen); outline-offset: var(--ew-fokus-abstand); box-shadow: var(--ew-fokus-halo); }
.ew-kurz-beantwortet h3 a:focus-visible { outline: none; box-shadow: none; }
.ew-kurz-beantwortet p { grid-column: 2; margin: 0; }
.ew-kurz-beantwortet .ew-pfeil { grid-column: 3; grid-row: 1 / 3; align-self: center; }
.ew-ueber { max-width: 70ch; }
.ew-ueber > * { margin: 0 0 10px; }
.ew-ueber ul { padding-left: 1.2em; }

/* ---------- 404 und Suche ---------- */
.ew-404 { max-width: 680px; padding: 40px 0 20px; }
.ew-404 .ew-code { margin: 0; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.08em; color: var(--ew-muted); }
.ew-404 h1 { margin: 0; }
.ew-404 .ew-suche { margin: 20px 0 24px; }
.ew-404 .ew-suche .wp-block-search__input,
.ew-suche-seite .wp-block-search__input { flex: 1; width: 100%; }
.ew-404 h2 { margin: 0 0 12px; font-size: 1.3rem; }
.ew-treffer-liste { margin: 16px 0 0; padding: 0; list-style: none; }
.ew-treffer-liste > li { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--ew-line); }
.ew-treffer-titel { margin: 0 0 4px; font-size: 1.2rem; }
.ew-treffer-auszug p { margin: 0; }
.wp-block-query-pagination { margin-top: 20px; }
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }

/* ---------- Fußzeile ---------- */
.ew-fuss { margin-top: 24px; padding: 40px 0 28px; font-size: 0.9375rem; color: #fff; background: var(--ew-text); }
.ew-fuss a { color: #fff; }
.ew-fuss :focus-visible { outline-color: #fff; }
.ew-fuss-kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 28px; margin-bottom: 26px; padding-bottom: 26px; border-bottom: 1px solid rgba(255, 255, 255, 0.18); }
.ew-fuss .ew-wortmarke { font-size: 1.8rem; color: #fff; }
.ew-fuss .ew-idot svg { fill: #8FD6DB; }
.ew-fuss-kopf p { margin: 0; padding-left: 28px; line-height: 1.45; color: #DCE3EC; border-left: 1px solid rgba(255, 255, 255, 0.25); }
.ew-fuss-spalten { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.ew-fuss h2 { margin: 0 0 6px; font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #B9C6D6; }
.ew-fuss ul { margin: 0; padding: 0; list-style: none; }
.ew-fuss li a { display: inline-flex; align-items: center; gap: 10px; min-width: 44px; min-height: 44px; text-decoration: none; }
.ew-fuss li a:hover { text-decoration: underline; }
.ew-fuss li[class*="ew-c-"] a::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--ew-c-s); }
.ew-fuss-fein { margin: 24px 0 0; padding-top: 16px; font-size: 0.875rem; color: #DCE3EC; border-top: 1px solid rgba(255, 255, 255, 0.18); }

/* ---------- M: 601–1023 px ---------- */
@media (max-width: 1023px) {
	.ew-suche-kopf { display: none; }
	.ew-lupe { display: inline-flex; }
	/* Lupe und Menü-Knopf auf einer Höhe: Abstand unten an der Zeile statt an den Knöpfen (die Lupe stand 7 px höher). */
	.ew-kopf-zeile { padding-bottom: 14px; }
	.ew-lupe { margin-bottom: 0; }
	.ew-menue-teil { flex-basis: auto; order: 3; margin-bottom: 0; border-top: 0; }
	.ew-hauptmenue .wp-block-navigation__responsive-container-open { display: inline-flex; }
	.ew-hauptmenue .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
	.ew-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "spalte" "inhalt"; gap: 0; }
	.ew-layout > .ew-seitenspalte { position: static; }
	.ew-toc { display: none; }
	.ew-toc-mobil { display: block; }
	.ew-karten--flaeche,
	.ew-raster,
	.ew-verweise--bereich,
	.ew-rezept-karten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ew-rezept-spalten { grid-template-columns: minmax(0, 1fr); }
	.ew-kurz-beantwortet li { grid-template-columns: 1fr auto; }
	.ew-kurz-beantwortet .ew-chip { grid-row: auto; grid-column: 1 / -1; }
	.ew-kurz-beantwortet h3,
	.ew-kurz-beantwortet p { grid-column: 1; }
	.ew-kurz-beantwortet .ew-pfeil { grid-column: 2; grid-row: 2 / 4; }
	.ew-fuss-spalten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Menü-Knopf mit Symbol (M: Symbol und Wort, S: nur Symbol, Wort bleibt für Screenreader) */
.ew-hauptmenue .wp-block-navigation__responsive-container-open::before { content: ""; width: 22px; height: 22px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v2.4H4zM4 10.8h16v2.4H4zM4 15.6h16V18H4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v2.4H4zM4 10.8h16v2.4H4zM4 15.6h16V18H4z'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Geöffnetes Menü (M, S): Suchfeld oben, je Bereich eine Zeile mit Farbpunkt und Pfeil */
.ew-hauptmenue .wp-block-navigation__responsive-container.is-menu-open { padding: 20px var(--ew-rand) 32px; color: var(--ew-text); background: #fff; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__responsive-container-close { top: 20px; right: var(--ew-rand); display: inline-flex; align-items: center; min-width: 46px; min-height: 46px; padding: 0 14px; font-weight: 700; color: var(--ew-brand); background: #fff; border: 2px solid var(--ew-brand); border-radius: 999px; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 70px !important; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__container { display: block !important; width: 100%; }
.ew-hauptmenue .is-menu-open .ew-suche-menue { display: block; width: 100%; margin: 0 0 18px; }
.ew-hauptmenue .is-menu-open .ew-suche-menue .wp-block-search__inside-wrapper { width: 100% !important; }
.ew-hauptmenue .is-menu-open .ew-suche-menue .wp-block-search__input { flex: 1; width: 100%; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item { display: flex !important; flex-direction: row !important; flex-wrap: wrap; align-items: center; justify-content: space-between; width: 100%; margin: 0 !important; border-bottom: 1px solid var(--ew-line); }
.ew-hauptmenue .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { flex: 1 1 0; width: auto !important; justify-content: flex-start; padding: 12px 0 !important; font-weight: 700; text-align: left; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { width: 100%; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::before { width: 12px; height: 12px; }
.ew-hauptmenue .is-menu-open .ew-menue-quer { margin-left: 0; }
/* Im geöffneten Menü sind alle Unterpunkte sichtbar: WordPress meldet dort jedes Untermenü als offen (aria-expanded), ein Pfeil je Bereich hätte keine Wirkung. */
.ew-hauptmenue .is-menu-open .wp-block-navigation-submenu__toggle { display: none !important; }
.ew-hauptmenue.ew-hauptmenue .is-menu-open .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container { position: static !important; display: block !important; flex-basis: 100%; width: 100% !important; min-width: 0 !important; margin: 0 0 12px !important; padding: 6px 0 !important; background: var(--ew-c-t) !important; border: 0 !important; border-radius: var(--ew-r) !important; box-shadow: none; visibility: visible !important; opacity: 1 !important; height: auto !important; }
.ew-hauptmenue .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 10px 16px !important; font-weight: 600; color: var(--ew-c); }

/* ---------- S: bis 600 px ---------- */
@media (max-width: 600px) {
	:root { --ew-rand: 16px; }
	body { --wp--style--root--padding-left: 16px; --wp--style--root--padding-right: 16px; }
	.ew-marke { --ls: 1.45rem; }
	.ew-claim { margin-top: 4px; font-size: 0.75rem; }
	.ew-kopf-zeile { padding-top: 14px; column-gap: 8px; }
	.ew-hauptmenue .wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open { gap: 0; padding: 0 10px; font-size: 0; }
	.ew-held { padding: 26px 0 18px; }
	.ew-held p { font-size: 1.1rem; }
	.ew-vorlage-start > .ew-inhalt > p:first-child { padding-bottom: 18px; font-size: 1.1rem; }
	.ew-abschnitt { padding: 22px 0; }
	.ew-inhalt > h2,
	.ew-inhalt > .wp-block-heading:is(h2) { margin-top: 48px; } /* E-102 */
	.ew-karten,
	.ew-karten--flaeche,
	.ew-raster,
	.ew-verweise--bereich,
	.ew-rezept-karten,
	.ew-ergebnis dl { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.ew-karten--flaeche { grid-auto-rows: auto; }
	.ew-karten--flaeche .ew-karte { padding: 14px 16px; }
	.ew-karten--flaeche .ew-wert { font-size: 1.35rem; }
	.ew-kurzantwort { padding: 16px; font-size: 1.0625rem; }
	.ew-rechner-form { padding: 18px 16px; }
	.ew-anzeige-inhalt { flex-direction: column; }
	.ew-kurz-beantwortet li { grid-template-columns: minmax(0, 1fr); padding: 16px 16px 16px 18px; }
	.ew-kurz-beantwortet .ew-chip,
	.ew-kurz-beantwortet p { grid-row: auto; grid-column: 1; }
	.ew-kurz-beantwortet .ew-pfeil { grid-column: 1; grid-row: auto; margin-top: 4px; }
	.ew-zutaten li { grid-template-columns: 80px 1fr; }
	/* Tabellen als Karten, je Zeile eine Karte (Spaltenname aus data-label) */
	.ew-tabelle--karten thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.ew-tabelle--karten :is(table, caption, tbody, tr, th, td) { display: block; width: 100%; box-sizing: border-box; }
	.ew-tabelle--karten tr { margin: 0 0 12px; padding: 6px 14px; border: 1px solid var(--ew-line); border-left: 6px solid var(--ew-c-s); border-radius: var(--ew-r); }
	.ew-tabelle--karten tbody th { padding: 8px 0; font-weight: 700; border-bottom: 1px solid var(--ew-line); }
	.ew-tabelle--karten tbody tr:nth-child(even),
	.ew-tabelle--karten tbody tr:hover { background: #fff; }
	.ew-tabelle--karten td { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; text-align: right; border: 0 !important; }
	.ew-tabelle--karten td::before { content: attr(data-label); text-align: left; font-weight: 500; color: var(--ew-muted); }
	.ew-fuss-spalten { grid-template-columns: minmax(0, 1fr); gap: 18px; }
	.ew-fuss-kopf { flex-direction: column; align-items: flex-start; }
	.ew-fuss-kopf p { padding-left: 0; border-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
	* { scroll-behavior: auto !important; }
}