@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/inter-latin.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500 800;font-display:swap;src:url(fonts/jetbrains-mono-latin.woff2) format('woff2')}

:root{
  --bg:#FFFFFF;--surface:#F7F7F7;--surface-2:#EEEEEE;--dark:#0A0A0A;--dark-2:#171717;
  --text:#0A0A0A;--text-2:#404040;--muted:#737373;--on-dark:#FAFAFA;--on-dark-2:rgba(250,250,250,.74);
  --orange:#FF6A00;--orange-2:#E55A00;--orange-3:#FF8A33;
  --line:#E6E6E6;--line-dark:rgba(255,255,255,.08);--tint:rgba(255,106,0,.08);--tint-2:rgba(255,106,0,.16);
  --success:#16A34A;--warning:#F59E0B;--error:#DC2626;
  --r-sm:6px;--r-md:10px;--r-lg:14px;--r-xl:20px;
  --shadow:0 4px 24px rgba(0,0,0,.08);--shadow-o:0 8px 48px rgba(255,106,0,.12);
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono','Cascadia Mono',Consolas,'SF Mono',Menlo,monospace;
  --kopf-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{color-scheme:light;scroll-behavior:smooth;scroll-padding-top:calc(var(--kopf-h) + 16px);-webkit-text-size-adjust:100%}
body{margin:0;counter-reset:marke;background:var(--bg);color:var(--text-2);font:400 18px/1.55 var(--font);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;color:var(--text);line-height:1.15;text-wrap:balance}
h1{font-size:clamp(2.4rem,5vw,4.25rem);font-weight:750;letter-spacing:-.025em}
h2{font-size:clamp(1.75rem,3vw,2.6rem);font-weight:700;letter-spacing:-.015em}
h3{font-size:1.2rem;font-weight:650;line-height:1.25}
h4{font-size:1rem;font-weight:650;line-height:1.3}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
svg{width:24px;height:24px;flex:none}
.ic{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ib{display:grid;place-items:center;flex:none}
:focus-visible{outline:3px solid var(--dark);outline-offset:3px;border-radius:var(--r-sm)}

.wrap{width:100%;max-width:1600px;margin-inline:auto;padding-inline:clamp(20px,3vw,40px)}
.sprung{position:absolute;left:16px;top:-64px;z-index:100;padding:12px 16px;background:var(--dark);color:var(--on-dark);border-radius:var(--r-md);font-weight:650;text-decoration:none}
.sprung:focus{top:16px}

section{padding-block:96px}
.grau{background:var(--surface)}
.dunkel{background:var(--dark);color:var(--on-dark-2)}
.dunkel h2,.dunkel h3,.dunkel h4{color:var(--on-dark)}

.sek-kopf{max-width:820px;margin-bottom:48px}
.lede{margin-top:16px;font-size:1.15rem;color:var(--text-2);max-width:60ch}
.dunkel .lede{color:var(--on-dark-2)}

/* Marke über jeder Abschnittsüberschrift, Nummer kommt aus dem Zähler */
.eyebrow{display:inline-block;margin-bottom:16px;padding:8px 12px;border-radius:var(--r-sm);background:var(--dark);color:var(--on-dark);font:600 14px/1 var(--mono)}
.eyebrow::before{counter-increment:marke;content:counter(marke,decimal-leading-zero) " ";color:var(--orange);white-space:pre}
.dunkel .eyebrow{background:var(--orange);color:var(--dark)}
.dunkel .eyebrow::before{color:var(--dark)}
.pille{display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:14px;font-weight:600;color:var(--text)}
.pille i{width:8px;height:8px;border-radius:50%;background:var(--orange)}
.mark{background:linear-gradient(transparent 60%,var(--tint-2) 60%)}
.tag{display:inline-block;padding:4px 12px;border-radius:var(--r-sm);background:var(--tint-2);color:var(--text);font-size:14px;font-weight:600;line-height:1.4}

/* Knöpfe */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:16px 24px;border:1px solid var(--orange);border-radius:var(--r-md);background:var(--orange);color:var(--dark);font:650 18px/1.3 var(--font);text-decoration:none;text-align:center;cursor:pointer;transition:background .2s ease}
.btn:hover{background:var(--orange-3)}
.btn svg{width:20px;height:20px}
.btn.klein{padding:12px 16px;font-size:16px}
.btn.linie{background:var(--bg);border-color:var(--dark)}
.btn.linie:hover{background:var(--surface-2)}

/* Kopfzeile */
.kopf{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.kopf-in{display:flex;align-items:center;gap:32px;min-height:var(--kopf-h)}
.logo{display:block;flex:none}
.logo img{width:auto;height:40px}
.nav{display:flex;gap:24px;margin-left:auto}
.nav a{padding:8px 0;font-size:16px;font-weight:600;color:var(--text-2);text-decoration:none;border-bottom:2px solid transparent;transition:color .2s ease,border-color .2s ease}
.nav a:hover{color:var(--text);border-color:var(--orange)}
.kopf-rechts{display:flex;align-items:center;gap:16px}
.kopf-tel{display:inline-flex;align-items:center;gap:8px;font:600 16px/1 var(--mono);color:var(--text);text-decoration:none;white-space:nowrap}
.kopf-tel svg{width:20px;height:20px;color:var(--orange-2)}
.menue-knopf{display:none;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--text);cursor:pointer}

/* Hero */
.hero{padding-top:96px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:64px;align-items:center}
.hero-sub{margin-top:24px;font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:650;line-height:1.3;color:var(--text)}
.hero-text{margin-top:12px;font-size:clamp(1.1rem,1.4vw,1.25rem);max-width:46ch}
.nutzen{display:grid;gap:16px;margin-top:32px}
.nutzen li{display:flex;gap:16px;align-items:flex-start}
.nutzen .haken{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-md);background:var(--orange);color:var(--dark);flex:none}
.nutzen .haken svg{width:20px;height:20px}
.nutzen b{display:block;color:var(--text);font-weight:650;line-height:1.3}
.nutzen span span{display:block;font-size:16px;color:var(--text-2)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:32px}
.hero-hinweis{font-size:15px;color:var(--muted);max-width:280px;line-height:1.4}
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r-xl);overflow:hidden;background:var(--dark);box-shadow:var(--shadow)}
.video img{width:100%;height:100%;object-fit:cover}
.video iframe,.video video{position:absolute;inset:0;width:100%;height:100%;border:0}
.video video{background:#000}
.video-start{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;width:100%;padding:24px;border:0;background:transparent;color:var(--on-dark);font-family:var(--font);cursor:pointer}
.play{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--orange);color:var(--dark);transition:box-shadow .2s ease}
.play svg{width:28px;height:28px;margin-left:4px}
.video-start:hover .play{box-shadow:0 0 0 12px rgba(255,106,0,.25)}
.video-text{font-size:15px;line-height:1.4;text-align:center}
.video-text b{display:block;font-size:1.12rem;font-weight:650}
.zahlen-karte{margin-top:32px}
.zahlen-karte p{font:600 14px/1 var(--mono);color:var(--muted)}
.zahlen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:16px}
.zahlen div{border-top:3px solid var(--dark);padding-top:12px}
.zahlen div:first-child{border-color:var(--orange)}
.zahlen b{display:block;font-size:clamp(1.75rem,2.8vw,2.6rem);font-weight:750;line-height:1.05;letter-spacing:-.02em;color:var(--text)}
.zahlen span{font-size:15px;color:var(--text-2)}

/* Vertrauensleiste */
.vertrauen{margin-top:96px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.vertrauen-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 32px;padding-block:24px}
.bew-badge{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.bew-badge .g{width:32px;height:32px}
.bew-zeile{display:flex;align-items:center;gap:8px;line-height:1.1}
.bew-wert{font-size:24px;font-weight:750;letter-spacing:-.02em}
.bew-sterne{color:#F5A400;font-size:20px;letter-spacing:2px}
.bew-meta{display:block;font-size:14px;color:var(--text-2);text-decoration:underline;text-underline-offset:3px}
.v-fakt{display:flex;align-items:center;gap:12px;font-size:15px;line-height:1.3;color:var(--text-2)}
.v-fakt b{font-size:24px;font-weight:750;letter-spacing:-.02em;color:var(--text);white-space:nowrap}
.v-logos{display:flex;flex-wrap:wrap;align-items:center;gap:24px 32px}
.v-logos img{width:auto;height:32px}
.proven{display:inline-flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--text);line-height:1.1}
.proven b{font-size:18px;font-weight:750}
.proven b span{color:#F5A400;letter-spacing:2px;margin-left:4px}
.proven small{font-size:14px;color:var(--text-2);text-decoration:underline;text-underline-offset:3px}

/* Karten allgemein */
.problem,.pfad,.fall,.offen li,.ablauf li,.k-selbst,.fragen details,.kontaktweg{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg)}
.problem,.pfad,.fall,.ablauf li,.k-selbst{box-shadow:var(--shadow)}

/* Probleme */
.probleme{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.problem{display:flex;gap:16px;align-items:flex-start;padding:32px}
.pz{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--surface);color:var(--error);flex:none}
.pz svg{width:22px;height:22px}
.problem p{margin-top:8px;font-size:16px}
.loesung{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;margin-top:24px;padding:32px;border:2px solid var(--orange);border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--shadow-o)}
.loesung h3{font-size:1.5rem}
.loesung p{margin-top:8px}
.loesung-cta{display:flex;flex-direction:column;align-items:center;gap:12px}
.loesung .mehr{font-size:15px;font-weight:650;color:var(--text);text-underline-offset:4px}

/* Leistungen als Schrank mit drei Fächern */
.schrank{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow);overflow:hidden}
.schrank-kopf{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px 32px;background:var(--dark);color:var(--on-dark);font:500 16px/1.3 var(--mono)}
.schrank-kopf b{color:var(--orange);font-weight:600}
.schrank-kopf .ic{color:var(--orange)}
.faecher{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.fach{display:flex;flex-direction:column;padding:32px;border-right:1px solid var(--line)}
.fach:last-child{border-right:0}
.fach-hl{background:var(--tint)}
.fach-kopf{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.fach-kopf .ib{width:48px;height:48px;border-radius:var(--r-md);background:var(--surface);color:var(--text)}
.fach-hl .fach-kopf .ib{background:var(--orange);color:var(--dark)}
.fach-kopf h3{font-size:1.3rem}
.fach-text{margin:12px 0 24px;font-size:16px;font-weight:600;color:var(--text)}
.punkte li{padding:12px 0;border-bottom:1px solid var(--line)}
.punkte li:first-child{padding-top:0}
.punkte li:last-child{border-bottom:0}
.punkte b{display:block;color:var(--text);font-weight:600}
.punkte span{font-size:15px;color:var(--text-2)}
.fach-beleg{margin-top:auto;padding-top:24px;font-size:15px}
.fach-beleg b{color:var(--text);font-weight:750}

/* Für wen: Baum mit drei Wegen */
.baum-start{width:max-content;max-width:100%;margin:0 auto;padding:16px 32px;border-radius:999px;background:var(--dark);color:var(--on-dark);font-size:1.1rem;font-weight:650}
.baum-linien{position:relative;height:48px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.baum-linien::before{content:"";position:absolute;left:50%;top:0;height:24px;border-left:2px solid var(--dark)}
.baum-linien::after{content:"";position:absolute;top:24px;left:calc((100% - 48px) / 6);right:calc((100% - 48px) / 6);border-top:2px solid var(--dark)}
.baum-linien span{position:relative}
.baum-linien span::before{content:"";position:absolute;left:50%;top:24px;height:24px;border-left:2px solid var(--dark)}
.pfade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pfad{position:relative;display:flex;flex-direction:column;gap:12px;padding:32px}
.ziffer{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-md);background:var(--dark);color:var(--on-dark);font-size:1.3rem;font-weight:750}
.pfad .tag{position:absolute;top:40px;right:32px}
.pfad h3{margin-top:8px;font-size:1.3rem}
.pfad-text{font-size:16px}
.pfad .punkte{margin-top:8px}
.pfad .punkte li{font-size:16px;color:var(--text)}
.pfad-ziel{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:16px;font-weight:650;color:var(--text)}
.pfad-ziel .ic{width:20px;height:20px;color:var(--orange-2)}
.stufen-fuss{margin-top:32px;text-align:center}
.stufen-fuss a{font-weight:650;color:var(--text);text-underline-offset:4px;text-decoration-color:var(--orange);text-decoration-thickness:2px}

/* System: Erfolgskreislauf */
.system h2 .mark{background:none;color:var(--orange)}
.kreis-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.kreis-fest{position:sticky;top:calc(var(--kopf-h) + 48px)}
.kreis{position:relative;width:100%;max-width:440px;margin-inline:auto}
.kreis svg{display:block;width:100%;height:auto;overflow:visible}
.seg{fill:none;stroke:#262626;stroke-width:56;transition:stroke .4s ease,opacity .4s ease,filter .4s ease}
.seg.war{stroke:var(--orange-3);opacity:.45}
.seg.an{stroke:var(--orange);filter:drop-shadow(0 0 16px rgba(255,106,0,.55))}
.seg-nr{font:800 24px var(--mono);fill:var(--on-dark-2);text-anchor:middle;dominant-baseline:central;transition:fill .4s ease}
.seg-nr.an{fill:var(--dark)}
.kreis-mitte{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:32%;text-align:center;pointer-events:none}
.km-nr{font:800 40px/1 var(--mono);color:var(--orange)}
.km-titel{font-size:16px;font-weight:650;line-height:1.25;color:var(--on-dark)}
.kreis-hinweis{margin-top:24px;text-align:center;font:600 14px/1.4 var(--mono);color:var(--on-dark)}
.kreis-hinweis span{display:block;margin-top:4px;font-family:var(--font);font-weight:400;color:var(--on-dark-2)}
.stationen{display:grid;gap:24px}
.station{min-height:44vh;padding:32px;border:1px solid var(--line-dark);border-radius:var(--r-lg);background:var(--dark-2);transition:opacity .4s ease,border-color .4s ease}
.js .station{opacity:.4}
.js .station.aktiv{opacity:1;border-color:var(--orange)}
.st-nr{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:var(--r-md);background:rgba(255,106,0,.14);color:var(--orange);font:800 20px/1 var(--mono)}
.station h3{margin-top:16px;font-size:clamp(1.4rem,2.2vw,1.9rem)}
.st-satz{margin-top:12px;font-size:1.15rem;font-weight:600;color:var(--on-dark);line-height:1.35}
.station p{margin-top:12px;font-size:16px}
.st-mess{display:inline-block;margin-top:24px;padding:12px 16px;border-radius:var(--r-sm);background:rgba(255,255,255,.06);color:var(--on-dark)}
.st-mess b{display:block;margin-bottom:4px;font:600 12px/1.2 var(--mono);color:var(--orange)}
.kreis-schluss{margin-top:24px;padding:24px 32px;border:1px solid var(--orange);border-radius:var(--r-lg);font-size:1.15rem;font-weight:600;color:var(--on-dark)}
.schritte-titel{margin-top:96px;font-size:1.5rem}
.schritte{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:32px}
.schritt{display:flex;flex-direction:column;gap:12px;padding:32px;border:1px solid var(--line-dark);border-radius:var(--r-lg);background:var(--dark-2)}
.schritt-nr{display:grid;place-items:center;width:56px;height:56px;margin-bottom:8px;border-radius:var(--r-md);background:rgba(255,106,0,.14);color:var(--orange);font:800 20px/1 var(--mono)}
.schritt p{font-size:16px}

/* Kostenblock */
.kosten{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}
.k-selbst,.k-beg{display:flex;flex-direction:column;padding:32px}
.k-selbst h3,.k-beg h3{font-size:1.3rem}
.k-liste{margin-top:16px}
.k-liste li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.k-liste b{font:600 16px/1.6 var(--mono);color:var(--text);white-space:nowrap}
.k-summe{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:24px;font-weight:650;color:var(--text)}
.k-summe b{font-size:clamp(1.75rem,3vw,2.6rem);font-weight:750;letter-spacing:-.02em;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--error);text-decoration-thickness:3px;white-space:nowrap}
.k-fuss{margin-top:12px;font-size:15px}
.k-beg{border:2px solid var(--orange);border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--shadow-o)}
.k-haken{display:grid;gap:16px;margin-top:24px}
.k-haken li{position:relative;padding-left:40px;color:var(--text);line-height:1.4}
.k-haken li::before{content:"";position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:var(--orange)}
.k-haken li::after{content:"";position:absolute;left:9px;top:5px;width:6px;height:11px;border-right:2px solid var(--dark);border-bottom:2px solid var(--dark);transform:rotate(45deg)}
.k-preis{margin-top:auto;padding-top:32px}
.k-preis span{display:block;font-weight:650;color:var(--text)}
.k-preis b{display:block;font-size:clamp(2.4rem,5vw,4.25rem);font-weight:750;line-height:1.05;letter-spacing:-.025em;color:var(--text)}
.k-preis small{display:block;font-size:15px;color:var(--text-2)}
.k-beg .btn{margin-top:24px}
.k-quelle{margin-top:10px;font-size:13px;color:var(--muted)}

/* Ergebnisse */
.faelle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.fall{display:flex;flex-direction:column;padding:32px}
.schilder{display:flex;flex-wrap:wrap;gap:8px}
.schild{padding:6px 12px;border-radius:var(--r-sm);background:var(--surface);border:1px solid var(--line);color:var(--text);font:500 14px/1 var(--mono)}
.schild.o{background:var(--tint-2);border-color:transparent}
.fall h3{margin-top:16px;font-size:1.3rem}
.fall blockquote{margin:16px 0 0;font-size:16px}
.fall-wer{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-weight:650;color:var(--text)}
.fall blockquote + .fall-wer{margin-top:24px}
.fall-wer img{width:48px;height:48px;border-radius:50%;flex:none}
.werte{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:64px 0}
.werte div{border-top:3px solid var(--dark);padding-top:16px}
.werte div:last-child{border-color:var(--orange)}
.werte b{display:block;font-size:clamp(2.4rem,4vw,3.5rem);font-weight:750;line-height:1.05;letter-spacing:-.02em;color:var(--text)}
.werte span{font-size:15px;color:var(--text-2)}
.zwischen{margin-bottom:16px;font-weight:650;color:var(--text)}
.offen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.offen li{padding:24px;font-size:15px}
.offen b{display:block;margin:12px 0 4px;color:var(--text);font-size:1.12rem;font-weight:650;line-height:1.3}

/* Über uns */
.ueber-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.ueber-grid figure,.einblicke figure{margin:0}
.ueber-grid figure img{width:100%;border-radius:var(--r-xl);box-shadow:var(--shadow)}
.ueber-text p + p{margin-top:16px}
.fakten{display:grid;gap:16px;margin-top:32px}
.fakten li{display:flex;gap:16px;align-items:flex-start;font-size:16px}
.fakten .haken{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-md);background:var(--surface);color:var(--text);flex:none}
.fakten .haken svg{width:20px;height:20px}
.fakten b{color:var(--text);font-weight:650}
.einblicke{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:64px}
.einblicke img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-lg)}
.einblicke figcaption{margin-top:12px;font-size:16px;font-weight:650;color:var(--text)}
.organigramm{margin-top:64px;padding:48px 32px;border-radius:var(--r-xl);background:var(--dark);color:var(--on-dark-2);text-align:center}
.org-kopf img{width:auto;height:64px;margin-inline:auto}
.org-kopf p{margin-top:12px;font:500 14px/1.4 var(--mono);color:var(--on-dark)}
.org-linie{width:2px;height:32px;margin:16px auto 0;background:var(--orange)}
.org-quer{height:2px;width:66.6%;margin-inline:auto;background:var(--orange)}
.marken{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.marke{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;padding-top:32px;color:var(--on-dark-2);font-size:16px;line-height:1.45;text-decoration:none}
.marke::before{content:"";position:absolute;top:0;left:50%;width:2px;height:24px;background:var(--orange)}
.marke img{width:auto;height:56px;object-fit:contain}
.marke:hover span{color:var(--on-dark)}
.marke:focus-visible{outline-color:var(--on-dark)}
.partner-titel{margin-top:64px;font-weight:650;color:var(--text)}
.partner{display:flex;flex-wrap:wrap;align-items:center;gap:24px 48px;margin-top:24px}
.partner img{width:auto;height:40px}
.partner .breit{height:32px}

/* Fragen */
.fragen{max-width:960px;display:grid;gap:12px}
.fragen summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 32px;font-weight:650;line-height:1.35;color:var(--text);cursor:pointer;list-style:none}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--orange-2);border-bottom:2px solid var(--orange-2);transform:rotate(45deg);flex:none;margin-right:4px;transition:transform .2s ease}
.fragen details[open] summary::after{transform:rotate(-135deg)}
.fragen details p{padding:0 32px 24px;font-size:16px;max-width:70ch}

/* Anfrage */
.anfrage-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.person{display:inline-flex;align-items:center;gap:12px;margin-top:32px;padding:8px 24px 8px 8px;border:1px solid var(--line);border-radius:999px;background:var(--bg)}
.person img{width:64px;height:64px;border-radius:50%;flex:none;object-fit:cover}
.person b{display:block;color:var(--text);font-weight:650}
.person span span{display:block;font-size:14px;color:var(--muted);line-height:1.35}
.kontaktwege{display:grid;gap:12px;margin-top:24px;max-width:480px}
.kontaktweg{display:flex;align-items:center;gap:16px;padding:16px 24px;text-decoration:none;color:var(--text);transition:border-color .2s ease}
.kontaktweg:hover{border-color:var(--orange)}
.kontaktweg svg{color:var(--orange-2)}
.kontaktweg small{display:block;font-size:14px;color:var(--muted);line-height:1.3}
.kontaktweg b{display:block;font-weight:650;line-height:1.3}
.kontaktweg b.mono{font-family:var(--mono);font-weight:600}
.formular{padding:0 32px 32px;border:1px solid var(--line);border-radius:var(--r-xl);background:var(--bg);box-shadow:var(--shadow);overflow:hidden}
.formular h3{margin:0 -32px;padding:16px 32px;background:var(--dark);color:var(--on-dark);font:500 16px/1.3 var(--mono)}
.f-reihe{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.feld{display:block;margin-top:16px}
.feld > span,.gruppe legend{display:block;margin-bottom:8px;padding:0;font-size:16px;font-weight:600;color:var(--text)}
.feld input{width:100%;min-height:48px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg);color:var(--text);font:400 18px/1.3 var(--font)}
.feld input:focus{outline:3px solid var(--orange);outline-offset:1px;border-color:var(--orange)}
.feld input.fehler{border-color:var(--error)}
.gruppe{margin:24px 0 0;padding:0;border:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);font:500 15px/1 var(--mono);color:var(--text);transition:background .2s ease,border-color .2s ease}
.chip input:checked + span{background:var(--dark);border-color:var(--dark);color:var(--on-dark)}
.chip input:focus-visible + span{outline:3px solid var(--orange);outline-offset:2px}
.formular .btn{width:100%;margin-top:24px}
.f-hinweis{margin-top:12px;font-size:14px;color:var(--muted);line-height:1.5}
.f-hinweis a{color:var(--text-2)}
.f-siegel{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;margin-top:16px;font-size:14px;font-weight:600;color:var(--text-2)}
.f-siegel span{display:inline-flex;align-items:center;gap:8px}
.f-siegel svg{width:16px;height:16px;color:var(--orange-2)}
.f-meldung{margin-top:16px;padding:16px;border-radius:var(--r-md);background:var(--surface);border-left:4px solid var(--warning);font-size:16px;color:var(--text)}
.f-meldung.gut{border-left-color:var(--success)}
.f-meldung.schlecht{border-left-color:var(--error)}

/* Fuß */
footer{padding-block:64px 96px;background:var(--dark);color:var(--on-dark-2);font-size:15px}
.fuss-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer img{width:auto;height:56px}
footer h4{color:var(--on-dark);font:600 14px/1 var(--mono)}
footer ul{display:grid;gap:8px;margin-top:16px}
footer a{color:var(--on-dark-2);text-decoration:none}
footer a:hover{color:var(--on-dark);text-decoration:underline}
footer address{margin-top:24px;font-style:normal;line-height:1.6}
.fuss-unten{margin-top:48px;padding-top:24px;border-top:1px solid var(--line-dark);font-size:14px}

/* Feste Elemente */
.leiste{display:none;position:fixed;left:0;right:0;bottom:0;z-index:40;gap:12px;padding:12px 16px;background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -4px 24px rgba(0,0,0,.08)}
.leiste .rund{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-md);background:var(--dark);color:var(--orange);flex:none}
.leiste .btn{flex:1;padding:12px 16px;font-size:16px}
.nach-oben{position:fixed;right:24px;bottom:24px;z-index:39;display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:var(--r-md);background:var(--dark);color:var(--on-dark);cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s ease}
.nach-oben.an{opacity:1;pointer-events:auto}

/* Einblenden */
.js .rv{opacity:0;transition:opacity .4s ease;transition-delay:calc(var(--d,0) * 100ms)}
.js .rv.da{opacity:1}

/* Entwurfsmodus */
.klaer-knopf{position:fixed;right:0;top:35%;z-index:45;writing-mode:vertical-rl;padding:16px 8px;border:0;border-radius:var(--r-md) 0 0 var(--r-md);background:var(--warning);color:var(--text);font:700 14px/1 var(--font);cursor:pointer;box-shadow:var(--shadow)}
.klaer-liste{position:fixed;right:48px;top:20%;z-index:45;width:min(420px,calc(100vw - 64px));max-height:60vh;overflow:auto;padding:16px;border-radius:var(--r-lg);background:var(--bg);border:2px solid var(--warning);box-shadow:var(--shadow);font-size:14px;line-height:1.4}
.klaer-liste ol{padding-left:24px;display:grid;gap:8px;list-style:decimal}
.klaer-liste a{color:var(--text)}
body:not(.entwurf) .klaer-knopf,body:not(.entwurf) .klaer-liste{display:none}

@media (max-width:1300px){
  .schritte{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1179px){
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;padding:8px 24px 24px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .nav.offen{display:flex}
  .nav a{padding:16px 0;font-size:18px;border-bottom:1px solid var(--line)}
  .menue-knopf{display:flex}
  .kopf-rechts{margin-left:auto}
  .offen{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fuss-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:1000px){
  .hero-grid,.kreis-grid,.ueber-grid,.anfrage-grid,.kosten{grid-template-columns:minmax(0,1fr);gap:48px}
  .kosten{gap:24px}
  .probleme,.faecher,.pfade,.faelle,.einblicke{grid-template-columns:minmax(0,1fr)}
  .ablauf{grid-template-columns:minmax(0,1fr);gap:40px}
  .fach{border-right:0;border-bottom:1px solid var(--line)}
  .fach:last-child{border-bottom:0}
  .baum-linien{display:none}
  .baum-start{margin:0 0 24px}
  .loesung,.garantie-in{grid-template-columns:minmax(0,1fr);gap:24px}
  .loesung-cta{align-items:stretch}
  .loesung .mehr{text-align:center}
  .kreis-grid{gap:24px}
  .kreis-fest{top:var(--kopf-h);z-index:2;display:flex;align-items:center;gap:16px;margin-inline:calc(clamp(20px,3vw,40px) * -1);padding:12px clamp(20px,3vw,40px);background:var(--dark);border-bottom:1px solid var(--line-dark)}
  .kreis{width:104px;margin:0;flex:none}
  .km-titel,.seg-nr{display:none}
  .km-nr{font-size:24px}
  .kreis-mitte{padding:0}
  .kreis-hinweis{margin-top:0;text-align:left}
  .station{min-height:0}
  .schritte-titel{margin-top:64px}
}
@media (max-width:767px){
  body{padding-bottom:72px}
  section{padding-block:64px}
  .hero{padding-top:48px}
  .vertrauen{margin-top:64px}
  .garantie{padding-block:0 64px}
  .sek-kopf{margin-bottom:32px}
  .kopf-in{gap:12px}
  .kopf-tel span{display:none}
  .kopf-tel{width:48px;height:48px;justify-content:center;border:1px solid var(--line);border-radius:var(--r-md)}
  .kopf-rechts .btn{display:none}
  .logo img{height:32px}
  .hero-cta .btn{width:100%}
  .hero-hinweis{max-width:none}
  .zahlen{gap:12px}
  .werte{grid-template-columns:repeat(2,minmax(0,1fr));margin:48px 0}
  .schritte,.fuss-grid,.marken{grid-template-columns:minmax(0,1fr)}
  .marken{gap:8px}
  .org-quer,.marke::before{display:none}
  .marke{padding-top:24px;border-top:1px solid var(--line-dark)}
  .organigramm{padding:32px 16px}
  .problem,.fach,.pfad,.fall,.station,.schritt,.k-selbst,.k-beg,.loesung,.garantie-in{padding:24px}
  .pfad .tag{position:static;align-self:flex-start}
  .ablauf li{padding:40px 24px 24px}
  .f-reihe{grid-template-columns:minmax(0,1fr);gap:0}
  .formular{padding:0 20px 24px}
  .formular h3{margin:0 -20px;padding:16px 20px}
  .fragen summary{padding:20px}
  .fragen details p{padding:0 20px 20px}
  .schrank-kopf{padding:16px 24px}
  .leiste{display:flex}
  .nach-oben{bottom:88px;right:16px}
  .klaer-liste{right:40px;top:12%}
  .partner img{height:32px}
  .partner .breit{height:24px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transition:none}
  .seg,.seg-nr,.station{transition:none}
}

/* Mittig gesetzter Abschnittskopf */
.sek-kopf.mitte{margin-inline:auto;text-align:center}
.sek-kopf.mitte .lede{margin-inline:auto}
.sek-kopf .lede + .lede{margin-top:12px}

/* Für wen: Skizzen */
.skizze{display:block;width:100%;max-width:240px;height:auto;margin-bottom:8px;color:var(--text)}
.skizze *{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.skizze .ak{stroke:var(--orange)}
.skizze .bo{stroke:var(--line)}
.pfad-kopf{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pfad .tag{position:static}
.pfad h4{margin-top:8px;font:600 14px/1 var(--mono);color:var(--muted)}
.pfad h4 + .punkte{margin-top:0}

/* Branchen */
.br-chips{display:flex;flex-wrap:wrap;gap:8px}
.br-chips span{padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--text);font:500 14px/1 var(--mono)}
.fach-hl .br-chips span{background:var(--bg)}
.br-hinweis{margin-top:24px}
.br-hinweis a{font-weight:650;color:var(--text);text-underline-offset:4px;text-decoration-color:var(--orange);text-decoration-thickness:2px}

/* System: großer Kopf, Zahlen plus Emotionen gleich Ergebnis */
.system .sek-kopf{max-width:1100px}
.system h2{font-size:clamp(1.9rem,4.6vw,4.25rem);font-weight:750;letter-spacing:-.025em}
.zg{margin-bottom:96px}
.zg h3{font-size:clamp(1.4rem,2.2vw,1.9rem);max-width:28ch}
.zg-grid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px;margin-top:32px}
.zg-karte{display:flex;flex-direction:column;gap:12px;padding:32px;border:1px solid var(--line-dark);border-radius:var(--r-lg);background:var(--dark-2)}
.zg-hl{border-color:var(--orange)}
.zg-kopf{display:flex;align-items:center;gap:12px}
.zg-kopf .st-nr{width:44px;height:44px}
.zg-kopf .st-nr .ic{width:22px;height:22px}
.zg-tag{font:600 13px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--on-dark-2)}
.zg-hl .zg-tag{color:var(--orange)}
.zg-zahl{margin-top:16px;font:800 clamp(3rem,6vw,5.5rem)/1 var(--font);letter-spacing:-.04em;color:var(--on-dark)}
.zg-hl .zg-zahl{color:var(--orange)}
.zg-karte h4{font-size:clamp(1.3rem,2vw,1.75rem)}
.zg-karte p{font-size:16px}
.zg-karte .zg-satz{font-size:18px;font-weight:650;color:var(--on-dark)}
.dunkel .br-chips span{margin-top:4px;background:rgba(255,255,255,.06);border-color:var(--line-dark);color:var(--on-dark)}
.zg-knoten{display:grid;place-items:center}
.zg-zeichen{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--orange);color:var(--dark);font:800 34px/1 var(--mono)}
.zg-ergebnis{display:grid;grid-template-columns:auto minmax(0,1fr);gap:32px;align-items:center;margin-top:24px;padding:32px;border:1px solid var(--line-dark);border-radius:var(--r-lg);background:var(--dark-2)}
.zg-ergebnis h4{font-size:clamp(1.3rem,2vw,1.75rem)}
.zg-ergebnis p{margin-top:8px;max-width:75ch;font-size:16px}
.zg-ziele{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.zg-ziele li{display:flex;align-items:center;gap:10px;padding:12px 16px;border:1px solid var(--orange);border-radius:var(--r-md);background:rgba(255,106,0,.1);color:var(--on-dark);font-size:16px;font-weight:650}
.zg-ziele .ic{width:20px;height:20px;color:var(--orange)}

/* Kostenblock: Einleitung rechts */
.k-intro{margin-top:12px;color:var(--text)}

/* Ergebnisse: Laufband */
.lb-titel{margin-bottom:24px;color:var(--text)}
.lb-titel b{font-size:1.5rem;font-weight:750;letter-spacing:-.02em}
.laufband{overflow:hidden;padding-block:6px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.lb-spur{display:flex;gap:12px;width:max-content;animation:lauf 60s linear infinite}
.lb-r .lb-spur{animation-direction:reverse}
.laufband:hover .lb-spur{animation-play-state:paused}
.lb-spur span{padding:12px 24px;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--text);font-weight:650;white-space:nowrap}
@keyframes lauf{to{transform:translateX(calc(-50% - 6px))}}
.laufband + .wrap{margin-top:64px}
.fall h3{font-size:1.5rem;line-height:1.2}
.fall-wer img{width:56px;height:56px}
.faelle + .zwischen{margin-top:24px;font-weight:400;color:var(--text-2)}

/* Garantie als Abschluss der Ergebnisse */
.garantie-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:32px;align-items:center;margin-top:64px;padding:32px;border:2px solid var(--orange);border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--shadow-o)}
.siegel{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--orange);color:var(--dark)}
.siegel svg{width:32px;height:32px}
.garantie-in h2{margin-top:12px;font-size:clamp(1.5rem,2.4vw,2rem)}
.garantie-in p{margin-top:8px;max-width:70ch}
.garantie-in .g-hinweis{font-size:15px;color:var(--muted)}

/* Ablauf: Schritte auf einer Linie */
.weg{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:48px;margin-top:16px}
.weg::before{content:"";position:absolute;left:0;right:0;top:32px;height:1px;background:linear-gradient(90deg,var(--line) 0,var(--line) 85%,transparent)}
.weg-icon{position:relative;display:grid;place-items:center;width:64px;height:64px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--shadow);color:var(--orange-2)}
.weg-icon .ic{width:28px;height:28px}
.weg-icon b{position:absolute;top:-10px;right:-10px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--orange);color:var(--dark);font-size:14px;font-weight:800;box-shadow:0 0 0 4px var(--surface)}
.weg h3{margin-top:24px;font-size:1.3rem}
.weg .tag{margin:8px 0 12px}
.weg p{font-size:16px;max-width:40ch}
.weg-cta{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:64px}
.weg-cta small{font-size:15px;color:var(--muted)}

@media (max-width:1000px){
  .zg-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .zg{margin-bottom:64px}
  .zg-zeichen{width:48px;height:48px;font-size:26px}
  .zg-ergebnis{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:16px}
  .garantie-in{grid-template-columns:minmax(0,1fr);gap:24px}
  .weg{grid-template-columns:minmax(0,1fr);gap:40px}
  .weg::before{left:32px;right:auto;top:0;bottom:0;width:1px;height:auto;background:var(--line)}
  .weg li{position:relative}
}
@media (max-width:767px){
  .zg-karte,.zg-ergebnis,.garantie-in{padding:24px}
  .lb-spur span{padding:8px 16px;font-size:15px}
  .laufband + .wrap{margin-top:48px}
}
@media (prefers-reduced-motion:reduce){
  .lb-spur{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
  .lb-spur span[aria-hidden]{display:none}
  .laufband{-webkit-mask-image:none;mask-image:none}
}

h1,h2,h3,h4{overflow-wrap:break-word}

/* ===== Runde 4 (18.10.2026) ===== */
h2.gross{font-size:clamp(2.4rem,5vw,4.25rem);font-weight:750;letter-spacing:-.025em}
.rot-text{color:var(--error)}
.eyebrow.ohne-nr::before{content:none;counter-increment:none}
.l-ober{display:block;margin-bottom:8px;font:600 14px/1.3 var(--mono);color:var(--orange)}
.mehr{font-size:15px;font-weight:650;text-underline-offset:4px}

/* Hero */
.pille.gross{gap:12px;padding:10px 20px;font-size:clamp(16px,1.5vw,20px)}
.pille.gross i{width:10px;height:10px}
.statement{display:flex;gap:12px;align-items:flex-start;max-width:440px;font-size:15px;font-weight:650;line-height:1.4;color:var(--text)}
.statement svg{width:24px;height:24px;margin-top:1px;color:var(--orange-2);flex:none}
.unter-video{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin-top:20px;padding:16px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg)}

/* Google-Bewertungen als Laufband */
.bew-leiste{margin-top:64px;border-block:1px solid var(--line);background:var(--surface)}
.bew-leiste-in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:32px;align-items:center;padding-block:20px}
.bew-band{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.bew-spur{display:flex;gap:16px;width:max-content;animation:lauf16 50s linear infinite}
.bew-band:hover .bew-spur{animation-play-state:paused}
.bew-karte{display:flex;flex-direction:column;gap:6px;width:340px;padding:16px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);color:var(--text-2);font-size:14px;line-height:1.45;text-decoration:none}
.bew-karte .sterne{color:#F5A400;letter-spacing:2px}
.bew-karte q{quotes:none}
.bew-karte b{color:var(--text)}
@keyframes lauf16{to{transform:translateX(calc(-50% - 8px))}}
@keyframes lauf20{to{transform:translateX(calc(-50% - 10px))}}

/* Probleme in Rot */
section.rot{background:linear-gradient(180deg,rgba(220,38,38,.10),rgba(220,38,38,.04))}
.rot .eyebrow{background:var(--error);color:#FFFFFF}
.rot .problem{border:1px solid rgba(220,38,38,.25);border-left:6px solid var(--error)}
.rot .pz{background:var(--error);color:#FFFFFF}
.loesung{background:var(--dark);border:2px solid var(--orange);color:var(--on-dark-2);box-shadow:var(--shadow-o)}
.loesung h3{color:var(--on-dark);font-size:clamp(1.5rem,2.4vw,2rem)}
.loesung .mehr{color:var(--on-dark)}

/* Kundenstimmen im Stil der TV4ALL-Seite */
.faelle-gross{display:grid;gap:64px}
.fallkarte{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.fallkarte.wechsel .fall-bild{order:2}
.fall-bild{position:relative;margin:0;aspect-ratio:16/10;border-radius:var(--r-xl);overflow:hidden;background:var(--dark);box-shadow:var(--shadow)}
.fall-bild > img,.fall-bild video,.fall-video img{width:100%;height:100%;object-fit:cover}
.fall-bild video{background:#000}
.fall-video{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer}
.fall-video .play{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%)}
.fall-video:hover .play{box-shadow:0 0 0 12px rgba(255,106,0,.25)}
.fall-zitat{position:absolute;left:16px;right:16px;bottom:16px;padding:16px 20px;border-radius:var(--r-lg);background:rgba(255,255,255,.95);color:var(--text);font-size:15px;font-weight:650;line-height:1.45;pointer-events:none}
.fall-zitat q{quotes:"„" "“"}
.fall-zitat span{display:block;margin-top:6px;font-size:14px;font-weight:500;color:var(--muted)}
.fall-bild.hell{background:var(--surface)}
.fall-bild.hell > img{object-fit:contain;padding:24px 24px 116px}
.zitatbild{display:flex;flex-direction:column;justify-content:center;gap:16px;padding:48px;color:var(--on-dark)}
.zitatzeichen{font:800 120px/.6 var(--font);color:var(--orange)}
.zitatbild q{quotes:none;font-size:clamp(1.4rem,2.4vw,2rem);font-weight:700;line-height:1.25}
.zitatbild figcaption{display:flex;align-items:center;gap:12px;font-weight:650}
.zitatbild figcaption img{width:56px;height:56px;border-radius:50%}
.fall-ober{font:600 14px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--orange-2)}
.fall-text h3{margin-top:12px;font-size:clamp(1.6rem,2.6vw,2.3rem);font-weight:750;letter-spacing:-.015em}
.fall-text p{margin-top:12px}
.fall-haken{display:grid;gap:10px;margin:20px 0 28px}
.fall-haken li{display:flex;gap:10px;font-weight:650;color:var(--text)}
.fall-haken svg{width:20px;height:20px;margin-top:2px;color:var(--success)}

/* System */
.kreis-titel{margin:0 0 32px;font-size:1.5rem}

/* Für wen: Stufen von hell nach dunkel */
.pfad .punkte b{display:block;color:var(--text)}
.pfad .punkte span{font-size:15px;color:var(--text-2)}
.pfad.stufe-2{background:var(--tint);border-color:rgba(255,106,0,.35)}
.pfad.stufe-3{background:var(--dark);border-color:var(--dark);color:var(--on-dark-2)}
.stufe-3 h3,.stufe-3 .punkte b{color:var(--on-dark)}
.stufe-3 .pfad-text,.stufe-3 h4,.stufe-3 .punkte span{color:var(--on-dark-2)}
.stufe-3 .punkte li{border-color:var(--line-dark)}
.stufe-3 .skizze{color:var(--on-dark)}
.stufe-3 .skizze .bo{stroke:var(--line-dark)}
.stufe-3 .ziffer{background:var(--orange);color:var(--dark)}
.stufe-3 .tag{background:rgba(255,106,0,.28);color:var(--on-dark)}
.branchen{margin-top:96px}
.branchen h3{max-width:26ch;font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:750;letter-spacing:-.015em}
.branchen > p{margin-top:12px;max-width:60ch}
.kacheln{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:32px}
.kachel{position:relative;aspect-ratio:4/3;border-radius:var(--r-md);overflow:hidden;background:var(--dark)}
.kachel img{width:100%;height:100%;object-fit:cover;filter:brightness(.55);transition:filter .4s ease}
.kachel:hover img{filter:brightness(.75)}
.kachel span{position:absolute;inset:0;display:grid;place-items:center;padding:8px;color:#FFFFFF;font-size:clamp(14px,1.2vw,17px);font-weight:700;line-height:1.25;text-align:center;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.kachel-cta{background:var(--orange);text-decoration:none}
.kachel-cta span{display:flex;flex-direction:column;justify-content:center;gap:4px;color:var(--dark);text-shadow:none}
.kachel-cta small{font-size:14px;font-weight:500}

/* Investition */
.szenen{margin-bottom:48px}
.szenen-titel{font:600 14px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.szenen-reihe{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.szene{padding:24px;border:1px solid var(--line);border-left:6px solid var(--error);border-radius:var(--r-lg);background:var(--bg);color:var(--text);font-size:1.1rem;font-weight:650;line-height:1.35}
.szene q{quotes:"„" "“"}
.szenen-fazit{margin-top:24px;font-size:clamp(1.5rem,3vw,2.4rem);font-weight:750;letter-spacing:-.015em;color:var(--text)}
.k-beg{background:var(--dark);border:2px solid var(--orange);color:var(--on-dark-2)}
.k-beg h3{margin-top:4px;color:var(--on-dark);font-size:clamp(1.5rem,2.4vw,2rem)}
.k-beg .k-intro{color:var(--on-dark-2)}
.k-beg .k-haken li{color:var(--on-dark)}
.k-beg .k-preis span{color:var(--on-dark-2)}
.k-beg .k-preis b{color:var(--orange)}
.k-beg .k-preis small{margin-top:8px;max-width:46ch;color:var(--on-dark-2)}
.k-schluss{margin-top:48px;max-width:36ch;font-size:clamp(1.4rem,2.6vw,2.2rem);font-weight:650;line-height:1.3;color:var(--text)}
.k-schluss b{color:var(--orange-2)}

/* Kundenlogos als Laufband */
.logo-band{overflow:hidden;padding-block:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logo-spur{display:flex;gap:20px;width:max-content;animation:lauf20 70s linear infinite}
.lb-r .logo-spur{animation-direction:reverse}
.logo-band:hover .logo-spur{animation-play-state:paused}
.logo-spur span{display:grid;place-items:center;width:150px;height:150px;border:1px solid var(--line);border-radius:50%;background:#FFFFFF;box-shadow:var(--shadow);flex:none}
.logo-spur img{width:108px;height:108px;object-fit:contain}

/* Garantie als dunkler Kasten */
.garantie-box{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;align-items:center;margin-top:96px;padding:48px;border-radius:var(--r-xl);background:var(--dark);color:var(--on-dark-2)}
.garantie-box h2{margin-top:8px;color:var(--on-dark);font-size:clamp(1.8rem,3.4vw,2.8rem);font-weight:750}
.garantie-box h2 span{display:block;color:var(--orange)}
.garantie-box p{margin-top:16px}
.g-haken{display:grid;gap:14px;margin-bottom:28px}
.g-haken li{display:flex;gap:12px;color:var(--on-dark);font-size:1.05rem;font-weight:650}
.g-haken svg{width:22px;height:22px;color:var(--orange)}
.garantie-box .mehr{display:block;margin-top:14px;color:var(--on-dark)}

/* Über uns: Partnerleiste oben, Organigramm hell */
.partner{flex-direction:column;align-items:center;gap:24px;margin-top:48px;padding:32px;border:1px solid var(--line);border-radius:var(--r-xl);background:var(--bg)}
.partner-logos,.partner-sender{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px 48px}
.partner-sender img{height:36px}
.partner-sender .breit{height:30px}
.organigramm.hell{background:var(--bg);border:1px solid var(--line);color:var(--text-2);box-shadow:var(--shadow)}
.organigramm.hell .org-kopf img{height:56px}
.organigramm.hell .org-kopf p{color:var(--text);font:600 16px/1.4 var(--font)}
.organigramm.hell .marke{color:var(--text-2)}
.organigramm.hell .marke img{width:auto;max-width:260px;height:58px;object-fit:contain}
.marke-domain{font:600 14px/1.3 var(--mono);color:var(--orange-2)}
.marke p{margin:0;max-width:34ch}

/* Ablauf */
#ablauf .weg h3{font-size:clamp(1.3rem,2vw,1.7rem)}
#ablauf .weg-icon b{box-shadow:0 0 0 4px var(--bg)}
.verknappung{margin-top:56px;text-align:center;font-size:clamp(1.15rem,1.8vw,1.4rem);font-weight:750;color:var(--text)}
#ablauf .weg-cta{margin-top:24px}

/* Formular Schritt für Schritt */
.funnel .f-step{display:none;min-width:0;margin:24px 0 0;padding:0;border:0}
.funnel .f-step.aktiv{display:block}
.funnel legend{margin-bottom:16px;padding:0;color:var(--text);font-size:clamp(1.3rem,2vw,1.6rem);font-weight:750;line-height:1.25}
.f-fortschritt{height:6px;margin-top:24px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.f-fortschritt i{display:block;width:0;height:100%;background:var(--orange);transition:width .3s ease}
.f-zaehler{margin-top:8px;font:600 14px/1 var(--mono);color:var(--muted)}
.f-wahl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.f-option{position:relative;cursor:pointer}
.f-option input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.f-option span{display:flex;align-items:center;gap:12px;min-height:64px;padding:16px;border:2px solid var(--line);border-radius:var(--r-lg);background:var(--bg);color:var(--text);font-weight:650;transition:border-color .2s ease,background .2s ease}
.f-option .ic{width:24px;height:24px;color:var(--orange-2)}
.f-option:hover span{border-color:var(--orange)}
.f-option input:checked + span{border-color:var(--orange);background:var(--tint)}
.f-option input:focus-visible + span{outline:3px solid var(--orange);outline-offset:2px}
.f-knoepfe{display:flex;gap:12px;margin-top:24px}
.f-knoepfe .btn{flex:1;width:auto;margin-top:0}
.f-knoepfe #f-zurueck{flex:0 0 auto}
.f-fertig{display:flex;gap:16px;align-items:flex-start;margin-top:24px;padding:20px;border:1px solid rgba(22,163,74,.3);border-radius:var(--r-lg);background:rgba(22,163,74,.08);color:var(--text)}
.siegel-klein{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--success);color:#FFFFFF;flex:none}
.siegel-klein svg{width:20px;height:20px}

@media (max-width:1179px){
  .kacheln{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:1000px){
  .bew-leiste-in{grid-template-columns:minmax(0,1fr);gap:16px}
  .fallkarte{grid-template-columns:minmax(0,1fr);gap:24px}
  .fallkarte.wechsel .fall-bild{order:0}
  .szenen-reihe{grid-template-columns:minmax(0,1fr)}
  .garantie-box{grid-template-columns:minmax(0,1fr);gap:24px;margin-top:64px}
  .branchen{margin-top:64px}
  .kacheln{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:767px){
  .faelle-gross{gap:48px}
  .zitatbild{padding:24px}
  .zitatzeichen{font-size:80px}
  .fall-bild.hell > img{padding:16px 16px 120px}
  .kacheln{grid-template-columns:repeat(2,minmax(0,1fr))}
  .garantie-box{padding:24px}
  .f-wahl{grid-template-columns:minmax(0,1fr)}
  .logo-spur span{width:110px;height:110px}
  .logo-spur img{width:80px;height:80px}
  .bew-karte{width:280px}
  .statement{max-width:none}
  .verknappung{margin-top:40px}
}
@media (prefers-reduced-motion:reduce){
  .bew-spur,.logo-spur{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
  .bew-karte[aria-hidden],.logo-spur span[aria-hidden]{display:none}
}

.zitatbild{position:relative;padding-top:120px}
.zitatzeichen{position:absolute;top:28px;left:44px;font-size:150px;line-height:1}
@media (max-width:767px){.zitatbild{padding-top:88px}.zitatzeichen{top:16px;left:22px;font-size:110px}}

/* ===== Runde 5 (18.10.2026) ===== */
main h2{font-size:clamp(2.2rem,4.6vw,4rem);font-weight:750;letter-spacing:-.025em}
.sek-kopf{max-width:1000px}
.sek-kopf.breit{max-width:none}
.sek-kopf h2 + .lede{margin-top:20px}
.lede{font-size:clamp(1.1rem,1.5vw,1.3rem)}

/* Hero */
.h1-zusatz{display:block;margin-top:16px;font-size:clamp(1.3rem,2.2vw,1.9rem);font-weight:650;letter-spacing:-.01em;line-height:1.25;color:var(--text-2)}
.hero-sub{margin-top:28px}
.hero-vertrauen{display:flex;flex-wrap:wrap;align-items:center;gap:20px 32px;margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.hv-google{display:inline-flex;align-items:center;gap:10px;color:var(--text);text-decoration:none}
.hv-google .g{width:30px;height:30px}
.hv-google b{display:block;font-size:20px;font-weight:750;line-height:1.1}
.hv-google b i{font-style:normal;color:#F5A400;letter-spacing:2px;font-size:16px}
.hv-google small{font-size:14px;color:var(--text-2);text-decoration:underline;text-underline-offset:3px}
.hv-logo{display:block}
.hv-logo img,img.hv-logo{width:auto;height:34px}
.bew-leiste-in{grid-template-columns:minmax(0,1fr)}

/* Kundenlogos eckig, direkt nach den Problemen */
.kunden-band{padding-bottom:64px}
.kunden-band .sek-kopf{margin-bottom:32px}
.logo-spur span{width:200px;height:120px;border-radius:var(--r-lg)}
.logo-spur img{width:150px;height:90px}

/* System kompakt */
.system h2{font-size:clamp(2rem,4vw,3.5rem)}
.system h2 .mark{display:block}
.formel{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:stretch}
.f-teil{display:flex;flex-direction:column;gap:10px;padding:28px;border:1px solid var(--line-dark);border-radius:var(--r-lg);background:var(--dark-2)}
.f-tag{display:inline-flex;align-items:center;gap:8px;font:600 14px/1.2 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--on-dark-2)}
.f-tag .ic{width:20px;height:20px;color:var(--orange)}
.f-teil h3{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:750;color:var(--on-dark)}
.f-teil p{font-size:17px}
.f-hl{border-color:var(--orange)}
.f-ergebnis{background:var(--orange);border-color:var(--orange);color:var(--dark)}
.f-ergebnis h3,.f-ergebnis .f-tag,.f-ergebnis .f-tag .ic{color:var(--dark)}
.f-ergebnis p{font-weight:600}
.f-zeichen{align-self:center;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--orange);color:var(--dark);font:800 30px/1 var(--mono)}
.formel-fazit{margin-top:32px;max-width:60ch;font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:600;color:var(--on-dark)}

/* Erfolgskreislauf kompakt bei Für wen */
.kreis-kompakt{margin-top:96px;padding:48px;border-radius:var(--r-xl);background:var(--dark);color:var(--on-dark-2)}
.kk-text h3{color:var(--on-dark);font-size:clamp(1.6rem,3vw,2.6rem);font-weight:750;letter-spacing:-.015em}
.kk-text p{margin-top:12px;font-size:clamp(1.05rem,1.4vw,1.2rem)}
.kk-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:center;margin-top:40px}
.kk-grid .kreis{max-width:380px}
.stationen.kk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.stationen.kk .station{display:flex;gap:16px;align-items:flex-start;min-height:0;padding:20px;cursor:pointer}
.stationen.kk .st-nr{width:48px;height:48px;font-size:17px;flex:none}
.stationen.kk h4{color:var(--on-dark);font-size:1.25rem}
.stationen.kk p{margin-top:6px;font-size:16px}
.js .stationen.kk .station{opacity:.5}
.js .stationen.kk .station.aktiv{opacity:1;border-color:var(--orange)}

/* Branchen einheitlich */
.kachel img{filter:grayscale(.35) brightness(.5) contrast(1.05)}
.kachel:hover img{filter:grayscale(.2) brightness(.7)}
.kachel-frage{display:block;background:var(--dark-2);border:1px solid var(--line-dark);text-decoration:none}
.kachel-frage span{display:flex;flex-direction:column;justify-content:center;gap:4px;color:#FFFFFF}
.kachel-frage small{font-size:14px;font-weight:500;color:var(--on-dark-2)}

/* Investition: Schlusskasten */
.schluss-kasten{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;margin-top:48px;padding:40px;border:2px solid var(--orange);border-radius:var(--r-xl);background:var(--dark);box-shadow:var(--shadow-o)}
.schluss-kasten p{font-size:clamp(1.4rem,2.6vw,2.2rem);font-weight:700;line-height:1.3;color:var(--on-dark)}
.schluss-kasten b{color:var(--orange)}

/* Garantie als eigener Abschnitt */
.garantie-abschnitt{padding-top:0}
.garantie-abschnitt .garantie-box{margin-top:0}
#investition{padding-bottom:96px}

/* Ablauf besser lesbar */
#ablauf .weg{gap:56px}
#ablauf .weg::before{top:44px;height:2px;background:linear-gradient(90deg,var(--orange-3) 0,var(--orange-3) 85%,transparent)}
#ablauf .weg-icon{width:88px;height:88px;border-radius:var(--r-xl)}
#ablauf .weg-icon .ic{width:38px;height:38px}
#ablauf .weg-icon b{width:36px;height:36px;font-size:17px;top:-12px;right:-12px}
#ablauf .weg h3{margin-top:28px;font-size:clamp(1.5rem,2.4vw,2rem)}
#ablauf .weg .tag{font-size:15px}
#ablauf .weg p{font-size:18px;max-width:44ch}

@media (max-width:1000px){
  .formel{grid-template-columns:minmax(0,1fr);gap:12px}
  .f-zeichen{justify-self:center;width:48px;height:48px;font-size:26px}
  .kk-grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .kk-grid .kreis{width:100%;max-width:260px;margin-inline:auto}
  .kk-grid .km-titel{display:block}
  .kk-grid .seg-nr{display:inline}
  .kk-grid .kreis-mitte{padding:32%}
  .kk-grid .km-nr{font-size:32px}
  .schluss-kasten{grid-template-columns:minmax(0,1fr);gap:24px}
  #ablauf .weg::before{left:44px;top:0;bottom:0;width:2px;height:auto;background:var(--orange-3)}
}
@media (max-width:767px){
  .kreis-kompakt{padding:24px;margin-top:64px}
  .stationen.kk{grid-template-columns:minmax(0,1fr)}
  .schluss-kasten{padding:24px}
  .logo-spur span{width:150px;height:90px}
  .logo-spur img{width:116px;height:68px}
  .hv-logo img,img.hv-logo{height:28px}
}

#probleme .probleme{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
#probleme .problem{padding:28px 24px}
@media (max-width:1300px){#probleme .probleme{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){#probleme .probleme{grid-template-columns:minmax(0,1fr)}}

/* ===== Runde 6 (19.10.2026) ===== */
/* Hero: Vertrauen gesammelt unter dem Video */
.unter-video{display:block;padding:20px 24px}
.uv-oben{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.uv-oben .v-fakt b{font-size:22px}
.uv-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.uv-logos .hv-logo img,.uv-logos img.hv-logo{height:38px}

/* Google-Abzeichen vor dem Laufband */
.bew-leiste-in{grid-template-columns:auto minmax(0,1fr)}
.bew-leiste .bew-badge{padding:14px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);transition:border-color .2s ease}
.bew-leiste .bew-badge:hover{border-color:var(--orange)}
.bew-leiste .bew-meta{font-weight:650;color:var(--text)}

/* Für wen: Engpass mit den Leistungen */
.engpass{margin-top:96px}
.engpass-kopf{margin-bottom:32px}
.engpass-kopf h3{font-size:clamp(1.6rem,3vw,2.6rem);font-weight:750;letter-spacing:-.015em}
.engpass-kopf p{margin-top:12px;max-width:70ch;font-size:clamp(1.05rem,1.4vw,1.2rem)}
.engpass-tag{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin-bottom:20px;padding:6px 14px 6px 10px;border-radius:999px;background:rgba(220,38,38,.08);color:var(--error);font-size:15px;font-weight:700;line-height:1.3}
.engpass-tag svg{width:16px;height:16px}
.fach-kopf h4{font-size:1.3rem;font-weight:700}
.fach-kopf .ib{background:var(--tint);color:var(--orange-2)}
.hebel-marken{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.hebel-marken li{padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:15px;font-weight:650;line-height:1.3;color:var(--text)}
.stufe-2 .hebel-marken li{background:var(--bg);border-color:rgba(255,106,0,.35)}
.stufe-3 .hebel-marken li{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:var(--on-dark)}

/* Branchen: Frage-Kachel leicht orange, über zwei Spalten */
.kachel-frage{grid-column:span 2;display:flex;aspect-ratio:auto;min-height:150px;border:1px solid var(--orange);background:radial-gradient(120% 160% at 0% 0%,rgba(255,106,0,.36),rgba(255,106,0,.1) 55%,rgba(255,106,0,.04)),var(--dark-2);box-shadow:var(--shadow-o);transition:transform .3s ease}
.kachel-frage:hover{transform:translateY(-2px)}
.kachel-frage span{position:relative;inset:auto;flex:1;gap:6px;padding:16px 24px}
.kachel-frage b{font-size:clamp(18px,1.6vw,24px);font-weight:750;line-height:1.2}
.kachel-frage small{font-size:15px;color:var(--on-dark-2)}
.kachel-frage i{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin-top:6px;font-style:normal;font-size:15px;font-weight:700;color:var(--orange-3)}
.kachel-frage i svg{width:18px;height:18px}

/* Über uns */
#ueber-uns{border-top:1px solid var(--line)}
.ueber-lede{font-size:clamp(1.15rem,1.6vw,1.4rem);font-weight:650;line-height:1.4;color:var(--text)}
.marke-domain{color:var(--text)}

/* Anfrage */
.h2-zusatz{display:block;margin-top:14px;font-size:clamp(1.25rem,2vw,1.75rem);font-weight:650;letter-spacing:-.01em;line-height:1.25;color:var(--text-2)}

@media (max-width:1179px){
  .kachel-frage{grid-column:span 4}
}
@media (max-width:1000px){
  .bew-leiste-in{grid-template-columns:minmax(0,1fr)}
  .bew-leiste .bew-badge{justify-self:start}
  .kachel-frage{grid-column:span 2}
}
@media (max-width:767px){
  .engpass{margin-top:64px}
  .uv-logos{justify-content:flex-start}
  .uv-logos .hv-logo img,.uv-logos img.hv-logo{height:32px}
}

/* ===== Runde 6b (19.10.2026) ===== */
/* Kundenstimmen: jede Stimme in einem eigenen dunklen Block, Video und Infokarte gehören sichtbar zusammen */
.faelle-gross{gap:40px}
.fallkarte{gap:32px;align-items:center;padding:32px;border-radius:var(--r-xl);background:radial-gradient(80% 120% at 0% 0%,rgba(255,106,0,.24),rgba(255,106,0,0) 60%),var(--dark);box-shadow:var(--shadow)}
.fallkarte.wechsel{background:radial-gradient(80% 120% at 100% 0%,rgba(255,106,0,.24),rgba(255,106,0,0) 60%),var(--dark)}
.fallkarte .fall-bild{box-shadow:none}
.fallkarte .zitatbild{background:var(--dark-2);border:1px solid rgba(255,255,255,.1)}
.fallkarte .fall-text{display:flex;flex-direction:column;align-items:flex-start;padding:36px;border-radius:var(--r-lg);background:var(--bg);box-shadow:0 12px 40px rgba(0,0,0,.35)}

/* Organigramm: Domain bleibt immer gleich gut lesbar */
.organigramm.hell .marke:hover span,.organigramm.hell .marke-domain{color:var(--text)}

@media (max-width:767px){
  .fallkarte{padding:16px;gap:16px}
  .fallkarte .fall-text{padding:24px}
}

/* Hero: drei Logos unter dem Video ab Tablet immer in einer Reihe */
@media (min-width:768px){
  .uv-logos{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.5fr) minmax(0,1fr);gap:20px}
  .uv-logos .hv-logo img,.uv-logos img.hv-logo{width:auto;max-width:100%;height:auto;max-height:38px}
  .uv-logos > :nth-child(2){justify-self:center}
  .uv-logos > :last-child{justify-self:end}
}

/* Ablauf: jeder Satz der Überschrift in einer eigenen Zeile */
#ablauf .sek-kopf{max-width:none}
#ablauf h2 .zeile{display:block}
#ablauf .lede{text-wrap:balance}

/* Kundenstimmen: Zitat verschwindet beim Abspielen, damit die Videosteuerung frei ist */
.fall-zitat{transition:opacity .3s ease,visibility .3s ease}
.fall-bild.laeuft .fall-zitat{opacity:0;visibility:hidden}

/* Kundenstimmen: erste vier sichtbar, Rest hinter dem Knopf (später Unterseite /kundenstimmen) */
.faelle-gross:not(.aufgeklappt) .zusatz-stimme{display:none}
.stimmen-mehr{margin-top:48px;text-align:center}
.stimmen-mehr[hidden]{display:none}
@media (max-width:600px){.stimmen-mehr .btn{width:100%}}

/* Hero bis Tablet: Video direkt unter der Überschrift, dann System-Satz und Logos, dann der Nutzen */
@media (max-width:1000px){
  .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .hero-grid > div{display:contents}
  .hero h1{order:1}
  .hero .video-rahmen{order:2;margin-top:28px}
  .hero-sub{order:3}
  .hero .unter-video{order:4}
  .hero .nutzen{order:5}
  .hero-cta{order:6}
}

/* Hero-Video: großer, pulsierender Abspielknopf, damit der Klick naheliegt */
.video img{animation:poster-zoom 9s ease-in-out infinite alternate}
.video-start{gap:20px;background:radial-gradient(45% 55% at 50% 50%,rgba(10,10,10,.35),rgba(10,10,10,0) 100%)}
.video-start .play{position:relative;width:104px;height:104px;box-shadow:0 10px 40px rgba(255,106,0,.6);animation:play-puls 1.6s ease-in-out infinite}
.video-start .play svg{width:40px;height:40px;margin-left:6px}
.video-start .play::before,.video-start .play::after{content:"";position:absolute;inset:0;border-radius:50%;border:3px solid var(--orange);animation:play-welle 1.6s ease-out infinite}
.video-start .play::after{animation-delay:.8s}
.video-start:hover .play{background:var(--orange-3)}
.video-text small{display:inline-block;margin-bottom:10px;padding:6px 10px;border-radius:var(--r-sm);background:var(--orange);color:var(--dark);font:700 13px/1 var(--mono);letter-spacing:.04em;text-transform:uppercase}
.video-text b{margin-bottom:4px;font-size:clamp(1.3rem,2.1vw,1.7rem);font-weight:750;letter-spacing:-.01em;line-height:1.2}
@keyframes play-puls{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
@keyframes play-welle{0%{transform:scale(1);opacity:.9}100%{transform:scale(2);opacity:0}}
@keyframes poster-zoom{from{transform:scale(1)}to{transform:scale(1.06)}}
@media (max-width:600px){
  .video-start{gap:10px;padding:12px}
  .video-start .play{width:60px;height:60px}
  .video-start .play svg{width:24px;height:24px;margin-left:4px}
  .video-text small{margin-bottom:5px;padding:4px 8px;font-size:11px}
  .video-text b{margin-bottom:0;font-size:1.1rem}
  .vt-unter{display:none}
}
@media (prefers-reduced-motion:reduce){
  .video img,.video-start .play,.video-start .play::before,.video-start .play::after{animation:none}
}

/* Hero: weichgezeichnetes Foto aus unserer Videoproduktion als Hintergrund, hell überlagert */
.hero{position:relative;isolation:isolate}
.hero::before,.hero::after{content:"";position:absolute;inset:0;pointer-events:none}
.hero::before{z-index:-2;background:url(bilder/hero-hintergrund.webp) center/cover no-repeat}
.hero::after{z-index:-1;background:linear-gradient(180deg,rgba(255,255,255,0) 70%,rgba(255,255,255,.85) 100%),linear-gradient(90deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.9) 42%,rgba(255,255,255,.62) 72%,rgba(255,255,255,.5) 100%)}
.hero .unter-video{background:rgba(255,255,255,.93);border-color:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
@media (max-width:1000px){
  .hero::after{background:rgba(255,255,255,.86)}
}


/* Branchen: 21 Kacheln, die Frage-Kachel füllt jeweils die letzte Reihe */
.kachel-frage{grid-column:span 3}
@media (max-width:767px){
  .kachel-frage{grid-column:span 2}
  .kacheln > .kachel:nth-last-child(2){grid-column:span 2;aspect-ratio:8/3}
}

/* ===== Runde 7: Bewertungsleiste über die volle Breite, 6 bis 7 Karten auf einmal ===== */
.bew-leiste .wrap{max-width:none}
.bew-leiste-in{gap:20px;padding-block:16px}
.bew-leiste .bew-badge{flex-direction:column;gap:6px;max-width:210px;padding:14px 18px;text-align:center}
.bew-leiste .bew-badge .g{width:28px;height:28px}
.bew-leiste .bew-zeile{justify-content:center}
.bew-leiste .bew-meta{font-size:13px}
.bew-band{-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.bew-spur{gap:12px;animation:lauf-drittel 40s linear infinite}
.bew-karte{width:236px;padding:14px 16px;font-size:13.5px}
.bew-karte q{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.bew-karte b{margin-top:auto}
@keyframes lauf-drittel{to{transform:translateX(calc((-100% - 12px) / 3))}}
@media (max-width:1000px){
  .bew-leiste .bew-badge{flex-direction:row;max-width:none;text-align:left}
  .bew-leiste .bew-zeile{justify-content:flex-start}
}
@media (max-width:767px){
  .bew-karte{width:240px}
}

/* Runde 7: Stufe 3 als kräftigere Orange-Stufe statt Schwarz */
.pfad.stufe-3{background:linear-gradient(160deg,#FFE7D6 0%,#FFD5B5 100%);border-color:rgba(255,106,0,.6);color:var(--text-2);box-shadow:0 12px 32px rgba(255,106,0,.14)}
.stufe-3 h3,.stufe-3 .punkte b{color:var(--text)}
.stufe-3 .pfad-text,.stufe-3 .punkte span{color:var(--text-2)}
.stufe-3 h4{color:#8A4A1F}
.stufe-3 .punkte li{border-color:rgba(255,106,0,.25)}
.stufe-3 .skizze{color:var(--text)}
.stufe-3 .skizze .bo{stroke:rgba(10,10,10,.14)}
.stufe-3 .ziffer{background:var(--orange);color:var(--dark)}
.stufe-3 .tag{background:rgba(255,106,0,.24);color:var(--text)}
.stufe-3 .hebel-marken li{background:var(--bg);border-color:rgba(255,106,0,.5);color:var(--text)}

/* Runde 7: Vorschaubild des Erklärvideos mit Figuren, Text oben, Knopf in der Mitte */
.video-start{justify-content:flex-start;gap:0;padding:4.5% 6% 0;background:none;color:var(--text)}
.video-start .play{margin-top:clamp(10px,2.6%,22px)}
.video-text small{display:inline-block;margin-bottom:8px;padding:5px 12px;border-radius:999px;background:var(--orange);color:var(--dark);font:700 14px/1.2 var(--font);letter-spacing:0;text-transform:none}
.video-text b{margin-bottom:0;font-size:clamp(1.2rem,1.75vw,1.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;color:var(--text)}
.video-text b em{font-style:normal;color:var(--orange-2)}
.video-dauer{position:absolute;right:12px;bottom:12px;padding:4px 8px;border-radius:6px;background:rgba(10,10,10,.85);color:#FFFFFF;font:600 13px/1.2 var(--font)}
@media (max-width:600px){
  .video-start{padding-top:4%}
  .video-text small{margin-bottom:4px;padding:3px 9px;font-size:11px}
  .video-text b{font-size:1rem}
  .video-start .play{margin-top:8px}
  .video-dauer{right:8px;bottom:8px;padding:2px 6px;font-size:11px}
}
.hero .video{container-type:inline-size}
.hero .video-start .play{width:clamp(54px,18cqw,104px);height:clamp(54px,18cqw,104px)}
.hero .video-start .play svg{width:38%;height:38%}
.hero .video-text small{font-size:clamp(11px,2.4cqw,14px)}
.hero .video-text b{font-size:clamp(.95rem,4.6cqw,1.7rem)}
.hero .video-start .play{margin-top:clamp(6px,2.4cqw,16px)}

/* Vimeo-Player in den Kundenstimmen */
.fall-bild iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}