/* ======================================================================
   KEA · Seiten-Komponenten-Kit  (assets/css/kea-pages.css)
   Wird NACH kea.css geladen. Präfix kp- für alles. Nutzt nur die Basis-
   Tokens aus kea.css (--k-*, --bg, --surface, --ink, --line, --cta, --r-*)
   und eigene --kp-*-Tokens (unten). Katalog: /_kit/ · Anleitung: AUTHORING.md
   Nur das Kit ändert diese Datei. Klassen-APIs werden nur erweitert.
   v1.2 (Integration 24.09.2026): cta--light-Lead, CTA-Textlinks, example__total als <p>, «+» in
   Zusatzzeilen hängend (opt-in kp-price--hang), Karten ohne Link ohne Hover-Lift (+ kp-card--static), kp-split--copy-first,
   kp-timeline--row, facts--plain ohne Radius.
   v1.3 (Integration QA 24.09.2026): SVG-Beschriftungen mobil (≤480 px) auf effektive Mindestgrösse (Massstab
   --kp-svg-k aus kea-pages.js; Tokens --kp-i-text-min, --kp-m-label-min, …-muted-min, …-hq-min), kp-chip mit <strong> ohne Doppelabstand, «+» in
   Zusatzzeilen immer hängend (kp-price--hang = Standard), kp-prose-Tabellen ≤480 px mit Silbentrennung
   (+ opt-in .kp-table--stack), Hero-H1 ≤420 px kleiner + Silbentrennung.
   v1.4 (Kit-Integration 24.09.2026): kp-price-Preisspalte nie abgeschnitten (Textspalten trennen/umbrechen, Container
   Query für schmale Karten), Glas-Bildunterschriften in --dark, kp-link-Pfeil folgt dem Text, kp-steps mobil ohne
   Überlauf, kp-eyebrow ohne Flex-Doppelabstand, Abstand Hero → erste weisse Sektion, Breadcrumb mobil einzeilig,
   kp-hero__art mit beliebigem SVG-Format, endliche Animationen, Leerzeichen Zahl/Einheit; neue Optionen
   kp-cards--compact/--row/--plain, kp-card--row, kp-facts--compact, kp-callout--compact/--split,
   kp-price-grid--even/--wide-first, kp-review__quote.
   v1.4 a11y (audit/a11y.md): --kp-accent = --k-red-text, --kp-grad-text/--kp-star kontraststark, Fokus --k-focus,
   callout-Links ohne .kp-btn, Überschriften brechen um, Review-Avatar einfarbig, TOC-Leiste folgt dem Fokus.

   Inhalt
     0  Tokens (hell/dunkel)
     1  Layout: wrap, section, head, Typo, prose, Buttons, Chips, Links
     2  Hero (--photo, --split, --illustration, --compact) + Breadcrumb
     3  TOC + Layout mit Seitenleiste
     4  Facts
     5  Steps + Timeline
     6  Preise + Beispielrechnung
     7  Split
     8  Callouts + Zitat
     9  FAQ
    10  Cards
    11  Reviews
    12  Team
    13  Trust
    14  Regions
    15  CTA-Band
    16  Legal
    17  Kontakt + Formular
    18  Illustrationen
    19  Animations-Utilities, Reduced Motion, Druck
   ====================================================================== */

/* ---------- 0 · Tokens ---------- */
:root{
  --kp-max:1240px;
  --kp-wide:1440px;
  --kp-narrow:820px;
  --kp-read:68ch;
  --kp-pad:var(--pad,clamp(20px,5vw,56px));
  --kp-sec:clamp(64px,8.5vw,128px);
  --kp-sec-s:clamp(40px,5.5vw,80px);
  --kp-gap:clamp(16px,2vw,28px);
  --kp-r:var(--r-l,24px);
  --kp-r-s:var(--r-m,16px);
  --kp-ease:cubic-bezier(.22,.68,.24,1);
  --kp-sticky:calc(var(--kn-header-height,86px) + 24px);
  /* Typo */
  --kp-h1:clamp(2.25rem,5.4vw,4.25rem);
  --kp-h1-s:clamp(2rem,4vw,3rem);
  --kp-h2:clamp(1.75rem,3.3vw,2.7rem);
  --kp-h3:clamp(1.12rem,1.5vw,1.3rem);
  --kp-lead:clamp(1.06rem,1.45vw,1.25rem);
  /* Flächen */
  --kp-card:var(--surface);
  --kp-card-2:var(--surface-2);
  --kp-shadow:0 1px 2px rgba(14,17,22,.04),0 8px 28px rgba(14,17,22,.06);
  --kp-shadow-h:0 2px 6px rgba(14,17,22,.05),0 20px 48px rgba(14,17,22,.11);
  /* Dunkle Markenfläche (wie die Haus-Szene der Startseite) – in beiden Themes dunkel */
  --kp-forest:#0b1f1e;
  --kp-forest-2:#071514;
  --kp-forest-line:rgba(188,223,199,.14);
  --kp-on-dark:#eef5ee;
  --kp-on-dark-2:#b3c7bb;
  --kp-mint:#8cdeb3;
  --kp-warm:#f6b456;
  /* Akzente */
  --kp-accent:var(--k-red-text,#BC3A1A);   /* v1.4 a11y: Text-Rot ≥ 4.5:1 (vorher --k-red-2) */
  --kp-grad-text:linear-gradient(95deg,#B4243B 0%,#BC3A1A 55%,#B8560A 100%);   /* v1.4 a11y: alle Stopps ≥ 4.4:1 */
  --kp-star:#B7791F;   /* v1.4 a11y: ≥ 3:1 auf Weiss/Grau (dunkel: #F2B01E) */
  --kp-ok:#1A7A46;   /* v1.4 a11y: als Textfarbe ≥ 5:1 (vorher #1f8d52 = 4.21:1) */
  /* Callouts */
  --kp-info-bg:#eef4fb; --kp-info-line:#b5cfee; --kp-info-ink:#1d5a99;
  --kp-warn-bg:#fff5ea; --kp-warn-line:#f3bd86; --kp-warn-ink:#a2470f;
  --kp-tip-bg:#ecf9f1;  --kp-tip-line:#9fdcb9;  --kp-tip-ink:#1c7a47;
  --kp-legal-bg:var(--surface-2); --kp-legal-line:var(--line-2); --kp-legal-ink:var(--ink-2);
  /* Illustrationen */
  --kp-illu-line:#5b7a72;
  --kp-illu-soft:#2a4642;
  --kp-illu-hi:var(--kp-mint);
  --kp-illu-warm:var(--kp-warm);
  --kp-illu-red:#e65d40;
}
:root[data-theme="dark"]{
  --kp-shadow:0 1px 2px rgba(0,0,0,.35);
  --kp-shadow-h:0 2px 8px rgba(0,0,0,.4),0 20px 48px rgba(0,0,0,.42);
  --kp-accent:var(--k-yellow,#F6C24A);
  --kp-grad-text:linear-gradient(95deg,var(--k-red-2) 0%,var(--k-orange) 50%,var(--k-yellow) 100%);
  --kp-ok:#8fe3b0;
  --kp-star:#f2b01e;
  --kp-info-bg:#101d2c; --kp-info-line:#2b4d74; --kp-info-ink:#a4cbf3;
  --kp-warn-bg:#231a10; --kp-warn-line:#7d4c1d; --kp-warn-ink:#f6c07a;
  --kp-tip-bg:#0e211a;  --kp-tip-line:#2b6446;  --kp-tip-ink:#98e6b8;
  --kp-forest:#0c1d1c;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --kp-shadow:0 1px 2px rgba(0,0,0,.35);
    --kp-shadow-h:0 2px 8px rgba(0,0,0,.4),0 20px 48px rgba(0,0,0,.42);
    --kp-accent:var(--k-yellow,#F6C24A);
    --kp-grad-text:linear-gradient(95deg,var(--k-red-2) 0%,var(--k-orange) 50%,var(--k-yellow) 100%);
    --kp-ok:#8fe3b0;
    --kp-star:#f2b01e;
    --kp-info-bg:#101d2c; --kp-info-line:#2b4d74; --kp-info-ink:#a4cbf3;
    --kp-warn-bg:#231a10; --kp-warn-line:#7d4c1d; --kp-warn-ink:#f6c07a;
    --kp-tip-bg:#0e211a;  --kp-tip-line:#2b6446;  --kp-tip-ink:#98e6b8;
    --kp-forest:#0c1d1c;
  }
}

/* ---------- 1 · Layout & Grundelemente ---------- */
.kp-wrap{width:100%;max-width:calc(var(--kp-max) + 2 * var(--kp-pad));margin-inline:auto;padding-inline:var(--kp-pad)}
.kp-wrap--wide{max-width:calc(var(--kp-wide) + 2 * var(--kp-pad))}
.kp-wrap--narrow{max-width:calc(var(--kp-narrow) + 2 * var(--kp-pad))}
.kp-section{position:relative;padding-block:var(--kp-sec);background:var(--bg);color:var(--ink)}
.kp-section--s{padding-block:var(--kp-sec-s)}
.kp-section--muted{background:var(--bg-2)}
.kp-section--line{border-top:1px solid var(--line)}
.kp-section--flush-top{padding-top:0}
.kp-section--dark{background:var(--kp-forest);color:var(--kp-on-dark);isolation:isolate;overflow:hidden;
  --ink:var(--kp-on-dark);--ink-2:var(--kp-on-dark-2);--muted:var(--kp-on-dark-2);--line:var(--kp-forest-line);--line-2:rgba(188,223,199,.22);
  --surface:rgba(255,255,255,.04);--surface-2:rgba(255,255,255,.06);--kp-card:rgba(255,255,255,.045);--kp-card-2:rgba(255,255,255,.07);
  --kp-accent:var(--k-yellow);--kp-shadow:none;--kp-shadow-h:0 20px 48px rgba(0,0,0,.35);
  --glass:color-mix(in srgb,var(--kp-forest) 72%,transparent);   /* v1.4: Glas-Flächen (Bildunterschriften, Badges) dunkel */
  --kp-star:#f2b01e;--kp-grad-text:linear-gradient(95deg,var(--k-red-2) 0%,var(--k-orange) 50%,var(--k-yellow) 100%)}
.kp-section--dark :is(.kp-split__media,.kp-hero__media) figcaption{color:var(--kp-on-dark);border:1px solid var(--kp-forest-line)}
.kp-section--dark::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 60% 70% at 82% 18%,rgba(70,127,94,.22),transparent 70%),radial-gradient(ellipse 50% 60% at 0% 100%,rgba(224,75,42,.10),transparent 70%)}
/* v1.4: weisser Hero direkt gefolgt von weisser Sektion – oben nur der kleine Sektionsabstand (sonst ~230 px Loch)
   (Spezifität niedrig gehalten: eigene page.css-Regeln mit body[data-page]-Präfix gelten weiter) */
.kp-hero + .kp-section:where(:not(.kp-section--muted,.kp-section--dark,.kp-section--line,.kp-section--flush-top)){padding-top:var(--kp-sec-s)}
/* gleiche Hintergründe hintereinander: kein doppelter Abstand */
.kp-section:not(.kp-section--muted):not(.kp-section--dark) + .kp-section:not(.kp-section--muted):not(.kp-section--dark):not(.kp-section--line),
.kp-section--muted + .kp-section--muted:not(.kp-section--line){padding-top:0}
.kp-stack>*+*{margin-top:var(--kp-stack,24px)}
.kp-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kp-gap)}
@media (max-width:860px){.kp-grid-2{grid-template-columns:1fr}}

/* Sektionskopf */
.kp-head{max-width:760px;margin-bottom:clamp(32px,4.5vw,56px)}
.kp-head--center{margin-inline:auto;text-align:center}
.kp-head--center .kp-eyebrow,.kp-center .kp-eyebrow{width:fit-content;max-width:100%;margin-inline:auto}
.kp-head--split{max-width:none;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px 64px;align-items:end}
.kp-head--split .kp-lead{margin-top:0}
@media (max-width:860px){.kp-head--split{grid-template-columns:1fr}}
.kp-eyebrow{position:relative;display:block;padding-left:33px;margin:0 0 18px;font-size:12.5px;line-height:1.5;font-weight:650;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
/* v1.4: kein Flex mehr (Inline-Kinder wie <span> bekamen sonst Gap + Leerzeichen = doppelten Wortabstand); die Marke
   hängt absolut vor der ersten Zeile, Folgezeilen fluchten mit dem Text. Zentriert: Box so breit wie der Text. */
.kp-eyebrow::before{content:"";position:absolute;left:0;top:calc(.75em - 1.5px);width:22px;height:3px;border-radius:3px;background:var(--k-grad)}
/* v1.4 a11y (Reflow 320 px / 200 % Zoom, WCAG-Textabstände): Überschriften brechen nie aus ihrer Box; schmal mit
   Silbentrennung langer Wörter nur sehr schmal (≤ 360 px ≈ 320-px-Reflow), damit Titel sonst ganze Wörter umbrechen */
h1,h2,h3,h4{overflow-wrap:break-word}
@media (max-width:360px){main :is(h2,h3,h4){hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:12 5 5}}   /* Hero-H1: Regel ≤ 420 px (v1.3) */
.kp-h2,.kp-section h2.kp-h2{font-size:var(--kp-h2);line-height:1.08;letter-spacing:-.032em;font-weight:700;text-wrap:balance}
.kp-h3{font-size:var(--kp-h3);line-height:1.25;letter-spacing:-.012em;font-weight:700}
.kp-lead{margin-top:18px;font-size:var(--kp-lead);line-height:1.55;color:var(--ink-2);max-width:62ch;text-wrap:pretty}
.kp-grad{background:var(--kp-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.kp-muted{color:var(--muted)}
.kp-small{font-size:.9rem;line-height:1.55;color:var(--muted)}
.kp-center{text-align:center}
.kp-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.kp-ico{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Fliesstext */
.kp-prose{max-width:var(--kp-read);font-size:1.0625rem;line-height:1.7;color:var(--ink-2)}
.kp-prose>*+*{margin-top:1.05em}
.kp-prose h2{font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.15;letter-spacing:-.025em;font-weight:700;color:var(--ink);margin-top:2em}
.kp-prose h3{font-size:var(--kp-h3);line-height:1.3;font-weight:700;color:var(--ink);margin-top:1.8em}
.kp-prose h2+*,.kp-prose h3+*{margin-top:.6em}
.kp-prose>:first-child{margin-top:0}
.kp-prose strong{color:var(--ink);font-weight:650}
.kp-prose a:not([class]){color:var(--ink);text-decoration:underline;text-decoration-color:var(--kp-accent);text-decoration-thickness:2px;text-underline-offset:3px;transition:text-decoration-color .2s}
.kp-prose a:not([class]):hover{text-decoration-color:currentColor}
.kp-prose ul,.kp-prose ol{padding-left:0;list-style:none}
.kp-prose li{position:relative;padding-left:1.6em}
.kp-prose li+li{margin-top:.5em}
.kp-prose ul>li::before{content:"";position:absolute;left:.25em;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--k-grad)}
.kp-prose ol{counter-reset:kp-ol}
.kp-prose ol>li{counter-increment:kp-ol}
.kp-prose ol>li::before{content:counter(kp-ol) ".";position:absolute;left:0;top:0;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.kp-prose blockquote{margin-inline:0;padding:4px 0 4px 22px;border-left:3px solid;border-image:var(--k-grad) 1;font-size:1.15em;line-height:1.55;color:var(--ink)}
.kp-prose table{width:100%;border-collapse:collapse;font-size:.95rem;display:block;overflow-x:auto}
.kp-prose th,.kp-prose td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.kp-prose thead th{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:650}
.kp-prose hr{border:0;height:1px;background:var(--line);margin-block:2em}
/* Mobil (≤ 480 px): lange Wörter in Tabellenzellen trennen, damit die Tabelle in die Spalte passt (sonst scrollt sie
   wie bisher in sich, nie die Seite). Opt-in .kp-table--stack: Zeilen stapeln (Kopfzeile nur für Screenreader,
   1. Zelle als Titel) – nur für Begriff/Erklärung-Tabellen, deren Spaltenköpfe nicht zum Verständnis nötig sind. */
@media (max-width:480px){
  .kp-prose :is(th,td){hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 4 4}
  .kp-prose table.kp-table--stack{overflow:visible}
  .kp-prose table.kp-table--stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .kp-prose table.kp-table--stack :is(tbody,tfoot,tr){display:block}
  .kp-prose table.kp-table--stack tr{padding:12px 0;border-bottom:1px solid var(--line)}
  .kp-prose table.kp-table--stack :is(tbody,tfoot) :is(th,td){display:block;padding:0;border:0}
  .kp-prose table.kp-table--stack :is(tbody,tfoot) tr>:first-child:not(:only-child){margin-bottom:3px;font-weight:650;color:var(--ink)}
}
.kp-prose--center{margin-inline:auto}
.kp-check{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.kp-check li{position:relative;padding-left:34px;line-height:1.55;color:var(--ink-2)}
.kp-check li::before{content:"";position:absolute;left:0;top:.1em;width:22px;height:22px;border-radius:50%;background:color-mix(in srgb,var(--cta,#5be68d) 26%,transparent)}
.kp-check li::after{content:"";position:absolute;left:7px;top:calc(.1em + 6px);width:8px;height:5px;border-left:2px solid var(--kp-ok);border-bottom:2px solid var(--kp-ok);transform:rotate(-45deg)}

/* Buttons */
.kp-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.kp-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border-radius:var(--r-pill,999px);border:1.5px solid transparent;font:inherit;font-size:1rem;font-weight:700;line-height:1.2;cursor:pointer;text-align:center;transition:transform .18s var(--kp-ease),background .18s,box-shadow .18s,border-color .18s,color .18s}
.kp-btn .kp-ico,.kp-btn svg{width:19px;height:19px;flex:none}
.kp-btn:hover{transform:translateY(-2px)}
.kp-btn:active{transform:none}
.kp-btn--primary{background:var(--cta,#5be68d);color:var(--cta-ink,#103d24);box-shadow:0 10px 28px rgba(82,219,132,.24)}
.kp-btn--primary:hover{background:var(--cta-hover,#43d97a);box-shadow:0 14px 34px rgba(82,219,132,.34)}
.kp-btn--ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.kp-btn--ghost:hover{border-color:var(--ink);background:var(--surface)}
.kp-btn--s{min-height:42px;padding:10px 18px;font-size:.94rem}
@media (max-width:520px){.kp-actions .kp-btn{flex:1 1 100%}}
.kp-link{display:inline-block;max-width:100%;font-weight:650;color:var(--ink);border-bottom:1.5px solid transparent;transition:border-color .2s}
/* v1.4: Pfeil inline – folgt beim Umbruch dem letzten Wort (früher inline-flex: Pfeil am rechten Rand des Textblocks) */
.kp-link svg{display:inline-block;width:18px;height:18px;margin-left:8px;vertical-align:-.2em;transition:transform .2s var(--kp-ease)}
.kp-link__tail{white-space:nowrap}   /* von kea-pages.js gesetzt: letztes Wort + Pfeil */
.kp-link:hover{border-color:currentColor}
.kp-link:hover svg{transform:translateX(3px)}

/* Chips & Pills */
.kp-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.kp-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r-pill,999px);border:1px solid var(--line);background:var(--surface);font-size:.9rem;line-height:1.3;font-weight:560;color:var(--ink-2)}
.kp-chip svg{width:16px;height:16px;flex:none;color:var(--kp-accent)}
.kp-chip strong{color:var(--ink);font-weight:700}
/* «Icon + Text <strong>Wert</strong>»: <strong> nicht als eigenes Flex-Item (sonst Gap statt Leerzeichen = doppelter
   Abstand). Chips ohne Icon, deren <strong> bewusst per Gap absteht (z. B. «01 Periodische …»), bleiben unverändert. */
.kp-chip>svg~:is(strong,b){display:contents}
.kp-chip--brand{border-color:transparent;background:var(--k-grad-soft)}

/* ---------- 2 · Hero ---------- */
.kp-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--bg);color:var(--ink);padding-block:clamp(28px,4vw,56px) clamp(56px,7vw,104px)}
.kp-hero::before{content:"";position:absolute;inset:-20% -10% auto auto;width:min(900px,90vw);aspect-ratio:1;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(246,194,74,.13),rgba(224,75,42,.06) 55%,transparent 75%);transform:translate(20%,-10%)}
.kp-hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,80px);align-items:center}
.kp-hero__copy{position:relative;z-index:1;min-width:0}
.kp-hero__crumbs{margin-bottom:clamp(20px,3vw,40px)}
.kp-hero .kp-eyebrow{margin-bottom:20px}
.kp-hero__title,.kp-hero h1{font-size:var(--kp-h1);line-height:1.02;letter-spacing:-.04em;font-weight:700;text-wrap:balance;max-width:16ch;overflow-wrap:break-word}
/* Schmale Telefone: lange Komposita («Stockwerkeigentümer») trennen statt überlaufen */
@media (max-width:420px){
  .kp-hero{--kp-h1:clamp(1.8rem,8.6vw,2.25rem)}
  .kp-hero__title,.kp-hero h1{hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:12 5 5}
}
.kp-hero__lead{margin-top:22px;font-size:var(--kp-lead);line-height:1.55;color:var(--ink-2);max-width:56ch;text-wrap:pretty}
.kp-hero .kp-actions{margin-top:32px}
.kp-hero .kp-chips{margin-top:28px}
.kp-hero__media{position:relative;margin:0;border-radius:var(--kp-r);overflow:hidden;background:var(--surface-2);box-shadow:var(--kp-shadow-h)}
.kp-hero__media img{width:100%;height:100%;aspect-ratio:4/3.4;object-fit:cover}
.kp-hero__media figcaption{position:absolute;left:14px;bottom:14px;padding:6px 12px;border-radius:999px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:.8rem;color:var(--ink-2)}
.kp-hero__badge{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:16px;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--kp-shadow);font-size:.86rem;line-height:1.3;color:var(--ink)}
.kp-hero__badge svg{width:34px;height:34px;padding:7px;border-radius:10px;background:var(--k-grad);color:#fff;flex:none}
@media (max-width:620px){
  body[data-page="messtechnik"] .kp-hero__media figcaption{top:14px;bottom:auto;z-index:2}
}
/* --split: Standard (Text links, Bild rechts) */
/* --photo: grosses Foto rechts, weich ins Hintergrundbild ausgeblendet */
.kp-hero--photo{padding-block:0;min-height:clamp(520px,72vh,760px);display:flex;flex-direction:column}
.kp-hero--photo .kp-hero__grid{grid-template-columns:minmax(0,1fr);flex:1;align-items:center;padding-block:clamp(28px,4vw,48px) clamp(64px,8vw,112px)}
.kp-hero--photo .kp-hero__copy{max-width:600px}
.kp-hero--photo .kp-hero__media{position:absolute;inset:0 0 0 auto;width:min(64%,1080px);border-radius:0;box-shadow:none;z-index:-1;background:transparent;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.5) 18%,#000 42%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.5) 18%,#000 42%)}
.kp-hero--photo .kp-hero__media img{aspect-ratio:auto;height:100%}
.kp-hero--photo::before{display:none}
.kp-hero--photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--k-grad);opacity:.9}
/* --illustration: SVG-Bühne auf dunkler Markenfläche */
.kp-hero__art{position:relative;margin:0;border-radius:var(--kp-r);overflow:hidden;background:var(--kp-forest);color:var(--kp-illu-hi);aspect-ratio:4/3.3;display:grid;place-items:center;padding:clamp(16px,3vw,40px);
  box-shadow:inset 0 0 0 1px var(--kp-forest-line),var(--kp-shadow-h)}
.kp-hero__art::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 70% 30%,rgba(70,127,94,.28),transparent 70%),radial-gradient(ellipse 60% 50% at 10% 100%,rgba(224,75,42,.12),transparent 70%)}
.kp-hero__art svg{position:relative;width:100%;height:100%;max-height:440px}
/* v1.4: SVG in der Bühne einpassen – auch Illustrationen, deren viewBox nicht ~4:3 ist (vorher lief ein fast
   quadratisches SVG unten aus der Bühne: die auto-Grid-Zeile gab height:100% keine Bezugsgrösse). Mit fester
   1fr-Zeile füllt das SVG die Innenfläche und skaliert per preserveAspectRatio hinein. Bühnen mit aspect-ratio:auto
   (Höhe aus dem SVG) verhalten sich wie bisher. */
.kp-hero__art{grid-template:minmax(0,1fr) / minmax(0,1fr)}
/* --compact: Rechts-/Servicetexte */
.kp-hero--compact{padding-block:clamp(24px,3vw,40px) clamp(36px,4.5vw,64px);border-bottom:1px solid var(--line)}
.kp-hero--compact::before{display:none}
.kp-hero--compact .kp-hero__grid{grid-template-columns:1fr}
.kp-hero--compact h1,.kp-hero--compact .kp-hero__title{font-size:var(--kp-h1-s);max-width:22ch}
.kp-hero__meta{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:18px;font-size:.92rem;color:var(--muted)}
.kp-hero__meta span{display:inline-flex;align-items:center;gap:7px}
.kp-hero__meta svg{width:16px;height:16px}
@media (max-width:960px){
  .kp-hero__grid{grid-template-columns:1fr}
  .kp-hero__media img{aspect-ratio:16/11}
  .kp-hero__art{aspect-ratio:16/12}
  .kp-hero--photo{min-height:0}
  .kp-hero--photo .kp-hero__grid{padding-block:0 clamp(48px,10vw,72px)}
  .kp-hero--photo .kp-hero__media{position:relative;inset:auto;width:calc(100% + 2 * var(--kp-pad));margin:0 calc(-1 * var(--kp-pad));order:-1;height:clamp(260px,62vw,440px);
    -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
  .kp-hero--photo .kp-hero__copy{margin-top:-28px}
  .kp-hero--photo .kp-hero__crumbs{order:-2}
}
/* Breadcrumb: vom Build ({{breadcrumb}} → nav.kea-breadcrumb) oder manuell (nav.kp-breadcrumb) */
.kp-breadcrumb ol,.kp-hero__crumbs .kea-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;list-style:none;margin:0;padding:0;font-size:.875rem;line-height:1.4;color:var(--muted)}
.kp-breadcrumb li,.kp-hero__crumbs .kea-breadcrumb li{display:inline-flex;align-items:center;min-width:0}
.kp-breadcrumb li+li::before,.kp-hero__crumbs .kea-breadcrumb li+li::before{content:"";width:6px;height:6px;margin:0 10px 0 8px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg);opacity:.55;flex:none}
.kp-breadcrumb a,.kp-hero__crumbs .kea-breadcrumb a{color:var(--muted);padding-block:6px;transition:color .15s}
.kp-breadcrumb a:hover,.kp-hero__crumbs .kea-breadcrumb a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.kp-breadcrumb [aria-current],.kp-hero__crumbs .kea-breadcrumb [aria-current]{color:var(--ink-2);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:42ch}
/* v1.4 · Mobil (≤ 620 px): Pfad immer einzeilig. Ab vier Gliedern werden die Zwischenglieder zu «…» (Link bleibt,
   Name bleibt für Screenreader im DOM). Reicht der Platz nicht, kürzt sich zuerst das aktuelle Glied (steht ohnehin
   als H1 darunter), dann das Elternglied (Ellipse); «Startseite» bleibt ganz. */
@media (max-width:620px){
  .kp-breadcrumb ol,.kp-hero__crumbs .kea-breadcrumb ol{flex-wrap:nowrap;white-space:nowrap}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li{flex:0 1 auto;min-width:0}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:first-child{flex-shrink:0}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:last-child:not(:first-child){flex-shrink:40;min-width:6em}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:nth-last-child(2):not(:first-child){flex-shrink:1;min-width:5.5em}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:not(:first-child):not(:nth-last-child(-n+2)){flex-shrink:0}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:not(:first-child):not(:nth-last-child(-n+2))>a{font-size:0;letter-spacing:0}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li:not(:first-child):not(:nth-last-child(-n+2))>a::after{content:"…";font-size:.875rem;padding-inline:2px}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) li>:is(a,span){display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  :is(.kp-breadcrumb,.kp-hero__crumbs .kea-breadcrumb) [aria-current]{max-width:none}
}

/* ---------- 3 · Inhaltsverzeichnis & Seitenleiste ---------- */
.kp-layout{display:grid;grid-template-columns:minmax(220px,270px) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.kp-layout--right{grid-template-columns:minmax(0,1fr) minmax(240px,300px)}
.kp-layout--right>.kp-aside{order:2}
.kp-aside{position:sticky;top:var(--kp-sticky);max-height:calc(100vh - var(--kp-sticky) - 24px);overflow:auto}
.kp-toc{font-size:.94rem}
.kp-toc>details,.kp-toc>details[open]{border:1px solid var(--line);border-radius:var(--kp-r-s);background:var(--kp-card);box-shadow:none;overflow:visible}
.kp-toc summary{display:flex;font-size:.78rem;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;cursor:pointer;list-style:none;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kp-toc summary::-webkit-details-marker{display:none}
.kp-toc summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.kp-toc details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.kp-toc ol{list-style:none;margin:0;padding:0 8px 10px;counter-reset:kp-toc}
.kp-toc li{counter-increment:kp-toc}
.kp-toc a{position:relative;display:flex;gap:10px;padding:8px 10px 8px 14px;border-radius:10px;color:var(--ink-2);line-height:1.35;transition:background .15s,color .15s}
.kp-toc a::before{content:"";position:absolute;left:3px;top:10px;bottom:10px;width:2px;border-radius:2px;background:transparent;transition:background .2s}
.kp-toc a:hover{background:var(--kp-card-2);color:var(--ink)}
.kp-toc a[aria-current="true"],.kp-toc a.is-active{color:var(--ink);font-weight:650}
.kp-toc a[aria-current="true"]::before,.kp-toc a.is-active::before{background:var(--k-grad)}
.kp-toc--numbered a>span:first-child{font-variant-numeric:tabular-nums;color:var(--muted);min-width:1.6em}
@media (min-width:1025px){
  .kp-toc>details,.kp-toc>details[open]{border:0;background:transparent}
  .kp-toc summary{padding:0 10px 12px;cursor:default;pointer-events:none}
  .kp-toc summary::after{display:none}
  .kp-toc ol{padding:0}
}
@media (max-width:1024px){
  .kp-layout,.kp-layout--right{grid-template-columns:1fr}
  .kp-layout--right>.kp-aside{order:0}
  .kp-aside{position:static;max-height:none;overflow:visible}
}
/* --bar: horizontale Sprungnavigation direkt unter dem Hero */
.kp-toc--bar{position:sticky;top:var(--kn-header-height,72px);z-index:20;background:var(--glass);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);border-block:1px solid var(--line)}
.kp-toc--bar ol{display:flex;gap:4px;padding:10px 0;overflow-x:auto;scroll-padding-inline:24px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.kp-toc--bar ol::-webkit-scrollbar{display:none}
.kp-toc--bar li{flex:none}
.kp-toc--bar a{white-space:nowrap;padding:8px 14px;border-radius:999px;font-size:.9rem}
.kp-toc--bar a::before{display:none}
.kp-toc--bar a[aria-current="true"],.kp-toc--bar a.is-active{background:var(--ink);color:var(--bg)}
[id]{scroll-margin-top:calc(var(--kn-header-height,86px) + 24px)}
.kp-has-bar [id]{scroll-margin-top:calc(var(--kn-header-height,86px) + 84px)}

/* ---------- 4 · Facts ---------- */
.kp-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:var(--kp-gap);list-style:none;margin:0;padding:0}
.kp-fact{position:relative;display:flex;flex-direction:column;gap:10px;padding:clamp(22px,2.4vw,30px);border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow)}
.kp-fact__icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--kp-card-2);color:var(--kp-accent);margin-bottom:8px}
.kp-fact__icon svg{width:22px;height:22px}
.kp-fact__value{font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1;letter-spacing:-.035em;font-weight:750;color:var(--ink);font-variant-numeric:tabular-nums}
.kp-fact__value small{font-size:.5em;letter-spacing:-.01em;font-weight:650;color:var(--ink-2);margin-left:.2em}
.kp-fact__value--word{font-size:clamp(1.35rem,2.1vw,1.7rem);letter-spacing:-.02em;line-height:1.15}
.kp-fact__label{font-weight:650;color:var(--ink);line-height:1.35}
.kp-fact__text{font-size:.95rem;line-height:1.55;color:var(--muted)}
/* v1.4: lange Wörter («Preisgrundlage», «explosionsgefährdete») bleiben in schmalen Karten (Trennung nur ab 12/14 Zeichen) */
.kp-fact{min-width:0}
.kp-fact :is(.kp-fact__value--word,.kp-fact__label){overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:12 5 5}
.kp-fact__text{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:14 6 6}
.kp-facts--plain .kp-fact{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0 0 0 20px;border-left:2px solid var(--line)}
.kp-facts--plain .kp-fact::before{content:"";position:absolute;left:-2px;top:0;width:2px;height:42px;background:var(--k-grad)}
/* v1.4: Einheit mit führendem Leerzeichen im <small> – Textinhalt «6 Monate» statt «6Monate» (SEO/Screenreader):
   <span data-kp-count>6</span><small> Monate</small>. Das Leerzeichen (≈ .21em) ersetzt den bisherigen Abstand
   (.2em) – optisch gleich. Ohne Leerzeichen im Markup stünde die Einheit direkt an der Zahl → immer mit Leerzeichen. */
.kp-fact__value:not(.kp-fact__value--word)>small:not([class]){margin-left:0}
/* v1.4 · kp-facts--compact: mobil (≤ 560 px) Symbol links, Wert/Label/Text rechts – kürzere Kartenstapel */
@media (max-width:560px){
  .kp-facts--compact{gap:12px}
  .kp-facts--compact .kp-fact:has(>.kp-fact__icon){display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;row-gap:4px;padding:20px}
  .kp-facts--compact .kp-fact:has(>.kp-fact__icon)>.kp-fact__icon{grid-row:1 / span 3;margin:0;align-self:start}
  .kp-facts--compact .kp-fact:has(>.kp-fact__icon)>:not(.kp-fact__icon){grid-column:2}
  .kp-facts--compact .kp-fact__value{font-size:1.75rem}
  .kp-facts--compact .kp-fact__value--word{font-size:1.2rem}
}

/* ---------- 5 · Steps + Timeline ---------- */
.kp-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--kp-cols,auto-fit),minmax(min(100%,200px),1fr));gap:var(--kp-gap);counter-reset:kp-step;position:relative}
.kp-step{counter-increment:kp-step;position:relative;padding-top:64px;min-width:0;overflow-wrap:break-word}
/* v1.4: feste Spaltenzahl (--kp-cols) passt immer in die Breite – vorher erzwang minmax(200px,…) bei 4–5 Spalten
   zwischen 721 und ~1100 px einen Überlauf nach rechts (letzte Schritte abgeschnitten) */
.kp-steps[style*="--kp-cols"]{grid-template-columns:repeat(var(--kp-cols),minmax(0,1fr))}
@media (min-width:721px) and (max-width:1100px){.kp-steps[style*="--kp-cols"] .kp-step :is(h3,p){hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 4 4}}
.kp-step::before{content:counter(kp-step,decimal-leading-zero);position:absolute;left:0;top:0;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--kp-card);border:1px solid var(--line-2);font-weight:750;font-size:.95rem;font-variant-numeric:tabular-nums;color:var(--ink);box-shadow:var(--kp-shadow);z-index:1}
.kp-step::after{content:"";position:absolute;left:56px;right:calc(-1 * var(--kp-gap) + 8px);top:24px;height:2px;background:linear-gradient(90deg,var(--line-2),var(--line-2)) no-repeat;background-size:100% 100%}
.kp-step:last-child::after{display:none}
.kp-step h3{font-size:var(--kp-h3);line-height:1.25;font-weight:700;letter-spacing:-.012em}
.kp-step p{margin-top:10px;color:var(--ink-2);line-height:1.6;font-size:.98rem}
@media (max-width:420px){.kp-step :is(h3,p){hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:12 5 5}}
.kp-step:first-child::before{background:var(--k-grad);color:#fff;border-color:transparent}
/* Linie zeichnet sich beim Einblenden */
.kc-ready .kp-steps[data-reveal] .kp-step::after{background-image:var(--k-grad);background-size:0 100%;transition:background-size 1s var(--kp-ease) calc(var(--kc-i,0) * 180ms + 200ms)}
.kc-ready .kp-steps[data-reveal].is-in .kp-step::after{background-size:100% 100%}
@media (max-width:720px){
  .kp-steps,.kp-steps[style*="--kp-cols"]{grid-template-columns:minmax(0,1fr);gap:28px}   /* v1.4: minmax(0,…) – lange Wörter sprengen die Spalte nicht */
  .kp-step{padding:0 0 0 68px;min-height:48px;min-width:0;overflow-wrap:break-word}
  .kp-step::after{left:23px;right:auto;top:56px;bottom:-24px;width:2px;height:auto}
  .kc-ready .kp-steps[data-reveal] .kp-step::after{background-size:100% 0}
  .kc-ready .kp-steps[data-reveal].is-in .kp-step::after{background-size:100% 100%}
}
/* Timeline: vertikal, Füllstand über --kp-fill (0–1, JS) */
.kp-timeline{--kp-fill:1;--kp-tl-pad:clamp(100px,9vw,120px);position:relative;list-style:none;margin:0;padding:0 0 0 var(--kp-tl-pad);max-width:880px}   /* v1.4: min. 100px – Marke «20 Jahre» ragt nicht mehr links hinaus */
.kp-timeline::before,.kp-timeline::after{content:"";position:absolute;left:calc(var(--kp-tl-pad) - 29px);top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--line-2)}
.kp-timeline::after{background:var(--k-grad);background:linear-gradient(180deg,var(--k-red),var(--k-orange),var(--k-yellow));transform-origin:top;transform:scaleY(var(--kp-fill))}
.kp-timeline__item{position:relative;padding-bottom:clamp(28px,4vw,48px)}
.kp-timeline__item:last-child{padding-bottom:0}
.kp-timeline__item::before{content:"";position:absolute;left:-36px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--bg);border:2px solid var(--line-2);z-index:1;transition:border-color .3s,background .3s,box-shadow .3s}
.kp-timeline__item.is-on::before,.kp-timeline:not([data-kp-timeline]) .kp-timeline__item::before{border-color:var(--k-orange);background:var(--k-yellow);box-shadow:0 0 0 6px rgba(246,194,74,.18)}
.kp-timeline__mark{position:absolute;right:calc(100% + 52px);top:0;min-width:40px;text-align:right;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.1;font-weight:750;letter-spacing:-.02em;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.kp-timeline__mark small{display:block;font-size:.62em;font-weight:600;letter-spacing:.02em;color:var(--muted)}
.kp-timeline__item h3{font-size:var(--kp-h3);line-height:1.3;font-weight:700}
.kp-timeline__item p{margin-top:8px;color:var(--ink-2);line-height:1.6;max-width:60ch}
.kp-timeline__item .kp-chips{margin-top:12px}
@media (max-width:620px){
  .kp-timeline{padding-left:40px}
  .kp-timeline::before,.kp-timeline::after{left:11px}
  .kp-timeline__item::before{left:-36px}
  .kp-timeline__mark{position:static;display:block;text-align:left;margin-bottom:6px;color:var(--kp-accent)}
  .kp-timeline__mark small{display:inline;margin-left:3px}   /* v1.4: + führendes Leerzeichen im <small> (« Jahre») ≈ 6px */
}

/* v1.2 · Timeline --row: ab 961 px waagrecht (Marken oben, Punkte auf einer Linie), darunter wie Standard */
@media (min-width:961px){
  .kp-timeline--row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0 var(--kp-gap);padding:0;max-width:none}
  .kp-timeline--row::before,.kp-timeline--row::after{left:0;right:0;top:calc(var(--kp-tl-top,52px) + 7px);bottom:auto;width:auto;height:2px}
  .kp-timeline--row::after{background:linear-gradient(90deg,var(--k-red),var(--k-orange),var(--k-yellow));transform-origin:left;transform:scaleX(var(--kp-fill))}
  .kp-timeline--row .kp-timeline__item{padding:calc(var(--kp-tl-top,52px) + 36px) 8px 0 0}
  .kp-timeline--row .kp-timeline__item::before{left:0;top:var(--kp-tl-top,52px)}
  .kp-timeline--row .kp-timeline__mark{right:auto;left:0;top:0;text-align:left}
}

/* ---------- 6 · Preise ---------- */
.kp-price-group+.kp-price-group{margin-top:clamp(56px,7vw,96px)}
.kp-price-group__head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 20px;align-items:baseline;margin-bottom:clamp(24px,3vw,36px);max-width:900px}
.kp-price-group__num{font-size:clamp(2rem,4vw,3.2rem);font-weight:750;letter-spacing:-.04em;line-height:1;background:var(--kp-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.kp-price-group__head h2{font-size:var(--kp-h2);line-height:1.08;letter-spacing:-.032em;font-weight:700}
.kp-price-group__head p{grid-column:2;margin-top:10px;color:var(--ink-2);line-height:1.6;max-width:64ch}
@media (max-width:620px){.kp-price-group__head{grid-template-columns:1fr}.kp-price-group__head p{grid-column:1}}
.kp-price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));gap:var(--kp-gap);align-items:start}
.kp-price{position:relative;border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow);overflow:hidden;container:kp-price / inline-size}
.kp-price::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--k-grad);opacity:.85}
.kp-price__head{padding:clamp(22px,2.6vw,30px) clamp(20px,2.6vw,30px) 14px}
.kp-price__head h3{font-size:clamp(1.15rem,1.7vw,1.35rem);line-height:1.25;letter-spacing:-.015em;font-weight:700}
.kp-price__head p{margin-top:8px;font-size:.93rem;line-height:1.55;color:var(--muted)}
.kp-price__table{width:100%;border-collapse:collapse;font-size:.97rem}
.kp-price__table caption{text-align:left}
.kp-price__table thead th{padding:8px clamp(20px,2.6vw,30px);font-size:.72rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;border-bottom:1px solid var(--line)}
.kp-price__table thead th:last-child{text-align:right}
.kp-price__table tbody tr{border-bottom:1px solid var(--line)}
.kp-price__table tbody tr:last-child{border-bottom:0}
.kp-price__table th[scope="row"],.kp-price__table td{padding:14px clamp(20px,2.6vw,30px);vertical-align:top;text-align:left;font-weight:400}
.kp-price__table th[scope="row"]{font-weight:650;color:var(--ink);line-height:1.4;padding-right:10px}
.kp-price__table td{color:var(--muted);font-size:.92rem;line-height:1.45}
.kp-price__table td.kp-price__amount,.kp-price__amount{text-align:right;white-space:nowrap;color:var(--ink);font-weight:700;font-size:1rem;font-variant-numeric:tabular-nums lining-nums;padding-left:10px}
.kp-price__amount small{display:block;font-size:.76rem;font-weight:550;color:var(--muted)}
.kp-price__table tr.is-extra th[scope="row"]{font-weight:550;color:var(--ink-2)}
.kp-price__table tr.is-extra th[scope="row"]::before{content:"+";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:8px;border-radius:50%;background:var(--kp-card-2);border:1px solid var(--line-2);font-size:.8rem;font-weight:700;line-height:1;color:var(--ink-2);vertical-align:1px}
/* v1.3: «+» hängt immer vor der Bezeichnung (Symbol und Text brechen nie untereinander um, Folgezeilen fluchten
   mit dem Text). Früher opt-in über .kp-price--hang – die Klasse bleibt gültig, ist aber nicht mehr nötig. */
.kp-price__table tr.is-extra th[scope="row"]{position:relative;padding-left:calc(clamp(20px,2.6vw,30px) + 26px)}
.kp-price__table tr.is-extra th[scope="row"]::before{position:absolute;left:clamp(20px,2.6vw,30px);top:calc(14px + .679rem - 9px);margin:0}   /* Mitte der 1. Zeile (.97rem × 1.4 / 2) */
.kp-price__table tr.is-extra .kp-price__amount{color:var(--ink-2)}
/* v1.4 · Preisspalte nie abgeschnitten (alle Breiten): Leistung/Umfang dürfen trennen (Silbentrennung, notfalls
   Umbruch im Wort) – dadurch ist die Mindestbreite der Tabelle ≈ Preisspalte + Innenabstände und die Tabelle
   passt in jede Karte. Der Preis selbst bricht nie um. */
.kp-price__table :is(th[scope="row"],td:not(.kp-price__amount)){overflow-wrap:anywhere;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 4 4}
.kp-price__table tr.is-sep{border-top:1px dashed var(--line-2)}
/* Staffel: linke Stufenkante */
.kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]{position:relative;padding-left:calc(clamp(20px,2.6vw,30px) + 18px)}
.kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]::after{content:"";position:absolute;left:clamp(20px,2.6vw,30px);top:16px;width:6px;height:calc(10px + var(--kp-tier,1) * 3px);max-height:26px;border-radius:3px;background:var(--k-grad);opacity:calc(.35 + var(--kp-tier,1) * .12)}
.kp-price__note{margin:0;padding:14px clamp(20px,2.6vw,30px) 18px;background:var(--kp-card-2);border-top:1px solid var(--line);font-size:.9rem;line-height:1.55;color:var(--ink-2)}
.kp-price__note strong{color:var(--ink)}
.kp-price__note>b:first-child,.kp-price__note-label{display:inline-block;margin-right:6px;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--kp-accent)}
.kp-price__note ul{margin:6px 0 0;padding-left:18px}
.kp-price__note li+li{margin-top:4px}
/* Schmale Karte (< 600 px, z. B. 2er-Raster bei 1000–1300 px) mit Tabellen-Layout: engere Innenabstände,
   Leistungsspalte mind. ein Drittel – abhängig von der Kartenbreite (Container Query), nicht vom Viewport. */
@media (min-width:621px){
  @container kp-price (max-width:600px){
    .kp-price__head{padding-left:20px;padding-right:20px}
    .kp-price__note{padding-left:20px;padding-right:20px}
    .kp-price__table thead th,.kp-price__table th[scope="row"],.kp-price__table td{padding-left:20px;padding-right:20px}
    .kp-price__table th[scope="row"]{padding-right:8px}
    .kp-price__table td.kp-price__amount{padding-left:8px}
    .kp-price__table th[scope="row"]:has(~td:not(.kp-price__amount)){width:34%}
    .kp-price__table tr.is-extra th[scope="row"]{padding-left:46px}
    .kp-price__table tr.is-extra th[scope="row"]::before{left:20px}
    .kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]{padding-left:38px}
    .kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]::after{left:20px}
  }
}
.kp-footnotes{margin-top:22px;padding:0;list-style:none;font-size:.86rem;line-height:1.55;color:var(--muted);max-width:80ch}
.kp-footnotes li+li{margin-top:4px}
.kp-footnotes a,.kp-price__note a,.kp-price-group__head p a:not([class]),.kp-example a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--kp-accent);text-decoration-thickness:1.5px;text-underline-offset:3px}
.kp-footnotes sup,.kp-price sup{font-size:.7em;color:var(--kp-accent);font-weight:700}
@media (max-width:620px){
  .kp-price__table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .kp-price__table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;padding:13px 20px}
  .kp-price__table th[scope="row"],.kp-price__table td{padding:0}
  .kp-price__table th[scope="row"]{grid-column:1;grid-row:1}
  .kp-price__table td.kp-price__amount{grid-column:2;grid-row:1;padding:0}
  .kp-price__table td:not(.kp-price__amount){grid-column:1 / -1;grid-row:2;margin-top:3px}
  .kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]{padding-left:18px}
  .kp-price--tiers .kp-price__table tbody tr:is([style*="--kp-tier"],.is-tier) th[scope="row"]::after{left:0;top:3px}
  .kp-price__table tr.is-extra th[scope="row"]{padding:0 0 0 26px}                      /* mobil: «+» hängt am Zeilenanfang */
  .kp-price__table tr.is-extra th[scope="row"]::before{left:0;top:calc(.679rem - 9px)}
}
/* v1.4 · Raster-Optionen
   kp-price-grid--even: Karten einer Zeile gleich hoch, «Gut zu wissen» unten bündig (ab 961 px).
   kp-price-grid--wide-first: erste Karte breiter (1.3 : 1, ab 1200 px) – z. B. 3-spaltige neben 2-spaltiger Tabelle. */
@media (min-width:961px){
  .kp-price-grid--even{align-items:stretch}
  .kp-price-grid--even>.kp-price{display:flex;flex-direction:column}
  .kp-price-grid--even>.kp-price>.kp-price__note{margin-top:auto}
}
@media (min-width:1200px){.kp-price-grid--wide-first{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
/* Beispielrechnung – klar als Beispiel markiert, nie grün */
.kp-examples{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--kp-gap);align-items:start}
.kp-example{position:relative;padding:clamp(22px,2.4vw,28px);border-radius:var(--kp-r);border:1.5px dashed var(--line-2);background:transparent}
.kp-example__tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--kp-card-2);border:1px solid var(--line);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kp-example h3{margin-top:14px;font-size:1.12rem;line-height:1.3;font-weight:700}
.kp-example>p{margin-top:6px;font-size:.93rem;line-height:1.55;color:var(--muted)}
.kp-example__lines{list-style:none;margin:16px 0 0;padding:0;font-size:.94rem}
.kp-example__lines li{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--line);color:var(--ink-2);line-height:1.4}
.kp-example__lines li>span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink)}
.kp-example__total{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:14px;font-weight:700;color:var(--ink)}
.kp-example__total span:last-child{font-size:1.25rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.kp-example__total small{display:block;font-weight:500;font-size:.78rem;color:var(--muted)}
.kp-example__foot{margin-top:12px;font-size:.84rem;line-height:1.5;color:var(--muted)}
.kp-example>p.kp-example__total{margin-top:14px;font-size:1rem;color:var(--ink)}  /* v1.2: <p class=kp-example__total> erbte sonst .kp-example>p */

/* ---------- 7 · Split ---------- */
.kp-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.kp-split+.kp-split{margin-top:clamp(64px,8vw,120px)}
.kp-split--reverse .kp-split__media{order:-1}
.kp-split__copy{min-width:0}
.kp-split__copy .kp-h2{margin-bottom:0}
.kp-split__copy .kp-prose{margin-top:20px}
.kp-split__copy .kp-actions,.kp-split__copy .kp-check{margin-top:26px}
.kp-split__media{position:relative;margin:0;border-radius:var(--kp-r);overflow:hidden;background:var(--surface-2);box-shadow:var(--kp-shadow-h);aspect-ratio:var(--kp-ratio,4/3.2)}
.kp-split__media img{width:100%;height:100%;object-fit:cover}
.kp-split__media--portrait{--kp-ratio:4/5}
.kp-split__media--square{--kp-ratio:1/1}
.kp-split__media--art{background:var(--kp-forest);color:var(--kp-illu-hi);display:grid;place-items:center;padding:clamp(16px,3vw,40px);box-shadow:inset 0 0 0 1px var(--kp-forest-line),var(--kp-shadow-h)}
.kp-split__media--art svg{width:100%;height:100%}
.kp-split__media figcaption{position:absolute;left:14px;right:14px;bottom:14px;width:max-content;max-width:calc(100% - 28px);padding:7px 13px;border-radius:12px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:.8rem;line-height:1.35;color:var(--ink-2)}
@media (max-width:860px){
  .kp-split{grid-template-columns:1fr}
  .kp-split--reverse .kp-split__media,.kp-split__media{order:-1}
  .kp-split.kp-split--copy-first .kp-split__media{order:0}  /* v1.2: mobil Text vor Bild/Grafik (z. B. Tabelle + Schema) */
}

/* ---------- 8 · Callouts + Zitat ---------- */
.kp-callout{--c-bg:var(--kp-info-bg);--c-line:var(--kp-info-line);--c-ink:var(--kp-info-ink);
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 16px;align-items:start;padding:clamp(18px,2.2vw,24px) clamp(18px,2.4vw,28px);border-radius:var(--kp-r-s);background:var(--c-bg);border:1px solid var(--c-line);color:var(--ink-2);max-width:var(--kp-read)}
.kp-callout--wide{max-width:none}
.kp-callout>svg{width:24px;height:24px;margin-top:1px;color:var(--c-ink);fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.kp-callout__title{display:block;margin-bottom:6px;font-size:1rem;font-weight:700;color:var(--ink);line-height:1.35}
.kp-callout__label{display:block;margin-bottom:4px;font-size:.7rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink)}
.kp-callout__body{line-height:1.6;font-size:.98rem;min-width:0}
.kp-callout__body>*+*{margin-top:.6em}
.kp-callout__body a:not(.kp-btn){color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}   /* v1.4 a11y: Knöpfe behalten ihre Farben */
.kp-callout__body ul{margin:.6em 0 0;padding-left:1.1em}
.kp-callout__body li+li{margin-top:.35em}
.kp-callout--important{--c-bg:var(--kp-warn-bg);--c-line:var(--kp-warn-line);--c-ink:var(--kp-warn-ink)}
.kp-callout--legal{--c-bg:var(--kp-legal-bg);--c-line:var(--kp-legal-line);--c-ink:var(--kp-legal-ink);border-left:3px solid var(--ink-2)}
.kp-callout--tip{--c-bg:var(--kp-tip-bg);--c-line:var(--kp-tip-line);--c-ink:var(--kp-tip-ink)}
.kp-section--dark .kp-callout{--c-bg:rgba(255,255,255,.05);--c-line:var(--kp-forest-line);--c-ink:var(--kp-mint)}
/* v1.4 · kp-callout--compact: mobil (≤ 480 px) steht das Symbol neben dem Label/Titel, der Text nutzt die volle Breite */
@media (max-width:480px){
  .kp-callout--compact{display:block;position:relative}
  .kp-callout--compact>svg{position:absolute;left:clamp(18px,2.4vw,28px);top:clamp(18px,2.2vw,24px);width:20px;height:20px;margin:0}
  .kp-callout--compact .kp-callout__body>:first-child:not(div),.kp-callout--compact .kp-callout__head:first-child>:first-child{text-indent:30px}
  .kp-callout--compact :is(.kp-callout__body,.kp-callout__head)>.kp-callout__label:first-child{line-height:20px;margin-bottom:8px}
}
/* v1.4 · kp-callout--split (mit --wide): ab 961 px Label + Titel links, Text rechts (statt ~150 Zeichen langer Zeilen).
   Markup: <div class="kp-callout__body"><div class="kp-callout__head">Label + Titel</div><div class="kp-callout__text">p …</div></div> */
.kp-callout__text>*+*{margin-top:.7em}
@media (min-width:961px){
  .kp-callout--split{padding:clamp(24px,3vw,40px) clamp(24px,3.4vw,44px);gap:14px 20px}
  .kp-callout--split .kp-callout__body{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr);column-gap:clamp(32px,5vw,72px);align-items:start}
  .kp-callout--split .kp-callout__body>*+*{margin-top:0}
  .kp-callout--split .kp-callout__title{margin-bottom:0;font-size:clamp(1.15rem,1.8vw,1.35rem);letter-spacing:-.015em;text-wrap:balance}
}
.kp-quote{position:relative;margin:0;max-width:880px;padding-top:56px}
.kp-quote::before{content:"";position:absolute;left:0;top:0;width:44px;height:36px;background:var(--k-grad);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 36'%3E%3Cpath d='M0 36V21C0 9 6 2 17 0l2 5c-6 2-9 6-9 11h8v20zm25 0V21c0-12 6-19 17-21l2 5c-6 2-9 6-9 11h8v20z'/%3E%3C/svg%3E") no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 36'%3E%3Cpath d='M0 36V21C0 9 6 2 17 0l2 5c-6 2-9 6-9 11h8v20zm25 0V21c0-12 6-19 17-21l2 5c-6 2-9 6-9 11h8v20z'/%3E%3C/svg%3E") no-repeat}
.kp-quote blockquote{margin:0;font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.35;letter-spacing:-.02em;font-weight:600;color:var(--ink);text-wrap:balance}
.kp-quote figcaption{margin-top:20px;font-size:.95rem;color:var(--muted)}
.kp-quote figcaption strong{color:var(--ink);font-weight:650}
.kp-quote--center{margin-inline:auto;text-align:center}
.kp-quote--center::before{left:50%;transform:translateX(-50%)}

/* ---------- 9 · FAQ ---------- */
.kp-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,80px);align-items:start}
.kp-faq--single{grid-template-columns:1fr;max-width:900px}
.kp-faq__head{position:sticky;top:var(--kp-sticky)}
.kp-faq__head>.kp-link{margin-top:22px}
.kp-faq--single .kp-faq__head{position:static}
.kp-faq__list{border-top:1px solid var(--line)}
.kp-faq__item,.kp-faq__item[open]{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;overflow:visible}
.kp-faq__item>summary{position:relative;display:block;gap:0;padding:22px 52px 22px 0;cursor:pointer;list-style:none;font-size:clamp(1.02rem,1.4vw,1.14rem);line-height:1.4;font-weight:650;color:var(--ink);transition:color .15s}
.kp-faq__item>summary::-webkit-details-marker{display:none}
.kp-faq__item>summary::before,.kp-faq__item>summary::after{content:"";position:absolute;right:10px;top:50%;margin:0;width:14px;height:2px;border:0;border-radius:2px;background:currentColor;transition:transform .25s var(--kp-ease),opacity .2s}
.kp-faq__item>summary::after{transform:rotate(90deg)}
.kp-faq__item[open]>summary::after{transform:rotate(0);opacity:0}
.kp-faq__item>summary:hover{color:var(--kp-accent)}
.kp-faq__answer{padding:0 52px 24px 0;color:var(--ink-2);line-height:1.7;max-width:70ch}
.kp-faq__answer>*+*{margin-top:.7em}
.kp-faq__answer a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--kp-accent);text-decoration-thickness:2px}
.kp-faq__item[open] .kp-faq__answer{animation:kp-faq-in .35s var(--kp-ease)}
@keyframes kp-faq-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (max-width:860px){.kp-faq{grid-template-columns:1fr}.kp-faq__head{position:static}.kp-faq__answer{padding-right:0}}

/* ---------- 10 · Cards ---------- */
.kp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--kp-card-min,280px)),1fr));gap:var(--kp-gap);list-style:none;margin:0;padding:0}
.kp-cards--2{--kp-card-min:420px}
.kp-cards--4{--kp-card-min:230px}
.kp-card{position:relative;display:flex;flex-direction:column;border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow);overflow:hidden;transition:transform .3s var(--kp-ease),box-shadow .3s,border-color .3s}
.kp-card:hover{transform:translateY(-4px);box-shadow:var(--kp-shadow-h);border-color:var(--line-2)}
.kp-card:focus-within{box-shadow:var(--kp-shadow-h)}
.kp-card__media{margin:0;aspect-ratio:16/10;overflow:hidden;background:var(--surface-2)}
.kp-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--kp-ease)}
.kp-card:hover .kp-card__media img{transform:scale(1.04)}
.kp-card__body{display:flex;flex-direction:column;flex:1;gap:10px;padding:clamp(20px,2.2vw,26px)}
.kp-card__icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--kp-card-2);color:var(--kp-accent);margin-bottom:6px}
.kp-card__icon svg{width:24px;height:24px}
.kp-card__eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kp-card h3{font-size:1.18rem;line-height:1.28;letter-spacing:-.015em;font-weight:700;color:var(--ink)}
.kp-card p{font-size:.96rem;line-height:1.6;color:var(--ink-2)}
.kp-card__link{color:inherit}
.kp-card__link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.kp-card__link:focus-visible{outline:none}
.kp-card__link:focus-visible::after{outline:3px solid var(--k-focus,#B8560A);outline-offset:-3px}
.kp-card__more{margin-top:auto;padding-top:10px;display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:.94rem;color:var(--ink)}
.kp-card__more svg{width:18px;height:18px;transition:transform .25s var(--kp-ease)}
.kp-card:hover .kp-card__more svg{transform:translateX(4px)}
.kp-card--flat{box-shadow:none;background:transparent}
/* v1.2: Karten ohne Ganzkarten-Link (.kp-card__link) heben sich nicht an – nur klickbare Karten reagieren */
.kp-card--static:hover,.kp-card:not(a):not(:has(.kp-card__link)):hover{transform:none;box-shadow:var(--kp-shadow);border-color:var(--line)}
.kp-card--flat.kp-card--static:hover,.kp-card--flat:not(a):not(:has(.kp-card__link)):hover{box-shadow:none}
.kp-card--static:hover .kp-card__media img,.kp-card:not(a):not(:has(.kp-card__link)):hover .kp-card__media img{transform:none}
/* v1.4 · Karten-Optionen (nur Icon-Karten, d. h. .kp-card__body mit .kp-card__icon)
   kp-cards--compact: mobil (≤ 620 px) Symbol links, Text rechts – statt hoher Kacheln untereinander.
   kp-cards--row / kp-card--row: immer als Zeile (Symbol links), z. B. Prüfpunkte, Kurzlisten.
   kp-cards--plain: offene Spalten ohne Kartenkasten (Haarlinie oben + kurzer Markenverlauf, kein Hover-Lift). */
.kp-cards--row .kp-card__body:has(>.kp-card__icon),.kp-card--row .kp-card__body:has(>.kp-card__icon){display:grid;grid-template-columns:auto minmax(0,1fr);align-content:start;column-gap:18px;row-gap:4px;padding:clamp(18px,2vw,22px) clamp(18px,2.2vw,24px)}
.kp-cards--row .kp-card__body>.kp-card__icon,.kp-card--row .kp-card__body>.kp-card__icon{grid-row:1 / span 3;width:44px;height:44px;margin:0}
.kp-cards--row .kp-card__body:has(>.kp-card__icon)>:not(.kp-card__icon),.kp-card--row .kp-card__body:has(>.kp-card__icon)>:not(.kp-card__icon){grid-column:2}
.kp-cards--row .kp-card__body:has(>.kp-card__icon)>.kp-card__more,.kp-card--row .kp-card__body:has(>.kp-card__icon)>.kp-card__more{justify-self:start;padding-top:6px}
.kp-cards--row .kp-card__body>.kp-card__icon svg,.kp-card--row .kp-card__body>.kp-card__icon svg{width:22px;height:22px}
.kp-cards--row .kp-card__body:has(>.kp-card__icon)>:is(.kp-card__eyebrow,p),.kp-card--row .kp-card__body:has(>.kp-card__icon)>:is(.kp-card__eyebrow,p){margin-top:2px}
@media (max-width:400px){
  .kp-cards--row .kp-card__body:has(>.kp-card__icon),.kp-card--row .kp-card__body:has(>.kp-card__icon){column-gap:14px}
  .kp-cards--row .kp-card__body>.kp-card__icon,.kp-card--row .kp-card__body>.kp-card__icon{width:38px;height:38px}
  .kp-cards--row .kp-card__body>.kp-card__icon svg,.kp-card--row .kp-card__body>.kp-card__icon svg{width:20px;height:20px}
}
@media (max-width:620px){
  .kp-cards--compact .kp-card__body:has(>.kp-card__icon){display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 16px;align-content:start}
  .kp-cards--compact .kp-card__body>.kp-card__icon{grid-row:1 / span 3;width:44px;height:44px;margin:2px 0 0}
  .kp-cards--compact .kp-card__body:has(>.kp-card__icon)>:not(.kp-card__icon){grid-column:2}
  .kp-cards--compact .kp-card__body:has(>.kp-card__icon)>.kp-card__more{padding-top:6px;justify-self:start}
}
.kp-cards--plain{gap:clamp(28px,4vw,56px)}
.kp-cards--plain>.kp-card{background:transparent;border:0;border-top:1px solid var(--line-2);border-radius:0;box-shadow:none;overflow:visible}
.kp-cards--plain>.kp-card:hover{transform:none;box-shadow:none;border-color:var(--line-2)}
.kp-cards--plain>.kp-card::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:2px;background:var(--k-grad)}
.kp-cards--plain .kp-card__body{padding:clamp(24px,2.6vw,32px) 0 0}
.kp-cards--plain .kp-card__icon{background:var(--kp-card);box-shadow:var(--kp-shadow)}
.kp-cards--plain .kp-card h3{font-size:var(--kp-h3)}
.kp-cards--plain .kp-card p{max-width:40ch}
/* Linkliste (kompakt, für viele verwandte Seiten) */
.kp-linklist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));column-gap:var(--kp-gap)}
.kp-linklist a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 4px;border-bottom:1px solid var(--line);font-weight:650;color:var(--ink);transition:color .15s,padding .2s var(--kp-ease)}
.kp-linklist a small{display:block;font-weight:450;font-size:.88rem;color:var(--muted);margin-top:2px}
.kp-linklist a svg{width:18px;height:18px;flex:none;color:var(--muted);transition:transform .2s var(--kp-ease),color .2s}
.kp-linklist a:hover{padding-left:10px}
.kp-linklist a:hover svg{transform:translateX(3px);color:var(--ink)}

/* ---------- 11 · Reviews ---------- */
.kp-rating{display:inline-flex;align-items:center;gap:14px;padding:12px 20px 12px 14px;border-radius:999px;background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow);color:var(--ink);line-height:1.25}
.kp-rating__g{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--kp-card-2);font-weight:800;font-size:1.05rem;color:var(--ink)}
.kp-rating__label{font-weight:700}
.kp-rating__count{display:block;font-size:.84rem;color:var(--muted);font-weight:500}
.kp-stars{display:inline-flex;gap:2px;color:var(--kp-star);font-size:1rem;letter-spacing:1px;line-height:1}
.kp-stars svg{width:16px;height:16px;fill:currentColor;stroke:none}
.kp-reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--kp-gap);list-style:none;margin:0;padding:0}
.kp-review{display:flex;flex-direction:column;gap:16px;margin:0;padding:clamp(22px,2.4vw,28px);border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow);height:100%}
.kp-review blockquote{margin:0;flex:1;font-size:1rem;line-height:1.62;color:var(--ink)}
.kp-review blockquote p{margin:0}
.kp-review figcaption{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;align-items:center;padding-top:14px;border-top:1px solid var(--line)}
.kp-review__avatar{grid-row:span 2;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--k-red);color:#fff;font-weight:750}   /* v1.4 a11y: Weiss auf einfarbigem Rot (6.4:1) */
.kp-review__name{font-weight:650;color:var(--ink);line-height:1.3}
.kp-review__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:.84rem;color:var(--muted)}
.kp-review__meta .kp-stars svg{width:13px;height:13px}
.kp-reviews-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px 40px;margin-bottom:clamp(28px,4vw,48px)}
.kp-reviews-head .kp-head{margin-bottom:0}
.kp-reviews__source{margin-top:18px;font-size:.84rem;color:var(--muted)}
/* v1.4 · optionales Zitat-Symbol: <svg class="kp-ico kp-review__quote" aria-hidden="true"><use href="#i-quote"></use></svg> vor dem blockquote */
.kp-review__quote{width:34px;height:34px;margin:-6px 0 -8px -5px;color:var(--k-orange);stroke-width:1.6}
/* Bewertungsmodul: Google-typische Lesereihenfolge, weiterhin klar als KEA-Seite gestaltet. */
.kp-rating{max-width:100%;border-radius:16px;box-shadow:0 2px 12px rgba(32,33,36,.06)}
.kp-rating__g{flex:none;background:#fff;border:1px solid #dadce0;color:#4285f4}
.kp-rating__logo{display:block;width:76px;height:auto;max-height:28px;object-fit:contain;flex:none}
.mg-brand{display:grid;place-items:center;width:90px;height:76px;margin-bottom:8px;overflow:hidden;border-radius:6px;background:#fff}
.mg-brand img{display:block;width:100%;height:100%;object-fit:contain;padding:4px}
.mg-brand img[src$="electrosuisse-original.png"]{object-fit:cover;object-position:center}
body[data-page="about"] .ka-proof__brand img[src$="electrosuisse-original.png"]{object-fit:cover;object-position:center}
.kp-rating>span:last-child{min-width:0}
.kp-rating__count{margin-top:4px;overflow-wrap:anywhere}
.kp-rating .kp-stars,.kp-review .kp-stars{color:#b36b00}
.kp-review{position:relative;gap:14px;box-shadow:0 2px 12px rgba(32,33,36,.06)}
.kp-review::after{content:"G";position:absolute;top:25px;right:25px;color:#4285f4;font-size:1rem;font-weight:800}
.kp-review figcaption{order:-1;grid-template-columns:42px minmax(0,1fr);padding:0 30px 0 0;border:0}
.kp-review__avatar{background:#1a73e8}
.kp-reviews>li:nth-child(4n + 2) .kp-review__avatar{background:#188038}
.kp-reviews>li:nth-child(4n + 3) .kp-review__avatar{background:#a14200}
.kp-reviews>li:nth-child(4n + 4) .kp-review__avatar{background:#9334e6}
.kp-review__meta{font-size:.8rem}

/* ---------- 12 · Team ---------- */
.kp-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--kp-gap);list-style:none;margin:0;padding:0}
.kp-person{display:flex;flex-direction:column;border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow);overflow:hidden}
.kp-person__photo{margin:0;aspect-ratio:4/4.3;background:var(--surface-2);overflow:hidden}
.kp-person__photo img{width:100%;height:100%;object-fit:cover}
.kp-person__avatar{aspect-ratio:4/4.3;display:grid;place-items:center;background:var(--kp-forest);color:var(--kp-on-dark);position:relative;overflow:hidden}
.kp-person__avatar::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 70% 20%,rgba(70,127,94,.35),transparent 70%),radial-gradient(ellipse 60% 50% at 10% 100%,rgba(224,75,42,.18),transparent 70%)}
.kp-person__avatar span{position:relative;width:96px;height:96px;display:grid;place-items:center;border-radius:50%;border:1.5px solid rgba(140,222,179,.45);font-size:2rem;font-weight:700;letter-spacing:.02em}
.kp-person__body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:4px;flex:1}
.kp-person__name{font-size:1.15rem;font-weight:700;color:var(--ink);line-height:1.3}
.kp-person__role{font-size:.93rem;color:var(--muted);line-height:1.45}
.kp-person__text{margin-top:10px;font-size:.95rem;line-height:1.6;color:var(--ink-2)}
.kp-person__contact{margin-top:auto;padding-top:14px;display:flex;flex-direction:column;gap:4px;font-size:.93rem}
.kp-person__contact a{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-weight:600;padding-block:3px}
.kp-person__contact svg{width:16px;height:16px;color:var(--muted)}
.kp-person--wide{display:grid;grid-template-columns:minmax(200px,.7fr) minmax(0,1.3fr);max-width:900px}
.kp-person--wide .kp-person__photo,.kp-person--wide .kp-person__avatar{aspect-ratio:auto;min-height:100%}
@media (max-width:620px){.kp-person--wide{grid-template-columns:1fr}.kp-person--wide .kp-person__avatar{aspect-ratio:16/10}}

/* ---------- 13 · Trust ---------- */
.kp-trust{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;list-style:none;margin:0;padding:0}
.kp-trust__item{display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 12px;border-radius:999px;border:1px solid var(--line);background:var(--kp-card);font-size:.92rem;line-height:1.3;color:var(--ink-2)}
.kp-trust__item svg{width:20px;height:20px;flex:none;color:var(--kp-accent)}
.kp-trust__item strong{color:var(--ink);font-weight:700}
.kp-trust__item a{color:inherit}
.kp-trust__item a::after{content:" →";color:var(--muted)}
.kp-trust--bar{justify-content:center;padding:18px var(--kp-pad);border-block:1px solid var(--line);background:var(--bg-2)}

/* ---------- 14 · Regions ---------- */
.kp-regions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,80px);align-items:center}
.kp-places{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:24px 0 0;padding:0}
.kp-places a,.kp-places span{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid var(--line-2);background:var(--kp-card);font-weight:600;font-size:.94rem;color:var(--ink);transition:border-color .2s,background .2s,transform .2s var(--kp-ease)}
.kp-places a::before,.kp-places span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--k-orange)}
.kp-places a:hover{border-color:var(--ink);transform:translateY(-2px)}
.kp-places [aria-current="page"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.kp-places .is-hq::before{background:var(--k-red);box-shadow:0 0 0 3px rgba(224,75,42,.2)}
.kp-map{position:relative;margin:0;border-radius:var(--kp-r);overflow:hidden;background:var(--kp-forest);box-shadow:inset 0 0 0 1px var(--kp-forest-line),var(--kp-shadow-h);color:var(--kp-on-dark)}
.kp-map svg{width:100%;height:auto}
.kp-map figcaption{padding:12px 18px 16px;font-size:.8rem;line-height:1.45;color:var(--kp-on-dark-2);border-top:1px solid var(--kp-forest-line)}
.kp-map .m-grid{stroke:rgba(140,222,179,.08);stroke-width:1;fill:none}
.kp-map .m-river{stroke:#3f7f93;stroke-width:3;fill:none;stroke-linecap:round;opacity:.7}
.kp-map .m-ring{fill:none;stroke:var(--kp-mint);stroke-width:1;opacity:.35;stroke-dasharray:3 5}
.kp-map .m-dot{fill:var(--kp-on-dark)}
.kp-map .m-dot--cur{fill:var(--k-yellow)}
.kp-map .m-hq{fill:var(--k-red-2)}
.kp-map .m-halo{fill:var(--k-orange);opacity:.18;transform-box:fill-box;transform-origin:center}
.kp-map .m-label{fill:var(--kp-on-dark);font:600 13px/1 var(--font);letter-spacing:.01em}
.kp-map .m-label--muted{fill:var(--kp-on-dark-2);font-weight:500;font-size:11px}
.kp-map .m-label--hq{font-size:14px;font-weight:750}
/* Mobil (≤ 480 px): die SVG wird meist auf ~60–75 % verkleinert. kea-pages.js setzt --kp-svg-k (Massstab);
   die Beschriftung wird in SVG-Einheiten nur so weit angehoben, dass sie effektiv mind. 10.5 px (Ort),
   9.5 px (gedämpft) bzw. 11.5 px (Sitz) misst – nie kleiner als die Grundgrösse. Seiten mit eigenen Grössen
   (body[data-page] …) behalten diese. Mindestwerte anpassbar über --kp-m-label-min/-muted-min/-hq-min. */
@media (max-width:480px){
  .kp-map .m-label{font-size:max(13px,calc(var(--kp-m-label-min,10.5px) / var(--kp-svg-k,1)))}
  .kp-map .m-label--muted{font-size:max(11px,calc(var(--kp-m-label-muted-min,9.5px) / var(--kp-svg-k,1)))}
  .kp-map .m-label--hq{font-size:max(14px,calc(var(--kp-m-label-hq-min,11.5px) / var(--kp-svg-k,1)))}
}
.kp-map a:hover .m-label,.kp-map a:focus .m-label{fill:var(--k-yellow)}
.kp-map a:focus-visible{outline:none}
.kp-map a:focus-visible .m-dot{stroke:var(--k-yellow);stroke-width:3}
.kc-ready .kp-map .m-halo{animation:kp-halo 3.2s var(--kp-ease) 3}   /* v1.4: 3 Zyklen, dann Ruhe (statischer Halo) */
@keyframes kp-halo{0%{transform:scale(.6);opacity:.35}100%{transform:scale(2.2);opacity:0}}
@media (max-width:860px){.kp-regions{grid-template-columns:1fr}}

/* ---------- 15 · CTA-Band ---------- */
.kp-cta{position:relative;isolation:isolate;overflow:hidden;background:var(--kp-forest);color:var(--kp-on-dark);padding-block:clamp(64px,8vw,120px);--kp-star:#f2b01e;--kp-grad-text:linear-gradient(95deg,var(--k-red-2) 0%,var(--k-orange) 50%,var(--k-yellow) 100%)}
.kp-cta::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 55% 80% at 88% 10%,rgba(246,180,86,.20),transparent 70%),radial-gradient(ellipse 50% 70% at 70% 100%,rgba(224,75,42,.16),transparent 70%),radial-gradient(ellipse 60% 70% at 0% 40%,rgba(70,127,94,.22),transparent 70%)}
.kp-cta::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--k-grad)}
.kp-cta__inner{display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:32px 64px;align-items:end}
.kp-cta .kp-eyebrow{color:var(--kp-on-dark-2)}
.kp-cta h2{font-size:var(--kp-h2);line-height:1.06;letter-spacing:-.035em;font-weight:700;color:var(--kp-on-dark);max-width:18ch;text-wrap:balance}
.kp-cta p:not(.kp-eyebrow):not(.kp-cta__contact){margin-top:16px;font-size:var(--kp-lead);line-height:1.55;color:var(--kp-on-dark-2);max-width:54ch}
.kp-cta .kp-btn--ghost{color:var(--kp-on-dark);border-color:rgba(238,245,238,.3)}
.kp-cta .kp-btn--ghost:hover{border-color:var(--kp-on-dark);background:rgba(255,255,255,.06)}
.kp-cta__contact{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:28px;padding-top:22px;border-top:1px solid var(--kp-forest-line);font-size:.98rem;color:var(--kp-on-dark-2);grid-column:1 / -1}
.kp-cta__contact a{display:inline-flex;align-items:center;gap:10px;color:var(--kp-on-dark);font-weight:650;padding-block:4px}
.kp-cta__contact a:hover{color:var(--k-yellow)}
.kp-cta__contact svg{width:18px;height:18px;color:var(--kp-mint)}
.kp-cta .kp-actions{justify-content:flex-end}
/* v1.2: Links im CTA-Fliesstext erkennbar */
.kp-cta p:not(.kp-eyebrow):not(.kp-cta__contact) a:not([class]){color:var(--kp-on-dark);text-decoration:underline;text-decoration-color:var(--kp-mint);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:color .15s}
.kp-cta p:not(.kp-eyebrow):not(.kp-cta__contact) a:not([class]):hover{color:var(--k-yellow)}
@media (max-width:860px){.kp-cta__inner{grid-template-columns:1fr}.kp-cta .kp-actions{justify-content:flex-start}}
.kp-cta--light{background:var(--bg-2);color:var(--ink)}
.kp-cta--light::before{background:radial-gradient(ellipse 55% 80% at 90% 0%,rgba(246,194,74,.18),transparent 70%)}
.kp-cta--light h2{color:var(--ink)}
.kp-cta--light p:not(.kp-eyebrow),.kp-cta--light p:not(.kp-eyebrow):not(.kp-cta__contact),.kp-cta--light .kp-cta__contact{color:var(--ink-2)}
.kp-cta--light .kp-cta__contact{border-color:var(--line)}
.kp-cta--light .kp-cta__contact a{color:var(--ink)}
.kp-cta--light .kp-btn--ghost{color:var(--ink);border-color:var(--line-2)}
.kp-cta--light .kp-eyebrow{color:var(--muted)}
.kp-cta--light p:not(.kp-eyebrow):not(.kp-cta__contact) a:not([class]){color:var(--ink);text-decoration-color:var(--kp-accent)}
.kp-cta--light p:not(.kp-eyebrow):not(.kp-cta__contact) a:not([class]):hover{color:var(--ink);text-decoration-color:currentColor}

/* ---------- 16 · Legal ---------- */
.kp-legal{counter-reset:kp-sec;max-width:var(--kp-read);font-size:1rem;line-height:1.72;color:var(--ink-2)}
.kp-legal__meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:32px;padding:14px 18px;border-radius:var(--kp-r-s);background:var(--bg-2);border:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.kp-legal__meta strong{color:var(--ink)}
.kp-legal>section{counter-increment:kp-sec;counter-reset:kp-sub;padding-top:8px}
.kp-legal>section+section{margin-top:40px;padding-top:40px;border-top:1px solid var(--line)}
.kp-legal h2{display:grid;grid-template-columns:3ch minmax(0,1fr);gap:8px;font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.3;letter-spacing:-.018em;font-weight:700;color:var(--ink);margin-bottom:14px}
.kp-legal h2::before{content:counter(kp-sec) ".";color:var(--kp-accent);font-variant-numeric:tabular-nums}
.kp-legal--manual h2{display:block}
.kp-legal--manual h2::before{content:none}
.kp-legal h3{font-size:1.05rem;font-weight:700;color:var(--ink);margin:22px 0 8px;line-height:1.4}
.kp-legal p+p,.kp-legal p+ul,.kp-legal ul+p,.kp-legal p+ol{margin-top:.8em}
.kp-legal ol,.kp-legal ul{padding-left:1.3em;margin:0}
.kp-legal li+li{margin-top:.45em}
.kp-legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.kp-legal strong{color:var(--ink)}
.kp-legal address{font-style:normal;margin-top:.8em}
.kp-legal__clause{display:grid;grid-template-columns:3.4em minmax(0,1fr);gap:0 6px}
.kp-legal__clause+.kp-legal__clause{margin-top:.8em}
.kp-legal__clause>b:first-child{font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}

/* ---------- 17 · Kontakt + Formular ---------- */
.kp-contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--kp-gap);list-style:none;margin:0;padding:0}
.kp-contact-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:clamp(22px,2.4vw,30px);border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow)}
.kp-contact-card__icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--k-grad-soft);color:var(--kp-accent);margin-bottom:8px}
.kp-contact-card__icon svg{width:24px;height:24px}
.kp-contact-card h3{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kp-contact-card__value{font-size:clamp(1.2rem,2vw,1.45rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.25;overflow-wrap:anywhere}
a.kp-contact-card__value:hover{color:var(--kp-accent)}
.kp-contact-card p{font-size:.93rem;line-height:1.55;color:var(--muted)}
.kp-contact-card address{font-style:normal;color:var(--ink-2);line-height:1.6}
.kp-form{padding:clamp(22px,3vw,40px);border-radius:var(--kp-r);background:var(--kp-card);border:1px solid var(--line);box-shadow:var(--kp-shadow)}
.kp-form__notice{margin-bottom:24px}
.kp-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.kp-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.kp-field--full{grid-column:1 / -1}
.kp-field label,.kp-field legend{font-size:.92rem;font-weight:650;color:var(--ink)}
.kp-field label small{font-weight:450;color:var(--muted)}
.kp-input,.kp-select,.kp-textarea{width:100%;min-height:50px;padding:12px 16px;border-radius:12px;border:1.5px solid var(--line-2);background:var(--bg);color:var(--ink);font:inherit;font-size:1rem;line-height:1.4;transition:border-color .15s,box-shadow .15s}
.kp-textarea{min-height:130px;resize:vertical}
.kp-select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 22px) 52%,calc(100% - 16px) 52%;background-size:6px 6px;background-repeat:no-repeat}
.kp-input:focus,.kp-select:focus,.kp-textarea:focus{outline:none;border-color:var(--k-focus,#B8560A);box-shadow:0 0 0 2px var(--k-focus,#B8560A)}
.kp-field__hint{font-size:.84rem;color:var(--muted);line-height:1.45}
.kp-form__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:26px}
.kp-form__legal{font-size:.84rem;line-height:1.5;color:var(--muted);max-width:52ch}
.kp-form__status{margin-top:16px;font-size:.92rem;color:var(--ink-2)}
.kp-form__status:empty{display:none}
@media (max-width:620px){.kp-form__grid{grid-template-columns:1fr}}

/* ---------- 18 · Illustrationen (Linien-Isometrie) ---------- */
.kp-illu{display:block;width:100%;height:auto;color:var(--kp-illu-hi);overflow:visible}
.kp-illu .i-base{fill:none;stroke:var(--kp-illu-line);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.kp-illu .i-soft{fill:none;stroke:var(--kp-illu-soft);stroke-width:1}
.kp-illu .i-hi{fill:none;stroke:var(--kp-illu-hi);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.kp-illu .i-warm{fill:none;stroke:var(--kp-illu-warm);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.kp-illu .i-red{fill:none;stroke:var(--kp-illu-red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.kp-illu .i-face{fill:rgba(140,222,179,.05);stroke:none}
.kp-illu .i-face-2{fill:rgba(140,222,179,.09);stroke:none}
.kp-illu .i-glass{fill:rgba(246,180,86,.14);stroke:none}
.kp-illu .i-glow{fill:var(--kp-illu-warm);opacity:.9}
.kp-illu .i-dot{fill:var(--kp-illu-hi)}
.kp-illu .i-dot-warm{fill:var(--kp-illu-warm)}
.kp-illu .i-text{fill:var(--kp-on-dark-2);font:600 11px/1 var(--font);letter-spacing:.08em}
/* Mobil: effektiv mind. 9.5 px (Massstab --kp-svg-k aus kea-pages.js, siehe .kp-map oben) */
@media (max-width:480px){.kp-illu .i-text{font-size:max(11px,calc(var(--kp-i-text-min,9.5px) / var(--kp-svg-k,1)));letter-spacing:.06em}}
.kp-illu .i-pulse{fill:none;stroke:var(--kp-illu-warm);stroke-width:3;stroke-linecap:round;stroke-dasharray:.06 .94;stroke-dashoffset:1;opacity:0}
.kc-ready .kp-illu.is-in .i-pulse{opacity:1;animation:kp-pulse 3.6s linear 1.8s 3}   /* v1.4: 3 Durchläufe, danach Ruhe (Endlage = Ruhelage wie bei reduced motion) */
@keyframes kp-pulse{to{stroke-dashoffset:0}}
.kp-illu-stage{border-radius:var(--kp-r-s);background:var(--kp-forest-2);box-shadow:inset 0 0 0 1px var(--kp-forest-line);padding:clamp(8px,2vw,20px);margin-bottom:10px;color:var(--kp-illu-hi)}
.kp-illu .i-light{opacity:.25;transition:opacity 1.2s ease 1.4s}
.kp-illu.is-in .i-light,html:not(.kc-ready) .kp-illu .i-light{opacity:1}

/* ---------- 19 · Animations-Utilities ---------- */
/* Laufzeit: kea.js setzt html.kc-ready und .is-in auf [data-reveal] / [data-draw] (IntersectionObserver),
   --kc-i auf Kinder von data-reveal="stagger" und auf Geschwister. Anfangszustände nur ohne reduced motion
   und nur, wenn kea.js läuft (html.kc-ready) – ohne JS ist alles sichtbar. */
@media (prefers-reduced-motion:no-preference){
  .kc-ready [data-reveal]{transition:opacity .8s var(--kp-ease),transform .8s var(--kp-ease);transition-delay:calc(var(--kc-i,0) * 90ms)}
  .kc-ready [data-reveal]:not(.is-in){opacity:0;transform:translateY(22px)}
  .kc-ready [data-reveal="fade"]:not(.is-in){transform:none}
  .kc-ready [data-reveal="stagger"]{transition:none}
  .kc-ready [data-reveal="stagger"]:not(.is-in){opacity:1;transform:none}
  .kc-ready [data-reveal="stagger"]>*{transition:opacity .7s var(--kp-ease),transform .7s var(--kp-ease),box-shadow .3s,border-color .3s;transition-delay:calc(var(--kc-i,0) * 80ms)}
  .kc-ready [data-reveal="stagger"]:not(.is-in)>*{opacity:0;transform:translateY(18px)}
  .kc-ready [data-reveal="stagger"].is-in>*:hover{transition-delay:0s}
  /* SVG-Linien zeichnen: <svg data-draw> mit Elementen class="kp-line" pathLength="1" */
  .kc-ready [data-draw] .kp-line{stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--kp-ease);transition-delay:calc(var(--kp-d,0) * 110ms)}
  .kc-ready [data-draw].is-in .kp-line{stroke-dashoffset:0}
  .kc-ready [data-draw] .kp-fade{opacity:0;transition:opacity .9s ease 1.1s}
  .kc-ready [data-draw].is-in .kp-fade{opacity:1}
}
[data-kp-count]{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){
  .kp-card,.kp-card__media img,.kp-btn,.kp-link svg,.kp-places a,.kp-linklist a,.kp-timeline__item::before,.kp-timeline::after{transition:none!important}
  .kp-card:hover,.kp-btn:hover,.kp-places a:hover{transform:none}
  .kp-card:hover .kp-card__media img{transform:none}
  .kp-faq__item[open] .kp-faq__answer{animation:none}
  .kc-ready .kp-map .m-halo,.kc-ready .kp-illu.is-in .i-pulse{animation:none}
  .kp-illu .i-light{transition:none;opacity:1}
}

/* ---------- Druck ---------- */
@media print{
  .kp-hero,.kp-section,.kp-cta{padding-block:16px!important;background:#fff!important;color:#000!important;box-shadow:none!important}
  .kp-hero::before,.kp-hero::after,.kp-cta::before,.kp-section--dark::before{display:none}
  .kp-toc,.kp-toc--bar,.kp-aside,.kp-cta,.kp-actions,.kp-hero__media,.kp-hero__art,.kp-form{display:none!important}
  .kp-layout{display:block}
  .kp-legal{max-width:none;font-size:10.5pt;line-height:1.5;color:#000}
  .kp-legal>section{break-inside:auto}
  .kp-legal h2{break-after:avoid;color:#000}
  .kp-legal a::after{content:" (" attr(href) ")";font-size:.85em;color:#444}
  .kp-card,.kp-price,.kp-fact,.kp-callout,.kp-review{box-shadow:none!important;break-inside:avoid;border-color:#bbb!important}
  [data-reveal],[data-reveal]>*,[data-draw] .kp-line{opacity:1!important;transform:none!important;stroke-dashoffset:0!important}
  .kp-faq__item{break-inside:avoid}
}

/* Price scope stays legible next to the first price mention. */
.kp-price-basis{margin:20px 0 0;color:var(--ink-2);font-size:.9rem;line-height:1.5}
