*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--c-bg);color:var(--c-text);font:var(--fw-text) var(--fs-md)/var(--lh-text) var(--font-text);font-variant-numeric:tabular-nums}
.wrap{max-width:1120px;margin:0 auto;padding:0 var(--s-4)}
@media (min-width:720px){.wrap{padding:0 var(--s-6)}}
h1,h2,h3{font-family:var(--font-head);font-weight:var(--fw-head);line-height:var(--lh-head);letter-spacing:var(--tracking-head);margin:0}
h1{font-size:var(--fs-3xl)} h1,h2,h3{hyphens:auto;overflow-wrap:break-word} h2{font-size:var(--fs-2xl);margin-bottom:var(--s-2)} h3{font-size:var(--fs-lg);margin-bottom:var(--s-2)}
p{margin:0 0 var(--s-3);max-width:var(--measure)}
a{color:var(--c-link);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
.muted{color:var(--c-text-muted)} .klein{font-size:var(--fs-sm)} .xs{font-size:var(--fs-xs)}
.mono{font-family:var(--font-mono);font-size:.94em}

section{padding:var(--s-7) 0;border-bottom:var(--b-haar) solid var(--c-line)}
.kopf{display:flex;align-items:baseline;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-5)}
.kopf .nr{font:var(--fw-strong) var(--fs-sm) var(--font-mono);color:var(--c-text-muted)}
.raster{display:grid;gap:var(--s-5)}
@media (min-width:860px){.r2{grid-template-columns:1fr 1fr}.r3{grid-template-columns:repeat(3,1fr)}.r-7-5{grid-template-columns:7fr 5fr}}

/* Hero */
.hero{padding:var(--s-8) 0 var(--s-7)}
.hero h1{max-width:20ch;margin-bottom:var(--s-4)}
.claim{font:var(--fw-strong) var(--fs-lg)/1.3 var(--font-text);margin:var(--s-5) 0 0;padding:var(--s-3) var(--s-4);background:var(--c-signal-flaeche);color:var(--c-signal-text);display:inline-block;border-radius:var(--r-1)}

/* Knoepfe & Felder */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:var(--hit);padding:0 var(--s-5);font:var(--fw-strong) var(--fs-md)/1 var(--font-text);border-radius:var(--r-2);border:var(--b-regel) solid transparent;cursor:pointer;text-decoration:none;transition:background-color var(--t-kurz) var(--ease)}
.k-haupt{background:var(--c-accent);color:var(--c-on-accent)} .k-haupt:hover{background:var(--c-accent-hover)}
.k-zweit{background:transparent;color:var(--c-text);border-color:var(--c-line-strong)} .k-zweit:hover{border-color:var(--c-text)}
.k-text{background:transparent;color:var(--c-link);padding:0 var(--s-2);text-decoration:underline;text-underline-offset:.18em}
.k-fokus{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.knopfreihe{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}
label{display:block;font-weight:var(--fw-strong);margin-bottom:var(--s-1)}
.eingabe{width:100%;min-height:var(--field-h);padding:0 var(--s-3);font:var(--fs-md) var(--font-text);color:var(--c-text);background:var(--c-surface);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2)}
.eingabe:focus-visible{outline:var(--focus-ring);outline-offset:0;border-color:var(--c-focus)}
.hilfe{font-size:var(--fs-sm);color:var(--c-text-muted);margin-top:var(--s-1)}
.feldfehler .eingabe{border:var(--b-regel) solid var(--c-fehler)}
.feldfehler .hilfe{color:var(--c-fehler-text);font-weight:var(--fw-medium)}
.meldung{display:flex;gap:var(--s-3);padding:var(--s-3) var(--s-4);border-left:4px solid;border-radius:var(--r-1);font-size:var(--fs-sm);margin-bottom:var(--s-2)}
.m-fehler{background:var(--c-fehler-fill);color:var(--c-fehler-text);border-color:var(--c-fehler)}
.m-warn{background:var(--c-warnung-fill);color:var(--c-warnung-text);border-color:var(--c-warnung)}
.m-info{background:var(--c-info-fill);color:var(--c-info-text);border-color:var(--c-info)}
.m-ok{background:var(--c-entschieden-fill);color:var(--c-entschieden-text);border-color:var(--c-entschieden-line)}
.meldung svg{flex:none;width:20px;height:20px;margin-top:2px}

/* Tabelle */
.tabwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:var(--fs-sm);line-height:var(--lh-ui)}
th,td{padding:var(--s-3) var(--s-3);text-align:left;border-bottom:var(--b-haar) solid var(--c-line);vertical-align:top}
thead th{background:var(--c-surface-2);font-weight:var(--fw-strong);border-bottom:var(--b-regel) solid var(--c-line-strong);white-space:nowrap}
td.z,th.z{text-align:right;white-space:nowrap}
tfoot td{border-top:var(--b-regel) solid var(--c-text);border-bottom:0;font-weight:var(--fw-strong)}

/* Ampel */
.ampel{display:inline-flex;align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-3) var(--s-1) var(--s-2);border-radius:var(--r-1);font-weight:var(--fw-strong);font-size:var(--fs-sm);line-height:1.3;white-space:nowrap}
.ampel svg{width:16px;height:16px;flex:none}
.a-ok{background:var(--c-frist-ok-fill);color:var(--c-frist-ok-text)} .a-ok svg{fill:var(--c-frist-ok)}
.a-bald{background:var(--c-frist-bald-fill);color:var(--c-frist-bald-text)} .a-bald svg{fill:var(--c-frist-bald);stroke:var(--c-frist-bald-rand);stroke-width:2}
.a-ueber{background:var(--c-frist-ueber-fill);color:var(--c-frist-ueber-text)} .a-ueber svg{fill:var(--c-frist-ueber)}
.ampelliste{list-style:none;margin:0;padding:0}
.ampelliste li{display:grid;grid-template-columns:1fr auto;gap:var(--s-3);align-items:center;padding:var(--s-3) 0;border-bottom:var(--b-haar) solid var(--c-line)}
.ampelliste small{display:block;color:var(--c-text-muted);font-size:var(--fs-sm)}

/* Bestellvorschlag: Vorschlag vs. Entschieden */
.beleg{background:var(--c-surface);border-radius:var(--r-1);padding:var(--s-4) var(--s-4) var(--s-3)}
.vorschlag{border:var(--b-vorschlag);background:var(--c-vorschlag-fill)}
.entschieden{border:var(--b-entschieden);background:var(--c-entschieden-fill)}
.status{display:flex;align-items:center;gap:var(--s-2);font-weight:var(--fw-strong);font-size:var(--fs-sm);margin-bottom:var(--s-2)}
.vorschlag .status{color:var(--c-vorschlag-text)} .entschieden .status{color:var(--c-entschieden-text)}
.status svg{width:18px;height:18px;flex:none}
.beleg h3{margin-bottom:var(--s-1)}
.beleg table{margin:var(--s-3) 0}
.beleg thead th{background:transparent}
.kuerzel{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r-rund);border:var(--b-regel) solid var(--c-entschieden-line);color:var(--c-entschieden-text);font:var(--fw-head) var(--fs-sm) var(--font-text);transform:rotate(-8deg);flex:none}
.abzeichnung{display:flex;gap:var(--s-3);align-items:center;font-size:var(--fs-sm);color:var(--c-entschieden-text)}
.geaendert{color:var(--c-entschieden-text);font-weight:var(--fw-strong)}
.geaendert s{color:var(--c-text-muted);font-weight:400;margin-right:.3em}

/* Chat-Antwort mit Quelle */
.frage{font-weight:var(--fw-strong);margin-bottom:var(--s-3)}
.frage span{display:block;font:var(--fw-medium) var(--fs-xs) var(--font-text);color:var(--c-text-muted)}
.antwort{border-left:3px dashed var(--c-vorschlag-line);padding:var(--s-1) 0 var(--s-1) var(--s-4)}
.antwort .status{color:var(--c-vorschlag-text)}
.quelle{display:flex;gap:var(--s-3);align-items:flex-start;margin-top:var(--s-3);padding:var(--s-3);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2);font-size:var(--fs-sm);background:var(--c-surface)}
.quelle .nr{flex:none;display:inline-grid;place-items:center;min-width:28px;height:28px;border:var(--b-regel) solid var(--c-text);border-radius:var(--r-1);font:var(--fw-head) var(--fs-sm) var(--font-mono)}
sup.fn{font:var(--fw-head) .72em var(--font-mono);border:1.5px solid currentColor;border-radius:2px;padding:0 .25em;margin-left:.15em}

/* Lieferschein */
.lieferschein{background:var(--c-surface);border:var(--b-haar) solid var(--c-line-strong);border-top:6px solid var(--c-text);padding:var(--s-5) var(--s-4)}
@media (min-width:720px){.lieferschein{padding:var(--s-6)}}
.ls-kopf{display:flex;justify-content:space-between;gap:var(--s-4);flex-wrap:wrap;margin-bottom:var(--s-5)}
.ls-kopf dl{margin:0;display:grid;grid-template-columns:auto auto;gap:var(--s-1) var(--s-4);font-size:var(--fs-sm)}
.ls-kopf dt{color:var(--c-text-muted)} .ls-kopf dd{margin:0;text-align:right}
.unterschrift{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5);margin-top:var(--s-6);font-size:var(--fs-xs);color:var(--c-text-muted)}
.unterschrift div{border-top:var(--b-haar) solid var(--c-text);padding-top:var(--s-1)}
.beispiel{display:inline-block;font:var(--fw-strong) var(--fs-xs) var(--font-text);color:var(--c-text-muted);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-1);padding:0 var(--s-2);vertical-align:middle}
/* ===== Seiten-Bausteine (Startseite, Produkt, Motive) ===== */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:-999px;top:0;background:var(--c-text);color:var(--c-bg);padding:var(--s-2) var(--s-3);z-index:99}.skip:focus{left:var(--s-2);top:var(--s-2)}
.ki-hinweis{background:var(--c-surface-2);color:var(--c-text-muted);font-size:var(--fs-xs);padding:var(--s-1) 0;text-align:center}
.ki-hinweis a{color:inherit}
.band .wrap{justify-content:space-between}
.logo-h,.logo-d{height:52px;width:auto;display:block}
.logo-d{display:none}
:root[data-theme="dark"] .logo-h{display:none}:root[data-theme="dark"] .logo-d{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .logo-h{display:none}:root:not([data-theme="light"]) .logo-d{display:block}}
.nav{display:none;gap:var(--s-5);align-items:center;font-weight:var(--fw-medium)}
.nav a{color:var(--c-text);text-decoration:none;padding:var(--s-2) 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-bottom-color:var(--c-accent)}
.nav .knopf{padding:0 var(--s-4);min-height:var(--hit-min);color:var(--c-on-accent);border-bottom:0}
.nav .knopf.k-zweit{color:var(--c-text)}
@media (min-width:960px){.nav{display:flex}.mobil{display:none}}
.mobil{position:relative}
.mobil summary{list-style:none;cursor:pointer;min-height:var(--hit-min);display:inline-flex;align-items:center;padding:0 var(--s-4);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2);font-weight:var(--fw-medium)}
.mobil summary::-webkit-details-marker{display:none}
.mobil nav{position:absolute;right:0;top:calc(100% + var(--s-2));background:var(--c-surface);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2);padding:var(--s-3);display:grid;gap:var(--s-1);min-width:15rem;box-shadow:var(--shadow-float);z-index:20}
.mobil nav a{padding:var(--s-3);color:var(--c-text);text-decoration:none;min-height:var(--hit-min)}
section.ohne-linie{border-bottom:0}
.hero-grid{display:grid;gap:var(--s-7);align-items:center}
@media (min-width:960px){.hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.hero .lead{font-size:var(--fs-lg);line-height:1.5;color:var(--c-text);max-width:46ch}
.knopfreihe.mt{margin-top:var(--s-5)}
.abschnitt-kopf{display:grid;gap:var(--s-3);margin-bottom:var(--s-5)}
@media (min-width:860px){.abschnitt-kopf{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:end;gap:var(--s-7)}}
.abschnitt-kopf p{margin:0;color:var(--c-text-muted)}
.legende{display:grid;gap:var(--s-5)}
@media (min-width:860px){.legende{grid-template-columns:repeat(3,minmax(0,1fr))}}
.legende article{border-top:2px solid var(--c-text);padding-top:var(--s-3)}
.legende h3{font-size:var(--fs-lg)}
.legende p{color:var(--c-text-muted);margin:0}
.legende .status{margin-bottom:var(--s-2)}
.legende .v{color:var(--c-vorschlag-text)}.legende .e{color:var(--c-entschieden-text)}.legende .f{color:var(--c-text)}
/* Register der Branchen */
.filter{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-4)}
.chip{min-height:var(--hit-min);padding:0 var(--s-4);font:var(--fw-medium) var(--fs-sm) var(--font-text);color:var(--c-text);background:transparent;border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--c-text);color:var(--c-bg);border-color:var(--c-text)}
.zeilen{list-style:none;margin:0;padding:0;border-top:var(--b-regel) solid var(--c-text)}
.zeilen li{border-bottom:var(--b-haar) solid var(--c-line)}
.zeilen li[hidden]{display:none}
.zeilen a{display:grid;gap:var(--s-1) var(--s-6);padding:var(--s-4) var(--s-2);color:var(--c-text);text-decoration:none;min-height:var(--hit)}
@media (min-width:860px){.zeilen a{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}
.zeilen a:hover{background:var(--c-surface-2)}
.zeilen .name{font:var(--fw-head) var(--fs-xl)/1.1 var(--font-head)}
.zeilen .satz{color:var(--c-text-muted)}
.zeilen .sonder a{background:var(--c-surface-2)}
.nicht-dabei{margin-top:var(--s-5);color:var(--c-text-muted)}
/* Schichten als Tabelle */
.schichten{width:100%;border-collapse:collapse}
.schichten th,.schichten td{padding:var(--s-4) var(--s-3);border-bottom:var(--b-haar) solid var(--c-line);vertical-align:top;text-align:left}
.schichten th{font:var(--fw-head) var(--fs-lg)/1.2 var(--font-head);width:26%}
.schichten th small{display:block;font:var(--fw-text) var(--fs-sm) var(--font-text);color:var(--c-text-muted);margin-top:var(--s-1)}
.schichten ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.schichten li{border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-1);padding:var(--s-1) var(--s-3);font-size:var(--fs-sm)}
.schichten tr:last-child th,.schichten tr:last-child td{border-bottom:var(--b-regel) solid var(--c-text)}
@media (max-width:700px){.schichten th,.schichten td{display:block;width:auto}.schichten th{border-bottom:0;padding-bottom:0}}
/* Daten / Abschluss */
.daten{background:var(--c-surface-2);border-bottom:0}
.daten ul{list-style:none;margin:0;padding:0}
.daten li{display:flex;gap:var(--s-3);align-items:center;padding:var(--s-3) 0;border-top:var(--b-haar) solid var(--c-line-strong);font-weight:var(--fw-medium)}
.daten li svg{width:20px;height:20px;flex:none;color:var(--c-entschieden-text)}
.schluss{border-bottom:0}
.fuss{padding:var(--s-7) 0 var(--s-8);border-top:var(--b-regel) solid var(--c-text);font-size:var(--fs-sm)}
.fuss-spruch{font:var(--fw-head) var(--fs-xl)/1.15 var(--font-head);margin:0 0 var(--s-5)}
.fuss-spalten{display:grid;gap:var(--s-5);margin-bottom:var(--s-5)}
@media (min-width:720px){.fuss-spalten{grid-template-columns:repeat(3,minmax(0,1fr))}}
.fuss h2{font:var(--fw-strong) var(--fs-sm) var(--font-text);margin:0 0 var(--s-2)}
.fuss a{display:block;color:var(--c-text);padding:var(--s-1) 0}
.fuss .klein a{display:inline;padding:0}
/* Bildschirme (Produktseite) */
.bildschirm{border:var(--b-regel) solid var(--c-line-strong);border-radius:var(--r-3);overflow:hidden;background:var(--c-bg)}
.bildschirm .titel{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--c-surface-2);border-bottom:var(--b-haar) solid var(--c-line);font-size:var(--fs-sm);font-weight:var(--fw-strong)}
.bildschirm .titel span{font-weight:var(--fw-text);color:var(--c-text-muted)}
.bildschirm .inhalt{padding:var(--s-5)}
.bildschirm.tablet{max-width:760px;border-radius:var(--r-3)}
.bild-zeile{display:grid;gap:var(--s-6);margin-bottom:var(--s-8)}
@media (min-width:960px){.bild-zeile{grid-template-columns:minmax(0,4fr) minmax(0,7fr);align-items:start}}
.bild-zeile h2{font-size:var(--fs-xl)}
.bild-zeile .text p{color:var(--c-text-muted)}
.menge{width:5.5rem;min-height:var(--hit-min);padding:0 var(--s-2);font:var(--fs-md) var(--font-text);color:var(--c-text);background:var(--c-surface);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-2);text-align:right}
.menge:focus-visible{outline:var(--focus-ring);outline-offset:0;border-color:var(--c-focus)}
.pruef{list-style:none;margin:0;padding:0}
.pruef li{display:grid;gap:var(--s-2) var(--s-4);padding:var(--s-4) 0;border-bottom:var(--b-haar) solid var(--c-line);align-items:center}
@media (min-width:640px){.pruef li{grid-template-columns:minmax(0,1fr) auto auto}}
.pruef small{display:block;color:var(--c-text-muted);font-size:var(--fs-sm)}
.pruef .abgezeichnet{display:none;align-items:center;gap:var(--s-2);color:var(--c-entschieden-text);font-size:var(--fs-sm)}
.pruef li.fertig .abgezeichnet{display:flex}.pruef li.fertig button{display:none}
.pruef li.fertig{border-left:3px solid var(--c-entschieden-line);padding-left:var(--s-3)}
.auszug{margin-top:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--c-surface-2);border-radius:var(--r-1);font-size:var(--fs-sm)}
.auszug mark{background:var(--c-vorschlag-fill);color:inherit;box-shadow:inset 0 -2px 0 var(--c-vorschlag-line)}
details.quelle-auf summary{cursor:pointer;color:var(--c-link);text-decoration:underline;text-underline-offset:.18em;min-height:var(--hit-min);display:inline-flex;align-items:center}
/* Motive */
.motive{display:grid;gap:var(--s-5)}
@media (min-width:960px){.motive{grid-template-columns:repeat(2,minmax(0,1fr))}}
.motiv h3{font-size:var(--fs-xl);margin-bottom:var(--s-1)}
.motiv .wer{color:var(--c-text-muted);font-size:var(--fs-sm);margin-bottom:var(--s-3)}
.motiv{display:flex;flex-direction:column}.motiv .beleg{flex:1}
.ohne-js .nur-js{display:none}
@media (prefers-reduced-motion:no-preference){.beleg.wechsel{animation:wechsel var(--t-kurz) var(--ease)}}
@keyframes wechsel{from{opacity:.6}to{opacity:1}}

/* Branchenseite */
.probleme{margin:0;display:grid;gap:0;border-top:var(--b-regel) solid var(--c-text)}
.probleme>div{padding:var(--s-5) 0;border-bottom:var(--b-haar) solid var(--c-line);display:grid;gap:var(--s-2) var(--s-6)}
@media (min-width:860px){.probleme>div{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}}
.probleme dt{font:var(--fw-head) var(--fs-lg)/1.2 var(--font-head)}
.probleme dd{margin:0;color:var(--c-text-muted);max-width:var(--measure)}
.fliess p{color:var(--c-text-muted)}
.sr{position:absolute;left:-999px}
.zeile-kopf h1{font-size:var(--fs-2xl)}

[hidden]{display:none!important}
.hero-grid,.bild-zeile,.motive,.abschnitt-kopf,.legende,.fuss-spalten{grid-template-columns:minmax(0,1fr)}
.hero-grid>*,.bild-zeile>*,.motive>*,.abschnitt-kopf>*,.legende>*{min-width:0}
@media (min-width:960px){.hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.bild-zeile{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}.motive{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:860px){.abschnitt-kopf{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.legende{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:720px){.fuss-spalten{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:960px){.band .wrap{flex-wrap:nowrap}.nav{gap:var(--s-4)}.nav .knopf{padding:0 var(--s-3);white-space:nowrap}.nav a{white-space:nowrap}}
.band{background:var(--c-band);color:var(--c-band-text);border-bottom:var(--b-haar) solid var(--c-line)}
.band .wrap{display:flex;align-items:center;gap:var(--s-4);min-height:76px;padding-top:var(--s-2);padding-bottom:var(--s-2)}

/* ===== Umgesetzte WordPress-Seiten ===== */
.seiten-kopf h1{max-width:24ch;font-size:var(--fs-2xl)}
.seiten-kopf .lead{max-width:60ch}
.seiten-inhalt{padding-bottom:var(--s-8)}
.seiten-inhalt section{padding:var(--s-6) 0;border-top:var(--b-haar) solid var(--c-line);display:grid;row-gap:0;column-gap:var(--s-7);grid-template-columns:minmax(0,1fr)}
.seiten-inhalt section>*{min-width:0}
.seiten-inhalt section:first-child{border-top:var(--b-regel) solid var(--c-text)}
@media (min-width:960px){
  .seiten-inhalt section{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
  .seiten-inhalt section>h2{grid-column:1;grid-row:1/span 40;align-self:start;position:sticky;top:var(--s-5)}
  .seiten-inhalt section>*:not(h2){grid-column:2}
  .seiten-inhalt section:not(:has(>h2))>*{grid-column:1/-1}
}
.seiten-inhalt h2{font-size:var(--fs-xl)}
.seiten-inhalt h3{font-size:var(--fs-lg);margin:var(--s-4) 0 var(--s-2)}
.seiten-inhalt h4{font:var(--fw-strong) var(--fs-md)/1.3 var(--font-text);margin:var(--s-3) 0 var(--s-1)}
.seiten-inhalt p,.seiten-inhalt li{max-width:var(--measure)}
.seiten-inhalt ul,.seiten-inhalt ol{padding-left:1.2em;margin:0 0 var(--s-3)}
.seiten-inhalt li{margin-bottom:var(--s-1)}
.seiten-inhalt img{max-width:100%;height:auto;border-radius:var(--r-3);display:block}
.seiten-inhalt figure{margin:var(--s-3) 0;position:relative}
.seiten-inhalt blockquote{margin:var(--s-4) 0;padding:var(--s-2) var(--s-4);border-left:4px solid var(--c-line-strong);color:var(--c-text-muted)}
.seiten-inhalt hr{border:0;border-top:var(--b-haar) solid var(--c-line);margin:var(--s-5) 0}
.seiten-inhalt details{border-bottom:var(--b-haar) solid var(--c-line)}
.seiten-inhalt summary{cursor:pointer;font-weight:var(--fw-strong);padding:var(--s-3) 0;min-height:var(--hit-min)}
.seiten-inhalt details[open] summary{color:var(--c-entschieden-text)}
.seiten-inhalt .raster{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.seiten-inhalt .karte{border-top:2px solid var(--c-text);padding-top:var(--s-3)}
.seiten-inhalt .karte h3{margin-top:0}
.seiten-inhalt .karte p{color:var(--c-text-muted)}
.seiten-inhalt .tabwrap{margin:var(--s-3) 0}
.seiten-inhalt [data-ki]{display:inline-block;font:var(--fw-medium) var(--fs-xs) var(--font-text);color:var(--c-text-muted);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-1);padding:0 var(--s-2);background:var(--c-surface)}
.seiten-inhalt .knopf{margin:var(--s-2) var(--s-2) var(--s-2) 0}
.beitrag .wrap{max-width:820px}
.beitrag section{grid-template-columns:minmax(0,1fr)!important;border-top:0!important;padding:var(--s-3) 0}
.beitrag section>h2{position:static!important;grid-row:auto!important}
.beitrag section>*{grid-column:1/-1!important}
.beitrag-meta{color:var(--c-text-muted);font-size:var(--fs-sm);margin-bottom:var(--s-3)}
.blog-liste .satz{display:block}

/* Branchenregister mit Foto */
.zeilen a{align-items:center}
.zeilen .foto{position:relative;display:block;border-radius:var(--r-2);overflow:hidden;background:var(--c-surface-2)}
.zeilen .foto img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.ki-tag{position:absolute;left:var(--s-2);bottom:var(--s-2);font:var(--fw-medium) var(--fs-xs)/1.3 var(--font-text);color:var(--c-text);background:rgba(255,255,255,.92);border-radius:var(--r-1);padding:0 var(--s-2)}
@media (min-width:860px){.zeilen a{grid-template-columns:150px minmax(0,4fr) minmax(0,6fr)}}
@media (max-width:859px){.zeilen a{grid-template-columns:96px minmax(0,1fr);column-gap:var(--s-4)}.zeilen .foto{grid-row:1/3}.zeilen .name,.zeilen .satz{grid-column:2}}
figure.video{margin:0}
figure.video video{width:100%;height:auto;border-radius:var(--r-3);background:var(--c-surface-2);display:block}
figure.video figcaption{margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--c-text-muted)}

/* Untermenues */
.nav-gruppe{position:relative}
.nav-sub{display:none;position:absolute;left:calc(-1 * var(--s-4));top:100%;min-width:17rem;padding:var(--s-2);background:var(--c-surface);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-3);box-shadow:var(--shadow-float);z-index:30}
.nav-gruppe:hover .nav-sub,.nav-gruppe:focus-within .nav-sub{display:grid}
.nav-sub a{padding:var(--s-3);min-height:var(--hit-min);border-bottom:0!important;border-radius:var(--r-2);font-weight:var(--fw-text)}
.nav-sub a:hover{background:var(--c-surface-2)}
.mobil nav a.unter{padding-left:var(--s-6);font-size:var(--fs-sm);color:var(--c-text-muted)}

.vorzeile{font:var(--fw-medium) var(--fs-sm)/1.3 var(--font-text);color:var(--c-text-muted);margin:0 0 var(--s-3)}
/* Tarifkarten */
.seiten-inhalt [data-tarif]{border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-3);padding:var(--s-5);background:var(--c-surface);display:flex;flex-direction:column;gap:var(--s-2);position:relative}
.seiten-inhalt [data-tarif="hervor"]{border:var(--b-regel) solid var(--c-entschieden-line)}
.seiten-inhalt [data-tarif] h3{margin:0;font-size:var(--fs-xl)}
.seiten-inhalt [data-rolle="tag"]{color:var(--c-text-muted);margin:0}
.seiten-inhalt [data-rolle="preis"]{margin:var(--s-3) 0 0;font:var(--fw-head) var(--fs-2xl)/1 var(--font-head);color:var(--c-text)}
.seiten-inhalt [data-rolle="preis"] s{font-size:var(--fs-lg);color:var(--c-text-muted);font-weight:var(--fw-text);margin-right:var(--s-2)}
.seiten-inhalt [data-rolle="sub"]{margin:0 0 var(--s-3);font-size:var(--fs-sm);color:var(--c-text-muted)}
.seiten-inhalt [data-rolle="band"]{align-self:flex-start;font:var(--fw-strong) var(--fs-sm)/1.3 var(--font-text);color:var(--c-entschieden-text);background:var(--c-entschieden-fill);border:var(--b-haar) solid var(--c-entschieden-line);border-radius:var(--r-1);padding:0 var(--s-2)}
.seiten-inhalt [data-tarif] ul{flex:1}
.seiten-inhalt [data-tarif] .knopf{align-self:flex-start}

.seiten-inhalt video{max-width:100%;height:auto;border-radius:var(--r-3);display:block;background:var(--c-surface-2)}
.seiten-inhalt iframe{max-width:100%}

.seiten-inhalt,.zeilen,.blog-liste,.fuss{overflow-wrap:anywhere}
.seiten-inhalt a{overflow-wrap:anywhere;word-break:break-word}
.zeilen .name,.legende h3,.karte h3{hyphens:auto}
/* Handbuch: eine Spalte */
.handbuch section{display:block!important}
.handbuch section>h2{position:static!important;margin:var(--s-7) 0 var(--s-3)}
.handbuch .wrap{max-width:980px}
.handbuch table{font-size:var(--fs-sm)}
.handbuch code{font:var(--fw-text) .9em var(--font-mono);background:var(--c-surface-2);padding:0 .25em;border-radius:var(--r-1)}

/* MAPE: Balkenvergleich und Lewis-Skala */
.balken{margin:var(--s-4) 0;max-width:34rem}
.balken p{margin:var(--s-2) 0 var(--s-1)}
.balken progress{-webkit-appearance:none;appearance:none;width:100%;height:14px;border:0;border-radius:7px;background:var(--c-surface-2);accent-color:var(--c-accent);display:block}
.balken progress::-webkit-progress-bar{background:var(--c-surface-2);border-radius:7px}
.balken progress::-webkit-progress-value{background:var(--c-accent);border-radius:7px}
.balken progress::-moz-progress-bar{background:var(--c-accent);border-radius:7px}
table.lewis{max-width:34rem}
table.lewis th{width:9rem;text-align:left;font-weight:var(--fw-strong)}
.lewis-marker{font-weight:var(--fw-strong);color:var(--c-entschieden-text)}

/* Branchenkreis (Startseite) */
.kreis-block{display:grid;gap:var(--s-4);justify-items:center}
.kreis{width:100%;max-width:520px;height:auto;display:block;overflow:visible}
.kreis .speichen line{stroke:var(--c-line-strong);stroke-width:1.5}
.kreis .mitte .ring{fill:var(--c-surface);stroke:var(--logo-violett);stroke-width:7}
.kreis .mitte .balken{fill:var(--logo-orange)}
.kreis .blase circle{fill:var(--c-surface);stroke:var(--c-line-strong);stroke-width:1.5;transition:fill var(--t-kurz) var(--ease),stroke var(--t-kurz) var(--ease)}
.kreis .blase text{font:var(--fw-head) 18px/1 var(--font-text);fill:var(--c-text);text-anchor:middle;dominant-baseline:central;pointer-events:none}
.kreis .blase:hover circle,.kreis .blase:focus-visible circle,.kreis .blase.treffer circle{fill:var(--c-accent);stroke:var(--c-accent)}
.kreis .blase:hover text,.kreis .blase:focus-visible text,.kreis .blase.treffer text{fill:var(--c-on-accent)}
.kreis .blase:focus-visible{outline:none}
.kreis .blase:focus-visible circle{stroke:var(--c-focus);stroke-width:4}
.kreis .blase.treffer circle{stroke-width:4;stroke:var(--c-entschieden-line)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .kreis .mitte .ring{stroke:var(--logo-violett-dunkelgrund)}}
:root[data-theme="dark"] .kreis .mitte .ring{stroke:var(--logo-violett-dunkelgrund)}
.kreis-suche{width:100%;max-width:520px}
.kreis-suche label{display:block;font-weight:var(--fw-strong);margin-bottom:var(--s-1)}
.kreis-treffer{margin:var(--s-2) 0 0;font-weight:var(--fw-medium)}
.vorschlag-zeile{max-width:560px}

/* Branchenkreis: Drehung per JavaScript (site2.js) */
.kreis-pause{justify-self:end;margin-top:calc(-1 * var(--s-2))}

/* Handy: kleine Kennzeichnung auf Vorschaubildern, kleinere Branchenueberschriften */
.ki-tag{white-space:nowrap}
.zeilen .foto{align-self:center}
@media (max-width:859px){
  .zeilen .ki-tag{left:var(--s-1);bottom:var(--s-1);font-size:.75rem;line-height:1.35;padding:0 var(--s-1)}
  .zeilen .name{font-size:var(--fs-lg);line-height:1.15}
  .zeilen a{padding:var(--s-3) var(--s-2)}
}

/* Produktseiten: Systembild neben dem Seitenkopf, Modulkarten */
.seiten-kopf.mit-bild .wrap{display:grid;gap:var(--s-6);grid-template-columns:minmax(0,1fr);align-items:center}
@media (min-width:960px){.seiten-kopf.mit-bild .wrap{grid-template-columns:minmax(0,6fr) minmax(0,6fr)}}
.systembild{margin:0}
.systembild img{display:block;width:100%;height:auto;border-radius:var(--r-3);border:var(--b-haar) solid var(--c-line-strong)}
.systembild figcaption{margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--c-text-muted)}
.seiten-inhalt .karte:has(ul){border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-3);padding:var(--s-5);background:var(--c-surface)}

.beispiel-raster{display:grid;gap:var(--s-6);grid-template-columns:minmax(0,1fr)}
@media (min-width:960px){.beispiel-raster{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s-8);align-items:start}}
.legende-stapel{grid-template-columns:minmax(0,1fr)!important}

/* Verweise als Chips (Linklisten) und Modulkarten mit Knopf */
.seiten-inhalt ul.linkreihe{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0 0 var(--s-3)}
.seiten-inhalt ul.linkreihe li{margin:0;max-width:none}
.seiten-inhalt ul.linkreihe a{display:inline-flex;align-items:center;min-height:var(--hit-min);padding:0 var(--s-4);border:var(--b-haar) solid var(--c-line-strong);border-radius:var(--r-rund);text-decoration:none;color:var(--c-text);font-weight:var(--fw-medium);background:var(--c-surface)}
.seiten-inhalt ul.linkreihe a:hover{background:var(--c-surface-2);border-color:var(--c-text)}
.seiten-inhalt .karte h3 a{color:inherit;text-decoration:none}
.seiten-inhalt .karte h3 a:hover{text-decoration:underline}
.seiten-inhalt .karte a.knopf{margin:var(--s-3) 0 0;text-decoration:none}
.seiten-inhalt .karte:has(ul){display:flex;flex-direction:column}
.seiten-inhalt .karte:has(ul) a.knopf{align-self:flex-start;margin-top:auto}
.seiten-inhalt .karte a.knopf,.seiten-inhalt a.knopf{line-height:1.25;padding-top:var(--s-2);padding-bottom:var(--s-2);text-align:center}

@media (min-width:720px){.fuss-spalten{grid-template-columns:repeat(4,minmax(0,1fr))}}
.fuss button.k-text{font:inherit;background:none;border:0;padding:var(--s-1) 0;text-decoration:underline;color:var(--c-text);cursor:pointer;text-align:left;min-height:0}

/* Blog: Karten mit Titelbild */
.blog-karten{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-6) var(--s-5);grid-template-columns:repeat(auto-fill,minmax(17.5rem,1fr))}
.blog-karte a{display:flex;flex-direction:column;gap:var(--s-2);height:100%;color:var(--c-text);text-decoration:none}
.blog-karte .bk-bild{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-3);background:var(--c-surface-2);border:var(--b-haar) solid var(--c-line)}
.blog-karte .bk-bild img{display:block;width:100%;height:100%;object-fit:cover}
.blog-karte .bk-ohne{background:var(--c-surface-2)}
.blog-karte .bk-meta{font-size:var(--fs-sm);color:var(--c-text-muted);margin-top:var(--s-1)}
.blog-karte .bk-kat{font-weight:var(--fw-strong);color:var(--c-text)}
.blog-karte .bk-titel{font:var(--fw-head) var(--fs-lg)/1.2 var(--font-head)}
.blog-karte a:hover .bk-titel{text-decoration:underline}
.blog-karte .bk-auszug{font-size:var(--fs-sm);color:var(--c-text-muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.beitragsbild{margin:var(--s-5) 0 0}
.beitragsbild img{display:block;width:100%;max-width:820px;height:auto;border-radius:var(--r-3);border:var(--b-haar) solid var(--c-line)}
.beitragsbild img{width:auto;max-width:100%;max-height:30rem}
.bb-rahmen{position:relative;display:inline-block;max-width:100%;line-height:0}
.bb-rahmen .ki-tag{line-height:1.3}