/* UNEQ Design System · Bausteine (eine Quelle für alle Kapitelseiten).
   Hell = Standard. Dunkel: Klasse .dk auf einem Vorfahren ODER html.un-dk (Dunkel-Modus der Website).
   .lt erzwingt Hell (helle Beispiele bleiben hell). Alle Farben, die sich zwischen Hell und Dunkel ändern, sind Variablen.
   Neue Elemente IMMER von hier nehmen, nie pro Seite neu bauen. Übersicht: Bausteine.html im Hauptordner. */
:root,.lt{--g-ink:#2B2931;--g-sub:#45434C;--g-mute:#6E6C75;--g-soft:#45434C;--g-ltx:#2B2931;--g-inv:#FFFFFF;--g-surf:#FFFFFF;--g-alt:#F6F4F1;--g-hov:#EFECE8;--g-line:#D9D5CF;--g-frame:#E8E3DD;--g-th:#45434C;--g-eb:#2B2931;--g-ok:#2E7D4F;--g-no:#B3261E;--g-okb:#3FA34D;--g-nob:#D9483B;--g-acc:#2B2931;--g-mkr:linear-gradient(#FBB040,#FBB040);--g-lk:#2B2931;--g-lku:2px;--g-fcs:#2B2931;--g-bdg:#FFF4E2;--g-bdgk:#2B2931;--g-bdgs:rgba(251,176,64,.12);--g-hs-i:#F6F4F1;--g-hs-ib:#D9D5CF;--g-hs-ii:#2B2931;--g-hs-if:#FFFFFF;--g-hs-ok:#EAF5EC;--g-hs-wa:#FFF4E2;--g-hs-er:#FBEAE8;--g-mk:#2B2931;--g-mkt:#FFFFFF;--g-tp:#F6F4F1;--g-tpb:#E8E3DD;--g-pp:#2B2931;--g-ppt:#FFFFFF;--g-pps:#D8D5DC;--g-sm:#45434C;--g-fn:#6E6C75;--g-ph:#E4E0DA;--g-cmph:#2B2931;--g-cmp1:#FFF4E2;--g-cmp2:#FBE9CC;--g-swb:transparent;--g-chip:#F6F4F1}
.dk,html.un-dk body{--g-ink:#FFFFFF;--g-sub:#D8D5DC;--g-mute:#B9B6C0;--g-soft:#C9C5CF;--g-ltx:#ECEAF0;--g-inv:#2B2931;--g-surf:#312F39;--g-alt:#2B2931;--g-hov:#3A3843;--g-line:#4A4853;--g-frame:#312F39;--g-th:#FBB040;--g-eb:#FBB040;--g-ok:#6FCF7F;--g-no:#FF8A7E;--g-okb:#4CC25E;--g-nob:#FF4A3D;--g-acc:#FBB040;--g-mkr:none;--g-lk:#FBB040;--g-lku:1px;--g-fcs:#FBB040;--g-bdg:#34323B;--g-bdgk:#FBB040;--g-bdgs:rgba(251,176,64,.08);--g-hs-i:#312F39;--g-hs-ib:#45434C;--g-hs-ii:#FFFFFF;--g-hs-if:#2B2931;--g-hs-ok:#2C3A31;--g-hs-wa:#3D3529;--g-hs-er:#3F2C2E;--g-mk:#1F1D24;--g-mkt:#FBB040;--g-tp:#312F39;--g-tpb:#312F39;--g-pp:#F6F4F1;--g-ppt:#2B2931;--g-pps:#45434C;--g-sm:#B9B6C0;--g-fn:#9C9AA3;--g-ph:#3A3841;--g-cmph:#1F1D24;--g-cmp1:#3A3843;--g-cmp2:#43414D;--g-swb:rgba(255,255,255,.18);--g-chip:#3A3841}
.lt,.dk{color:var(--g-ink)}

/* Seite: <body class="u-body">. Hintergrund Hell UNEQ Off-White, Dunkel UNEQ Blue (über --g-alt). */
.u-body{margin:0;background:var(--g-alt);color:var(--g-ink);font-family:Mulish,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}.u-body *,.u-body *:before,.u-body *:after{box-sizing:border-box}
:where(.u-body) a{color:var(--g-ink)}:where(.u-body) a:hover{color:var(--g-sub)}
.u-hd{font-size:clamp(32px,4.4vw,48px)}.u-hd .u-h1{font-size:1em}

/* Seitenrahmen einer Kapitelseite */
.u-f{max-width:1200px;margin:0 auto;padding:40px 32px 64px;display:flex;flex-direction:column;gap:56px;color:var(--g-ink);container-type:inline-size}
.u-h1{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(32px,4.4vw,48px);line-height:1.02;margin:0 0 12px;color:var(--g-ink)}
.u-h2{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(22px,2.6vw,28px);line-height:1.05;margin:0;color:var(--g-ink)}
.u-sec{display:flex;flex-direction:column;gap:18px}

/* Headline in Beispielen. Rahmen .u-hl setzt die Headline-Größe (1 em), alles darin rechnet in em.
   Größe hängt an der Breite der Spalte (--u-cw), nicht am Fenster: passt so auch neben der Seitenleiste. */
.u-hl{font-size:clamp(24px,calc(var(--u-cw,100cqi) * .09),52px)}.u-hl.e{font-size:clamp(20px,calc(var(--u-cw,100cqi) * .07),40px)}.u-hl.l{font-size:clamp(20px,calc(var(--u-cw,100cqi) * .075),42px)}.u-hl.m{font-size:clamp(24px,calc(var(--u-cw,100cqi) * .08),44px)}
.u-k{font-family:Montserrat,sans-serif;font-weight:900;font-size:1em;line-height:1.02;letter-spacing:-.01em;margin:0;text-wrap:balance;overflow-wrap:break-word;color:var(--g-ink)}.u-k.u{text-transform:uppercase}.u-k.l{line-height:1.05}

/* Text in Beispielen (Kapitel Headlines). Unterzeile .u-uz, Text unter der Headline .u-tx, Fließtext .u-p (.rg = Ratgeber, Montserrat). */
.u-uz{font-family:Montserrat,sans-serif;font-weight:700;font-size:clamp(18px,1.8vw,22px);line-height:1.25;margin:max(14px,.7em) 0 0;color:var(--g-ink);text-wrap:balance}
.u-tx{font-family:Mulish,sans-serif;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--g-sub);max-width:46ch;margin:max(16px,.8em) 0 0;text-wrap:pretty}.c>.u-tx,.c>div>.u-tx{margin-left:auto;margin-right:auto}
.u-p{margin:0;font-family:Mulish,sans-serif;font-size:clamp(17px,1.3vw,18px);line-height:1.6;color:var(--g-ltx);max-width:68ch;text-wrap:pretty}.u-p.rg{font-family:Montserrat,sans-serif;font-size:clamp(15px,1.2vw,16px);line-height:1.6}
/* Zwischenheadline schlicht (Website) und mit Linien (Ratgeber) */
.u-zw{font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(20px,1.8vw,24px);line-height:1.2;margin:max(28px,1.5em) 0 max(10px,.5em);color:var(--g-ink);text-wrap:balance}
.u-zh{font-family:Montserrat,sans-serif;font-weight:700;font-size:clamp(18px,1.8vw,22px);line-height:1.25;color:var(--g-ink);border:solid #FBB040;border-width:max(1.5px,.08em) 0;padding:max(8px,.5em) 0;margin:0 0 max(16px,.8em);text-wrap:balance}

/* Textstufen (Kapitel Textstufen). Alle Mulish. Einleitung .u-in 18–20 px, Fließtext .u-p 17–18 px, Kleintext .u-sm 14 px, Fußnote .u-fn 12 px.
   Kleintext und Fußnote grau, Fußnote sanfter. Beide mind. 4,5:1 Kontrast. */
.u-ut{margin:0;font-family:Mulish,sans-serif;font-weight:400;font-size:clamp(18px,1.5vw,20px);line-height:1.45;color:var(--g-ltx);max-width:46ch;text-wrap:pretty}.u-in{margin:0;font-family:Montserrat,sans-serif;font-weight:700;font-size:clamp(18px,1.8vw,22px);line-height:1.25;color:var(--g-ink);max-width:56ch;text-wrap:balance}.u-k+.u-ut,.u-k+.u-in{margin-top:max(16px,.8em)}.u-ut+.u-p,.u-in+.u-p{margin-top:max(12px,.7em)}
/* Untertitel .u-ut: Mulish 400, nie fett, steht allein unter der Headline (kein Fließtext danach). Einleitung .u-in: wie die Unterzeile, Montserrat Bold 18–22 px, Zeilenabstand 1,25, wenn Fließtext folgt. */
.u-sm{margin:0;font-family:Mulish,sans-serif;font-size:14px;line-height:1.45;color:var(--g-sm)}
.u-fn{margin:0;font-family:Mulish,sans-serif;font-size:12px;line-height:1.45;color:var(--g-fn)}.u-p sup,.u-fn sup{font-size:.65em;line-height:0}
.u-fns{display:flex;flex-direction:column;gap:4px;padding-top:14px;border-top:1px solid var(--g-line)}
/* Textfluss: Abstände zwischen den Stufen. Headline → Text mind. 16 px, Text → Button mind. 28 px, Zusatz unter dem Button mind. 14 px. .c = zentriert. */
.u-flow{display:flex;flex-direction:column;align-items:flex-start;min-width:0}.u-flow.c{align-items:center;text-align:center}.u-flow.c .u-cta{justify-content:center}
.u-flow>.u-in{margin-top:max(16px,.9em)}.u-flow>.u-p{margin-top:max(14px,.8em)}.u-flow>.u-in+.u-p{margin-top:max(16px,.9em)}.u-flow>.u-l{margin-top:max(12px,.7em)}.u-flow>.u-cta{margin-top:max(28px,1.75rem)}.u-flow>.u-sm{margin-top:max(14px,.9em)}.u-flow>.u-zw+.u-p{margin-top:0}.u-flow>.u-fns{margin-top:max(28px,1.75rem);align-self:stretch}.u-flow>:first-child{margin-top:0}
.u-read{width:100%;max-width:760px;margin:0 auto}
/* Muster untereinander: Beispiel + Bildunterschrift */
.u-stk{display:flex;flex-direction:column;gap:max(24px,1.75em)}.u-smp{display:flex;flex-direction:column;gap:max(8px,.5em)}
/* Zwei Spalten: Text neben Bild. Links 1,1 : 1, .eq = gleich breit. In schmalen Flächen untereinander. */
.u-two{--u-g2:clamp(24px,4cqi,56px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--u-g2);align-items:center;width:100%}.u-two.eq{grid-template-columns:repeat(2,minmax(0,1fr))}
.u-two>:first-child{--u-cw:calc((100cqi - var(--u-g2)) * .524)}.u-two.eq>:first-child{--u-cw:calc((100cqi - var(--u-g2)) / 2)}
.u-two>:first-child:is(.u-hl,.u-flow),.u-hl .u-two>:first-child{font-size:clamp(24px,calc(var(--u-cw) * .14),52px)}.u-hl.e .u-two>:first-child{font-size:clamp(20px,calc(var(--u-cw) * .11),40px)}.u-hl.l .u-two>:first-child{font-size:clamp(20px,calc(var(--u-cw) * .115),42px)}.u-hl.m .u-two>:first-child{font-size:clamp(24px,calc(var(--u-cw) * .125),44px)}
@container (max-width:500px){.u-two,.u-two.eq{grid-template-columns:1fr}.u-two>:first-child,.u-two.eq>:first-child{--u-cw:100cqi}.u-hl .u-two>:first-child{font-size:clamp(24px,calc(100cqi * .09),52px)}}
/* Bildplatzhalter: Fläche mit Beschriftung, bis das echte Bild da ist. Neben Text so hoch wie der Text. */
.u-img{display:flex;align-items:center;justify-content:center;min-height:220px;border-radius:8px;background:var(--g-ph);color:var(--g-sub);font-family:Mulish,sans-serif;font-size:13px;line-height:1.3}.u-two>.u-img{align-self:stretch;min-height:280px}
/* Kachel (Shop): zentriert, Bild bündig am unteren Rand. Kacheln nebeneinander gleich hoch. */
.u-pane.u-tile{padding:clamp(32px,5vw,56px) 20px 0;overflow:hidden;align-items:center;text-align:center}.u-tile>.u-flow{margin-bottom:max(32px,2rem)}.u-tile>.u-img{width:100%;margin-top:auto;border-radius:8px 8px 0 0;min-height:200px}

/* Headline mit Element daneben. Linke Spalte = 0,62 × Headline-Größe des Rahmens. */
.u-side{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:max(20px,.7em);align-items:center}.u-side>:first-child{font-size:.62em;min-width:0}
@container (max-width:420px){.u-side{grid-template-columns:1fr}}

/* Video mit Play-Button (Kapitel Bilder und Video): oranger Kreis, dunkles Dreieck, mittig, pulsierend. */
.u-vid{position:relative;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#1F1D24;isolation:isolate}.u-vid>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.u-play{--d:clamp(56px,14%,96px);position:absolute;left:50%;top:50%;width:var(--d);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:#FBB040;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 24px rgba(0,0,0,.25);z-index:2}
.u-play svg{width:42%;height:42%;fill:#2B2931;display:block}
.u-play:before,.u-play:after{content:"";position:absolute;inset:0;border-radius:50%;background:#FBB040;z-index:-1;animation:u-pulse 2.4s cubic-bezier(.2,.6,.3,1) infinite}.u-play:after{animation-delay:1.2s}
@keyframes u-pulse{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.7);opacity:0}}
@media(prefers-reduced-motion:reduce){.u-play:before,.u-play:after{animation:none;opacity:0}}

/* Website-Ausschnitt für "Im Einsatz". Rahmen setzt die Headline-Größe. .c = zentriert, .s = kleinere Headline (0,78). */
.u-web{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;overflow:hidden;color:var(--g-ink);font-size:clamp(24px,calc(var(--u-cw,100cqi) * .05),48px)}.u-web.dk{background:var(--g-alt);border-color:var(--g-line)}
.u-wnav{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;padding:16px clamp(20px,4vw,48px);border-bottom:1px solid var(--g-line);font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;line-height:1.3}.u-wnav img{height:18px;margin-right:auto}
.u-wb{padding:clamp(32px,6vw,80px) clamp(20px,5vw,64px);display:flex;flex-direction:column;align-items:flex-start}.u-wb.c{align-items:center;text-align:center}.u-wb.s{font-size:.78em}
.u-wside{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;width:100%}.u-wside>:first-child{font-size:.78em;display:flex;flex-direction:column;align-items:flex-start;min-width:0}@media(max-width:760px){.u-wside{grid-template-columns:1fr}}
.u-wb .u-btn{margin-top:max(28px,2em)}
.u-ph{aspect-ratio:4/5;border-radius:8px;background:#D9D5CF center/cover}

/* Erklärtext und Bildunterschrift */
.u-lede,.u-note{margin:0;max-width:72ch;color:var(--g-sub);text-wrap:pretty}.u-lede{font-size:18px;line-height:1.45}
.u-lede b,.u-note b{color:var(--g-ink);font-weight:800}
.u-cap{margin:0;font-family:Mulish,sans-serif;font-size:14px;line-height:1.55;color:var(--g-sub);text-wrap:pretty}.u-cap b{font-family:Montserrat,sans-serif;font-weight:800;color:var(--g-ink)}

/* Eyebrow (Kapitel Headlines). Größe 0,3 × Headline, mind. 12 px. Abstand zur Headline 0,4 em der Headline, mind. 10 px.
   Hell: Text dunkel, „//“ orange. Dunkel: ganz orange. Steht im Rahmen mit Schriftgröße = Headline-Größe. */
.u-eb{display:flex;gap:.6em;font-family:Montserrat,sans-serif;font-weight:800;font-size:max(12px,.3em);letter-spacing:.18em;text-transform:uppercase;line-height:1.3;color:var(--g-eb);margin:0 0 max(10px,1.333em)}
.u-eb>span:first-child{flex:none;color:#FBB040;letter-spacing:0}
.u-eb.c{justify-content:center}

/* Linie über der Headline und Akzentwort (Kapitel Headlines). em = Headline-Größe. */
.u-rule{width:2em;height:max(3px,.18em);background:#FBB040;margin-bottom:max(12px,.6em)}
.u-mk{color:var(--g-acc);background:var(--g-mkr) 0 100%/100% .34em no-repeat;padding:0 .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* Badge (Kapitel Headlines). Nur über zentrierten Haupt-Headlines. Größe 0,3 × Headline, mind. 13 px. Abstand zur Headline 0,5 em der Headline, mind. 12 px. */
.u-bdg{display:inline-flex;align-items:center;gap:.55em;max-width:100%;font-family:Mulish,sans-serif;font-weight:600;font-size:max(13px,.3em);line-height:1.25;text-align:left;padding:.3em 1em .3em .3em;border-radius:999px;border:max(1.5px,.12em) solid #FBB040;background:var(--g-bdg);color:var(--g-ink);box-shadow:0 0 0 .35em var(--g-bdgs);margin:.35em .35em max(12px,1.667em);-webkit-font-smoothing:antialiased}
.u-bdg>i{flex:none;width:1.9em;height:1.9em;border-radius:50%;background:#FBB040;display:inline-flex;align-items:center;justify-content:center}.u-bdg>i svg{width:1.05em;height:1.05em;stroke:#2B2931}
.u-bdg b{font-weight:800;color:var(--g-bdgk)}.u-bdg>span{min-width:0;text-wrap:balance}
.u-pane,.u-bdgw{container-type:inline-size}@container (max-width:480px){.u-bdg{border-radius:1.4em}}

/* Richtig / Falsch */
.u-sh{margin:8px 0 0;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.u-sh.ok{color:var(--g-ok)}.u-sh.no{color:var(--g-no)}.u-sh:after{content:"";flex:1;height:1px;background:currentColor;opacity:.25}
.u-tag{display:flex;align-items:center;gap:8px;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;line-height:1.3;color:var(--g-ink)}
.u-tag>i{flex:none;width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;color:#fff}.u-tag.ok>i{background:#2E7D4F}.u-tag.no>i{background:#B3261E}
.u-ok{border:3px solid var(--g-okb)}.u-no{border:3px solid var(--g-nob)}

/* Raster für Beispiele: Tag, Beispiel, Bildunterschrift stehen je Reihe auf einer Höhe. Abstand 1,5 em (16–28 px). */
/* Spaltenzahl hängt an der Breite des Inhalts (.u-f), nicht am Fenster. --u-cw = Breite einer Spalte, daran hängen die Headline-Größen. */
.u-g{--u-n:2;--u-gap:24px;display:grid;gap:var(--u-gap);grid-template-columns:repeat(var(--u-n),minmax(0,1fr));container-type:inline-size}.u-g.g3{--u-n:3}.u-g.g1{--u-n:1}
.u-g>*{--u-cw:calc((100cqi - (var(--u-n) - 1) * var(--u-gap)) / var(--u-n))}.u-pane>*{--u-cw:100cqi}
.u-g.g4{--u-n:4}
@container (max-width:836px){.u-g.g3,.u-g.g4{--u-n:2}}@container (max-width:640px){.u-g,.u-g.g3,.u-g.g4{--u-n:1}}
.u-cell{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:10px;align-content:start;min-width:0}:not(.u-g)>.u-cell{display:flex;flex-direction:column;gap:10px}:not(.u-g)>.u-cell>.u-tag{align-self:auto}.u-cell>.u-tag{align-self:end}.u-cell.w{grid-column:1/-1}

/* Beispielfläche */
.u-pane{border-radius:12px;padding:clamp(20px,3vw,40px);background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink);display:flex;flex-direction:column;min-width:0}
.u-pane.c{align-items:center;text-align:center}.u-pane.dk{background:var(--g-alt);border-color:var(--g-line)}.u-pane.u-ok{border:3px solid var(--g-okb)}.u-pane.u-no{border:3px solid var(--g-nob)}

/* Einsetzen / Nicht einsetzen */
.u-use{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}@media(max-width:520px){.u-use{grid-template-columns:1fr}}
.u-use>div{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:8px;padding:12px 14px 14px;font-size:14px;line-height:1.45}
.u-use h4{margin:0 0 6px;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;display:flex;align-items:center;gap:8px}.u-use .y h4{color:var(--g-ok)}.u-use .n h4{color:var(--g-no)}
.u-use h4 i{flex:none;width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:11px;color:#fff}.u-use .y h4 i{background:#2E7D4F}.u-use .n h4 i{background:#B3261E}
.u-use ul{margin:0;padding-left:1.1em;color:var(--g-sub)}.u-use li+li{margin-top:2px}

/* Werte-Kästen */
.u-spec{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:16px}
.u-spec>div{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:8px;padding:14px 16px;font-size:14px;line-height:1.45;color:var(--g-sub)}
.u-spec b{display:block;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--g-ink);margin-bottom:4px}

/* Buttons und Links (Kapitel Buttons und Links). Immer einzeilig. */
.u-btn{--fs:clamp(15px,1.1vw,17px);display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-family:Montserrat,sans-serif;font-weight:800;font-size:var(--fs);line-height:1.2;text-decoration:none;white-space:nowrap;border-radius:999px;min-height:max(48px,3em);padding:.85em 1.6em;border:2px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.u-btn svg{width:1.15em;height:1.15em;flex:none;stroke:currentColor}
.u-btn.p{background:#FBB040;color:#2B2931}.u-btn.p:hover,.u-btn.p.h{background:#FFC466;color:#2B2931;transform:translateY(-1px)}
.u-btn.s{background:transparent;border-color:var(--g-ink);color:var(--g-ink)}.u-btn.s:hover,.u-btn.s.h{background:var(--g-ink);color:var(--g-inv)}
.u-btn.x{padding:.85em .2em;min-height:max(44px,2.75em);border-radius:0;background:none;color:var(--g-ink)}.u-btn.x span{background:linear-gradient(#FBB040,#FBB040) 0 100%/0 2px no-repeat;transition:background-size .2s}.u-btn.x:hover span,.u-btn.x.h span{background-size:100% 2px}
.u-btn:focus-visible,.u-btn.fc{outline:3px solid #FBB040;outline-offset:3px}.u-btn.s:focus-visible,.u-btn.s.fc{outline-color:var(--g-fcs)}
.u-btn.dis,.u-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
.u-btn.sm{--fs:14px;min-height:44px;padding:.7em 1.3em}.u-btn.lg{--fs:clamp(17px,1.4vw,20px);min-height:max(56px,3em)}
.u-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.u-bs{display:flex;flex-direction:column;align-items:center;gap:max(14px,.9em);width:100%;max-width:440px;font-size:16px}
.u-esc{font-family:Mulish,sans-serif;font-size:15px;color:var(--g-soft);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em;text-decoration-color:currentColor;padding:10px 4px;margin:-10px 0}.u-esc:hover{color:var(--g-ink);text-decoration-color:#FBB040}
.u-hint{margin:0;display:flex;align-items:center;gap:.5em;font-size:14px;color:var(--g-soft);text-align:center}.u-hint svg{width:1.15em;height:1.15em;flex:none;stroke:currentColor}
.u-lk{color:var(--g-lk);font-weight:700;text-decoration:none;background:linear-gradient(#FBB040,#FBB040) 0 100%/100% var(--g-lku) no-repeat;padding-bottom:1px;transition:background-size .15s}.u-lk:hover{background-size:100% 100%;color:#2B2931}

/* Listen (Kapitel Listen). Maße in em, Mindestwerte in px. */
.u-l{list-style:none;margin:0;padding:0;font-size:clamp(17px,1.3vw,18px);line-height:1.5;color:var(--g-ltx);display:flex;flex-direction:column;gap:max(8px,.55em)}
.u-l li{display:grid;grid-template-columns:max(20px,1.2em) minmax(0,1fr);gap:max(10px,.65em);align-items:start}.u-l li>i{font-style:normal}.u-l b{font-weight:800;color:var(--g-ink)}
.u-l.dot li>i{width:max(9px,.5em);height:max(9px,.5em);border-radius:50%;background:#FBB040;margin:.5em 0 0 .25em}
.u-l.chk li>i{width:max(20px,1.2em);height:max(20px,1.2em);border-radius:50%;background:#FBB040;margin-top:.15em;display:flex;align-items:center;justify-content:center}.u-l.chk li>i svg{width:62%;height:62%;stroke:#2B2931}
.u-l.num{counter-reset:n}.u-l.num li{counter-increment:n;grid-template-columns:max(32px,1.9em) minmax(0,1fr)}.u-l.num li>i{font-family:Montserrat,sans-serif;font-weight:900;font-size:1.25em;line-height:1.2;color:var(--g-acc);background:var(--g-mkr) 0 88%/100% .34em no-repeat;padding:0 .06em;justify-self:start}.u-l.num li>i:before{content:counter(n,decimal-leading-zero)}
/* Icon-Liste: oranger Kreis, dunkles Linien-Icon, fette Zeile + Erklärung */
.u-l.ico{gap:max(16px,1em)}.u-l.ico li{grid-template-columns:max(40px,2.3em) minmax(0,1fr);align-items:center}
.u-l.ico li>i{width:max(40px,2.3em);height:max(40px,2.3em);border-radius:50%;background:#FBB040;display:flex;align-items:center;justify-content:center}.u-l.ico li>i svg{width:50%;height:50%;stroke:#2B2931}
.u-l.ico strong{display:block;font-family:Montserrat,sans-serif;font-weight:800;font-size:1em;line-height:1.25;color:var(--g-ink)}.u-l.ico em{display:block;font-style:normal;font-size:.88em;color:var(--g-soft)}

/* Verschachtelte Liste: zweite Ebene .u-l.sub mit kleinem vollem Quadrat, eingerückt bis zur Textkante, 0,92 em. Höchstens zwei Ebenen. */
.u-l.sub{font-size:.92em;gap:max(4px,.35em);margin-top:max(6px,.4em)}.u-l.sub li>i{width:max(7px,.4em);height:max(7px,.4em);border-radius:1px;background:#FBB040;margin:.56em 0 0 .3em}
/* Liste in zwei Spalten .u-l.c2: ab sechs einzeiligen Punkten, zeilenweise. In schmalen Flächen eine Spalte. */
.u-l.c2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:max(20px,1.5em)}@container (max-width:460px){.u-l.c2{grid-template-columns:1fr}}
/* Ampel-Liste .u-l.amp (nur Vorher und nachher): Rot mit weißem Kreuz i.r, Grün mit weißem Haken i.g. Kreis 1,5 em, mind. 26 px. */
.u-l.amp{gap:max(14px,.9em)}.u-l.amp li{grid-template-columns:max(26px,1.5em) minmax(0,1fr)}.u-l.amp li>i{width:max(26px,1.5em);height:max(26px,1.5em);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:-.05em}.u-l.amp li>i.r{background:#D9483B}.u-l.amp li>i.g{background:#3FA34D}.u-l.amp li>i svg{width:58%;height:58%;stroke:#fff}
/* Kastentitel: kleine Headline in Karten und Beispielen. Montserrat Black 22–28 px. */
.u-kt{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(22px,2.2vw,28px);line-height:1.05;margin:0 0 max(14px,.7em);color:var(--g-ink);text-wrap:balance;overflow-wrap:break-word}
/* Vorher und nachher .u-vn: Problem links dunkel (.u-vc.dk), Lösung rechts hell (.u-vc.lt). Gleich hoch, gleich viele Punkte.
   Abschnitt hell (.u-vn.lt): Fläche Off-White, Problem UNEQ Blue. Abschnitt dunkel (.u-vn.dk): Fläche UNEQ Blue, Problem UNEQ Light Blue. Lösung immer Weiß mit weichem Schatten. */
.u-vn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);padding:clamp(20px,3vw,40px);border-radius:12px;background:var(--g-alt)}@container (max-width:700px){.u-vn{grid-template-columns:1fr}}
.u-vc{border-radius:12px;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;min-width:0}.u-vc.dk{background:#2B2931}.u-vn.dk .u-vc.dk{background:#312F39}.u-vc.lt{background:#FFFFFF;box-shadow:0 1px 2px rgba(43,41,49,.06),0 10px 30px rgba(43,41,49,.08)}
.u-vh{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(22px,2.2vw,28px);line-height:1.08;text-align:center;text-wrap:balance;color:var(--g-ink)}
.u-vs{margin:max(8px,.4em) 0 max(22px,1.3em);text-align:center;font-size:15px;color:var(--g-mute)}

/* Hinweis-Kästen (Kapitel Hinweis-Kästen)
   a) Status-Hinweis .u-hs: info · ok · warn · err */
.u-hs{display:flex;gap:.8em;padding:1em 1.1em;border-radius:12px;border:1px solid;font-size:clamp(15px,1.4vw,16px);line-height:1.5;color:var(--g-ink)}
.u-hs .u-hi{flex:none;width:1.75em;height:1.75em;border-radius:50%;display:flex;align-items:center;justify-content:center}.u-hi svg{width:58%;height:58%;stroke:currentColor}
.u-hb{flex:1;display:flex;flex-direction:column;gap:.2em;min-width:0}.u-hb b{font-family:Montserrat,sans-serif;font-weight:800;font-size:1em;line-height:1.3}.u-hb p{margin:0;font-size:.94em;color:var(--g-sub)}
.u-hb a{margin-top:.35em;font-weight:700;font-size:.94em;color:var(--g-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.u-hs.info{background:var(--g-hs-i);border-color:var(--g-hs-ib)}.u-hs.info .u-hi{background:var(--g-hs-ii);color:var(--g-hs-if)}
.u-hs.ok{background:var(--g-hs-ok);border-color:#3FA34D}.u-hs.ok .u-hi{background:#3FA34D;color:#fff}
.u-hs.warn{background:var(--g-hs-wa);border-color:#FBB040}.u-hs.warn .u-hi{background:#FBB040;color:#2B2931}
.u-hs.err{background:var(--g-hs-er);border-color:#D9483B}.u-hs.err .u-hi{background:#D9483B;color:#fff}
/* b) Kasten im Text .u-hc: mk (Merke) · wi (Wichtig) · tp (Tipp) */
.u-hc{border-radius:12px;padding:1.3em 1.4em;display:flex;flex-direction:column;gap:.35em;font-size:clamp(15px,1.4vw,16px);line-height:1.5}
.u-hct{display:flex;align-items:center;gap:.55em;font-family:Montserrat,sans-serif;font-weight:800;font-size:.8em;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.3em}.u-hct .u-hi{flex:none;width:1.9em;height:1.9em;border-radius:50%;display:flex;align-items:center;justify-content:center}
.u-hc>b{font-family:Montserrat,sans-serif;font-weight:800;font-size:1.15em;line-height:1.25}.u-hc p{margin:0}
.u-hc.mk{background:var(--g-mk);color:#fff}.u-hc.mk p{color:#D8D5DC}.u-hc.mk .u-hct{color:var(--g-mkt)}.u-hc.mk .u-hi{background:#FBB040;color:#2B2931}
.u-hc.wi{background:#FBB040;color:#2B2931}.u-hc.wi p{color:#2B2931}.u-hc.wi .u-hi{background:#2B2931;color:#FBB040}
.u-hc.tp{background:var(--g-tp);border:1px solid var(--g-tpb);color:var(--g-ink)}.u-hc.tp p{color:var(--g-sub)}.u-hc.tp .u-hi{background:#FBB040;color:#2B2931}

/* Notizzettel (Kapitel Hinweis-Kästen). Text links, Zettel rechts, 2° nach rechts gekippt.
   Dunkel: Kasten UNEQ Blue, Zettel UNEQ Off-White. Hell: Kasten UNEQ Off-White, Zettel UNEQ Blue mit heller Schrift. */
.u-memo{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:clamp(24px,4vw,56px);align-items:center;border-radius:12px;padding:clamp(28px,4vw,48px);background:var(--g-alt);border:1px solid var(--g-frame);color:var(--g-ink)}@media(max-width:700px){.u-memo{grid-template-columns:1fr}}
.u-memo h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,2.6vw,32px);line-height:1.05}.u-memo>div>p{margin:12px 0 0;color:var(--g-sub);font-size:16px;line-height:1.6}.u-memo>div>p b{color:var(--g-ink)}
.u-pp{justify-self:end;width:100%;max-width:260px;padding:20px 22px 22px;border-radius:3px;background:var(--g-pp);color:var(--g-ppt);box-shadow:0 14px 30px rgba(0,0,0,.35);transform:rotate(2deg)}
.u-pp>b{display:block;font-family:Montserrat,sans-serif;font-weight:800;font-size:16px;margin-bottom:10px}
.u-pp ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.4;color:var(--g-pps)}.u-pp li{display:flex;gap:8px}.u-pp li:before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:#FBB040;margin-top:.5em}

/* Tabelle (Kapitel Tabellen) */
.u-tw{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;overflow-x:auto;-webkit-overflow-scrolling:touch;color:var(--g-ink)}
.u-tb{width:100%;border-collapse:collapse;font-family:Mulish,sans-serif;font-size:16px;font-variant-numeric:tabular-nums}
.u-tb th{font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;text-align:left;color:var(--g-th);padding:16px clamp(12px,1.5vw,18px) 12px;border-bottom:1px solid var(--g-line);white-space:nowrap;vertical-align:bottom}
.u-tb td{padding:14px clamp(12px,1.5vw,18px);vertical-align:middle;color:var(--g-ink)}
.u-tb tbody tr:nth-child(even) td{background:var(--g-alt)}
.u-tb tbody tr:hover td{background:var(--g-hov)}
.u-tb .r,.u-tb th.r{text-align:right}
.u-tb .ok,.u-tb .y{color:var(--g-ok);font-weight:800}.u-tb .no,.u-tb .n{color:var(--g-no);font-weight:800}
.u-tb tfoot td{border-top:1px solid var(--g-line);background:var(--g-alt)}

/* Tabelle: Status-Punkt .u-pl (g/o/r) immer mit Wort. Ja/Nein .u-sy (y/n) aus der Ampel. Falsch-Beispiel .u-tw.u-no */
.u-tw.u-no{border:3px solid var(--g-nob)}
.u-pl{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;white-space:nowrap}.u-pl:before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:currentColor}.u-pl.g:before{background:#3FA34D}.u-pl.o:before{background:#FBB040}.u-pl.r:before{background:#D9483B}
.u-sy{width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;font-style:normal}.u-sy svg{width:62%;height:62%;stroke:#fff}.u-sy.y{background:#3FA34D}.u-sy.n{background:#D9483B}
/* Vergleichstabelle .u-tb.cmp: Merkmale links fett, Werte mittig. Empfohlene Spalte .hi: Kopf dunkel mit oranger Linie und Label, Zellen zart orange (Dunkel: hellere Fläche). */
.u-tb.cmp td,.u-tb.cmp th{text-align:center}.u-tb.cmp td:first-child,.u-tb.cmp th:first-child{text-align:left;font-weight:700}
.u-tb.cmp th.hi{background:var(--g-cmph);color:#FFFFFF;border-radius:10px 10px 0 0;border-bottom-color:#FBB040;position:relative;padding-top:30px}.u-tb.cmp th.hi span{position:absolute;top:8px;left:50%;transform:translateX(-50%);font-size:10px;letter-spacing:.12em;background:#FBB040;color:#2B2931;border-radius:999px;padding:2px 8px}
.u-tb.cmp td.hi{background:var(--g-cmp1)}.u-tb.cmp tbody tr:nth-child(even) td.hi{background:var(--g-cmp2)}
/* Fläche für Beispiele auf einem Abschnitt: Weiß (.lt), Off-White (.o.lt), Dunkel (.o.dk). Titel .u-kt + Text .u-note in .u-sth */
.u-stage{border-radius:14px;padding:clamp(20px,3vw,40px);display:flex;flex-direction:column;gap:18px;background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink);min-width:0}.u-stage.o{background:var(--g-alt)}.u-sth .u-kt{margin:0 0 6px}
/* Handy-Rahmen für mobile Beispiele. Rahmen UNEQ Dark Blue 8 px, Ecken 28 px, Breite höchstens 320 px. */
.u-phones{display:grid;grid-template-columns:repeat(2,minmax(0,320px));gap:24px;justify-content:center}@container (max-width:700px){.u-phones{grid-template-columns:minmax(0,320px)}}
.u-phone{border:8px solid #1F1D24;border-radius:28px;background:var(--g-alt);color:var(--g-ink);padding:18px 14px;display:flex;flex-direction:column;gap:12px;min-height:480px;min-width:0;overflow:hidden}
.u-phone>h4{margin:0 0 2px;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--g-sub)}
.u-mc{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:10px;padding:14px 16px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:15px}.u-mc b{grid-column:1/-1;font-family:Montserrat,sans-serif;font-weight:800;font-size:16px;display:flex;justify-content:space-between;align-items:center}.u-mc span{color:var(--g-sub);font-size:13px}.u-mc em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums}
.u-phone .u-tw{border-radius:10px;min-width:0;max-width:100%;overflow-x:scroll;touch-action:pan-x pan-y;overscroll-behavior-x:contain}.u-phone .u-tb{font-size:14px;min-width:400px}.u-phone .u-tb.cmp th,.u-phone .u-tb.cmp td{padding-left:10px;padding-right:10px}
.u-phone .u-tb.cmp td:first-child,.u-phone .u-tb.cmp th:first-child{position:sticky;left:0;z-index:1;background:var(--g-surf);max-width:92px;min-width:92px;font-size:12px;line-height:1.3;white-space:normal;box-shadow:6px 0 8px -6px rgba(43,41,49,.18)}.u-phone .u-tb.cmp tbody tr:nth-child(even) td:first-child{background:var(--g-alt)}
.u-sc{font-size:12px;color:var(--g-sub);display:flex;align-items:center;gap:6px}

/* Kapitel Farben. Kleine Headline in Beispielen .u-k.s (22–32 px, hängt an der Spalte). Beispielfläche mit Abstand .u-pane.gp. Rahmen um Muster .u-box (8 px Ecken) mit .u-ok / .u-no.
   Muster in festen Farben (Farbfelder, Oberflächen, Cover) bleiben in Hell und Dunkel gleich. Auf Dunkel bekommen sie eine feine helle Kante (18 % Weiß), damit dunkle Felder nicht im Grund verschwinden. */
.u-k.s,.u-rule.s{font-size:clamp(22px,calc(var(--u-cw,100cqi) * .055),32px)}
.u-pane.gp{gap:14px;align-items:flex-start}.u-pane.gp>div:not([style*=absolute]){align-self:stretch}
.u-box{border-radius:8px;overflow:hidden;min-width:0}.u-box>.u-pane{border:0;border-radius:0;height:100%}
.u-gh{margin:0 0 8px;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--g-sub)}
.u-og{display:flex;flex-direction:column;gap:10px}.u-og>.u-gh{margin:6px 0 0}
.u-ovr{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:14px}
.u-ov{display:flex;flex-direction:column;gap:2px;min-width:0}.u-ov>i{display:block;height:84px;border-radius:8px;margin-bottom:8px;box-shadow:inset 0 0 0 1px var(--g-swb)}.u-ov>i.txt{font-style:normal;font-family:Mulish,sans-serif;line-height:1.5;padding:10px 12px;overflow:hidden}
.u-ov b{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--g-ink)}.u-ov code{font-size:13px;color:var(--g-sub)}.u-ov span{font-size:13px;color:var(--g-mute)}.u-ov em{font-style:normal;font-family:Montserrat,sans-serif;font-weight:700;font-size:12px;line-height:1.4;color:var(--g-ink);margin-top:4px}
.u-pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:16px}
.u-sw{background:var(--g-surf);border-radius:10px;overflow:hidden;border:1px solid var(--g-frame);display:flex;flex-direction:column;color:var(--g-ink)}.u-sw>i{display:block;height:110px}.u-sw>div{padding:14px 16px;display:flex;flex-direction:column;gap:4px}.u-sw b{font-family:Montserrat,sans-serif;font-weight:800;font-size:16px}.u-sw code{font-size:13px;color:var(--g-sub)}.u-sw p{margin:4px 0 0;font-size:14px;color:var(--g-sub)}
.u-share{display:flex;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--g-frame)}.u-share span{display:flex;align-items:flex-end;padding:8px 10px;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px}
.u-tb.ct td:first-child{font-weight:700}.u-tb.ct .s{box-shadow:inset 0 0 0 1px var(--g-swb);flex:none;margin-right:10px;vertical-align:middle;width:38px;height:24px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px}.u-tb.ct tr.x td{color:var(--g-mute)}.u-tb.ct tr.x td.n{color:var(--g-no)}.u-tb.ct tr.x .s{opacity:.85}.u-tb.ct s{text-decoration-color:#B3261E;text-decoration-thickness:2px}
.u-bars{display:flex;flex-direction:column;gap:12px;width:100%}.u-bars>div{display:grid;grid-template-columns:80px minmax(0,1fr) 44px;gap:12px;align-items:center;font-size:14px;font-weight:600}.u-bars i{display:block;height:16px;border-radius:4px}.u-bars em{font-style:normal;text-align:right}
.u-st{display:flex;flex-wrap:wrap;gap:8px}.u-st span{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;padding:6px 14px 6px 10px;border-radius:999px;background:var(--g-chip)}.u-st span:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--c)}
.u-apx{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:20px;align-items:stretch}@container (max-width:740px){.u-apx{grid-template-columns:1fr}}
.u-apc{border-radius:12px;overflow:hidden;background:#2B2931;display:flex;flex-direction:column;min-height:280px}.u-apl{flex:1;background:repeating-linear-gradient(135deg,transparent 0 13px,#FAB784 13px 14.5px)}.u-api{padding:18px 20px;display:flex;flex-direction:column;gap:2px;color:#fff;background:#2B2931}.u-api b{font-family:Montserrat,sans-serif;font-weight:900;font-size:22px}.u-api code{font-size:13px;color:#C9C5CF}.u-api span{font-size:13px;color:#B9B7BF}
.u-apc,.u-bl,.u-mock,.u-web2{outline:1px solid var(--g-swb);outline-offset:-1px}
.u-secs{display:flex;flex-direction:column;color:#2B2931}.u-secs>div{padding:22px 26px;font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;display:flex;justify-content:space-between;gap:12px}.u-secs>div span{font-family:Mulish,sans-serif;font-weight:600;font-size:13px;color:#6E6C75}
.u-secs>.sb{background:#2B2931;color:#fff}.u-secs>.sd{background:#1F1D24;color:#fff}.u-secs>.sb span,.u-secs>.sd span{color:#B9B7BF}.u-secs>.sw{background:#fff}.u-secs>.so{background:#F6F4F1}.u-secs>.mc3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 26px 22px}.u-secs>.mc3>div{padding:0;height:54px;background:#fff;border-radius:6px;border:1px solid #E8E3DD}
.u-bl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:12px;overflow:hidden}@container (max-width:800px){.u-bl{grid-template-columns:1fr}}.u-bl>div{padding:26px 22px;color:#fff;display:flex;flex-direction:column;gap:6px;min-height:260px}.u-bl .lv{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#B9B7BF}.u-bl b{font-family:Montserrat,sans-serif;font-weight:900;font-size:22px;line-height:1.1}.u-bl code{font-size:13px;color:#C9C5CF}.u-bl p{margin:10px 0 0;font-size:15px;line-height:1.55;color:#C9C5CF}.u-bl p b{font-family:inherit;font-weight:800;font-size:inherit;line-height:inherit;color:#fff}
.u-mock{border-radius:12px;overflow:hidden;background:#2B2931;color:#fff;display:grid;grid-template-columns:200px minmax(0,1fr);grid-template-rows:56px auto;font-size:14px}.u-mock .top{grid-column:2;grid-row:1;background:#1F1D24;border-bottom:1px solid #312F34;display:flex;align-items:center;justify-content:flex-end;padding:0 20px}.u-mock .top .s{background:#2B2931;border:1px solid #413F49;border-radius:6px;padding:6px 14px;color:#A39FA9;font-family:Mulish,sans-serif;font-weight:600;width:200px}
.u-mock .side{grid-column:1;grid-row:1/-1;background:#1F1D24;border-right:1px solid #312F34;padding:0 12px 16px;display:flex;flex-direction:column;gap:4px}.u-mock .side .sh{height:56px;box-sizing:border-box;margin:0 -12px 12px;padding:0 20px;display:flex;align-items:center;border-bottom:1px solid #312F34;border-radius:0;font-family:Montserrat,sans-serif;font-weight:800;color:#fff}.u-mock .side div{padding:10px 12px;border-radius:6px;color:#ECEAF0}.u-mock .side .on{background:#28262D}.u-mock .side .h{font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.14em;color:#A39FA9;padding:14px 12px 6px}.u-mock .main{padding:24px;display:flex;flex-direction:column;gap:16px}
.u-mock .card{background:#312F39;border:1px solid #413F49;border-radius:8px;overflow:hidden}.u-mock .ch{background:#35333E;padding:14px 18px;font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.14em;font-size:12px;border-bottom:1px solid #413F49}.u-mock .cb{padding:18px;display:flex;flex-direction:column;gap:8px}.u-mock label{color:#A39FA9;font-size:13px}.u-mock .in{background:#25232B;border:1px solid #45434D;border-radius:6px;height:40px}.u-mock .pill{align-self:flex-start;background:#3E4253;color:#85ADED;border-radius:999px;padding:4px 12px;font-weight:700;display:inline-flex;gap:6px;align-items:center}.u-mock .pill:before{content:"";width:9px;height:9px;border-radius:50%;background:#8AB4F7}.u-mock .top .an{display:none;font-family:Montserrat,sans-serif;font-weight:800}@container (max-width:560px){.u-mock{grid-template-columns:150px minmax(0,1fr)}.u-mock .top .s{width:auto}}@container (max-width:440px){.u-mock{grid-template-columns:1fr}.u-mock .side{display:none}.u-mock .top{grid-column:1;justify-content:space-between}.u-mock .top .an{display:block}}
.u-ann{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}@container (max-width:740px){.u-ann{grid-template-columns:1fr}}.u-ann>div{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:10px;padding:16px 18px;font-size:15px;color:var(--g-sub)}.u-ann b{font-family:Montserrat,sans-serif;font-weight:800;display:flex;align-items:center;gap:8px;margin-bottom:4px;color:var(--g-ink)}.u-ann i{width:16px;height:16px;border-radius:4px;display:inline-block;box-shadow:inset 0 0 0 1px var(--g-swb)}
.u-web2{border-radius:12px;overflow:hidden;color:#fff}.u-web2 .sec{background:#2B2931;padding:36px 32px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.u-web2 .sec h3{grid-column:1/-1;margin:0 0 6px;font-family:Montserrat,sans-serif;font-weight:900;font-size:28px;line-height:1.05}.u-web2 .o{color:#FBB040}.u-web2 .cd{background:#312F39;border-radius:8px;padding:18px;font-size:15px;color:#ECEAF0}.u-web2 .cd b{display:block;color:#fff;font-family:Montserrat,sans-serif;font-weight:800;margin-bottom:4px}.u-web2 .ft{background:#1F1D24;padding:22px 32px;font-size:14px;color:#B9B7BF;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}@container (max-width:640px){.u-web2 .sec{grid-template-columns:1fr}}
.u-cv{background:#2B2931;color:#fff;aspect-ratio:3/4;container-type:inline-size;position:relative}.u-cv .cvi{padding:9cqw 8cqw;height:100%;display:flex;flex-direction:column}.u-cv .n2{font-family:Montserrat,sans-serif;font-weight:900;font-size:42cqw;line-height:.8;color:#B89B5E;letter-spacing:-.03em}.u-cv .t{font-family:Montserrat,sans-serif;font-weight:900;text-transform:uppercase;font-size:9cqw;line-height:1.02;margin-top:5cqw}.u-cv .bar{align-self:flex-start;background:#B89B5E;color:#2B2931;font-family:Montserrat,sans-serif;font-weight:900;text-transform:uppercase;font-size:5.4cqw;padding:1.6cqw 3cqw;margin-top:4cqw}.u-cv .a{margin-top:auto;font-family:Montserrat,sans-serif;font-weight:700;font-size:4.6cqw;color:#B89B5E;letter-spacing:.04em;text-transform:uppercase}
.u-soc{background:#2B2931;color:#fff;aspect-ratio:1;container-type:inline-size;position:relative;overflow:hidden}.u-soc .soi{padding:9cqw;height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}.u-soc .n2{font-family:Montserrat,sans-serif;font-weight:900;font-size:34cqw;line-height:.85}.u-soc .t{font-family:Montserrat,sans-serif;font-weight:900;text-transform:uppercase;font-size:8cqw;line-height:1.05;margin-top:3cqw}.u-soc .lines{position:absolute;right:0;top:0;width:46%;height:52%;background-image:repeating-linear-gradient(135deg,#FAB784 0 1.5px,transparent 1.5px 14px);clip-path:polygon(15cqw 0,100% 0,100% 100%,0 100%,0 15cqw)}

/* Kapitel Logo und Marken. Logo-Fläche .u-lgs: .d = UNEQ Blue, .w = Weiß (feste Farben, wie das Logo dort steht). .fx feste Höhe 200 px (Weiß 150 px), Logobreite in cqw. .dl = 4:3 für DeepLeadership. Standard-Variante: .u-box.std mit oranger Kante 3 px. */
.u-box.std{outline:3px solid #FBB040;outline-offset:-1px}
.u-lgs{display:flex;align-items:center;justify-content:center;min-height:200px;padding:36px}.u-lgs img{max-width:100%;max-height:100%;display:block}.u-lgs.d{background:#2B2931}.u-lgs.w{background:#FFFFFF}
.u-lgs.fx{container-type:inline-size;height:200px;min-height:0;padding:24px}.u-lgs.fx.w{height:150px}.u-lgs.fx img{max-height:none}.u-lgs.dl{aspect-ratio:4/3;min-height:0;padding:0}.u-lgs.dl img{width:52%;max-height:none}
.u-lg{display:flex;flex-direction:column;gap:6px;color:var(--g-ink)}.u-lg b{font-family:Montserrat,sans-serif;font-weight:800;font-size:16px}.u-lg p{margin:0;font-size:14px;color:var(--g-sub)}.u-lg p b{color:var(--g-ink);font-weight:800;font-family:inherit;font-size:inherit}
.u-prio{align-self:flex-start;font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:#FBB040;color:#2B2931;padding:4px 10px;border-radius:999px;margin-bottom:4px}.u-prio.p2,.u-prio.p3{background:#E8E3DD}
.u-zone{--w:clamp(220px,30vw,330px);--z:calc(var(--w)*.1025);--m:calc(var(--w)*-.0158);position:relative;display:inline-block;padding:var(--z);outline:1.5px dashed #FBB040;background:repeating-linear-gradient(135deg,rgba(251,176,64,.10) 0 6px,transparent 6px 12px)}.u-zone img{display:block;width:var(--w);margin:var(--m);background:#2B2931;outline:calc(var(--w)*.0158) solid #2B2931}
.u-zone .uh{position:absolute;left:var(--z);top:var(--z);width:calc(var(--w)*.1017);height:var(--z);background:rgba(251,176,64,.45)}
:is(.u-zone,.u-bz) .av,:is(.u-zone,.u-bz) .ah{position:absolute;font-style:normal}:is(.u-zone,.u-bz) .av{width:0;border-left:1.5px solid #FBB040;margin-left:-.75px}:is(.u-zone,.u-bz) .av:before,:is(.u-zone,.u-bz) .av:after{content:"";position:absolute;left:-4.75px;border-left:4px solid transparent;border-right:4px solid transparent}:is(.u-zone,.u-bz) .av:before{top:0;border-bottom:6px solid #FBB040}:is(.u-zone,.u-bz) .av:after{bottom:0;border-top:6px solid #FBB040}
:is(.u-zone,.u-bz) .ah{height:0;border-top:1.5px solid #FBB040;margin-top:-.75px}:is(.u-zone,.u-bz) .ah:before,:is(.u-zone,.u-bz) .ah:after{content:"";position:absolute;top:-4.75px;border-top:4px solid transparent;border-bottom:4px solid transparent}:is(.u-zone,.u-bz) .ah:before{left:0;border-right:6px solid #FBB040}:is(.u-zone,.u-bz) .ah:after{right:0;border-left:6px solid #FBB040}
.u-sizes{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap}.u-sizes>div{display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-size:13px;color:#C9C5CF}
@keyframes u-spin{0%,30%{transform:rotate(0)}45%,80%{transform:rotate(180deg)}95%,100%{transform:rotate(360deg)}}.u-spin{animation:u-spin 6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.u-spin{animation:none}}
.u-wer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}@container (max-width:836px){.u-wer{grid-template-columns:1fr}}.u-wer>div{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:10px;padding:20px 22px;display:flex;flex-direction:column;gap:6px;color:var(--g-ink)}
.u-wer .wl{align-self:flex-start;font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:#2B2931;color:#fff;padding:4px 10px;border-radius:999px}.u-wer>div:nth-child(2) .wl{background:#FBB040;color:#2B2931}.u-wer b{font-family:Montserrat,sans-serif;font-weight:800;font-size:17px}.u-wer p{margin:0;font-size:15px;color:var(--g-sub)}.u-wer p b{font-family:inherit;font-size:inherit;color:var(--g-ink)}
.u-qel{position:relative;overflow:hidden;min-height:240px;padding:32px;display:flex;align-items:flex-end;background:#2B2931}.u-qel .q{position:absolute;left:-14%;top:-10%;height:130%;opacity:.1}.u-qel h3{position:relative;margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,2.6vw,32px);line-height:1.03;color:#fff}.u-qel h3 span{color:#FBB040}
.u-fav{display:flex;flex-direction:column;gap:12px;align-items:flex-start;color:var(--g-ink)}.u-fav img{width:96px;height:96px;display:block;border-radius:20%;box-shadow:0 0 0 1px var(--g-swb)}.u-fav b{font-family:Montserrat,sans-serif;font-weight:800;font-size:16px}.u-fav p{margin:0;font-size:14px;color:var(--g-sub)}
.u-tabs{background:#1F1D24;border-radius:10px;padding:10px 10px 0;display:flex;gap:6px;overflow:hidden;flex-wrap:wrap;outline:1px solid var(--g-swb);outline-offset:-1px}.u-tabs>.tb{display:flex;align-items:center;gap:10px;background:#2B2931;color:#ECEAF0;padding:10px 16px;border-radius:8px 8px 0 0;font-size:14px;min-width:0}.u-tabs>.tb img{width:18px;height:18px;flex:none}.u-tabs>.tb.on{background:#35333E;color:#fff}
.u-mat{display:grid;grid-template-columns:auto repeat(2,minmax(0,1fr));background:var(--g-surf);border:1px solid var(--g-frame);border-radius:10px;overflow:hidden;color:var(--g-ink)}.u-mat>div{padding:16px 18px;border-bottom:1px solid var(--g-hov);border-right:1px solid var(--g-hov);display:flex;align-items:center;gap:12px;font-size:15px}.u-mat small{font-family:Mulish,sans-serif;font-weight:600;letter-spacing:0;text-transform:none;color:var(--g-mute);font-size:12px}.u-mat .h{flex-direction:column;align-items:flex-start;gap:2px;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;background:var(--g-alt)}.u-mat img{width:40px;height:40px;border-radius:20%;box-shadow:0 0 0 1px var(--g-swb)}
/* Verweis-Kasten: dunkle Fläche, Headline und Text links, Button rechts (Kapitel Hinweis-Kästen) */
.u-link{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#2B2931;color:#fff;border-radius:12px;padding:28px 32px;flex-wrap:wrap;outline:1px solid var(--g-swb);outline-offset:-1px}.u-link h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:24px}.u-link p{margin:6px 0 0;color:#C9C5CF;font-size:15px}
.u-link .sbl{display:flex;flex-wrap:wrap;align-items:center;gap:20px 40px;margin-top:22px}.u-link .sbl img{height:40px;display:block}.u-link .sbl span{font-family:Montserrat,sans-serif;font-weight:800;font-size:20px;color:#fff}

/* Kapitel Abstände, Raster, Ecken */
.u-tb.sm{font-size:14px}.u-tb.k1 td:first-child{font-weight:800;white-space:nowrap}.u-tb code{font-size:12px;color:var(--g-ink)}
.u-scl{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:8px 20px;color:var(--g-ink)}
.u-scl .sr{display:grid;grid-template-columns:48px 120px 150px minmax(0,1fr);gap:16px;align-items:center;padding:12px 0}.u-scl .sr+.sr{border-top:1px solid var(--g-frame)}@container (max-width:640px){.u-scl .sr{grid-template-columns:40px 100px minmax(0,1fr)}.u-scl .su{grid-column:2/-1}}
.u-scl .sr b{font-family:Montserrat,sans-serif;font-weight:800}.u-scl .sb i{display:block;height:20px;background:#FBB040;border-radius:2px}.u-scl .sv{font-size:15px;font-weight:700}.u-scl .sv em{display:block;font-style:normal;font-weight:400;font-size:13px;color:var(--g-mute)}.u-scl .su{font-size:14px;color:var(--g-sub)}
/* Rhythmus-Muster: Abschnitt mit sichtbaren Abständen (orange Streifen .u-gp mit Nummer) */
.u-sx{border-radius:12px;padding:0 clamp(20px,3vw,40px);display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink);min-width:0}.u-sx.dk{background:var(--g-alt)}
.u-sxi{display:flex;flex-direction:column;align-items:center;font-size:clamp(26px,3vw,34px);align-self:stretch}.u-sxi>h3,.u-sxi>p{max-width:420px}.u-sxi>.u-eb{margin:0}
.u-sxi h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:1em;line-height:1.03}.u-sxi p{margin:0;font-size:17px;line-height:1.6;color:var(--g-sub)}.u-sxi .zx{font-size:14px;color:var(--g-mute)}
.u-gp{align-self:stretch;position:relative;background:repeating-linear-gradient(135deg,rgba(251,176,64,.22) 0 4px,rgba(251,176,64,.1) 4px 8px);display:flex;align-items:center;justify-content:center;min-height:4px}
.u-gp span{position:absolute;left:4px;top:50%;transform:translateY(-50%);width:16px;height:16px;border-radius:50%;background:#FBB040;color:#2B2931;font-family:Mulish,sans-serif;font-size:10px;font-weight:800;line-height:16px;text-align:center;z-index:1}
.u-lg2{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:8px 20px;font-size:14px;color:var(--g-sub)}.u-lg2 li{display:flex;gap:10px;align-items:center}.u-lg2 i{flex:none;width:18px;height:18px;border-radius:50%;background:#FBB040;color:#2B2931;font-style:normal;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
/* Raster-Muster: 12 Spalten, Abstand wie Kartenabstand */
.u-grd{position:relative;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:24px clamp(16px,4vw,48px)}
.u-grd .gc{position:absolute;inset:0 clamp(16px,4vw,48px);display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2.4vw,28px);pointer-events:none}.u-grd .gc i{background:rgba(251,176,64,.14);border-left:1px solid rgba(251,176,64,.5);border-right:1px solid rgba(251,176,64,.5)}
.u-grd .gl{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.u-grd .gl>div{background:#2B2931;color:#fff;border-radius:10px;padding:16px;font-size:13px;font-weight:700;min-height:90px;display:flex;align-items:flex-end;box-shadow:inset 0 0 0 1px var(--g-swb)}.u-grd .gl>div.lt2{background:#F6F4F1;color:#2B2931;border:1px solid #E8E3DD}
.u-grd .s6{grid-column:span 6}.u-grd .s4{grid-column:span 4}.u-grd .s8{grid-column:3 / span 8}.u-grd .s12{grid-column:span 12}@container (max-width:640px){.u-grd .s6,.u-grd .s4,.u-grd .s8{grid-column:span 12}}
/* Ecken-Muster */
.u-rds{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:16px}.u-rd{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:6px;color:var(--g-ink)}.u-rd i{display:block;height:64px;background:#2B2931;margin-bottom:8px;box-shadow:inset 0 0 0 1px var(--g-swb)}.u-rd b{font-family:Montserrat,sans-serif;font-weight:800}.u-rd span{font-size:13px;color:var(--g-sub)}
.u-rd .r3{border-radius:3px}.u-rd .r8{border-radius:8px}.u-rd .r12{border-radius:12px}.u-rd .r14{border-radius:14px}.u-rd .rp{border-radius:999px;height:44px;margin-top:10px;margin-bottom:18px}.u-rd .rc{border-radius:50%;width:64px}
.u-nest{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}@container (max-width:640px){.u-nest{grid-template-columns:1fr}}.u-nest .u-cap{margin-top:8px}.u-nest .ok2,.u-nest .no2{background:#2B2931;padding:12px;display:flex;border-radius:14px;box-shadow:inset 0 0 0 1px var(--g-swb)}.u-nest .ok2 div,.u-nest .no2 div{flex:1;height:80px;background:#FBB040}.u-nest .ok2 div{border-radius:2px}.u-nest .no2 div{border-radius:14px}
.u-mh{font-family:Montserrat,sans-serif;font-weight:900;font-size:20px;line-height:1.05}.u-mp{font-size:13px;color:var(--g-sub)}.u-mb{align-self:flex-start;height:30px;padding:0 14px;border-radius:999px;background:#FBB040;color:#2B2931;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;display:flex;align-items:center}

/* Kapitel Linienfeature. Fläche .u-lf (Linien UNEQ Apricot, Linie : Zwischenraum = 1 : 12, Abstand --p, Standard 16 px). Wird im Kapitel per Skript als SVG gezeichnet.
   Kachel .u-lft in festen Farben: .d UNEQ Blue, .o Off-White, .w Weiß. .L = Layout-Beispiel mit Text .tx. */
.u-lf{--p:16px;--s:calc(var(--p) / 13);position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 calc(var(--p) - var(--s)),#FAB784 calc(var(--p) - var(--s)) var(--p))}
.u-lft{position:relative;overflow:hidden;border-radius:10px;height:200px;border:3px solid var(--g-okb);min-width:0}.u-lft.u-no{border:3px solid var(--g-nob)}.u-lft.d{background:#2B2931}.u-lft.o{background:#F6F4F1}.u-lft.w{background:#FFFFFF}
.u-lft .sh2{position:absolute;left:14%;right:14%;top:50%;height:120px;margin-top:-60px}.u-lft .sh2.sq{left:50%;right:auto;width:120px;margin-left:-60px}.u-lft .sh2 .u-lf{position:absolute}
.u-lft.L{height:280px}.u-lft .tx{position:absolute;left:clamp(24px,4vw,44px);top:50%;transform:translateY(-50%);max-width:46%;z-index:2}.u-lft.L h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,2.6vw,32px);line-height:1.03;color:#fff}.u-lft.L.o h3{color:#2B2931}.u-lft.L h3 .o{color:#FBB040}.u-lft.L h3 .mk{background:linear-gradient(#FBB040,#FBB040) 0 88%/100% .34em no-repeat}.u-lft.L p{margin:10px 0 0;font-size:15px;color:#C9C5CF}.u-lft.L.o p{color:#45434C}
.u-lft .ph{position:absolute;background:#7A746C url(../assets/photo-gespraech.jpg) center/cover}
.u-lft .zc{position:absolute;z-index:2;width:44px;height:44px;border:2px solid #B3261E;border-radius:50%;pointer-events:none}
.u-lft .zoom{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.u-lft .zoom i{position:absolute;width:44px;height:44px;border:2px solid #B3261E;border-radius:50%;top:calc(50% - 82px);left:calc(14% - 22px)}
.u-story{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);background:#2B2931;color:#fff;border-radius:12px;padding:clamp(28px,4vw,44px);align-items:center;position:relative;overflow:hidden;outline:1px solid var(--g-swb);outline-offset:-1px}.u-story>div:first-child{position:relative;z-index:1}
.u-story h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,2.8vw,34px);line-height:1.03}.u-story h3 span{color:#FBB040}.u-story p{margin:14px 0 0;color:#ECEAF0;font-size:16px;line-height:1.6}.u-story p b{color:#fff}
.u-story .sv{position:absolute;top:clamp(28px,4vw,44px);right:0;bottom:0;width:40%}.u-story .sv .u-lf{position:absolute;inset:0}
@container (max-width:740px){.u-story{grid-template-columns:1fr}.u-story .sv{position:relative;width:auto;height:180px;margin:0 calc(-1*clamp(28px,4vw,44px)) calc(-1*clamp(28px,4vw,44px))}}
.u-ratio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(24px,4vw,48px);align-items:center;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:clamp(24px,3vw,36px);color:var(--g-ink)}@container (max-width:740px){.u-ratio{grid-template-columns:1fr}}
.u-ratio .rv{position:relative;height:220px;background:#2B2931;border-radius:8px;overflow:hidden}.u-ratio .rv span{position:absolute;font-family:Montserrat,sans-serif;font-weight:900;font-size:14px;color:#2B2931;background:#FBB040;border-radius:999px;padding:2px 9px}.u-ratio .m1{left:46%;top:44%}.u-ratio .m2{left:18%;top:62%}
.u-ratio .big{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(56px,8vw,96px);line-height:.9;letter-spacing:-.02em}.u-ratio p{margin:14px 0 0;color:var(--g-sub);font-size:16px;line-height:1.6;max-width:56ch}.u-ratio p b{color:var(--g-ink)}
.u-rg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}@container (max-width:836px){.u-rg{grid-template-columns:1fr}}.u-rg figure{margin:0;display:flex;flex-direction:column;gap:10px}.u-rg img{width:100%;aspect-ratio:2296/1624;object-fit:cover;border-radius:8px;display:block;box-shadow:0 1px 2px rgba(0,0,0,.08),0 8px 24px rgba(43,41,49,.12)}.u-rg figcaption{font-size:14px;line-height:1.55;color:var(--g-sub)}.u-rg figcaption b{color:var(--g-ink);font-family:Montserrat,sans-serif;font-weight:800}

/* Kapitel Icons. Icon .u-ic (Feather, Strich 1,5 im 24er Raster = 1/16), Größe über font-size. Icon im Kreis .u-cc: Kreis 2 em, Icon 55 %.
   Kachel .u-ict in festen Farben: .d UNEQ Blue mit weißem Icon, .w Weiß mit UNEQ Blue. */
.u-ic{width:1em;height:1em;display:block;flex:none}
.u-cc{width:2em;height:2em;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;font-size:28px}.u-cc .u-ic{width:55%;height:55%;font-size:inherit}
.u-ict{position:relative;overflow:hidden;border-radius:10px;min-height:170px;border:3px solid var(--g-okb);display:flex;align-items:center;justify-content:center;gap:22px;padding:24px;flex-wrap:wrap;min-width:0}.u-ict.u-no{border:3px solid var(--g-nob)}.u-ict .u-ic{font-size:36px}.u-g.g4 .u-ict{gap:14px;padding:20px 12px;flex-wrap:nowrap}
.u-ict.d,.u-set.d,.u-inl.d,.u-feat{background:#2B2931;color:#fff}.u-ict.w,.u-set.w,.u-inl.w{background:#fff;color:#2B2931}
.u-set{display:grid;grid-template-columns:repeat(6,1fr);gap:26px 0;padding:32px 24px;border-radius:10px;justify-items:center;min-width:0}.u-set .u-ic{font-size:30px}.u-set.w{border:1px solid #E8E3DD}.u-set.d,.u-ict.d,.u-inl.d,.u-feat{outline:1px solid var(--g-swb);outline-offset:-1px}.u-ict.d.u-no,.u-ict.d{outline:0}
.u-sz{display:flex;align-items:flex-end;gap:clamp(20px,4vw,48px);flex-wrap:wrap;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:10px;padding:28px 28px 22px;color:var(--g-ink)}.u-sz>div{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:13px;color:var(--g-sub)}.u-sz b{font-family:Montserrat,sans-serif;font-weight:800;color:var(--g-ink)}
.u-inl{display:flex;flex-direction:column;gap:14px;align-items:flex-start;padding:24px;border-radius:10px;min-width:0}.u-inl p{margin:0;display:flex;align-items:center;gap:.5em;font-weight:700}.u-inl p .u-ic{width:1.25em;height:1.25em}.u-btn .u-ic{stroke-width:2}
.u-feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:clamp(28px,4vw,48px);border-radius:10px}@container (max-width:740px){.u-feat{grid-template-columns:1fr}}.u-feat>div{display:flex;flex-direction:column;gap:10px}.u-feat b{font-family:Montserrat,sans-serif;font-weight:800;font-size:18px}.u-feat p{margin:0;font-size:15px;color:#C9C5CF}
.u-stat{display:flex;flex-direction:column;gap:10px;width:100%;max-width:340px}.u-stat>span{display:flex;align-items:center;gap:12px;font-weight:700;font-size:15px}.u-stat .u-cc{font-size:15px}

/* Kapitel Bilder und Video. Bildfläche .u-im (Foto füllt, Ecken 10 px), Zeitangabe .tc. Ruhiger Play-Button .u-play.static (nur Falsch-Beispiele). */
.u-im{position:relative;overflow:hidden;border-radius:10px;border:3px solid var(--g-okb);background:#2B2931;min-width:0}.u-im>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.u-im.u-no{border:3px solid var(--g-nob)}
.u-im .tc{position:absolute;right:12px;bottom:12px;background:rgba(31,29,36,.85);color:#fff;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;padding:3px 8px;border-radius:4px;z-index:2}
.u-play.static:before,.u-play.static:after{display:none}
.u-fmt{display:grid;grid-template-columns:2.2fr 1fr 1.25fr 0.9fr;gap:16px;align-items:end}@container (max-width:740px){.u-fmt{grid-template-columns:repeat(2,minmax(0,1fr))}}.u-fmt figure{margin:0;display:flex;flex-direction:column;gap:8px;min-width:0}.u-fmt figcaption{font-size:13px;color:var(--g-sub)}.u-fmt figcaption b{font-family:Montserrat,sans-serif;font-weight:800;color:var(--g-ink);margin-right:6px}
.u-anat{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;align-items:center;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:clamp(20px,3vw,32px)}@container (max-width:740px){.u-anat{grid-template-columns:1fr}}
.u-anat .big{position:relative;aspect-ratio:1;max-width:280px;margin:0 auto;width:100%;display:flex;align-items:center;justify-content:center;background:#2B2931;border-radius:10px}.u-anat .big .u-play{--d:46%}
.u-anat ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}.u-anat li{display:flex;gap:12px;font-size:15px;color:var(--g-sub)}.u-anat li b{font-family:Montserrat,sans-serif;font-weight:800;color:var(--g-ink);min-width:118px}
/* Abschnitt mit Video daneben, immer dunkel (.dk): Eyebrow orange, Akzent orange */
.u-vsec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,56px);align-items:center;background:#2B2931;color:#fff;border-radius:12px;padding:clamp(28px,4vw,56px);outline:1px solid var(--g-swb);outline-offset:-1px}@container (max-width:740px){.u-vsec{grid-template-columns:1fr}}
.u-vsec h3{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(26px,3vw,36px);line-height:1.03;margin:0 0 14px}.u-vsec h3 em{font-style:normal;color:#FBB040}.u-vsec p{margin:0;color:#D8D5DC;font-size:17px}.u-vsec .u-im{border:0}

/* Schaufenster-Abschnitt (Startseite): Abschnitt wie auf der Website, Text links, Bild oder Linienfeature rechts.
   Headline-Größe hängt an der Inhaltsbreite: 5,6 % (30–60 px), Eyebrow 0,3 × Headline. Fläche Weiß / UNEQ Light Blue, .o = Off-White / UNEQ Blue, .pl = ohne Fläche.
   .c = zentriert, eine Spalte. .vis = Linienfeature rechts randabfallend, oben und unten mit Innenabstand (nie in runde Ecken, nie über Text). .pic = Foto, Linienfeature ragt hinein (unter einem Drittel). */
.u-show{position:relative;overflow:hidden;border-radius:14px;background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink);padding:clamp(32px,6cqi,72px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,5cqi,64px);align-items:center}
.u-show.o{background:var(--g-alt)}.u-show.pl{background:none;border:0;padding-left:0;padding-right:0;overflow:visible}
.u-show .tx{font-size:clamp(30px,5.6cqi,60px);position:relative;z-index:1;min-width:0}.u-show .tx .u-tx{max-width:40ch}
.u-show.c{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}.u-show.c .tx{display:flex;flex-direction:column;align-items:center;max-width:860px}.u-show.c .u-tx{margin-left:auto;margin-right:auto}.u-show.c>.u-g{width:100%;text-align:left}
.u-show.hero{min-height:clamp(320px,42cqi,480px)}
.u-show .vis{position:absolute;right:0;top:clamp(32px,6cqi,72px);bottom:clamp(32px,6cqi,72px);width:34%}.u-show .vis .u-lf{position:absolute;inset:0}
.u-show .pic{position:relative;min-width:0}.u-show .pic img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}.u-show .pic .u-lf{inset:auto;left:-6%;bottom:-9%;width:34%;aspect-ratio:1;z-index:1}
.u-show .u-share{height:clamp(160px,22cqi,240px)}
@container (max-width:700px){.u-show{grid-template-columns:minmax(0,1fr)}.u-show.hero{min-height:0}.u-show .vis{position:relative;top:auto;bottom:auto;right:auto;width:auto;height:120px;margin-right:calc(-1 * clamp(32px,6cqi,72px))}.u-show .pic .u-lf{left:-4%}}
/* Kapitel-Karte als Link (.u-go): Icon im orangen Kreis, Titel, eine Zeile, „Zum Kapitel“. Hover 3 px nach oben, Schatten, 0,2 s. */
.u-go{display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:12px;background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink);text-decoration:none;transition:transform .2s,box-shadow .2s;min-width:0}
.u-go:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(43,41,49,.18),0 1px 3px rgba(43,41,49,.14)}.un-dk .u-go:hover{box-shadow:0 12px 28px rgba(0,0,0,.4)}.u-go:focus-visible{outline:2px solid #FBB040;outline-offset:2px}
.u-go .u-cc{background:#FBB040;color:#2B2931;font-size:22px;margin-bottom:6px}.u-go b{font-family:Montserrat,sans-serif;font-weight:800;font-size:18px;line-height:1.2}.u-go>span{font-size:15px;line-height:1.5;color:var(--g-sub)}
.u-go em{margin-top:auto;padding-top:8px;font-style:normal;font-family:Montserrat,sans-serif;font-weight:800;font-size:14px;display:flex;gap:6px;align-items:center}.u-go em svg{width:16px;height:16px;transition:transform .2s}.u-go:hover em svg{transform:translateX(3px)}

/* Badge im Video vergrößert (.u-bz): Ausschnitt unten rechts, dreifach. Maßpfeile .av / .ah wie bei der Schutzzone, Wert .ml. */
.u-bz{position:relative;overflow:hidden;border-radius:10px;aspect-ratio:4/3;border:3px solid var(--g-okb);background:#2B2931;min-width:0}.u-bz.u-no{border:3px solid var(--g-nob)}
.u-bz>img{position:absolute;right:0;bottom:0;width:300%;max-width:none;aspect-ratio:16/9;object-fit:cover}
.u-bz .tc{position:absolute;right:36px;bottom:36px;background:rgba(31,29,36,.85);color:#fff;font-family:Montserrat,sans-serif;font-weight:800;font-size:36px;line-height:1.2;padding:9px 24px;border-radius:12px;white-space:nowrap}
.u-bz .ml{position:absolute;font-family:Mulish,sans-serif;font-size:12px;font-weight:800;background:#FBB040;color:#2B2931;padding:1px 7px;border-radius:999px;white-space:nowrap}

/* Karten zentriert (.u-gos): feste Kartenbreite 260 px, Reihe mittig, Kartenabstand 24 px. Text in der Karte zentriert. .off = Bereich noch in Arbeit (nicht klickbar, gedämpft). */
.u-gos{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;width:100%}.u-gos>.u-go{flex:0 1 260px;align-items:center;text-align:center}.u-gos .u-go em{justify-content:center}
.u-go.off{cursor:default}.u-go.off:hover{transform:none;box-shadow:none}.u-go.off .u-cc{background:var(--g-hov);color:var(--g-sub)}.u-go.off em{color:var(--g-mute);font-weight:700}

/* kx:bl start · Kapitel Buttons und Links. Muster nur für dieses Kapitel, gelten unter .kx-bl. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-bl .t{border-radius:10px;min-height:150px;border:3px solid var(--g-okb);display:flex;align-items:center;justify-content:center;gap:14px;padding:28px 20px;flex-wrap:wrap}
.kx-bl .bad{border:3px solid var(--g-nob)}
.kx-bl .dk{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-bl .w{background:var(--g-surf);color:var(--g-ink)}
.kx-bl .ow{background:var(--g-alt)}
.kx-bl .ic{width:1.15em;height:1.15em;flex:none;display:block}
.kx-bl .lvl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@container (max-width:736px){.kx-bl .lvl{grid-template-columns:1fr}
}.kx-bl .lvl>div{display:flex;flex-direction:column;gap:12px}
.kx-bl .lvl .t{min-height:130px;padding-inline:12px}
.kx-bl .lvl h3{margin:0;font-family:Montserrat,sans-serif;font-weight:800;font-size:17px}
.kx-bl .lvl p{margin:0;font-size:14px;color:var(--g-sub)}
.kx-bl .lvl p b{color:var(--g-ink)}
.kx-bl .pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@container (max-width:736px){.kx-bl .pair{grid-template-columns:1fr}
}.kx-bl .zs .pair{grid-template-columns:1fr}
.kx-bl .st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%}
.kx-bl .st>div{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
.kx-bl .txt{border-radius:10px;padding:clamp(24px,3vw,36px);font-size:17px;line-height:1.6;max-width:none}
.kx-bl .txt p{margin:0}
.kx-bl .txt a.u-lk{color:inherit;font-weight:700;text-decoration:none;background:linear-gradient(#FBB040,#FBB040) 0 100%/100% 2px no-repeat;padding-bottom:1px}
.kx-bl .txt a.u-lk:hover{background-size:100% 100%;color:var(--g-ink)}
.kx-bl .txt.dk a.u-lk{color:#FBB040;background:linear-gradient(#FBB040,#FBB040) 0 100%/100% 1px no-repeat}
.kx-bl .txt.dk a.u-lk:hover{color:#2B2931;background-size:100% 100%}
.kx-bl .ctx{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;background:#2B2931;color:#fff;border-radius:12px;padding:clamp(28px,4vw,56px);outline:1px solid var(--g-swb);outline-offset:-1px}
@container (max-width:736px){.kx-bl .ctx{grid-template-columns:1fr}
}.kx-bl .ctx h3{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(26px,3vw,36px);line-height:1.03;margin:12px 0 14px}
.kx-bl .ctx h3 em{font-style:normal;color:#FBB040}
.kx-bl .ctx p{margin:0;color:#D8D5DC;font-size:17px}
.kx-bl .ctx .u-cta{margin-top:max(28px,2em)}
.kx-bl .ctx .ebx{font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:12px;display:flex;gap:.6em}
.kx-bl .ctx .ebx span{color:#FBB040;letter-spacing:0}
.kx-bl .ctx .im{aspect-ratio:4/3;border-radius:10px;background:#7A746C url(../assets/photo-gespraech.jpg) 45% 25%/cover}
/* kx:bl end */

/* kx:hw start · Kapitel Hinweis-Kästen. Muster nur für dieses Kapitel, gelten unter .kx-hw. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-hw .duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@container (max-width:796px){.kx-hw .duo{grid-template-columns:1fr}
}.kx-hw .pane{border-radius:12px;padding:clamp(18px,2.6vw,28px);display:flex;flex-direction:column;gap:14px}
.kx-hw .pane.lt{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-hw .pane.dk{background:#2B2931;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-hw .pl{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-sub)}
.kx-hw .dk .pl{color:#B9B6C0}
.kx-hw .hl{margin-top:.35em;font-weight:700;font-size:.94em;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.kx-hw .dk .u-hs .hl{color:#fff}
.kx-hw .nz{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:center;border-radius:12px;padding:clamp(24px,3.4vw,44px)}
@container (max-width:696px){.kx-hw .nz{grid-template-columns:1fr}
}.kx-hw .nz.dkb{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-hw .nz.ltb{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-hw .nz h3{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(22px,2.4vw,28px);line-height:1.04;margin:0 0 .5em}
.kx-hw .nz.dkb p{color:#D8D5DC;margin:0}
.kx-hw .nz.ltb p{color:var(--g-sub);margin:0}
.kx-hw .zt{background:var(--g-surf);color:var(--g-ink);border-radius:6px;padding:1.2em 1.3em;box-shadow:0 10px 30px rgba(0,0,0,.22),0 2px 6px rgba(0,0,0,.12);font-size:15px;display:flex;flex-direction:column;gap:.5em}
.kx-hw .nz.ltb .zt{background:var(--g-alt);box-shadow:0 8px 24px rgba(43,41,49,.12),0 1px 3px rgba(43,41,49,.1)}
.kx-hw .zt .zh{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:flex;gap:.5em}
.kx-hw .zt .zh span{color:#FBB040;letter-spacing:0}
.kx-hw .zt ul{margin:0;padding-left:1.1em;color:var(--g-sub)}
.kx-hw .zt li+li{margin-top:.3em}
.kx-hw .ctx{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@container (max-width:796px){.kx-hw .ctx{grid-template-columns:1fr}
}.kx-hw .pgx{border-radius:12px;overflow:hidden;border:1px solid var(--g-frame);background:var(--g-surf);display:flex;flex-direction:column}
.kx-hw .pgx .bar{height:56px;background:#1F1D24;display:flex;align-items:center;padding:0 18px}
.kx-hw .pgx .bar img{height:24px}
.kx-hw .pgx .bd{padding:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:16px}
.kx-hw .pgx h3{font-family:Montserrat,sans-serif;font-weight:900;font-size:24px;line-height:1.05;margin:0}
.kx-hw .pgx p{margin:0;color:var(--g-sub)}
.kx-hw .rows{border:1px solid var(--g-frame);border-radius:12px;overflow:hidden}
.kx-hw .rows div{display:flex;justify-content:space-between;padding:12px 16px;font-size:15px;color:var(--g-sub)}
.kx-hw .rows div+div{border-top:1px solid var(--g-frame)}
.kx-hw .rows b{color:var(--g-ink)}
.kx-hw .btn{align-self:flex-start;display:inline-flex;align-items:center;height:48px;padding:0 24px;border-radius:999px;background:#FBB040;color:#2B2931;font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;text-decoration:none}
.kx-hw .btn:hover{background:#FFC466;color:#2B2931}
.kx-hw .ondk{background:#1F1D24;border-radius:12px;padding:clamp(18px,3vw,40px);display:flex;flex-direction:column;gap:14px;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-hw .ondk .pl{color:#B9B6C0}
.kx-hw .bad{border:3px solid var(--g-nob);border-radius:12px;padding:16px;background:var(--g-surf);display:flex;flex-direction:column;gap:10px}
.kx-hw .art{border-radius:12px;padding:clamp(24px,4vw,56px) clamp(20px,6vw,96px);display:flex;flex-direction:column;gap:18px}
.kx-hw .art>*{max-width:68ch}
.kx-hw .art.lt{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-hw .art.dk{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-hw .art h3{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,2.8vw,32px);line-height:1.05;margin:0}
.kx-hw .art>p{margin:0;font-size:17px;line-height:1.65;color:var(--g-sub)}
.kx-hw .art.dk>p{color:#D8D5DC}
.kx-hw .eb2{font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:12px;display:flex;gap:.6em;margin-bottom:-8px}
.kx-hw .eb2 span{color:#FBB040;letter-spacing:0}
.kx-hw .art .u-hc{margin:8px 0}
.kx-hw .u-memo.lm.lm2{background:var(--g-alt)}
.kx-hw .u-memo.lm.lm2 .u-pp{background:#2B2931;color:#fff;box-shadow:0 14px 30px rgba(0,0,0,.35)}
.kx-hw .u-memo.lm.lm2 .u-pp ul{color:#D8D5DC}
/* kx:hw end */

/* kx:kz start · Kapitel Karten und Zitate. Muster nur für dieses Kapitel, gelten unter .kx-kz. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-kz .stage{border-radius:12px;padding:clamp(20px,3.4vw,44px);display:flex;flex-direction:column;gap:14px}
.kx-kz .stage.dk{background:#2B2931;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-kz .stage.lt{background:var(--g-alt);border:1px solid var(--g-frame)}
.kx-kz .stage.wh{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-kz .pl{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-sub)}
.kx-kz .dk .pl{color:#B9B6C0}
.kx-kz .row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
@container (max-width:796px){.kx-kz .row3{grid-template-columns:1fr}
}.kx-kz .kc{display:flex;flex-direction:column;gap:.5em;padding:1.6em;border-radius:14px;text-decoration:none;transition:transform .2s,box-shadow .2s}
.kx-kz .kc:hover{transform:translateY(-3px)}
.kx-kz .ki{width:2.75em;height:2.75em;border-radius:50%;background:#FBB040;color:#2B2931;display:flex;align-items:center;justify-content:center;margin-bottom:.4em}
.kx-kz .ki svg{width:50%;height:50%}
.kx-kz .kc b{font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(18px,1.8vw,20px);line-height:1.2}
.kx-kz .kc p{margin:0;font-size:15px}
.kx-kz .km{margin-top:auto;padding-top:.8em;display:flex;align-items:center;gap:.4em;font-weight:700;font-size:15px}
.kx-kz .km svg{width:1em;height:1em;transition:transform .2s}
.kx-kz .kc:hover .km svg{transform:translateX(3px)}
.kx-kz .dk .kc{background:#312F39;color:#fff}
.kx-kz .dk .kc p{color:#D8D5DC}
.kx-kz .dk .kc .km{color:#FBB040}
.kx-kz .dk .kc:hover{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.kx-kz .lt .kc{background:var(--g-surf);color:var(--g-ink)}
.kx-kz .lt .kc p{color:var(--g-sub)}
.kx-kz .lt .kc:hover{box-shadow:0 12px 28px rgba(43,41,49,.12)}
.kx-kz .wh .kc{background:var(--g-surf);color:var(--g-ink);border:1px solid var(--g-frame)}
.kx-kz .wh .kc p{color:var(--g-sub)}
.kx-kz .wh .kc:hover{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-kz .lt .km,.kx-kz .wh .km{color:var(--g-ink);text-decoration:underline;text-decoration-color:#FBB040;text-decoration-thickness:2px;text-underline-offset:4px}
.kx-kz .kb{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s}
.kx-kz .kb:hover{transform:translateY(-3px)}
.kx-kz .kbi{aspect-ratio:16/10;position:relative;overflow:hidden}
.kx-kz .kbi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.kx-kz .kb:hover .kbi img{transform:scale(1.04)}
.kx-kz .kbt{padding:1.2em 1.4em 1.4em;display:flex;flex-direction:column;gap:.4em}
.kx-kz .kbt b{font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(17px,1.7vw,19px);line-height:1.25}
.kx-kz .kmeta{font-size:14px}
.kx-kz .eb3{font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.16em;text-transform:uppercase;font-size:11px;display:flex;gap:.6em}
.kx-kz .eb3 span{color:#FBB040;letter-spacing:0}
.kx-kz .dk .kb{background:#312F39;color:#fff}
.kx-kz .dk .kmeta{color:#B9B6C0}
.kx-kz .dk .kb:hover{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.kx-kz .wh .kb{background:var(--g-surf);color:var(--g-ink);border:1px solid var(--g-frame)}
.kx-kz .wh .kmeta{color:var(--g-mute)}
.kx-kz .wh .kb:hover{box-shadow:0 12px 28px rgba(43,41,49,.1)}
.kx-kz .qt{margin:0;display:flex;flex-direction:column;gap:1.2em;max-width:820px}
.kx-kz .ql{width:2em;height:.18em;min-height:3px;background:#FBB040;font-size:clamp(24px,3.2vw,36px)}
.kx-kz .qt blockquote{margin:0;font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(24px,3.2vw,36px);line-height:1.2;text-wrap:pretty}
.kx-kz figcaption:not([class*="u-"]){display:flex;align-items:center;gap:14px;font-size:15px}
.kx-kz figcaption:not([class*="u-"]) b{display:block;font-family:Montserrat,sans-serif;font-weight:800;font-size:16px}
.kx-kz .qa{width:52px;height:52px;border-radius:50%;overflow:hidden;position:relative;flex:none}
.kx-kz .qa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kx-kz .dk .qt,.kx-kz .dk .tc{color:#fff}
.kx-kz .dk figcaption{color:#B9B6C0}
.kx-kz .dk figcaption b{color:#fff}
.kx-kz .wh figcaption,.kx-kz .lt figcaption{color:var(--g-sub)}
.kx-kz .qt.ctr{align-items:center;text-align:center;margin:0 auto}
.kx-kz .tc{margin:0;display:flex;flex-direction:column;gap:1em;padding:1.6em;border-radius:14px}
.kx-kz .tc .ql{font-size:22px}
.kx-kz .tc blockquote{margin:0;font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(17px,1.7vw,19px);line-height:1.3}
.kx-kz .tc figcaption{margin-top:auto}
.kx-kz .dk .tc{background:#312F39}
.kx-kz .wh .tc{background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink)}
.kx-kz .bad{border:3px solid var(--g-nob);border-radius:12px;padding:16px;display:flex;gap:10px}
.kx-kz .bad.dk{background:#2B2931;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-kz .bad.lt{background:var(--g-alt)}
.kx-kz .duo2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@container (max-width:796px){.kx-kz .duo2{grid-template-columns:1fr}
}.kx-kz .qt,.kx-kz .tc{position:relative;isolation:isolate}
.kx-kz .qt{padding-top:1.6em}
.kx-kz .qm{position:absolute;z-index:-1;left:-.06em;top:-.28em;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(150px,18vw,220px);line-height:1;color:#FBB040;opacity:.14;pointer-events:none;user-select:none}
.kx-kz .wh .qm,.kx-kz .lt .qm{opacity:.22}
.kx-kz .qt.ctr .qm{left:50%;transform:translateX(-50%)}
.kx-kz .tc{overflow:hidden}
.kx-kz .tc .qm{font-size:150px;left:auto;right:.08em;top:-.2em}
.kx-kz figcaption:not([class*="u-"]).nf b{display:inline}
.kx-kz figcaption:not([class*="u-"]).nf{gap:0}
.kx-kz figcaption:not([class*="u-"]).nf span{display:flex;flex-direction:column}
.kx-kz .qt.ctr figcaption{justify-content:center}
.kx-kz .qt.ctr figcaption.nf span{align-items:center}
.kx-kz .sub{margin:6px 0 0;font-family:Montserrat,sans-serif;font-weight:800;font-size:18px}
.kx-kz .row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:clamp(16px,2.4vw,28px)}
.kx-kz .km{white-space:nowrap}
.kx-kz .ctrk .kc{align-items:center;text-align:center}
.kx-kz .ctrk .km{justify-content:center}
.kx-kz .qb{--g:clamp(240px,28vw,420px);--q:min(var(--g) * .85, 70cqi);--pd:clamp(20px,2.6vw,36px);container-type:inline-size;position:relative;margin:calc(var(--q)*.12) calc(var(--q)*.12) 0 0;padding:var(--pd);border-radius:12px;display:flex;flex-direction:column;gap:1em}
.kx-kz .wh .qb{background:var(--g-alt);color:var(--g-ink)}
.kx-kz .dk .qb{background:#312F39;color:#fff}
.kx-kz .qb .ql{font-size:clamp(18px,2.1vw,26px)}
.kx-kz .qb blockquote{margin:0;font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(18px,2.1vw,26px);line-height:1.2;text-wrap:pretty}
.kx-kz .qb figcaption span{min-width:0}
.kx-kz .qb figcaption b{white-space:nowrap}
/* Anführungszeichen: Größe --q = 0,85 × --g, in schmalen Kästen höchstens 70 % der Kastenbreite (übergroß, ragt oben und rechts heraus). Sichtbares Zeichen: links 0,344 × --q vor der rechten Kastenkante, unten 0,31 × --q − 10 px unter der Oberkante.
   Ein unsichtbarer Platzhalter (float) reserviert genau diese Ecke plus 16 px. Zeilen daneben werden kürzer, Zeilen darunter nutzen die volle Breite, zu lange Wörter rutschen darunter. Nie überlappen. */
.kx-kz .qb blockquote:before{content:"";float:right;width:max(0px,calc(var(--q) * .344 + 16px - var(--pd)));height:max(0px,calc(var(--q) * .31 + 6px - var(--pd) - 20px))}
.kx-kz .qm2{position:absolute;right:calc(var(--q)*-.12);top:calc(var(--q)*-.2 - 10px);font-family:Mulish,sans-serif;font-weight:900;font-size:var(--q);line-height:1;color:#FBB040;pointer-events:none;user-select:none}
.kx-kz .qb.qf{--g:clamp(260px,30vw,460px);--pd:clamp(28px,4vw,56px)}
.kx-kz .qb.qf blockquote,.kx-kz .qb.qf .ql{font-size:clamp(22px,3vw,36px)}
.kx-kz .qb.qf blockquote{max-width:30ch}
.kx-kz .hvw{display:flex;flex-direction:column;gap:10px}
.kx-kz .hvl{font-size:13px;font-weight:700;color:var(--g-mute)}
.kx-kz .dk .hvl{color:#B9B6C0}
.kx-kz .hvr .kc{flex:1}
.kx-kz .kc.hov{transform:translateY(-3px)}
.kx-kz .kc.hov .km svg{transform:translateX(3px)}
.kx-kz .dk .kc.hov{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.kx-kz .wh .kc.hov{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-kz .qb{transition:transform .2s,box-shadow .2s}
.kx-kz .qb:hover,.kx-kz .qb.hov{transform:translateY(-3px)}
.kx-kz .wh .qb:hover,.kx-kz .wh .qb.hov{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-kz .dk .qb:hover,.kx-kz .dk .qb.hov{box-shadow:0 12px 28px rgba(0,0,0,.35)}
.kx-kz .v3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
@container (max-width:936px){.kx-kz .v3{grid-template-columns:1fr}
}@container (min-width:937px){.kx-kz .v3 .qb{--g:180px}
}.kx-kz .wh .qb.hov.hA{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-kz .wh .qb.hov.hB{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14),inset 0 0 0 1.5px #FBB040}
.kx-kz .wh .qb.hov.hC{box-shadow:none;background:#EDE8E1}
.kx-kz .hvt{width:100%;border-collapse:collapse;font-size:14px;background:var(--g-surf)}
.kx-kz .hvt th{font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:12px 16px;background:var(--g-alt)}
.kx-kz .hvt td{padding:12px 16px;border-top:1px solid var(--g-frame);color:var(--g-sub);vertical-align:top}
.kx-kz .hvt td:first-child{font-weight:800;color:var(--g-ink);white-space:nowrap}
.kx-kz .hvt code{font-size:12px;color:var(--g-ink)}
.kx-kz .kb.hov{transform:translateY(-3px)}
.kx-kz .kb.hov .kbi img{transform:scale(1.04)}
.kx-kz .dk .kb.hov{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.kx-kz .wh .kb.hov{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-kz .hvr .kb{flex:1}
/* kx:kz end */

/* kx:pv start · Kapitel Paketvergleiche. Muster nur für dieses Kapitel, gelten unter .kx-pv. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-pv .stage{border-radius:12px;padding:clamp(24px,4vw,56px) clamp(16px,3vw,40px);display:flex;flex-direction:column;gap:clamp(24px,3vw,36px)}
.kx-pv .stage.dk{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-pv .stage.lt{background:var(--g-alt);border:1px solid var(--g-frame)}
.kx-pv .pl{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-sub)}
.kx-pv .dk .pl{color:#B9B6C0}
.kx-pv .phd2{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.kx-pv .phd2 h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(26px,3.2vw,38px);line-height:1.03}
.kx-pv .phd2 p{margin:0;font-size:16px}
.kx-pv .dk .phd2 p{color:#D8D5DC}
.kx-pv .lt .phd2 p{color:var(--g-sub)}
.kx-pv .eb4{font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:12px;display:flex;gap:.6em}
.kx-pv .eb4 span{color:#FBB040;letter-spacing:0}
.kx-pv .pg3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);align-items:stretch;padding-top:14px}
@container (max-width:796px){.kx-pv .pg3{grid-template-columns:1fr;max-width:420px;margin:0 auto;width:100%}
}.kx-pv .pk{position:relative;border-radius:14px;padding:clamp(22px,2.4vw,30px);display:flex;flex-direction:column;gap:20px;transition:transform .2s,box-shadow .2s}
.kx-pv .dk .pk{background:#312F39;color:#fff}
.kx-pv .lt .pk{background:var(--g-surf);color:var(--g-ink)}
.kx-pv .pk:hover,.kx-pv .pk.hov{transform:translateY(-3px)}
.kx-pv .dk .pk:hover,.kx-pv .dk .pk.hov{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.kx-pv .lt .pk:hover,.kx-pv .lt .pk.hov{box-shadow:0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-pv .pk.hi{box-shadow:inset 0 0 0 2px #FBB040}
.kx-pv .dk .pk.hi:hover,.kx-pv .dk .pk.hi.hov{box-shadow:inset 0 0 0 2px #FBB040,0 12px 28px rgba(0,0,0,.3)}
.kx-pv .lt .pk.hi:hover,.kx-pv .lt .pk.hi.hov{box-shadow:inset 0 0 0 2px #FBB040,0 14px 30px rgba(43,41,49,.22),0 2px 4px rgba(43,41,49,.14)}
.kx-pv .pb{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:#FBB040;color:#2B2931;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:6px 14px;border-radius:999px;white-space:nowrap}
.kx-pv .ph2{display:flex;flex-direction:column;gap:6px}
.kx-pv .pn{font-family:Montserrat,sans-serif;font-weight:800;font-size:20px}
.kx-pv .pd{margin:0;font-size:15px;line-height:1.45;min-height:2.9em}
.kx-pv .dk .pd{color:#D8D5DC}
.kx-pv .lt .pd{color:var(--g-sub)}
.kx-pv .pp2{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.kx-pv .pv{font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(32px,3.4vw,40px);line-height:1;font-variant-numeric:tabular-nums}
.kx-pv .pu{font-size:15px}
.kx-pv .dk .pu{color:#B9B6C0}
.kx-pv .lt .pu{color:var(--g-mute)}
.kx-pv .bt{display:flex;align-items:center;justify-content:center;height:48px;border-radius:999px;font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;text-decoration:none;white-space:nowrap}
.kx-pv .bt.pr{background:#FBB040;color:#2B2931}
.kx-pv .bt.pr:hover{color:#2B2931;background:#FCC066}
.kx-pv .dk .bt.sc{box-shadow:inset 0 0 0 1.5px #fff;color:#fff}
.kx-pv .dk .bt.sc:hover{background:rgba(255,255,255,.08);color:#fff}
.kx-pv .lt .bt.sc{box-shadow:inset 0 0 0 1.5px #2B2931;color:var(--g-ink)}
.kx-pv .lt .bt.sc:hover{background:var(--g-alt)}
.kx-pv .pf{list-style:none;margin:0;padding:18px 0 0;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.4}
.kx-pv .dk .pf{border-top:1px solid #45434C}
.kx-pv .lt .pf{border-top:1px solid var(--g-frame)}
.kx-pv .pf li{display:flex;gap:10px;align-items:flex-start}
.kx-pv .pf i{flex:none;width:20px;height:20px;border-radius:50%;background:#FBB040;color:#2B2931;display:flex;align-items:center;justify-content:center;font-style:normal;margin-top:1px}
.kx-pv .pf i svg{width:12px;height:12px}
.kx-pv .pf li.nx{opacity:.55}
.kx-pv .pf li.nx i{background:transparent;color:inherit;font-weight:800}
.kx-pv .fn{margin:0;text-align:center;font-size:12px}
.kx-pv .dk .fn{color:#9C99A4}
.kx-pv .lt .fn{color:var(--g-mute)}
.kx-pv .bad{border:3px solid var(--g-nob);border-radius:12px;padding:22px 14px 14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}
.kx-pv .bad.dk{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-pv .pk.mini{padding:16px 10px 12px;gap:6px;align-items:center;text-align:center}
.kx-pv .pk.mini .pn{font-size:14px}
.kx-pv .pk.mini .pv{font-size:15px;white-space:nowrap}
.kx-pv .pk.mini .pb{font-size:9px;padding:4px 8px}
.kx-pv .seg{display:inline-flex;padding:4px;border-radius:999px;gap:4px;margin-top:8px}
.kx-pv .dk .seg{background:#1F1D24}
.kx-pv .lt .seg{background:var(--g-surf);box-shadow:inset 0 0 0 1px var(--g-line)}
.kx-pv .seg button{all:unset;cursor:pointer;height:44px;padding:0 20px;border-radius:999px;display:flex;align-items:center;gap:8px;font-family:Montserrat,sans-serif;font-weight:700;font-size:15px;white-space:nowrap;transition:background .2s,color .2s}
.kx-pv .dk .seg button{color:#D8D5DC}
.kx-pv .lt .seg button{color:var(--g-sub)}
.kx-pv .seg button:hover{color:inherit}
.kx-pv .dk .seg button:hover{color:#fff}
.kx-pv .lt .seg button:hover{color:var(--g-ink)}
.kx-pv .seg button:focus-visible{outline:2px solid #FBB040;outline-offset:2px}
.kx-pv .seg button.on{background:#FBB040;color:#2B2931!important;font-weight:800}
.kx-pv .seg em{font-style:normal;font-size:12px;font-weight:800;padding:2px 7px;border-radius:999px;background:rgba(251,176,64,.18);color:#FBB040}
.kx-pv .lt .seg em{color:#2B2931;background:#FFF4E2}
.kx-pv .seg button.on em{background:rgba(43,41,49,.12);color:#2B2931}
/* kx:pv end */

/* kx:nv start · Kapitel Navigation und Menüs. Muster nur für dieses Kapitel, gelten unter .kx-nv. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-nv .frame{border-radius:12px;overflow:hidden;border:3px solid var(--g-okb)}
.kx-nv .frame.bad{border:3px solid var(--g-nob)}
.kx-nv .ic{width:1.15em;height:1.15em;flex:none;display:block}
.kx-nv .b{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-family:Montserrat,sans-serif;font-weight:800;font-size:14px;text-decoration:none;border-radius:999px;min-height:44px;padding:.7em 1.3em;white-space:nowrap}
.kx-nv .b.p{background:#FBB040;color:#2B2931}
.kx-nv .hd{display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding:0 clamp(16px,3vw,32px);height:72px;background:#1F1D24;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .hd.lt{background:var(--g-surf);color:var(--g-ink);border-bottom:1px solid var(--g-frame)}
.kx-nv .hd .lg{height:30px;display:block;flex:none}
.kx-nv .hd nav{min-width:0;display:flex;gap:clamp(14px,2.4vw,32px);margin-left:auto;align-items:center;height:100%}
@container (max-width:760px){.kx-nv .hd nav:not([style*=overflow]) .ni:nth-child(n+4){display:none}}@container (max-width:660px){.kx-nv .hd nav:not([style*=overflow]) .ni:nth-child(n+3){display:none}}
.kx-nv .ni{white-space:nowrap;position:relative;display:flex;align-items:center;gap:.35em;height:100%;font-family:Montserrat,sans-serif;font-weight:700;font-size:15px;color:inherit;text-decoration:none;opacity:.82}
.kx-nv .ni:hover{opacity:1;color:inherit}
.kx-nv .ni .ic{width:1em;height:1em}
.kx-nv .ni.on{opacity:1}
.kx-nv .ni.on:after{content:"";position:absolute;left:0;right:0;bottom:18px;height:3px;background:#FBB040;border-radius:2px}
.kx-nv .pg{background:#2B2931;color:#fff;padding:clamp(28px,4vw,56px) clamp(16px,3vw,32px);min-height:180px;position:relative;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .pg.lt{background:var(--g-alt);color:var(--g-ink)}
.kx-nv .pg h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(24px,3vw,34px);line-height:1.04;max-width:16ch}
.kx-nv .pg p{margin:10px 0 0;color:#C9C5CF;max-width:46ch}
.kx-nv .pg.lt p{color:var(--g-sub)}
.kx-nv .dd{position:absolute;top:8px;left:auto;right:clamp(12px,34%,420px);max-width:calc(100% - 24px);width:300px;background:#312F39;border-radius:12px;padding:8px;box-shadow:0 16px 40px rgba(0,0,0,.35);display:flex;flex-direction:column;z-index:3;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .dd a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:8px;text-decoration:none;color:#fff;min-height:44px}
.kx-nv .dd a:hover,.kx-nv .dd a.h{background:#3A3843;color:#fff}
.kx-nv .dd b{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px}
.kx-nv .dd span{font-size:13px;color:#C9C5CF}
.kx-nv .dd[hidden]{display:none}
.kx-nv .dd.lt{background:var(--g-surf);box-shadow:0 16px 40px rgba(43,41,49,.16);border:1px solid var(--g-frame)}
.kx-nv .dd.lt a{color:var(--g-ink)}
.kx-nv .dd.lt a.h,.kx-nv .dd.lt a:hover{background:var(--g-alt);color:var(--g-ink)}
.kx-nv .dd.lt span{color:var(--g-sub)}
.kx-nv .mob{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}
@container (max-width:736px){.kx-nv .mob{grid-template-columns:1fr}
}.kx-nv .ph{width:280px;height:540px;border-radius:32px;overflow:hidden;border:8px solid #1F1D24;background:#2B2931;color:#fff;display:flex;flex-direction:column;position:relative}
.kx-nv .ph.lt{background:var(--g-alt);color:var(--g-ink)}
.kx-nv .mh{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 10px 0 18px;background:#1F1D24;color:#fff;flex:none;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .ph.lt .mh{background:var(--g-surf);color:var(--g-ink);border-bottom:1px solid var(--g-frame)}
.kx-nv .mh .lg{height:24px}
.kx-nv .mh button{all:unset;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.kx-nv .mh button .ic{width:24px;height:24px}
.kx-nv .mo{flex:1;display:flex;flex-direction:column;padding:16px 18px 22px;background:#1F1D24;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .mo a.mi{display:flex;align-items:center;justify-content:space-between;min-height:56px;border-bottom:1px solid #312F39;font-family:Montserrat,sans-serif;font-weight:800;font-size:20px;color:#fff;text-decoration:none}
.kx-nv .mo a.mi.on{color:#FBB040}
.kx-nv .mo a.mi.op{border-bottom:0;color:#FBB040}.kx-nv .mo a.mi.op .ic{color:#FBB040}.kx-nv .mo a.mi .ic{width:20px;height:20px;color:#C9C5CF}.kx-nv .msub{display:flex;flex-direction:column;gap:4px;margin:0 0 12px}.kx-nv .msub a{display:flex;align-items:center;flex:none;min-height:48px;padding:12px 16px;line-height:1.25;box-sizing:border-box;border-radius:8px;background:#312F39;font-family:Montserrat,sans-serif;font-weight:700;font-size:16px;color:#fff;text-decoration:none}.kx-nv .msub a:hover{background:#3A3843}
.kx-nv .mo .b,.kx-nv .mo .u-btn{margin-top:auto;width:100%;font-size:16px;min-height:52px}
.kx-nv .ph .pg{min-height:0;flex:1;padding:24px 18px}
.kx-nv .app{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:420px}
@container (max-width:636px){.kx-nv .app{grid-template-columns:1fr}
}.kx-nv .sb{background:#1F1D24;color:#fff;display:flex;flex-direction:column;gap:2px;padding:18px 12px;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .sb.lt{background:var(--g-surf);color:var(--g-ink);border-right:1px solid var(--g-frame)}
.kx-nv .sbl{padding:6px 12px 18px}
.kx-nv .sbl img{height:22px;display:block}
.kx-nv .si{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:8px;font-family:Montserrat,sans-serif;font-weight:700;font-size:14px;color:inherit;text-decoration:none;opacity:.82}
.kx-nv .si:hover{opacity:1;background:rgba(255,255,255,.06);color:inherit}
.kx-nv .sb.lt .si:hover{background:var(--g-alt)}
.kx-nv .si.on{opacity:1;background:#312F39;position:relative;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .si.on:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:2px;background:#FBB040}
.kx-nv .sb.lt .si.on{background:#FFF4E2}
.kx-nv .sbf{margin-top:auto;display:flex;flex-direction:column;gap:2px;padding-top:12px;border-top:1px solid #312F39}
.kx-nv .sb.lt .sbf{border-color:var(--g-frame)}
.kx-nv .main{background:#2B2931;color:#fff;padding:28px clamp(20px,3vw,36px);outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .main.lt{background:var(--g-alt);color:var(--g-ink)}
.kx-nv .bc{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:14px;color:#C9C5CF;margin-bottom:14px}
.kx-nv .bc a{color:inherit;text-decoration:none}
.kx-nv .bc a:hover{color:#fff;text-decoration:underline}
.kx-nv .bc .ic{width:14px;height:14px;opacity:.6}
.kx-nv .bc b{color:#fff;font-weight:700}
.kx-nv .main.lt .bc{color:var(--g-sub)}
.kx-nv .main.lt .bc b{color:var(--g-ink)}
.kx-nv .main.lt .bc a:hover{color:var(--g-ink)}
.kx-nv .main h3{margin:0 0 18px;font-family:Montserrat,sans-serif;font-weight:900;font-size:26px;line-height:1.05}
.kx-nv .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.kx-nv .cards div{height:110px;border-radius:10px;background:#312F39}
.kx-nv .main.lt .cards div{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-nv .shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:520px;background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
@container (max-width:696px){.kx-nv .shell{grid-template-columns:1fr}
}.kx-nv .as{background:#1F1D24;display:flex;flex-direction:column;border-right:1px solid #2E2C35;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .ah{height:64px;display:flex;align-items:center;gap:8px;padding:0 8px 0 18px;border-bottom:1px solid #2E2C35}
.kx-nv .lgx{display:flex;align-items:flex-end;gap:.4em;min-width:0}
.kx-nv .lgx img{display:block;flex:none}
.kx-nv .lgx .an{display:block;line-height:1;opacity:0;font-family:Montserrat,sans-serif;font-weight:700;white-space:nowrap}
.kx-nv .lgx.lm img{height:18px}
.kx-nv .lgx.lu img{height:31px}
.kx-nv .ah .ab{width:36px;flex:none}
.kx-nv .an{font-family:Montserrat,sans-serif;font-weight:700;font-size:15px}
.kx-nv .ab{all:unset;margin-left:auto;width:44px;height:44px;display:flex;align-items:center;justify-content:center;opacity:.7;cursor:pointer}
.kx-nv .anv{display:flex;flex-direction:column;gap:1px;padding:12px 10px;flex:1}
.kx-nv .ag{display:flex;flex-direction:column;gap:1px;margin-top:10px}
.kx-nv .agh{all:unset;display:flex;align-items:center;justify-content:space-between;min-height:30px;padding:0 10px;font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#C9C5CF;cursor:pointer}
.kx-nv .agh .ic{width:14px;height:14px}
.kx-nv .agh:before{content:"//";color:#FBB040;letter-spacing:0;margin-right:.6em}.kx-nv .agh{justify-content:flex-start}.kx-nv .agh .ic{margin-left:auto}
.kx-nv .ai{display:flex;align-items:center;gap:10px;min-height:36px;padding:0 10px;border-radius:8px;font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;color:#E6E3EA;text-decoration:none;position:relative}
.kx-nv .ai:hover{background:rgba(255,255,255,.05);color:#fff}
.kx-nv .ai .ic{width:17px;height:17px;opacity:.8}
.kx-nv .ai.on{background:#312F39;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .ai.on .ic{opacity:1;color:#FBB040}
.kx-nv .ai em{margin-left:auto;font-style:normal;min-width:22px;height:22px;border-radius:999px;background:#FBB040;color:#2B2931;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 6px}
.kx-nv .af{padding:10px 12px 14px;border-top:1px solid #2E2C35}
.kx-nv .am{display:flex;flex-direction:column;min-width:0}
.kx-nv .at{height:64px;display:flex;align-items:center;gap:16px;padding:0 20px 0 28px;border-bottom:1px solid #2E2C35;background:#1F1D24}
.kx-nv .at .bc{margin:0}
.kx-nv .ar{margin-left:auto;display:flex;align-items:center;gap:6px}
.kx-nv .ar button{all:unset;width:44px;height:44px;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer}
.kx-nv .ar button .ic{width:20px;height:20px}
.kx-nv .ar button i{position:absolute;top:10px;right:10px;width:8px;height:8px;border-radius:50%;background:#FBB040}
.kx-nv .sx{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:999px;background:#312F39;color:#C9C5CF;font-size:14px;min-width:180px;margin-right:6px;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .sx .ic{width:16px;height:16px}
.kx-nv .av{width:36px;height:36px;border-radius:50%;background:#FBB040;color:#2B2931;font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;margin-left:4px}
.kx-nv .ac{padding:28px}
.kx-nv .ac h3{margin:0 0 18px;font-family:Montserrat,sans-serif;font-weight:900;font-size:28px;line-height:1.05}
.kx-nv .ac .cards div{background:#312F39}
.kx-nv .shell.lt{background:var(--g-alt);color:var(--g-ink)}
.kx-nv .shell.lt .as{background:var(--g-surf);border-right-color:var(--g-frame)}
.kx-nv .shell.lt .ah,.kx-nv .shell.lt .af{border-color:var(--g-frame)}
.kx-nv .shell.lt .agh{color:var(--g-sub)}
.kx-nv .shell.lt .ai{color:var(--g-ink)}
.kx-nv .shell.lt .ai:hover{background:var(--g-alt)}
.kx-nv .shell.lt .ai.on{background:#FFF4E2}
.kx-nv .shell.lt .ai.on .ic{color:var(--g-ink)}
.kx-nv .shell.lt .at{border-color:var(--g-frame);background:var(--g-surf)}
.kx-nv .shell.lt .sx{background:var(--g-alt);color:var(--g-sub)}
.kx-nv .shell.lt .bc{color:var(--g-sub)}
.kx-nv .shell.lt .bc b{color:var(--g-ink)}
.kx-nv .shell.lt .ac .cards div{background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-nv .bw{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.kx-nv .bw .cell{display:flex;flex-direction:column;gap:10px}
.kx-nv .bsel{all:unset;box-sizing:border-box;width:100%;display:flex;flex-direction:column;gap:2px;padding:8px 12px;border-radius:8px;background:#2B2931;cursor:pointer;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .bsel:hover{background:#312F39;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .bsl{font-family:Montserrat,sans-serif;font-weight:800;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#C9C5CF}
.kx-nv .bsv{display:flex;align-items:center;gap:8px;font-family:Montserrat,sans-serif;font-weight:800;font-size:14px;color:#fff}
.kx-nv .bsv .ic{width:16px;height:16px}
.kx-nv .bsv .ic:first-child{color:#FBB040}
.kx-nv .bsv .ic:last-child{margin-left:auto;opacity:.7}
.kx-nv .swr{padding:12px 10px;border-bottom:1px solid #2E2C35;display:flex;flex-direction:column;gap:8px;position:relative}
/* Bereichs-Auswahl aufgeklappt: Liste direkt unter dem Feld, gleiche Breite, Schatten wie Dropdown. Aktiver Bereich orange mit Haken. */
.kx-nv .bls{position:absolute;left:10px;right:10px;top:calc(100% - 6px);z-index:5;background:#312F39;border-radius:10px;padding:6px;display:flex;flex-direction:column;gap:2px;box-shadow:0 12px 32px rgba(0,0,0,.45);outline:1px solid #413F49;outline-offset:-1px}.kx-nv .bls[hidden]{display:none}
.kx-nv .bls button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;min-height:40px;padding:0 10px;border-radius:6px;font-family:Montserrat,sans-serif;font-weight:700;font-size:14px;color:#fff;cursor:pointer}.kx-nv .bls button:hover,.kx-nv .bls button:focus-visible{background:#3A3843}.kx-nv .bls button:focus-visible{outline:2px solid #FBB040;outline-offset:-2px}
.kx-nv .bls .ic{width:16px;height:16px;color:#C9C5CF}.kx-nv .bls button.on{color:#FBB040}.kx-nv .bls button.on .ic{color:#FBB040}.kx-nv .bls .ck{margin-left:auto}
.kx-nv .swl{font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#C9C5CF;padding:0 4px}
.kx-nv .seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#2B2931;border-radius:12px;padding:4px;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .seg a{display:flex;align-items:center;justify-content:center;min-height:40px;border-radius:9px;font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;color:#E6E3EA;text-decoration:none}
.kx-nv .seg a{position:relative}
.kx-nv .seg a.on{background:#3A3843;color:#fff}
.kx-nv .seg a.on:after{content:"";position:absolute;left:30%;right:30%;bottom:5px;height:3px;border-radius:2px;background:#FBB040}
.kx-nv .tbar{display:grid;grid-template-columns:repeat(4,1fr);background:#1F1D24;border-top:1px solid #2E2C35;padding:6px 4px 10px;flex:none;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .tbi{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:52px;justify-content:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:11px;color:#C9C5CF;text-decoration:none}
.kx-nv .tbi .ic{width:22px;height:22px}
.kx-nv .tbi.on{color:#FBB040}
.kx-nv .rtd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@container (max-width:796px){.kx-nv .rtd{grid-template-columns:1fr}
}.kx-nv .rtw{border-radius:12px;padding:clamp(18px,2.6vw,28px);display:flex;flex-direction:column;gap:18px;min-width:0}
.kx-nv .rtw.dk{background:#2B2931;color:#fff;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-nv .rtw.lt{background:var(--g-surf);border:1px solid var(--g-frame);color:var(--g-ink)}
.kx-nv .rtl{display:flex;gap:22px;overflow-x:auto;scrollbar-width:none}
.kx-nv .rtw.dk .rtl{box-shadow:inset 0 -1px 0 #45434C}
.kx-nv .rtw.lt .rtl{box-shadow:inset 0 -1px 0 var(--g-frame)}
.kx-nv .rtl button{all:unset;cursor:pointer;flex:none;min-height:44px;display:flex;align-items:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:15px;white-space:nowrap;position:relative}
.kx-nv .rtw.dk .rtl button{color:#B9B6C0}
.kx-nv .rtw.lt .rtl button{color:var(--g-sub)}
.kx-nv .rtw.dk .rtl button:hover,.kx-nv .rtw.dk .rtl button.on{color:#fff}
.kx-nv .rtw.lt .rtl button:hover,.kx-nv .rtw.lt .rtl button.on{color:var(--g-ink)}
.kx-nv .rtl button:focus-visible{outline:2px solid #FBB040;outline-offset:2px;border-radius:4px}
.kx-nv .rtl button.on:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:#FBB040;border-radius:2px}
.kx-nv .rtp p{margin:0;font-size:16px;line-height:1.6}
.kx-nv .rtw.dk .rtp p{color:#D8D5DC}
.kx-nv .rtw.lt .rtp p{color:var(--g-sub)}
.kx-nv .rbad{border:3px solid var(--g-nob)!important}
.kx-nv .rcap{margin:10px 0 0;font-size:14px;color:var(--g-sub)}
.kx-nv .rcap b{font-family:Montserrat,sans-serif;font-weight:800;color:var(--g-ink)}
.kx-nv .wrapR{overflow-x:auto;border:1px solid var(--g-frame);border-radius:12px}
.kx-nv .rtt{width:100%;border-collapse:collapse;font-size:14px;background:var(--g-surf)}
.kx-nv .rtt th{font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:12px 16px;background:var(--g-alt)}
.kx-nv .rtt td{padding:12px 16px;border-top:1px solid var(--g-frame);color:var(--g-sub);vertical-align:top}
.kx-nv .rtt td:first-child{font-weight:800;color:var(--g-ink);white-space:nowrap}
.kx-nv .rtt tr:nth-child(even) td{background:var(--g-alt)}
/* kx:nv end */

/* kx:fo start · Kapitel Formulare. Muster nur für dieses Kapitel, gelten unter .kx-fo. Farben, die zwischen Hell und Dunkel wechseln, sind Variablen. */
.kx-fo .duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
@container (max-width:796px){.kx-fo .duo{grid-template-columns:1fr}
}.kx-fo .bad{--ink:var(--g-ink);--sub:var(--g-sub);--fld:var(--g-surf);--bd:#8A8792;border:3px solid var(--g-nob);border-radius:12px;background:var(--g-surf);padding:20px;display:flex;flex-direction:column;gap:12px;justify-content:center}
.kx-fo .ic{width:1.1em;height:1.1em;flex:none;display:block}
.kx-fo .fm{border-radius:14px;padding:clamp(20px,3vw,36px);display:flex;flex-direction:column;gap:22px;background:var(--g-surf);border:1px solid var(--g-frame);--ink:#2B2931;--sub:#45434C;--fld:#fff;--bd:#8A8792;--blk:#F6F4F1}
.kx-fo .fm.dk{background:#2B2931;border-color:#2B2931;--ink:#fff;--sub:#C9C5CF;--fld:#312F39;--bd:#6E6C78;--blk:#312F39;outline:1px solid var(--g-swb);outline-offset:-1px}
.kx-fo .fh h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:clamp(22px,2.4vw,28px);line-height:1.05;color:var(--ink)}
.kx-fo .fh p{margin:8px 0 0;color:var(--sub);font-size:15px}
.kx-fo .stp{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--sub);margin-bottom:8px}
.kx-fo .blk{background:var(--blk);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:16px}
.kx-fo .fm.dk .blk{background:#1F1D24}
.kx-fo .bt{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--ink)}
.kx-fo .r2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@container (max-width:396px){.kx-fo .r2{grid-template-columns:1fr}
}.kx-fo .fl{display:flex;flex-direction:column;gap:6px;min-width:0}
.kx-fo .lb{font-family:Montserrat,sans-serif;font-weight:700;font-size:14px;color:var(--ink)}
.kx-fo .lb i{font-style:normal;font-family:Mulish,sans-serif;font-weight:600;color:var(--sub);font-size:13px;margin-left:4px}
.kx-fo .in{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;border-radius:10px;background:var(--fld);border:1.5px solid var(--bd);font-size:16px;color:var(--ink)}
.kx-fo .fm.dk .blk .in{background:#2B2931}
.kx-fo .in .v{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kx-fo .in .ph{flex:1;min-width:0;color:var(--sub);opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kx-fo .ta .in{align-items:flex-start;min-height:96px;padding-top:12px}
.kx-fo .ta .in .ph{white-space:normal}
.kx-fo .in .ic{opacity:.7}
.kx-fo .foc .in{border-color:#FBB040;box-shadow:0 0 0 3px rgba(251,176,64,.35)}
.kx-fo .foc .v:after{content:"";display:inline-block;width:1.5px;height:1.1em;background:var(--ink);vertical-align:-.15em;margin-left:1px}
.kx-fo .err .in{border-color:#D9483B;border-width:2px}
.kx-fo .em{display:flex;gap:6px;align-items:flex-start;font-size:14px;line-height:1.4;color:#B3261E;font-weight:700}
.kx-fo .fm.dk .em{color:#FF8A7E}
.kx-fo .em .ic{margin-top:1px}
.kx-fo .hn{font-size:14px;color:var(--sub)}
.kx-fo .okc{width:22px;height:22px;border-radius:50%;background:#3FA34D;color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.kx-fo .okc .ic{width:13px;height:13px;opacity:1}
.kx-fo .cb{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--sub);cursor:pointer}
.kx-fo .cb a{color:var(--ink)}
.kx-fo .bx{width:24px;height:24px;flex:none;border-radius:6px;border:1.5px solid var(--bd);display:flex;align-items:center;justify-content:center;margin-top:1px}
.kx-fo .bx.on{background:#FBB040;border-color:#FBB040;color:#2B2931}
.kx-fo .bx .ic{width:15px;height:15px}
.kx-fo .act{display:flex;flex-direction:column;align-items:center;gap:max(14px,.9em)}
.kx-fo .b{display:inline-flex;align-items:center;justify-content:center;font-family:Montserrat,sans-serif;font-weight:800;font-size:16px;text-decoration:none;border-radius:999px;min-height:52px;padding:.8em 1.6em;white-space:nowrap;width:100%}
.kx-fo .b.p{background:#FBB040;color:#2B2931}
.kx-fo .b.p:hover{background:#FCC066;color:#2B2931}
.kx-fo .hint{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--sub)}
.kx-fo .hint .ic{width:15px;height:15px}
.kx-fo .lnk{font-size:15px;color:var(--sub);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.kx-fo .fm.dk .lnk{color:#C9C5CF}
.kx-fo .cg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@container (max-width:396px){.kx-fo .cg{grid-template-columns:1fr}
}.kx-fo .ch{position:relative;display:flex;flex-direction:column;gap:4px;padding:18px;min-height:132px;border-radius:12px;border:1.5px solid var(--bd);background:var(--fld);text-decoration:none;color:var(--ink)}
.kx-fo .ch:hover{border-color:#FBB040;color:var(--ink)}
.kx-fo .ch b{font-family:Montserrat,sans-serif;font-weight:800;font-size:16px;line-height:1.2}
.kx-fo .ch>span:not(.ci){font-size:14px;color:var(--sub)}
.kx-fo .ci{width:40px;height:40px;border-radius:50%;background:#FBB040;color:#2B2931;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.kx-fo .ci .ic{width:20px;height:20px}
.kx-fo .ch.on{border:2px solid #FBB040;box-shadow:0 0 0 3px rgba(251,176,64,.25)}
.kx-fo .fm:not(.dk) .ch.on{background:#FFF4E2}
.kx-fo .fm.dk .ch.on{background:#3A3843}
.kx-fo .tick{position:absolute;top:14px;right:14px;width:24px;height:24px;border-radius:50%;background:#FBB040;color:#2B2931;display:flex;align-items:center;justify-content:center}
.kx-fo .tick .ic{width:14px;height:14px}
.kx-fo .prog{height:6px;border-radius:3px;background:var(--blk);overflow:hidden}
.kx-fo .fm.dk .prog{background:#1F1D24}
.kx-fo .prog i{display:block;height:100%;background:#FBB040;border-radius:3px}
.kx-fo .st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:14px;padding:24px;--ink:#2B2931;--sub:#45434C;--fld:#fff;--bd:#8A8792}
@container (max-width:836px){.kx-fo .st{grid-template-columns:repeat(2,minmax(0,1fr))}
}@container (max-width:456px){.kx-fo .st{grid-template-columns:1fr}
}.kx-fo .st .k{font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-sub);margin-bottom:8px}
.kx-fo .grp{border-radius:14px;overflow:hidden;background:var(--g);border:1px solid var(--gb)}
.kx-fo .fm{--g:#F6F4F1;--gb:var(--g-line);--ln:#E2DED8}
.kx-fo .fm.dk{--g:#37353F;--gb:#45434C;--ln:#46444E}
.kx-fo .gr{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:stretch;min-height:52px;border-top:1px solid var(--ln);position:relative}
.kx-fo .grp>.gr:first-child{border-top:0}
@container (max-width:456px){.kx-fo .gr{grid-template-columns:1fr}
.kx-fo .gl{padding-bottom:0!important;min-height:0!important;padding-top:10px!important;font-size:14px!important}
}.kx-fo .gl{display:flex;align-items:center;gap:6px;padding:0 16px;font-size:16px;color:var(--ink)}
.kx-fo .gl.wide{grid-column:1/-1;padding-right:80px}
.kx-fo .gl .ic{width:17px;height:17px}
.kx-fo .gv{display:flex;min-width:0}
.kx-fo .gc{flex:1;display:flex;align-items:center;gap:8px;padding:0 16px;font-size:16px;color:var(--ink);min-width:0;min-height:52px}
.kx-fo .gc+.gc{border-left:1px solid var(--ln)}
.kx-fo .gc.nr{flex:0 0 84px}
.kx-fo .gc.plz{flex:0 0 110px}
.kx-fo .gc .vv{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kx-fo .gc .ph{flex:1;min-width:0;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kx-fo .gc>.ic{margin-left:auto;opacity:.7}
.kx-fo .car{display:inline-block;width:1.5px;height:1.15em;background:var(--ink);margin-left:-6px}
.kx-fo .gr.foc{box-shadow:inset 0 0 0 2px #FBB040;border-radius:2px}
.kx-fo .gr.err .gl{color:#B3261E;font-weight:700}
.kx-fo .fm.dk .gr.err .gl{color:#FF8A7E}
.kx-fo .gr.err{box-shadow:inset 0 0 0 2px #D9483B}
.kx-fo .gem{padding:8px 16px 12px 166px;font-size:14px;font-weight:700;color:#B3261E;background:var(--g)}
.kx-fo .fm.dk .gem{color:#FF8A7E}
@container (max-width:456px){.kx-fo .gem{padding-left:16px}
}.kx-fo .tg{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:52px;height:32px;border-radius:999px;background:#8A8792;transition:background .2s}
.kx-fo .tg i{position:absolute;left:3px;top:3px;width:26px;height:26px;border-radius:50%;background:#FFFFFF;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.kx-fo .tg.on{background:#FBB040}
.kx-fo .tg.on i{left:23px}
.kx-fo .topb{display:flex;align-items:center;justify-content:space-between;gap:12px}
.kx-fo .bk{display:flex;align-items:center;gap:4px;font-size:15px;color:var(--sub);text-decoration:none}
.kx-fo .bk:hover{color:var(--ink)}
.kx-fo .bk .ic{width:16px;height:16px}
.kx-fo .topb .stp{margin:0}
.kx-fo .sum{background:var(--g);border:1px solid var(--gb);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:10px}
.kx-fo .st2{font-family:Montserrat,sans-serif;font-weight:800;font-size:18px;color:var(--ink)}
.kx-fo .sr{display:flex;justify-content:space-between;gap:16px;font-size:15px;color:var(--sub)}
.kx-fo .sr span:last-child{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.kx-fo .sr b{color:var(--ink)}
.kx-fo .sr s{opacity:.8}
.kx-fo .sr.tot{border-top:1px solid var(--ln);padding-top:12px;font-family:Montserrat,sans-serif;font-weight:800;font-size:17px;color:var(--ink)}
.kx-fo .sr.ft{font-size:13px}
.kx-fo .pl{font-size:14px;color:var(--sub);margin-bottom:8px}
.kx-fo .seg3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kx-fo .seg3 i{height:5px;border-radius:3px;background:var(--gb)}
.kx-fo .seg3 i.on{background:#FBB040}
.kx-fo .q{margin:0;font-family:Montserrat,sans-serif;font-weight:800;font-size:clamp(19px,2vw,22px);line-height:1.2;color:var(--ink)}
.kx-fo .ol{display:flex;flex-direction:column;gap:10px}
.kx-fo .op{display:flex;align-items:center;gap:14px;min-height:56px;padding:0 18px;border-radius:14px;background:var(--g);border:1.5px solid var(--gb);font-size:17px;color:var(--ink);text-decoration:none}
.kx-fo .op:hover{border-color:#FBB040;color:var(--ink)}
.kx-fo .rd{width:22px;height:22px;border-radius:50%;border:2px solid #8A8792;flex:none;position:relative}
.kx-fo .op.on{border:2px solid #FBB040}
.kx-fo .fm:not(.dk) .op.on{background:#FFF4E2}
.kx-fo .op.on .rd{border-color:#FBB040}
.kx-fo .op.on .rd:after{content:"";position:absolute;inset:3px;border-radius:50%;background:#FBB040}
.kx-fo .stw{max-width:640px}
.kx-fo .ftyp{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:24px;padding:22px 0;border-top:1px solid #E2DED8}
@container (max-width:836px){.kx-fo .ftyp{grid-template-columns:1fr}
}.kx-fo .ftt h3{margin:0 0 6px;font-family:Montserrat,sans-serif;font-weight:800;font-size:18px}
.kx-fo .ftt .note{font-size:15px}
.kx-fo .ftd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
@container (max-width:576px){.kx-fo .ftd{grid-template-columns:1fr}
}.kx-fo .fm.sm{padding:18px;gap:10px;justify-content:center}
.kx-fo .fm.sm .gr{grid-template-columns:120px minmax(0,1fr)}
.kx-fo .fm.sm .gr.stk{grid-template-columns:1fr}
.kx-fo .fm.sm .gr.stk .gl{min-height:0;padding-top:10px;font-size:14px;color:var(--sub)}
.kx-fo .fm.sm .gr.stk .dsel{padding:4px 8px 8px}
.kx-fo .fm.sm .gr.stk .gc{padding:0 10px 0 14px}
.kx-fo .pfm .gem,.kx-fo .fm.sm .gem{padding-left:16px!important}
.kx-fo .fm.sm .gl{padding:0 0 0 14px;font-size:16px}
.kx-fo .fm.sm .gl.wide{padding:0 14px}
.kx-fo .fm.sm .gi{padding:0 14px}
.kx-fo .fm.sm .gc{padding:0 10px 0 14px}
.kx-fo .gi{all:unset;box-sizing:border-box;flex:1;min-width:0;width:100%;padding:0 16px;font-size:16px;color:var(--ink);min-height:52px;font-family:Mulish,sans-serif}
.kx-fo .gi::placeholder{color:var(--sub);opacity:1}
.kx-fo .gc .gi{padding:0}
.kx-fo .gr:after{content:"";position:absolute;inset:0;pointer-events:none;border:2px solid transparent;border-radius:3px}
.kx-fo .grp>.gr:first-child:after{border-top-left-radius:13px;border-top-right-radius:13px}
.kx-fo .grp>.gr:last-child:after{border-bottom-left-radius:13px;border-bottom-right-radius:13px}
.kx-fo .gr:focus-within:after,.kx-fo .gr.foc:after{border-color:#FBB040}
.kx-fo .gr.err:after{border-color:#D9483B}
.kx-fo .gr:focus-within,.kx-fo .gr.foc,.kx-fo .gr.err{box-shadow:none!important}
.kx-fo .tf{display:flex;flex-direction:column;gap:6px}
.kx-fo .lb2{font-size:15px;font-weight:700;color:var(--ink)}
.kx-fo .lb2 i{font-style:normal;font-weight:400;color:var(--sub);white-space:nowrap}
.kx-fo .ta2{font:16px/1.5 Mulish,sans-serif;color:var(--ink);background:var(--g);border:1px solid var(--gb);border-radius:14px;padding:12px 16px;min-height:104px;resize:vertical;outline:none;field-sizing:content}
.kx-fo .ta2::placeholder{color:var(--sub);opacity:1}
.kx-fo .ta2:focus{box-shadow:0 0 0 2px #FBB040;border-color:#FBB040}
.kx-fo .cnt{align-self:flex-end;font-size:13px;color:var(--sub);font-variant-numeric:tabular-nums}
.kx-fo .ck{cursor:pointer}
.kx-fo .ck .gl{gap:12px;padding-right:16px}
.kx-fo .ck:hover{background:rgba(251,176,64,.08)}
.kx-fo .bx2{width:22px;height:22px;flex:none;border-radius:6px;border:2px solid #8A8792;display:flex;align-items:center;justify-content:center;color:transparent}
.kx-fo .bx2 .ic{width:14px;height:14px}
.kx-fo .bx2.on{background:#FBB040;border-color:#FBB040;color:#2B2931}
.kx-fo .sub2{font-size:14px;color:var(--sub)}
.kx-fo .sw{cursor:pointer;position:relative;padding-right:80px}
.kx-fo .dsel{position:relative;flex:1;display:flex;align-items:center;align-self:stretch;min-width:0}
.kx-fo .dsel{padding:6px 8px 6px 8px}
.kx-fo .dsel select{appearance:none;-webkit-appearance:none;cursor:pointer;padding:0 40px 0 12px!important;width:100%;height:40px;min-height:40px;line-height:40px;text-align:left;font-size:16px;background:var(--fld);border:1px solid var(--gb);border-radius:10px;box-sizing:border-box}
.kx-fo .fm.dk .dsel select{background:#2B2931}
.kx-fo .dsel select:hover{border-color:#FBB040}
.kx-fo .dsel select option{color:var(--g-ink)}
.kx-fo .dsel .ic{position:absolute;right:20px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--ink);opacity:.75}
.kx-fo .ac2{position:relative}
.kx-fo .clr{all:unset;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--sub)}
.kx-fo .clr[hidden]{display:none}
.kx-fo .clr .ic{width:16px;height:16px}
.kx-fo .gc>.ic:first-child{margin:0;opacity:.7}
.kx-fo .acL{margin-top:6px;background:var(--g);border:1px solid var(--gb);border-radius:14px;overflow:auto;max-height:228px;display:none}
.kx-fo .acL.open{display:block}
.kx-fo .acL div{min-height:44px;display:flex;align-items:center;padding:0 16px;font-size:16px;color:var(--sub);cursor:pointer;border-top:1px solid var(--ln)}
.kx-fo .acL div:first-child{border-top:0}
.kx-fo .acL div b{color:var(--ink);font-weight:800}
.kx-fo .acL div.hl,.kx-fo .acL div:hover{background:rgba(251,176,64,.14);color:var(--ink)}
.kx-fo .acL .none{cursor:default;font-size:14px}
.kx-fo .acL .none:hover{background:none}
.kx-fo .pb{display:flex;flex-direction:column;gap:8px}
.kx-fo .pbt{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.kx-fo .pbn{font-family:Montserrat,sans-serif;font-weight:800;font-size:14px;color:var(--ink)}
.kx-fo .bad .seg3 i{background:var(--g-line)}
.kx-fo .bad .seg3 i.on{background:#FBB040}
.kx-fo .gr.sw0{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:8px;padding:8px 10px 8px 0}
.kx-fo .sw0 .gl.wide{padding-right:0!important;min-height:36px}
.kx-fo .pills{display:flex;gap:6px;flex:none;margin-left:auto}
.kx-fo .pill{all:unset;cursor:pointer;height:34px;padding:0 12px;border-radius:8px;background:var(--fld);border:1px solid var(--gb);font-size:16px;color:var(--ink);display:flex;align-items:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.kx-fo .fm.dk .pill{background:#2B2931}
.kx-fo .pill.ph0{color:var(--sub)}
.kx-fo .dsel select:invalid{color:var(--sub)}
.kx-fo .pill.act{color:#2B2931;background:#FBB040!important;border-color:#FBB040}
.kx-fo .cal,.kx-fo .tm{margin-top:8px;background:var(--g);border:1px solid var(--gb);border-radius:14px;padding:12px}
.kx-fo .cal[hidden],.kx-fo .tm[hidden]{display:none}
.kx-fo .ch2{display:flex;justify-content:space-between;align-items:center;padding:0 4px 8px}
.kx-fo .ch2 b{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--ink)}
.kx-fo .ch2 span{display:flex;gap:2px}
.kx-fo .nv{all:unset;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;color:#FBB040}
.kx-fo .nv:hover{background:rgba(251,176,64,.14)}
.kx-fo .nv .ic{width:18px;height:18px}
.kx-fo .wd,.kx-fo .dg{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.kx-fo .wd i{font-style:normal;font-size:12px;font-weight:700;color:var(--sub);padding:4px 0}
.kx-fo .dg button{all:unset;cursor:pointer;aspect-ratio:1;max-height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums;margin:1px auto;width:100%;max-width:40px}
.kx-fo .dg button:hover{background:rgba(251,176,64,.14)}
.kx-fo .dg button.td{box-shadow:inset 0 0 0 1.5px #FBB040;font-weight:800}
.kx-fo .dg button.sel{background:#FBB040;color:#2B2931;font-weight:800}
.kx-fo .dg button:disabled{color:var(--sub);opacity:.45;cursor:default;background:none}
.kx-fo .tmh{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--ink);padding:0 4px 8px}
.kx-fo .tmg{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.kx-fo .tmg button{all:unset;cursor:pointer;height:40px;border-radius:8px;border:1px solid var(--gb);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.kx-fo .tmg button:hover{border-color:#FBB040}
.kx-fo .tmg button.sel{background:#FBB040;border-color:#FBB040;color:#2B2931;font-weight:800}
.kx-fo .opt{font-style:normal;font-weight:400;color:var(--sub);white-space:nowrap}
.kx-fo .pfm .gr[data-req=date] .gv{justify-content:flex-start;align-items:center;padding:6px 16px 6px 8px}
.kx-fo .pfm .gem[hidden]{display:none}
.kx-fo .pfm .gr.err .gl{color:#B3261E}
.kx-fo .fm.dk.pfm .gr.err .gl{color:#FF8A7E}
.kx-fo .pfh.ok{color:#3FA34D;font-weight:700}
.kx-fo .bdw{display:flex;flex-direction:column;gap:0}
.kx-fo .bdw+.bdw{margin-top:12px}
.kx-fo .bdm{display:flex;gap:6px;align-items:flex-start;font-size:14px;font-weight:700;color:#B3261E;padding:8px 4px 0}
.kx-fo .fm.dk .bdm{color:#FF8A7E}
.kx-fo .bdm[hidden]{display:none}
.kx-fo .bdm .ic{flex:none;margin-top:2px}
.kx-fo .ys{display:flex;gap:6px}
.kx-fo .ybt{all:unset;cursor:pointer;font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--ink);padding:4px 10px;border-radius:8px;border:1px solid var(--gb)}
.kx-fo .ybt:hover{border-color:#FBB040}
.kx-fo .ybt.act{background:#FBB040;border-color:#FBB040;color:#2B2931}
.kx-fo .yg,.kx-fo .mg{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;max-height:220px;overflow:auto}
.kx-fo .yg button,.kx-fo .mg button{all:unset;cursor:pointer;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.kx-fo .yg button:hover,.kx-fo .mg button:hover{background:rgba(251,176,64,.14)}
.kx-fo .yg button.sel,.kx-fo .mg button.sel{background:#FBB040;color:#2B2931;font-weight:800}
.kx-fo .yg:empty,.kx-fo .mg:empty{display:none}
.kx-fo .bdc .wd,.kx-fo .bdc .dg{display:none}
.kx-fo .bdc.days .wd,.kx-fo .bdc.days .dg{display:grid}
.kx-fo .seg2{display:inline-flex;padding:4px;border-radius:999px;gap:4px}
.kx-fo .fm.dk .seg2{background:#1F1D24}
.kx-fo .fm.lt .seg2{background:var(--g-surf);box-shadow:inset 0 0 0 1px var(--g-line)}
.kx-fo .seg2 button{all:unset;cursor:pointer;height:44px;padding:0 18px;border-radius:999px;display:flex;align-items:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:15px;white-space:nowrap;color:var(--sub)}
.kx-fo .seg2 button:hover{color:var(--ink)}
.kx-fo .seg2 button:focus-visible{outline:2px solid #FBB040;outline-offset:2px}
.kx-fo .seg2 button.on{background:#FBB040;color:#2B2931;font-weight:800}
/* Felder ohne feste Fassung (.fm ohne .lt/.dk) folgen im Dunkel-Modus der dunklen Fassung */
html.un-dk .kx-fo .fm:not(.lt){background:#2B2931;border-color:#2B2931;--ink:#fff;--sub:#C9C5CF;--fld:#312F39;--bd:#6E6C78;--blk:#312F39}
html.un-dk .kx-fo .fm:not(.lt) .blk{background:#1F1D24}
html.un-dk .kx-fo .fm:not(.lt) .blk .in{background:#2B2931}
html.un-dk .kx-fo .fm:not(.lt) .em{color:#FF8A7E}
html.un-dk .kx-fo .fm:not(.lt) .lnk{color:#C9C5CF}
html.un-dk .kx-fo .fm:not(.lt) .ch.on{background:#3A3843}
html.un-dk .kx-fo .fm:not(.lt) .prog{background:#1F1D24}
html.un-dk .kx-fo .fm:not(.lt){--g:#37353F;--gb:#45434C;--ln:#46444E}
html.un-dk .kx-fo .fm:not(.lt) .gr.err .gl{color:#FF8A7E}
html.un-dk .kx-fo .fm:not(.lt) .gem{color:#FF8A7E}
html.un-dk .kx-fo .fm:not(.lt) .dsel select{background:#2B2931}
html.un-dk .kx-fo .fm:not(.lt) .pill{background:#2B2931}
html.un-dk .kx-fo .fm:not(.lt).pfm .gr.err .gl{color:#FF8A7E}
html.un-dk .kx-fo .fm:not(.lt) .bdm{color:#FF8A7E}
html.un-dk .kx-fo .fm:not(.lt) .seg2{background:#1F1D24}
/* kx:fo end */

/* Richtig / Falsch: Rahmen 3 px. Richtig UNEQ Grün (Dunkel heller #4CC25E), Falsch UNEQ Rot (Dunkel kräftiger #FF4A3D). Text in Rot bleibt --g-no (Kontrast). */
/* Erklärung in Abschnitten (.u-txs): kurze Blöcke mit Kastentitel nebeneinander, statt eines langen Absatzes */
.u-txs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px 32px}.u-txs>div{display:flex;flex-direction:column;gap:6px}.u-txs .u-kt{margin:0;font-size:17px}.u-txs .u-note{font-size:16px}

/* Umschalter (.u-seg): 2–3 kurze, gleichrangige Ansichten desselben Inhalts. Pille, aktive Option UNEQ Orange mit dunkler Schrift. Ab 4 Optionen: Reiter-Linie.
   Fläche Dunkel UNEQ Dark Blue, Hell Weiß mit feiner Kante. Option 44 px hoch, Montserrat Bold 15 px. */
.u-seg{display:inline-flex;align-self:flex-start;padding:4px;border-radius:999px;gap:4px;background:#1F1D24}.lt .u-seg,.lt.u-seg{background:#FFFFFF;box-shadow:inset 0 0 0 1px #D9D5CF}
.u-seg button{all:unset;cursor:pointer;height:44px;padding:0 20px;border-radius:999px;display:flex;align-items:center;font-family:Montserrat,sans-serif;font-weight:700;font-size:15px;white-space:nowrap;color:#D8D5DC;transition:background .2s,color .2s}.lt .u-seg button{color:#45434C}
.u-seg button:hover{color:#fff}.lt .u-seg button:hover{color:#2B2931}.u-seg button:focus-visible{outline:2px solid #FBB040;outline-offset:2px}.u-seg button.on{background:#FBB040;color:#2B2931;font-weight:800}

/* Abstand um Buttons (Kapitel Buttons). Text → Button 2 em der Textgröße, mind. 28 px. Button ↔ Button 14 px (untereinander) / 24 px (nebeneinander). Rundum frei mind. 1 Button-Höhe zu Kanten und anderen Elementen.
   Maß-Muster .u-bgap: oranger Streifen zeigt den Abstand, Wert in .ml. */
.u-cta-gap{margin-top:max(28px,2em)}
.u-bgap{position:relative;display:flex;flex-direction:column;align-items:flex-start}
.u-bgap .gz{align-self:stretch;height:max(28px,2em);position:relative;background:repeating-linear-gradient(135deg,rgba(251,176,64,.28) 0 4px,rgba(251,176,64,.1) 4px 8px)}.u-bgap .gz span{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-family:Mulish,sans-serif;font-size:12px;font-weight:800;background:#FBB040;color:#2B2931;padding:1px 8px;border-radius:999px}

/* Headline in Beispielen mit Einleitung/Untertitel: mind. 2 × Einleitung (36–48 px). */
.u-k.m{font-size:clamp(36px,calc(var(--u-cw,100cqi) * .09),48px)}

/* Download-Karte (.u-dl): Vorschau in fester Farbe (.d UNEQ Blue, .w Weiß, .k Schwarz, .o Off-White), Name, Einsatz, Format-Knöpfe (44 px hoch). Karten in .u-g. */
.u-dl{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:var(--g-surf);border:1px solid var(--g-frame);min-width:0}
.u-dl .pv{height:120px;display:flex;align-items:center;justify-content:center;padding:20px}.u-dl .pv img{display:block;max-width:90%;max-height:64px}.u-dl .pv.o img{max-height:84px}
.u-dl .pv.d{background:#2B2931}.u-dl .pv.w{background:#FFFFFF;border-bottom:1px solid var(--g-frame)}.u-dl .pv.k{background:#000000}.u-dl .pv.o{background:#F6F4F1;border-bottom:1px solid var(--g-frame)}
.u-dl .bd{padding:14px 14px 16px;display:flex;flex-direction:column;gap:4px;flex:1}.u-dl .bd b{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px;color:var(--g-ink)}.u-dl .bd>span{font-size:13px;color:var(--g-sub)}
.u-dl .fm{display:flex;gap:6px;margin-top:auto;padding-top:10px;flex-wrap:wrap}.u-dl .fm a{display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 11px;border-radius:999px;border:1.5px solid var(--g-line);font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;color:var(--g-ink);text-decoration:none;transition:border-color .15s,background .15s}.u-dl .fm a:hover{border-color:#FBB040;background:var(--g-hov)}.u-dl .fm svg{width:15px;height:15px}
.u-sec>.u-kt{margin:10px 0 -4px}
.u-dls{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:16px}

.u-favs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:24px}

/* Code-Block (.u-code): Beispielcode im Guide. Fläche UNEQ Dark Blue, 14 px. Einzige Ausnahme von Montserrat/Mulish: Code steht in der Systemschrift für Code. .k Klasse/Token orange, .v Wert apricot, .c Kommentar grau. */
.u-code{margin:0;background:#1F1D24;color:#ECEAF0;border-radius:12px;padding:18px 22px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;line-height:1.7;overflow-x:auto;white-space:pre;outline:1px solid var(--g-swb);outline-offset:-1px;min-width:0;tab-size:2}.u-code .k{color:#FBB040}.u-code .v{color:#FAB784}.u-code .c{color:#9C9AA3}
.u-code.u-no{outline:3px solid var(--g-nob);outline-offset:-3px}.u-code.u-ok{outline:3px solid var(--g-okb);outline-offset:-3px}
/* Download-Platzhalter: Dateityp statt Vorschau (.ft), Knopf noch nicht verfügbar (.off) */
.u-dl .pv .ft{font-family:Montserrat,sans-serif;font-weight:900;font-size:24px;letter-spacing:.04em;color:#FBB040}.u-dl .fm .off{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;border:1.5px dashed var(--g-line);font-family:Montserrat,sans-serif;font-weight:800;font-size:13px;color:var(--g-mute)}

/* kx:ds start · Kapitel Design-Stack */
.kx-ds .flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}@container (max-width:836px){.kx-ds .flow{grid-template-columns:repeat(2,minmax(0,1fr))}}@container (max-width:520px){.kx-ds .flow{grid-template-columns:1fr}}
.kx-ds .flow>div{position:relative;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:8px;min-width:0}.kx-ds .flow>div:not(:last-child):after{content:"";position:absolute;right:-17px;top:50%;width:10px;height:10px;border-top:2px solid #FBB040;border-right:2px solid #FBB040;transform:translateY(-50%) rotate(45deg)}@container (max-width:836px){.kx-ds .flow>div:after{display:none}}
.kx-ds .flow i{width:28px;height:28px;border-radius:50%;background:#FBB040;color:#2B2931;font-style:normal;font-family:Montserrat,sans-serif;font-weight:900;font-size:13px;display:flex;align-items:center;justify-content:center}.kx-ds .flow b{font-family:Montserrat,sans-serif;font-weight:800;font-size:15px}.kx-ds .flow code{font-size:13px;color:var(--g-sub);overflow-wrap:anywhere}
.kx-ds .sw{display:inline-block;width:22px;height:22px;border-radius:6px;vertical-align:middle;margin-right:10px;box-shadow:inset 0 0 0 1px rgba(43,41,49,.12),0 0 0 1px var(--g-swb)}
.kx-ds .pair{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:stretch}@container (max-width:740px){.kx-ds .pair{grid-template-columns:1fr}}
.kx-ds .res{border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;padding:28px;min-width:0}.kx-ds .res.dk{background:#2B2931;outline:1px solid var(--g-swb);outline-offset:-1px}.kx-ds .res.lt{background:#FFFFFF;border:1px solid #E8E3DD}
.kx-ds .res h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:26px;line-height:1.03}.kx-ds .res p{margin:0;font-size:16px;color:var(--g-sub)}.kx-ds .res .u-eb{font-size:13px;margin:0}
/* kx:ds end */

/* kx:ve start · Kapitel Videoelemente. Video-Fläche .vf (16:9, .v = 9:16), Maße in cqi = % der Bildbreite. Bauchbinde .lt3 (.hl = helle Fassung). Animation nur unter .vf.run. */
.kx-ve .vf{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:#1F1D24;container-type:inline-size;min-width:0}.kx-ve .vf.v{aspect-ratio:9/16;max-width:300px;width:100%;justify-self:center}
.kx-ve .vf>img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.kx-ve .vf.run>img.bg{animation:kx-ve-kb 18s ease-in-out infinite alternate}
.kx-ve .vf .phl{position:absolute;left:12px;top:12px;z-index:3;font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:rgba(31,29,36,.85);color:#fff;padding:5px 10px;border-radius:999px}
.kx-ve .vf.paused *,.kx-ve .tl.paused *{animation-play-state:paused!important}
@keyframes kx-ve-kb{from{transform:scale(1)}to{transform:scale(1.07) translateX(-1.5%)}}
@media(prefers-reduced-motion:reduce){.kx-ve .vf.run *,.kx-ve .tl .ph{animation:none!important}}
.kx-ve .ctl{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.kx-ve .tlw{display:flex;flex-direction:column;gap:10px}.kx-ve .tll{display:flex;flex-wrap:wrap;gap:8px 20px;font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;color:var(--g-sub)}.kx-ve .tll span{display:inline-flex;align-items:center;gap:8px}.kx-ve .tll i{width:14px;height:14px;border-radius:3px;border:1px solid var(--g-frame)}.kx-ve .tll i.a{background:#FBB040;border-color:#FBB040}.kx-ve .tll i.h{background:var(--g-surf)}.kx-ve .tll i.z{background:repeating-linear-gradient(135deg,var(--g-alt) 0 3px,var(--g-hov) 3px 6px)}
.kx-ve .tl{position:relative;display:flex;height:24px;border-radius:8px;overflow:hidden;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;border:1px solid var(--g-frame)}.kx-ve .tl>span{display:flex;align-items:center;padding:0 10px;white-space:nowrap;overflow:hidden;min-width:0}
.kx-ve .tl .a{background:#FBB040;color:#2B2931}.kx-ve .tl .h{background:var(--g-surf);color:var(--g-ink)}.kx-ve .tl .z{background:repeating-linear-gradient(135deg,var(--g-alt) 0 6px,var(--g-hov) 6px 12px);color:var(--g-mute)}
.kx-ve .tl .ph{position:absolute;top:0;bottom:0;left:0;width:2px;background:#D9483B;animation:kx-ve-ph 9s linear infinite}@keyframes kx-ve-ph{from{left:0}to{left:calc(100% - 2px)}}
.kx-ve .ui{position:absolute;left:0;right:0;bottom:0;height:20%;z-index:3;background:linear-gradient(transparent,rgba(0,0,0,.75));display:flex;align-items:flex-end;justify-content:space-between;padding:0 6cqi 5cqi;color:#fff;font-size:4.2cqi;font-weight:700}.kx-ve .ui i{display:block;width:9cqi;height:9cqi;border-radius:50%;background:rgba(255,255,255,.85)}
.kx-ve .io{position:relative;aspect-ratio:16/9;border-radius:12px;background:#2B2931;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4%;container-type:inline-size;outline:1px solid var(--g-swb);outline-offset:-1px}.kx-ve .io img{display:block}.kx-ve .io .u1{width:34cqi}.kx-ve .io .d1{width:30cqi}.kx-ve .io .u2{width:12cqi;opacity:.9}.kx-ve .io small{font-family:Montserrat,sans-serif;font-weight:700;font-size:3cqi;color:#C9C5CF;letter-spacing:.06em}.kx-ve .io .eq{display:flex;align-items:center;gap:8cqi}.kx-ve .io .eq img{width:26cqi}
.kx-ve .io .phl{position:absolute;left:12px;top:12px;font-family:Montserrat,sans-serif;font-weight:800;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:#1F1D24;color:#C9C5CF;padding:5px 10px;border-radius:999px}.kx-ve .io .du{position:absolute;right:12px;bottom:12px;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;background:rgba(31,29,36,.85);color:#fff;padding:3px 8px;border-radius:4px}
.kx-ve .io.u-no{outline:3px solid var(--g-nob);outline-offset:-3px}
/* Bauchbinde Fläche (.bb2): Eyebrow oben, Name, optional Zusatzzeile (.t3). Hell = .hl. Linienfeld rechts in der Fläche angeschnitten. Maße in em der Namensgröße (2,6 % der Bildbreite) */
.kx-ve .bb2{position:absolute;left:6cqi;bottom:5.6cqi;z-index:2;font-size:2.6cqi}.kx-ve .vf.v .bb2{font-size:4.6cqi;left:7cqi;bottom:39cqi}.kx-ve .vf.v .bb2 .bx{padding-right:6.2em;max-width:86cqi}.kx-ve .vf.v .bb2 .lw{width:5em}
.kx-ve .bb2 .bx{position:relative;height:3.6em;padding:0 9.6em 0 1.2em;border-radius:.24em;overflow:hidden;background:#2B2931;display:flex;flex-direction:column;justify-content:center}.kx-ve .bb2.t3 .bx{height:4.6em}
.kx-ve .bb2 .lw{position:absolute;top:0;bottom:0;right:0;width:7.6em}.kx-ve .bb2 .lw .u-lf,.kx-ve .lb .lw .u-lf{--p:8px}
.kx-ve .bb2 em,.kx-ve .lb em{display:block;font-style:normal;font-family:Montserrat,sans-serif;font-weight:800;font-size:.44em;letter-spacing:.18em;text-transform:uppercase;color:#FBB040;margin:0 0 .5em;white-space:nowrap}.kx-ve .bb2 em i{font-style:normal}
.kx-ve .bb2 b{display:block;font-family:Montserrat,sans-serif;font-weight:800;font-size:1em;line-height:1.15;color:#fff;white-space:nowrap}
.kx-ve .bb2 small,.kx-ve .lb small{display:block;font-family:Mulish,sans-serif;font-weight:600;font-size:.5em;color:#D8D5DC;margin-top:.5em;white-space:nowrap}
.kx-ve .bb2 em+b+em{margin:.5em 0 0}.kx-ve .bb2 b+em{margin:.5em 0 0}
.kx-ve .bb2.hl .bx{background:rgba(255,255,255,.95)}.kx-ve .bb2.hl b,.kx-ve .bb2.hl em{color:#2B2931}.kx-ve .bb2.hl em i{color:#FBB040}.kx-ve .bb2.hl small{color:#45434C}
/* Laufband (.vf.lb): kein Kasten, Verlauf unten, Linien neben dem Namen bis zum rechten Rand */
.kx-ve .lb .vg{position:absolute;left:0;right:0;bottom:0;height:55%;z-index:1;background:linear-gradient(rgba(31,29,36,0),rgba(31,29,36,.6) 45%,rgba(31,29,36,.95))}
.kx-ve .lb .tx{position:absolute;left:6cqi;right:0;bottom:5.6cqi;z-index:2;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:3cqi;font-size:3.2cqi}.kx-ve .lb .tx>*{grid-column:1}
.kx-ve .lb em{font-size:.4em;margin-bottom:.45em}.kx-ve .lb b{font-family:Montserrat,sans-serif;font-weight:900;font-size:1em;line-height:1.02;color:#fff;white-space:nowrap}.kx-ve .lb small{font-size:.44em;margin-top:.55em}
.kx-ve .lb .tx>.lw{grid-column:2;grid-row:2;position:relative}
/* Bewegung nur unter .vf.run: von links nach rechts aufdecken, Linien danach, nach rechts wegwischen */
@keyframes kx-ve-io{0%{clip-path:inset(-30% 100% -30% 0);animation-timing-function:cubic-bezier(.2,.7,.2,1)}8%,63%{clip-path:inset(-30% -5% -30% 0);animation-timing-function:cubic-bezier(.6,0,.8,.3)}71%,100%{clip-path:inset(-30% -5% -30% 100%)}}
@keyframes kx-ve-li{0%,5%{clip-path:inset(0 100% 0 0);animation-timing-function:cubic-bezier(.2,.7,.2,1)}12%,100%{clip-path:inset(0)}}
@keyframes kx-ve-vg{0%{opacity:0}8%,66%{opacity:1}76%,100%{opacity:0}}
.kx-ve .vf.run .bb2>.in,.kx-ve .vf.run.lb .tx{animation:kx-ve-io 9s infinite both}.kx-ve .vf.run.lb .vg{animation:kx-ve-vg 9s infinite both}
/* Linien fahren einzeln von links unten nach rechts oben hoch, je 0,5 s, jede 25 ms nach der vorigen. Beim Abbau fahren sie in derselben Richtung hinaus (rechts oben), danach wird der Text nach rechts weggewischt */
.kx-ve .vf.run .lw .u-lf path{stroke-dasharray:1 1;stroke-dashoffset:1;animation:kx-ve-ln 9s infinite both;animation-delay:calc(var(--i) * 25ms)}
@keyframes kx-ve-ln{0%,5%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.7,.2,1)}11%,56%{stroke-dashoffset:0;animation-timing-function:cubic-bezier(.6,0,.8,.3)}61%,100%{stroke-dashoffset:-1}}
@media(prefers-reduced-motion:reduce){.kx-ve .vf.run .lw .u-lf path{animation:none!important;stroke-dashoffset:0}}
/* kx:ve end */

/* kx:mo start · Kapitel Modals. Bühne .stg (Seite dahinter), Hintergrund .ov, Modal .md. Farben über Variablen, folgen Hell/Dunkel. .static = dauerhaft offen (Beispielbild). */
.kx-mo .stg{position:relative;border-radius:12px;overflow:hidden;min-height:420px;background:var(--g-alt);border:1px solid var(--g-frame);color:var(--g-ink);padding:28px;display:flex;flex-direction:column;gap:12px;min-width:0}.kx-mo .stg.sm{min-height:320px;padding:20px}
.kx-mo .stg .pl{height:12px;border-radius:6px;background:var(--g-line);opacity:.6}.kx-mo .stg .pl.h{height:22px;width:55%;opacity:.9}.kx-mo .stg .pl.s{width:70%}.kx-mo .stg .cdz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}.kx-mo .stg .cdz i{height:84px;border-radius:10px;background:var(--g-surf);border:1px solid var(--g-frame)}
.kx-mo .ov{position:absolute;inset:0;z-index:5;background:rgba(31,29,36,.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.kx-mo .ov.open,.kx-mo .static .ov{opacity:1;visibility:visible}
.kx-mo .md{position:relative;width:min(100%,560px);background:var(--g-surf);color:var(--g-ink);border-radius:14px;padding:28px;box-shadow:0 24px 64px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:12px;transform:translateY(8px) scale(.98);transition:transform .2s cubic-bezier(.2,.7,.2,1);outline:1px solid var(--g-swb);outline-offset:-1px}.kx-mo .ov.open .md,.kx-mo .static .md{transform:none}.kx-mo .md:focus{outline:1px solid var(--g-swb)}
.kx-mo .md.s{width:min(100%,400px)}.kx-mo .stg.sm .md{padding:20px;gap:10px}
.kx-mo .md h3{margin:0 44px 0 0;font-family:Montserrat,sans-serif;font-weight:900;font-size:24px;line-height:1.1;display:flex;align-items:center;gap:12px}.kx-mo .stg.sm .md h3{font-size:19px}.kx-mo .md p{margin:0;font-size:16px;line-height:1.55;color:var(--g-sub)}.kx-mo .stg.sm .md p{font-size:14px}
.kx-mo .md>.x{all:unset;position:absolute;top:10px;right:10px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--g-ink);cursor:pointer}.kx-mo .md>.x:hover{background:var(--g-hov)}.kx-mo .md>.x:focus-visible{outline:3px solid #FBB040}.kx-mo .md>.x svg{width:22px;height:22px}
.kx-mo .md .act{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:16px;flex-wrap:wrap}.kx-mo .stg.sm .md .act{gap:14px;margin-top:8px}.kx-mo .stg.sm .u-btn{--fs:13px;min-height:40px;padding:.6em 1.1em}
.kx-mo .md .st{flex:none;width:32px;height:32px;border-radius:50%;background:#D9483B;display:inline-flex;align-items:center;justify-content:center}.kx-mo .md .st svg{width:18px;height:18px;stroke:#fff}
.kx-mo .md .scr{max-height:110px;overflow:hidden;position:relative}.kx-mo .md .scr:after{content:"";position:absolute;left:0;right:0;bottom:0;height:40px;background:linear-gradient(transparent,var(--g-surf))}
.kx-mo .md .fld{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700}.kx-mo .md .fld span{min-height:44px;border-radius:8px;border:1.5px solid #8A8792;background:var(--g-surf);display:flex;align-items:center;padding:0 12px;font-weight:400;font-size:16px;color:var(--g-ink)}
.kx-mo .msz{display:flex;flex-direction:column;gap:14px;background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;padding:24px}.kx-mo .msz>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center}.kx-mo .msz b{font-family:Montserrat,sans-serif;font-weight:800}.kx-mo .msz b small{display:block;font-family:Mulish,sans-serif;font-weight:400;font-size:13px;color:var(--g-sub)}.kx-mo .msz i{display:flex;align-items:center;height:44px;border-radius:8px;background:var(--g-alt);border:1px solid var(--g-line);padding:0 12px;font-style:normal;font-size:13px;font-weight:700;color:var(--g-sub)}
.kx-mo .u-phone{position:relative;padding:0;gap:0;min-height:520px}.kx-mo .u-phone .stg{border:0;border-radius:0;flex:1;min-height:0;padding:22px 16px}.kx-mo .u-phone .ov{align-items:flex-end;padding:0}
.kx-mo .sheet{width:100%;background:var(--g-surf);color:var(--g-ink);border-radius:14px 14px 0 0;padding:10px 20px 22px;display:flex;flex-direction:column;gap:10px;box-shadow:0 -12px 40px rgba(0,0,0,.3)}.kx-mo .sheet .gr{align-self:center;width:36px;height:4px;border-radius:2px;background:var(--g-line);margin-bottom:8px}.kx-mo .sheet h3{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:20px;line-height:1.1}.kx-mo .sheet p{margin:0;font-size:15px;color:var(--g-sub)}.kx-mo .sheet .act{display:flex;flex-direction:column;gap:14px;margin-top:10px}.kx-mo .sheet .u-btn{width:100%}
/* Einführung in Schritten (.md.ob): Bild oben randabfallend 16:9, Text, Fuß mit Fortschritt (.u-seg4) und Buttons */
.kx-mo .md.ob,.kx-mo .stg.sm .md.ob{padding:0;gap:0;overflow:hidden}.kx-mo .stg[data-ob]{min-height:640px}.kx-mo .stg.sm:has(.md.ob){min-height:400px}.kx-mo .stg.sm .md.ob .opic{aspect-ratio:auto;height:96px}.kx-mo .md.ob>.x{z-index:2;background:rgba(31,29,36,.55);color:#fff}.kx-mo .md.ob>.x:hover{background:rgba(31,29,36,.8)}
.kx-mo .ost{display:flex;flex-direction:column;animation:kx-mo-f .2s ease}.kx-mo .ost[hidden]{display:none}@keyframes kx-mo-f{from{opacity:0}to{opacity:1}}
.kx-mo .opic{aspect-ratio:16/9;background:#1F1D24;overflow:hidden;display:flex;align-items:center;justify-content:center}.kx-mo .opic img{width:100%;height:100%;object-fit:cover;display:block}.kx-mo .opic.ic{background:var(--g-alt)}
.kx-mo .oic{width:96px;height:96px;border-radius:50%;background:#FBB040;color:#2B2931;display:flex;align-items:center;justify-content:center}.kx-mo .oic svg{width:48px;height:48px}.kx-mo .stg.sm .opic{aspect-ratio:21/9}.kx-mo .stg.sm .oic{width:56px;height:56px}.kx-mo .stg.sm .oic svg{width:28px;height:28px}
.kx-mo .obd{padding:24px 28px 8px;display:flex;flex-direction:column;gap:10px}.kx-mo .obd h3{margin:0}.kx-mo .stg.sm .obd{padding:16px 20px 4px}
.kx-mo .ofo{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px 24px;flex-wrap:wrap}.kx-mo .stg.sm .ofo{padding:12px 20px 18px}
.kx-mo .oprg{display:flex;flex-direction:column;gap:8px;min-width:120px}.kx-mo .oprg small{font-size:13px;color:var(--g-sub)}.kx-mo .oprg small b{color:var(--g-ink)}.kx-mo .oact{display:flex;align-items:center;gap:24px;margin-left:auto}.kx-mo .oact .u-btn svg{order:2}
.u-seg4{display:flex;gap:4px;width:120px}.u-seg4 i{flex:1;height:5px;border-radius:3px;background:var(--g-line)}.u-seg4 i.on{background:#FBB040}.u-seg4.many{width:160px;gap:3px}
.kx-mo .md.ob .ofo{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}.kx-mo .md.ob .ofo>.u-btn.x{justify-self:start}.kx-mo .md.ob .ofo>.u-btn.p{justify-self:end}.kx-mo .ofo .hid{visibility:hidden}
.kx-mo .odots{width:80px;height:12px;overflow:hidden}.kx-mo .otr{display:flex;transition:transform .3s cubic-bezier(.2,.7,.2,1)}.kx-mo .otr i{flex:none;width:16px;height:12px;position:relative}.kx-mo .otr i:before{content:"";position:absolute;left:4px;top:2px;width:8px;height:8px;border-radius:50%;background:var(--g-line);transition:transform .3s,background .3s}.kx-mo .otr i.on:before{background:#FBB040}.kx-mo .otr i.sm:before{transform:scale(.6)}.kx-mo .otr i.out:before{transform:scale(0)}
.kx-mo .osr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kx-mo .md .act>.u-btn.p:only-child{margin-left:auto}
/* Bühne als angedeutete Website (.stg.ws): Kopfzeile, Einstieg mit Button, Karten, Footer */
.kx-mo .stg.ws{padding:0;gap:0}.kx-mo .wsh{display:flex;align-items:center;gap:24px;height:60px;padding:0 24px;background:var(--g-surf);border-bottom:1px solid var(--g-frame)}.kx-mo .wsh img{height:18px;display:block}.kx-mo .wsh .lg-d,html.un-dk .kx-mo .wsh .lg-l{display:none}html.un-dk .kx-mo .wsh .lg-d{display:block}
.kx-mo .wsh nav{display:flex;gap:20px;margin-left:auto;font-family:Montserrat,sans-serif;font-weight:700;font-size:13px;color:var(--g-sub)}.kx-mo .wsh .av{width:32px;height:32px;border-radius:50%;background:#FBB040;color:#2B2931;font-style:normal;font-family:Montserrat,sans-serif;font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;flex:none}
.kx-mo .wsb{padding:40px 32px 28px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;font-size:32px}.kx-mo .wsb .u-eb{margin:0}.kx-mo .wsb h4{margin:0;font-family:Montserrat,sans-serif;font-weight:900;font-size:32px;line-height:1.05;color:var(--g-ink)}.kx-mo .wsb p{margin:0 0 14px;font-size:16px;line-height:1.55;color:var(--g-sub);max-width:46ch}
.kx-mo .wsc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0 32px 32px}.kx-mo .wsc>div{background:var(--g-surf);border:1px solid var(--g-frame);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;gap:8px;padding-bottom:16px}.kx-mo .wsc i{display:block;aspect-ratio:16/9;background:var(--g-ph)}.kx-mo .wsc b{display:block;height:12px;margin:6px 16px 0;border-radius:6px;background:var(--g-line);width:60%}.kx-mo .wsc s{display:block;height:9px;margin:0 16px;border-radius:5px;background:var(--g-line);opacity:.6}
.kx-mo .wsf{margin-top:auto;height:56px;background:#1F1D24}
/* kx:mo end */

/* Navigation: eingeklappte Seitenleiste (.shell.col). 248 → 72 px in 0,2 s. Logo → Zeichen (.mk), Knopf unter das Zeichen, Menüpunkte nur Icon mit Namen beim Darüberfahren, Gruppen als Trennlinie, Zähler als Punkt. */
.kx-nv .shell{transition:grid-template-columns .2s cubic-bezier(.2,.7,.2,1)}.kx-nv .as{position:relative}.kx-nv .ah .mk{display:none;width:32px;height:32px;flex:none;border-radius:8px}
.kx-nv .shell.col{grid-template-columns:72px minmax(0,1fr)}.kx-nv .shell.col .ah{padding:0;justify-content:center}.kx-nv .shell.col .lgx{display:none}.kx-nv .shell.col .ah .mk{display:block}
.kx-nv .shell.col .ah .ab{position:absolute;top:72px;left:14px;margin:0;width:44px;height:44px;border-radius:8px}.kx-nv .shell.col .ah .ab:hover{background:rgba(255,255,255,.06);opacity:1}.kx-nv .shell.lt.col .ah .ab:hover{background:var(--g-alt)}
.kx-nv .shell.col .anv{padding:64px 0 12px;align-items:center}.kx-nv .shell.col .ag{align-items:center;margin-top:8px}
.kx-nv .shell.col .ai{width:44px;min-height:44px;padding:0;justify-content:center}.kx-nv .shell.col .ai span{display:none}.kx-nv .shell.col .ai .ic{width:19px;height:19px}
.kx-nv .shell.col .ai em{position:absolute;top:7px;right:7px;min-width:0;width:9px;height:9px;padding:0;font-size:0;box-shadow:0 0 0 2px #1F1D24}.kx-nv .shell.lt.col .ai em{box-shadow:0 0 0 2px var(--g-surf)}
.kx-nv .shell.col .agh{font-size:0;min-height:12px;width:32px;padding:0;justify-content:center;pointer-events:none}.kx-nv .shell.col .agh:before{content:"";flex:1;height:1px;background:#3A3843;margin:0}.kx-nv .shell.lt.col .agh:before{background:var(--g-frame)}.kx-nv .shell.col .agh .ic{display:none}
.kx-nv .shell.col .af{display:flex;justify-content:center;padding:10px 0 14px}
.kx-nv .shell.col .ai:hover:after,.kx-nv .shell.col .ai:focus-visible:after{content:attr(data-tip);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);background:#312F39;color:#fff;font-family:Montserrat,sans-serif;font-size:13px;font-weight:700;white-space:nowrap;padding:7px 11px;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:10;pointer-events:none}

/* Helle Kante auf Dunkel (18 % Weiß) immer nur am äußeren Element mit runden Ecken, nie an inneren Flächen: sonst läuft eine eckige Linie in die Rundung und die Ecke sieht doppelt aus. */
.u-sw,.u-dl{outline:1px solid var(--g-swb);outline-offset:-1px}

/* KI-Kit (.u-kit, Startseite): in .u-show. Rechts zwei .u-go-Karten untereinander (Website für Menschen, KI-Kit für die KI).
   Darunter über volle Breite die Anweisung zum Kopieren (.u-kit-p): Fläche wie Karte, Mulish 16 px, Button „Anweisung kopieren“.
   Dateiliste .u-kit-f: Pillen 44 px hoch, feiner Rahmen. Hell und Dunkel nur über Variablen. */
.u-kit .u-kit-c{display:flex;flex-direction:column;gap:max(16px,1.5em);font-size:16px}
.u-kit .u-kit-c .u-go{flex-direction:row;align-items:flex-start;gap:16px}.u-kit .u-kit-c .u-go .u-cc{margin:0}
.u-kit .u-kit-c .u-go>div{display:flex;flex-direction:column;gap:6px;min-width:0}.u-kit .u-kit-c .u-go>div>span{font-size:15px;line-height:1.5;color:var(--g-sub)}
.u-kit .u-kit-c .u-go em{margin-top:4px}
.u-kit-p{grid-column:1/-1;display:flex;flex-direction:column;gap:max(16px,1em);padding:clamp(20px,3cqi,32px);border-radius:12px;background:var(--g-surf);border:1px solid var(--g-frame)}
.u-kit-p .u-kt{margin:0}
.u-kit-p blockquote{margin:0;padding:16px 18px;border-radius:8px;background:var(--g-alt);border:1px solid var(--g-line);font-family:Mulish,sans-serif;font-size:16px;line-height:1.6;color:var(--g-ink);max-width:none}
.u-kit-p .u-cta{margin-top:max(12px,.5em)}
.u-kit-f{display:flex;flex-wrap:wrap;gap:8px}.u-kit-f a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--g-line);color:var(--g-ink);font-family:Montserrat,sans-serif;font-weight:700;font-size:14px;text-decoration:none;transition:border-color .2s}
.u-kit-f a:hover{border-color:#FBB040}.u-kit-f a:focus-visible{outline:2px solid #FBB040;outline-offset:2px}.u-kit-f a code{font-family:inherit;font-weight:500;color:var(--g-sub)}
.u-kit-p blockquote{overflow-wrap:anywhere}.u-kit-f a{white-space:nowrap}
@container (max-width:700px){.u-kit-p{padding:16px}.u-kit-f a code{display:none}}