
:root{
  --papier:#F7F3EC; --papier2:#EFE9DE; --tinte:#141B21; --hell:#F3F0E9;
  --text:#232D35; --text2:#66707A; --linie:#E2DACC; --linie-d:rgba(247,243,236,.14);
  --akzent:#1D6E7E; --karte:#FBF8F1; --marke-ai:#2A9EB6; --gruen:#2F6B52; --violett:#5F5390; --kupfer:#A8681F;
  --sans:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--text);font-family:var(--sans);line-height:1.6;font-size:16.5px}
a{color:inherit;text-decoration:none}
.inner{max-width:1120px;margin:0 auto;padding:0 26px}

:root{--r-s:6px;--r-m:10px}
header.kopf{position:sticky;top:0;z-index:60;background:rgba(247,243,236,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--linie)}
.kopf .inner{display:flex;align-items:center;justify-content:space-between;gap:20px;height:68px}
.kopf .wortmarke{height:26px;width:auto;color:var(--tinte)}
.k-marke{display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px;text-decoration:none}
.k-claim{font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;color:var(--text2);white-space:nowrap;width:100%;text-align:justify;text-align-last:justify}
nav.haupt{display:flex;align-items:center;gap:26px;font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
nav.haupt a{color:var(--text2);padding:6px 0;border-bottom:2px solid transparent}
nav.haupt a:hover{color:var(--text)}
nav.haupt a[aria-current]{color:var(--text);border-bottom-color:var(--akzent)}
nav.haupt a.nav-cta{flex:none;white-space:nowrap;line-height:1;background:var(--akzent);color:var(--hell) !important;padding:13px 26px;font-weight:800;border-bottom:none !important;border-radius:var(--r-s);font-family:var(--sans,inherit);font-size:.98rem;letter-spacing:0;text-transform:none}
nav.haupt a.nav-cta:hover{background:var(--tinte)}
@media(prefers-reduced-motion:no-preference){nav.haupt a.nav-cta{animation:cta-puls 2.8s ease-out infinite}@keyframes cta-puls{0%{box-shadow:0 0 0 0 rgba(29,110,126,.4)}55%{box-shadow:0 0 0 11px rgba(29,110,126,0)}100%{box-shadow:0 0 0 0 rgba(29,110,126,0)}}}

/* Gerüst-Blöcke */
main{padding:0}
.block{padding:92px 0;border-bottom:1px solid var(--linie)}
@media(max-width:700px){.block{padding:64px 0}}
.block.wechsel{background:var(--papier2)}
.block.dunkel{background:var(--tinte);color:var(--hell);border-bottom:none}
.b-label{font-family:var(--mono);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--akzent);margin:0 0 6px}
.b-titel{font-size:1.25rem;font-weight:800;margin:0 0 6px}
.b-zweck{font-size:.92rem;color:var(--text2);max-width:44rem;margin:0 0 18px}
.dunkel .b-zweck{color:#93A0AA}
.platzhalter{border:2px dashed var(--linie);background:rgba(255,255,255,.5);padding:26px;font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;color:var(--text2);display:flex;flex-wrap:wrap;gap:10px 22px;border-radius:var(--r-m)}
.dunkel .platzhalter{border-color:var(--linie-d);background:rgba(255,255,255,.04);color:#93A0AA}
.platzhalter span::before{content:"▢ "}

footer{background:var(--tinte);color:#93A0AA;padding:32px 0;font-size:.84rem}
footer .inner{display:flex;flex-wrap:wrap;gap:16px 30px;align-items:center;justify-content:space-between}
footer .wortmarke{color:var(--hell);height:16px}
footer nav{display:flex;gap:20px;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
footer a:hover{color:var(--hell)}
.cookiefrei{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em}
.cookiefrei::before{content:"/ ";color:var(--gruen)}
:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}

/* Lösung: Ebenen-Stapel */
.lb{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center}
.stapel{max-width:600px;margin:0 auto;width:100%;transform:translateX(66%);transition:transform .7s cubic-bezier(.4,0,.2,1)}
.lb.offen .stapel{transform:none}
.stapel-svg{width:100%;height:auto;display:block}
.stapel-hinweis{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text2);text-align:center;margin:10px 0 0}
.ebene{cursor:pointer;outline-offset:4px}
.ebene .deck{fill:var(--f);fill-opacity:.05;stroke:var(--f);stroke-width:1.8}
.ebene .seite{fill:var(--f);fill-opacity:.14;stroke:var(--f);stroke-width:1.8;stroke-linejoin:round}
.ebene .e-label{font-family:var(--sans);font-size:33px;font-weight:800;fill:var(--text)}
.ebene .e-sub{font-family:var(--mono);font-size:14px;letter-spacing:.08em;fill:var(--text2)}
.ebene:hover .deck{fill-opacity:.11}
.s-label{font-family:var(--mono);font-size:13px;letter-spacing:.3em;fill:var(--text2)}
.ebene,.schleifen{transition:opacity .45s ease,transform .45s ease}
.lb.offen .ebene:not(.an){opacity:.32}
.lb.offen .schleifen{opacity:.25}
.ebene.an{transform:translateY(-8px)}
#loesung.vor .ebene{opacity:0;transform:translateY(26px)}
#loesung.vor .schleifen{opacity:0}
#loesung.vor.da .ebene{opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease}
#loesung.vor.da .ebene[data-e="0"]{transition-delay:.05s}
#loesung.vor.da .ebene[data-e="1"]{transition-delay:.38s}
#loesung.vor.da .ebene[data-e="2"]{transition-delay:.71s}
#loesung.vor.da .schleifen{opacity:1;transition:opacity .9s ease 1.25s}
#loesung.vor.da .lb.offen .ebene:not(.an){opacity:.32}
.lpanel{display:grid;opacity:0;transform:translateX(28px);transition:opacity .5s ease .2s,transform .5s ease .2s;pointer-events:none}
.lb.offen .lpanel{opacity:1;transform:none;pointer-events:auto}
.lpanel-inhalt{grid-area:1/1;visibility:hidden;opacity:0;transition:opacity .35s ease,visibility 0s linear .35s}
.lpanel-inhalt.an{visibility:visible;opacity:1;transition:opacity .4s ease .05s,visibility 0s}
.lp-kicker{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--f);font-weight:700;margin:0 0 8px}
.lp-titel{font-size:1.35rem;font-weight:800;margin:0 0 10px}
.lp-intro{font-size:.95rem;color:var(--text2);margin:0 0 16px;max-width:36rem}
.lp-karte{background:var(--karte);background:color-mix(in srgb, var(--f) 7%, #fff);border:1px solid var(--linie);border-color:color-mix(in srgb, var(--f) 22%, var(--linie));border-left:3px solid var(--f);border-radius:var(--r-m);padding:12px 16px;margin:0 0 10px;display:flex;flex-direction:column;gap:2px}
.lp-karte b{font-size:.95rem}
.lp-karte span{font-size:.86rem;color:var(--text2)}
.lp-merk{font-family:var(--mono);font-size:.78rem;color:var(--text2);border-top:1px dashed var(--linie);padding-top:12px;margin:14px 0 0}
.lp-merk a{color:var(--akzent);text-decoration:underline}
@media(max-width:960px){.lb,.lb.offen{grid-template-columns:1fr;gap:18px}.stapel{transform:none}.lpanel{display:none}.lb.offen .lpanel{display:grid;opacity:1;transform:none}}
/* Vorgangs-Flow */
.flow-kopf{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.fpill{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;background:transparent;border:1px solid var(--linie);color:var(--text2);padding:7px 13px;cursor:pointer;border-radius:var(--r-s)}
.fpill[aria-pressed="true"]{background:var(--gruen);border-color:var(--gruen);color:var(--hell)}
.flow-titel{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text2);margin:0 0 18px;min-height:1.4em}
.flow-titel .puls{display:inline-block;width:8px;height:8px;border-radius:50%;background:#2ca06d;margin-right:10px;vertical-align:middle}
@media(prefers-reduced-motion:no-preference){.flow-titel .puls{animation:puls 1.6s ease infinite}@keyframes puls{50%{opacity:.3}}}
.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;position:relative}
.flow::before{content:"";position:absolute;left:2%;right:2%;top:22px;height:2px;background:var(--linie);z-index:0}
.flow .lauflinie{position:absolute;left:2%;top:22px;height:2px;background:var(--akzent);z-index:0;width:0;transition:width .5s ease}
@media(max-width:900px){.flow{grid-template-columns:1fr;gap:10px}.flow::before,.flow .lauflinie{display:none}}
.fstep{background:var(--karte);border:1px solid var(--linie);padding:14px 16px;position:relative;z-index:1;transition:border-color .4s,box-shadow .4s,background .5s;border-radius:var(--r-m)}
.fstep .fnr{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;color:var(--text2);display:block;margin-bottom:6px}
.fstep h4{margin:0 0 4px;font-size:.9rem;font-weight:800;color:#C4BFB4;transition:color .4s}
.fstep .fdetail{margin:0;font-size:.8rem;color:var(--text2);min-height:2.6em}
.fstep.aktiv{border-color:var(--akzent);box-shadow:0 2px 0 rgba(29,110,126,.15)}
.fstep.aktiv h4,.fstep.fertig h4{color:var(--text)}
.fstep.fertig{background:#EEF4EF;border-color:#C6D9CC}
.fstep.fertig .fnr::after{content:" ✓";color:var(--gruen)}
.fstep.frei.fertig{border-color:var(--gruen)}
.fstep.frei .fnr{color:var(--gruen)}
/* Logoband */
.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee-track{display:flex;align-items:center;gap:4rem;width:max-content}
.marquee img{height:38px;width:auto;opacity:.9;filter:grayscale(1) brightness(.32) contrast(1.15)}
.marquee img[src*="datev"]{height:22px}
@media(prefers-reduced-motion:no-preference){
  .marquee-track{animation:scrollx 45s linear infinite}
  .marquee:hover .marquee-track{animation-play-state:paused}
  @keyframes scrollx{to{transform:translateX(-50%)}}
}
.band-label{font-family:var(--mono);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--text2);text-align:center;margin:0 0 18px}
/* Hero: Tipp-Animation */
.hero-kicker{font-family:var(--mono);font-size:.92rem;letter-spacing:.28em;text-transform:uppercase;color:var(--tinte);margin:0 0 22px;font-weight:700}
.tipp{font-size:clamp(2.4rem,6.2vw,4.4rem);font-weight:850;font-stretch:92%;letter-spacing:-.025em;line-height:1.08;margin:0 0 10px;min-height:3.5em;text-transform:uppercase}
.tipp .z{display:block;min-height:1.08em}
.tipp .w1{color:var(--akzent)} .tipp .w2{color:var(--violett)} .tipp .w3{color:var(--kupfer)}
.tipp .z4{color:var(--text2);font-weight:750}
.caret{display:inline-block;width:.55ch;background:var(--tinte);height:1em;vertical-align:-.12em;margin-left:2px}
@media(prefers-reduced-motion:no-preference){.caret{animation:blink 1s steps(1) infinite}@keyframes blink{50%{opacity:0}}}
.tipp{margin-bottom:26px}
.hero-sub{max-width:42rem;color:var(--text2);font-size:1.14rem;margin:0 0 14px}
.recht-zeile{font-family:var(--mono);font-size:.92rem;font-weight:700;letter-spacing:.06em;color:var(--text);margin:0 0 28px}
.recht-zeile span{color:var(--gruen);font-weight:700}
.knopfreihe{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center}
.knopf{display:inline-block;background:var(--tinte);color:var(--hell);padding:15px 28px;font-weight:800;border:none;cursor:pointer;font-size:.98rem;font-family:inherit;border-radius:var(--r-s)}
.knopf:hover{background:var(--akzent)}
.knopf-text{font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text);border-bottom:1px solid var(--text2);padding-bottom:4px}
.knopf-text:hover{color:var(--akzent);border-bottom-color:var(--akzent)}
.reibung{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;color:var(--text2);margin-top:14px}
.hero-folgt{transition:opacity .7s ease,transform .7s ease}
#hero.verdeckt .hero-folgt{opacity:0;transform:translateY(12px);pointer-events:none}
#hero .hero-sub{transition-delay:0s}#hero .recht-zeile{transition-delay:.15s}#hero .knopfreihe{transition-delay:.3s}#hero .reibung{transition-delay:.45s}
@media(prefers-reduced-motion:reduce){.hero-folgt{transition:none}}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr}}
.kaskade{display:flex;flex-direction:column;gap:10px}
.kaskade details{background:var(--karte);border:1px solid var(--linie);box-shadow:0 2px 0 rgba(20,27,33,.05)}
.kaskade summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:15px 18px}
.kaskade summary::-webkit-details-marker{display:none}
.k-strich{width:22px;height:3px;flex:none}
.hk1 .k-strich{background:var(--akzent)}.hk2 .k-strich{background:var(--violett)}
.hk3 .k-strich{background:var(--kupfer)}.hk4 .k-strich{background:var(--gruen)}
.k-titel{font-weight:800;font-size:.98rem}
.kaskade .pfeil{margin-left:auto;color:var(--text2);transition:transform .25s}
.kaskade details[open] .pfeil{transform:rotate(90deg)}
@media(prefers-reduced-motion:reduce){.kaskade .pfeil{transition:none}}
.k-inhalt{padding:2px 18px 16px 54px;border-top:1px dashed var(--linie)}
.k-s{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--papier2);font-size:.9rem;color:var(--text)}
.k-s:last-of-type{border-bottom:none}
.k-s span:first-child{color:var(--text2);font-family:var(--mono);font-size:.72rem;padding-top:3px;flex:none}
.k-s .klein{color:var(--text2);font-size:.82rem}
.k-frei{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gruen);border:1px solid var(--gruen);padding:5px 10px}
.k-fuss{font-size:.84rem;color:var(--text2);margin:6px 0 0}
.k-fuss a{color:var(--akzent);border-bottom:1px solid var(--akzent)}
/* Was-wäre-wenn */
.block.dunkel .www-satz{margin-top:6px}
.www-satz{font-size:clamp(1.7rem,4.4vw,2.9rem);font-weight:850;font-stretch:94%;letter-spacing:-.02em;line-height:1.15;margin:0;text-transform:uppercase;min-height:2.4em}
.www-satz .fix{color:var(--marke-ai);display:block;font-weight:400}
.www-satz .frage{display:block;color:var(--hell);min-height:2.35em}
.block.dunkel .caret{background:var(--hell)}


/* Werkstatt-Stories */
.stories{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:960px){.stories{grid-template-columns:1fr}}
.story{background:var(--karte);border:1px solid var(--linie);border-top:3px solid var(--f);border-radius:var(--r-m);padding:20px 22px}
.st-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--f);font-weight:700;margin:0 0 10px}
.story h3{font-size:1.06rem;font-weight:800;line-height:1.35;margin:0 0 10px;text-wrap:balance}
.st-lage{font-size:.88rem;color:var(--text2);margin:0 0 10px}
.st-bau{font-size:.88rem;color:var(--text);margin:0;padding-top:10px;border-top:1px dashed var(--linie)}
.st-ehrlich{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;color:var(--text2);margin:18px 0 0}
.st-ehrlich span{color:var(--gruen)}

.st-namen{display:flex;flex-wrap:wrap;gap:10px 34px;align-items:baseline;margin:26px 0 0;padding-top:20px;border-top:1px solid var(--linie)}
.st-namen span{font-family:var(--mono);font-size:.82rem;letter-spacing:.18em;font-weight:700;color:var(--text2)}
.st-vorbehalt{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:#8a6d1f;background:rgba(216,180,90,.12);border:1px dashed rgba(138,109,31,.45);border-radius:var(--r-s);padding:10px 14px;margin:14px 0 0;max-width:56rem}

.story{position:relative}
.st-face{display:none}
@media(max-width:960px){.story{padding-right:78px}}

.st-namen{align-items:center;gap:14px 38px}
.st-namen img{width:auto;filter:grayscale(1) brightness(.32) contrast(1.15);opacity:.9}
.st-foto{display:block;width:88px;height:88px;border-radius:50%;object-fit:cover;border:2.5px solid var(--f);margin:2px 0 16px}
.st-zitat{font-size:1.04rem;font-style:italic;line-height:1.55;color:var(--text);margin:14px 0 0;padding-top:14px;border-top:1px dashed var(--linie)}
.st-zitat.st-offen{font-style:normal;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--text2)}
.st-wer{font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;color:var(--f);margin:6px 0 0;font-weight:700;white-space:nowrap}
.story{display:flex;flex-direction:column}
.st-bau{flex:1}
@media(min-width:961px){.st-zitat{min-height:148px}}
.st-leiste-titel{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text2);margin:26px 0 0;padding-top:20px;border-top:1px solid var(--linie)}
.st-namen{border-top:none;padding-top:14px;margin-top:0}
.st-namen img.logo-invert,.st-namen img.logo-invert:hover{filter:invert(1) brightness(.25);opacity:.95}
.st-namen img.logo-schwarz{filter:grayscale(1) brightness(.05)}
/* Schleifen: Strichmuster wandert in Flussrichtung + Fluss-Punkte */
@media(prefers-reduced-motion:no-preference){
.schleifen polyline{animation:dash-fluss 1.1s linear infinite}
@keyframes dash-fluss{to{stroke-dashoffset:-11}}
}
.fluss-punkt{opacity:.85}
@media(prefers-reduced-motion:reduce){.fluss-punkt{display:none}}
#loesung.vor .schleifen .fluss-punkt{opacity:0}
#loesung.vor.da .schleifen .fluss-punkt{opacity:.85;transition:opacity .6s ease 1.5s}
.flow-abbinder{font-size:.95rem;color:var(--text2);margin:24px 0 0}
.flow-abbinder a{color:var(--akzent);text-decoration:underline;font-weight:700}
/* Check-Teaser mit Ergebnis-Vorschau */
.lm-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
@media(max-width:960px){.lm-grid{grid-template-columns:1fr;gap:26px}}
.check-vorschau{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:22px 24px}
.cv-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;color:var(--text2);margin:0 0 16px}
.cv-zeile{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 5px}
.cv-name{font-weight:800;font-size:.92rem}
.cv-tag{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;color:var(--text2)}
.cv-spur{height:9px;background:var(--papier);border:1px solid var(--linie);border-radius:5px;overflow:hidden;margin:0 0 14px}
.cv-spur i{display:block;height:100%;border-radius:5px}
.cv-hinweis{font-family:var(--mono);font-size:.68rem;color:var(--text2);margin:4px 0 0;border-top:1px dashed var(--linie);padding-top:12px}
.cv-radar{width:100%;max-width:340px;height:auto;display:block;margin:0 auto}
.cv-achse{font-family:var(--mono);font-size:11px;letter-spacing:.06em}
/* Vorgehen: kompakte Leiste (Start) + Detail-Liste */
.vsteps{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
@media(max-width:1100px){.vsteps{grid-template-columns:repeat(4,1fr)}}
@media(max-width:700px){.vsteps{grid-template-columns:repeat(2,1fr)}}
.vstep{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:12px 13px;display:flex;flex-direction:column;gap:3px}
.v-nr{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;color:var(--akzent);font-weight:700}
.vstep b{font-size:.86rem;line-height:1.25}
.v-sub{font-size:.74rem;color:var(--text2)}
.vg-liste{display:flex;flex-direction:column;gap:0;max-width:46rem}
.vg-schritt{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:22px 0;border-bottom:1px dashed var(--linie)}
.vg-schritt:last-child{border-bottom:none}
.vg-nr{font-family:var(--mono);font-weight:700;color:var(--akzent);font-size:1.05rem;padding-top:3px}
.vg-schritt h3{margin:0 0 6px;font-size:1.12rem;font-weight:800}
.vg-schritt p{margin:0;font-size:.95rem;color:var(--text2)}
/* Vorgehen: Fortschrittslinie + zündende Nummern */
.vg-liste{position:relative}
.vg-linie{position:absolute;left:19px;top:28px;bottom:28px;width:2px;background:var(--linie)}
.vg-linie i{display:block;width:100%;height:0;background:var(--akzent);transition:height .42s cubic-bezier(.4,0,.2,1)}
.vg-kopf{position:absolute;left:50%;top:0;width:10px;height:10px;border-radius:50%;background:var(--akzent);transform:translate(-50%,-50%) scale(0);box-shadow:0 0 0 4px rgba(29,110,126,.18),0 0 14px rgba(29,110,126,.55);transition:top .42s cubic-bezier(.4,0,.2,1),transform .25s ease}
.vg-linie.zieht .vg-kopf{transform:translate(-50%,-50%) scale(1)}
.vg-nr{width:40px;height:40px;border-radius:50%;border:2px solid var(--akzent);background:var(--papier);display:grid;place-items:center;font-size:.86rem;padding:0;position:relative;z-index:1;transition:background .45s ease,color .45s ease}
.vg-schritt{align-items:start}
.vg-schritt.voll .vg-nr{background:var(--akzent);color:var(--hell);animation:vg-pop .38s cubic-bezier(.34,1.56,.64,1)}
@keyframes vg-pop{0%{transform:scale(1)}45%{transform:scale(1.22)}100%{transform:scale(1)}}
html:not(.vg-js) .vg-nr{background:var(--akzent);color:var(--hell)}
.vg-js .vg-schritt{opacity:0;transform:translateY(18px)}
.vg-js .vg-schritt.an{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.25,.8,.35,1)}
/* Leistungen-Grid */
.lk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:1100px){.lk-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.lk-grid{grid-template-columns:1fr}}
.lk{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:18px;display:flex;flex-direction:column;gap:8px;transition:transform .2s ease,border-color .2s ease}
.lk:hover{transform:translateY(-3px);border-color:var(--f)}
.lk-icon{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;color:var(--f);background:color-mix(in srgb, var(--f) 10%, #fff);border:1px solid color-mix(in srgb, var(--f) 25%, var(--linie))}
.lk-icon svg{width:24px;height:24px}
.lk-kicker{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;color:var(--f);font-weight:700}
.lk h3{margin:0;font-size:1rem;font-weight:800;line-height:1.3}
.lk p{margin:0;font-size:.84rem;color:var(--text2)}
/* FAQ */
.faq-liste{max-width:46rem}
.faq{border-bottom:1px dashed var(--linie)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:800;font-size:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq-plus{font-family:var(--mono);color:var(--akzent);font-size:1.1rem;transition:transform .25s ease;flex:none}
.faq[open] .faq-plus{transform:rotate(45deg)}
.faq p{margin:0 0 16px;font-size:.94rem;color:var(--text2);max-width:42rem}
.faq summary:hover{color:var(--akzent)}
.cv-statisch{display:none}
@media(prefers-reduced-motion:reduce){.cv-anim{display:none}.cv-statisch{display:block}}
.lm-grid{align-items:center}
.lm-punkte{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:9px}
.lm-punkte li{position:relative;padding-left:26px;font-size:.95rem;color:var(--text)}
.lm-punkte li::before{content:"✓";position:absolute;left:0;color:var(--gruen);font-weight:700;font-family:var(--mono)}
/* Preis-Sektion */
.preis-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:stretch}
@media(max-width:1100px){.preis-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.preis-grid{grid-template-columns:1fr}}
.preis-karte{position:relative;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:22px 20px;display:flex;flex-direction:column;gap:10px}
.preis-karte.empf{border-color:var(--akzent);box-shadow:0 3px 0 rgba(29,110,126,.12)}
.p-badge{position:absolute;top:-11px;left:20px;background:var(--akzent);color:var(--hell);font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;font-weight:700;padding:4px 10px;border-radius:999px}
.preis-karte h3{margin:0;font-size:1.05rem;font-weight:800}
.p-preis{margin:2px 0 4px;font-size:1.7rem;font-weight:800;letter-spacing:-.01em}
.p-preis span{font-size:.8rem;font-weight:700;color:var(--text2);margin-left:6px}
.p-liste{margin:0}
.p-liste li{font-size:.84rem}
.p-cta{text-align:center;font-size:.9rem;padding:12px 18px}
.preis-grid.p5{grid-template-columns:repeat(5,1fr);gap:12px;align-items:start}
@media(max-width:1100px){.preis-grid.p5{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.preis-grid.p5{grid-template-columns:1fr}}
.p5 .preis-karte{padding:20px 16px}
.p5 .p-preis{font-size:1.45rem}
.p5 .p-liste li{font-size:.78rem;padding-left:20px}
.p5 .p-cta{font-size:.82rem;padding:11px 10px}
.p5 h3{font-size:.98rem}
.p-ab{font-size:.72rem;font-weight:700;color:var(--text2);display:block;margin-bottom:-2px}
.p-badge2{background:var(--tinte)}
.p-desc{margin:0;font-size:.8rem;color:var(--text2)}
/* Betriebswege */
.bm-intro{background:var(--karte);border:1px solid var(--linie);border-left:3px solid var(--gruen);border-radius:var(--r-m);padding:20px 24px;max-width:56rem}
.bm-intro h3{margin:6px 0 8px;font-size:1.15rem;font-weight:800}
.bm-intro p{margin:0;font-size:.92rem;color:var(--text2)}
.bm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:stretch}
@media(max-width:960px){.bm-grid{grid-template-columns:1fr}}
.bm-karte{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:20px 22px}
.bm-karte h3{margin:0 0 14px;font-size:1rem;font-weight:800;line-height:1.35;min-height:2.7em}
.bm-l{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:var(--gruen);font-weight:700;margin:12px 0 3px}
.bm-t{margin:0;font-size:.85rem;color:var(--text2)}
.bm-fuss{font-family:var(--mono);font-size:.7rem;color:var(--text2);margin:18px 0 0;max-width:60rem}
/* Über uns: Team */
.tp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:stretch}
@media(max-width:960px){.tp-grid{grid-template-columns:1fr}}
.tp-karte{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:24px 22px}
.tp-ini{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:1.15rem;color:var(--f);background:color-mix(in srgb, var(--f) 10%, #fff);border:2px solid var(--f);margin-bottom:14px}
.tp-karte h3{margin:0;font-size:1.1rem;font-weight:800}
.tp-rolle{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;color:var(--f);font-weight:700;margin:4px 0 10px;text-transform:uppercase}
.tp-bio{margin:0;font-size:.9rem;color:var(--text2)}
/* Über uns: Profil-Reihen */
.tpr-liste{display:flex;flex-direction:column;gap:16px}
.tpr{display:grid;grid-template-columns:96px 1fr;gap:24px;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:26px}
@media(max-width:700px){.tpr{grid-template-columns:1fr}}
.tpr .tp-ini{width:84px;height:84px;font-size:1.4rem}
.tpr-text h3{margin:0;font-size:1.2rem;font-weight:800}
.tpr-text>p{margin:0 0 10px;font-size:.92rem;color:var(--text2);max-width:52rem}
.tpr-text .tp-rolle{margin:4px 0 12px}
.tpr-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.tpr-chips span{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;color:var(--f);font-weight:700;border:1px solid color-mix(in srgb, var(--f) 35%, var(--linie));border-radius:999px;padding:4px 10px;background:color-mix(in srgb, var(--f) 7%, #fff)}
.tpr .tp-foto{width:96px;height:96px;border-radius:50%;object-fit:cover;border:2.5px solid var(--f)}
/* Ablauf-Leiste animiert */
.vstep{transition:opacity .5s ease,transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.vsteps.vjs .vstep{opacity:.35;transform:translateY(8px)}
.vsteps.vjs .vstep.da{opacity:1;transform:none}
.v-nr{display:inline-block;padding:1px 8px;border-radius:999px;background:rgba(29,110,126,.16);transition:background .35s,color .35s,border-color .35s;align-self:flex-start;margin-left:-8px}
.vstep.puls{border-color:var(--akzent);transform:translateY(-3px);box-shadow:0 3px 0 rgba(29,110,126,.12)}
.vstep.puls .v-nr{background:var(--akzent);color:var(--hell)}
.vstep.war{border-color:rgba(29,110,126,.40);background:rgba(29,110,126,.06)}
.vstep.war .v-nr{background:var(--akzent);color:var(--hell)}
#vertrauensleiste{padding:38px 0}
@media(max-width:700px){#vertrauensleiste{padding:28px 0}}
.schild-ic{width:19px;height:19px;vertical-align:-4px;margin-right:6px}
.knopf-sekundaer{background:transparent;color:var(--tinte);border:2px solid var(--tinte);padding:13px 26px}
.knopf-sekundaer:hover{background:var(--tinte);color:var(--hell)}

/* Einheitlicher Schluss-Block (alle Seiten) */
.schluss{padding:92px 0}
.s-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.22em;font-weight:700;color:var(--marke-ai);margin:0 0 14px}
.schluss .b-titel{font-size:1.7rem;color:var(--hell)}
.schluss .b-zweck{color:#93A0AA;max-width:44rem}
.schluss .knopf{background:var(--akzent)}
.schluss .knopf-text{color:#93A0AA}
.schluss .reibung{color:#67737D}

/* Reise-Kurve (Startseite, adaptiert von beam.ai-Muster) */
.reise-svg{display:block;width:100%;height:auto;margin-top:34px}
.reise-svg text{font-family:var(--mono);font-size:14.5px;letter-spacing:.06em;font-weight:700}
#reise{padding-bottom:74px}
.reise-vonzu{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin-top:26px;padding:14px 20px;border:1px solid var(--linie);border-radius:var(--r-m);background:var(--karte);font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;color:var(--text2)}
.reise-vonzu .vz-label{color:var(--text2);font-weight:700;letter-spacing:.2em;opacity:.75}
.reise-vonzu .vz-hell{color:var(--akzent);font-weight:700}
.reise-vonzu .vz-sep{color:var(--linie)}
.reise-vonzu .vz-pfeil{color:var(--tinte);font-weight:700;margin:0 4px}
.reise-karten{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
@media(max-width:760px){.reise-karten{grid-template-columns:1fr}}
.rk{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-m);padding:20px 22px;transition:opacity .5s ease,transform .5s ease}
.rk.rk-vor{opacity:0;transform:translateY(14px)}
.rk-label{font-weight:800;font-size:.98rem;margin:0 0 6px}
.rk-zahl{font-family:var(--mono);font-weight:700;font-size:2rem;color:var(--akzent);margin:0 0 10px;letter-spacing:.02em}
.rk-text{margin:0;font-size:.9rem;color:var(--text2);line-height:1.55}
.reise-fussnote{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;color:var(--text2);margin:12px 0 0;opacity:.8}
.rk-zahl.wort{font-family:inherit;font-size:1.45rem;color:var(--tinte);letter-spacing:0}
.reise-vonzu [data-s]{cursor:pointer}
.reise-vonzu [data-s]:hover{color:var(--tinte)}
.reise-svg{transition:none}
.reise-svg .r-pill rect,.reise-svg .r-pill text,.reise-svg .r-punkt circle{transition:fill .35s ease,stroke .35s ease}
.reise-svg .r-pill,.reise-svg .r-punkt{transition:opacity .35s ease}

/* Farbwelt-Umschalter (Entwurfs-Werkzeug) */
.fw-wrap{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:10px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.fw-knopf{display:flex;align-items:center;gap:8px;background:var(--karte);border:1px solid var(--linie);border-radius:999px;padding:10px 16px;font-size:.85rem;font-weight:600;color:var(--text);cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.fw-panel{background:var(--karte);border:1px solid var(--linie);border-radius:14px;padding:14px;box-shadow:0 6px 24px rgba(0,0,0,.12);display:flex;flex-direction:column;gap:4px;min-width:230px}
.fw-kopf{margin:0 0 8px;font-size:.8rem;color:var(--text);font-weight:600}
.fw-kopf span{color:var(--text2);font-weight:400}
.fw-option{display:flex;align-items:center;gap:10px;background:none;border:1px solid transparent;border-radius:10px;padding:8px 10px;font-size:.82rem;color:var(--text);cursor:pointer;text-align:left}
.fw-option:hover{background:rgba(0,0,0,.04)}
.fw-option.fw-aktiv{border-color:var(--linie);background:rgba(0,0,0,.05)}
.fw-dots{display:inline-flex;gap:4px}
.fw-dots i{width:13px;height:13px;border-radius:50%;display:inline-block}
.fw-gruppe{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:var(--text2);margin:10px 0 4px;font-weight:700}
.fw-panel{max-height:70vh;overflow:auto}
.f-marke{display:inline-flex;flex-direction:column;align-items:flex-start}
.f-claim{font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;color:rgba(243,240,233,.65);margin:10px 0 0;white-space:nowrap;width:100%;text-align:justify;text-align-last:justify}
.fw-panel[hidden]{display:none}

/* Siegel-Band (adaptiert, nur belegbare Zusagen) */
#siegel{padding:46px 0}
.siegel-band{display:grid;grid-template-columns:repeat(4,1fr);gap:34px 24px;justify-items:center}
@media(max-width:760px){.siegel-band{grid-template-columns:repeat(2,1fr)}}
.siegel{display:flex;flex-direction:column;align-items:center;gap:9px;max-width:150px;text-align:center}
.siegel svg{width:36px;height:36px;stroke:var(--tinte);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;opacity:.82}
.siegel svg text{fill:var(--tinte);font-family:var(--sans)}
.siegel svg .s-dot{fill:var(--tinte)}
.siegel span{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;color:var(--text2);line-height:1.45}
