/* Intendo ERP, Design-System
   Herkunft: Markenfarbe #227046 und Schrift Gotham aus Florians Fassung (Stand 16.10.2026).
   Prinzip: helles Papier, dunkle Grünakzente, eine Farbwelt, Varianz über Raster statt über Effekte. */

@font-face{font-family:Gotham;font-weight:300;font-display:swap;src:url(fonts/Gotham-Light.otf) format("opentype")}
@font-face{font-family:Gotham;font-weight:400;font-display:swap;src:url(fonts/Gotham-Book.otf) format("opentype")}
@font-face{font-family:Gotham;font-weight:500;font-display:swap;src:url(fonts/Gotham-Medium.otf) format("opentype")}
@font-face{font-family:Gotham;font-weight:700;font-display:swap;src:url(fonts/Gotham-Bold.otf) format("opentype")}

:root{
  /* Grün-Skala aus #227046 */
  --g-950:#0B2216; --g-900:#0F2C1D; --g-800:#153C27; --g-700:#1B5535; --g:#227046; --g-500:#3D8358;
  --g-400:#6A9F7B; --g-300:#9CC1A6; --g-200:#C9DDCD; --g-100:#E4EEE6; --g-50:#F2F7F3;
  /* Produkt-Grün nur für Datenvisualisierung */
  --data:#62A132;
  /* Neutrale, warm */
  --ink:#141B17; --ink-2:#2D3832; --muted:#5B6760; --line:#DCDAD1; --line-2:#E9E7DF;
  --paper:#F7F6F1; --paper-2:#EFEDE5; --card:#FFFFFF;
  --warn:#B4532A;
  --radius:18px; --radius-s:12px; --radius-l:28px;
  --max:1240px; --gut:clamp(20px,4vw,40px);
  --shadow-1:0 1px 0 rgba(20,27,23,.04),0 10px 30px -18px rgba(20,27,23,.28);
  --shadow-2:0 2px 0 rgba(20,27,23,.03),0 30px 60px -30px rgba(15,44,29,.45);
  --ease:cubic-bezier(.2,.7,.2,1);
  --font:Gotham,"Helvetica Neue",Arial,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-weight:500;letter-spacing:-.025em;line-height:1.08;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.num,[data-to]{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--g);outline-offset:3px;border-radius:6px}
section[id],[id].anker{scroll-margin-top:110px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:clamp(72px,10vw,136px)}
.sec--tight{padding-block:clamp(56px,7vw,96px)}
.sec--paper2{background:var(--paper-2)}
.sec--white{background:var(--card)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Typo-Bausteine ---------- */
.kicker{display:flex;align-items:center;gap:14px;font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--g)}
.kicker::before{content:"";width:28px;height:1px;background:currentColor}
.kicker--plain::before{display:none}
.kicker .idx{font-variant-numeric:tabular-nums;color:var(--muted);letter-spacing:.08em}
.h1{font-size:clamp(40px,5.6vw,76px);font-weight:500;letter-spacing:-.035em;line-height:1.02}
.h2{font-size:clamp(32px,3.8vw,52px);letter-spacing:-.03em}
.h3{font-size:clamp(20px,1.7vw,24px);letter-spacing:-.02em;line-height:1.2}
.lead{font-size:clamp(18px,1.5vw,21px);line-height:1.55;color:var(--ink-2);font-weight:300}
.muted{color:var(--muted)}
.accent{color:var(--g)}
.sec-head{display:grid;gap:22px;max-width:780px}
.sec-head--split{max-width:none;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:clamp(24px,5vw,80px)}
.sec-head--center{margin-inline:auto;text-align:center;justify-items:center}
.sec-head--center .kicker::after{content:"";width:28px;height:1px;background:currentColor}
.mt-s{margin-top:24px}.mt-m{margin-top:40px}.mt-l{margin-top:clamp(48px,6vw,80px)}

/* ---------- Buttons ---------- */
.btn{--bg:var(--g);white-space:nowrap;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border-radius:12px;background:var(--bg);color:#fff;font:500 16px/1 var(--font);text-decoration:none;border:0;cursor:pointer;position:relative;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(15,44,29,.7);background:var(--g-700)}
.btn:hover::after{transform:translateX(120%)}
.btn .arr{transition:transform .25s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--g-300),0 10px 24px -16px rgba(15,44,29,.5)}
.btn--light{background:#fff;color:var(--g-900)}
.btn--light:hover{background:var(--g-50)}
.cta-note{font-size:14px;color:var(--muted);margin-top:14px}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:500;color:var(--g);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s var(--ease)}
.link:hover{background-size:100% 1px}

/* ---------- Kopfbereich ---------- */
.topbar{background:var(--g-900);color:#cfe0d4;font-size:13px}
.topbar .wrap{display:flex;justify-content:flex-end;gap:28px;padding-block:9px}
.topbar a{text-decoration:none}
.topbar a:hover{color:#fff}
.hdr{position:sticky;top:0;z-index:40;background:rgba(247,246,241,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.hdr.is-scrolled{border-bottom-color:var(--line);background:rgba(247,246,241,.94)}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:78px}
.logo img{height:38px;width:auto}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav>a,.nav .dd>button{font:500 15px var(--font);color:var(--ink-2);text-decoration:none;padding:10px 14px;border-radius:10px;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s,color .2s}
.nav>a:hover,.nav .dd>button:hover,.nav .dd.is-open>button{background:var(--card);color:var(--g)}
.nav a[aria-current=page],.nav .dd.is-active>button{color:var(--g)}
.nav .dd{position:relative}
.nav .dd>button svg{transition:transform .25s}
.nav .dd.is-open>button svg{transform:rotate(180deg)}
.dd-panel{position:absolute;top:calc(100% + 10px);left:-12px;width:min(560px,90vw);background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);box-shadow:var(--shadow-2);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:4px;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .2s,transform .25s var(--ease)}
.dd.is-open .dd-panel{opacity:1;transform:none;pointer-events:auto}
.dd-panel a{display:grid;gap:3px;padding:14px 16px;border-radius:12px;text-decoration:none;color:var(--ink)}
.dd-panel a:hover,.dd-panel a[aria-current=page]{background:var(--g-50)}
.dd-panel a b{font-weight:500;font-size:15px}
.dd-panel a span{font-size:13px;color:var(--muted);line-height:1.4}
.hdr .btn{padding:13px 20px;font-size:15px}
.burger{display:none;margin-left:auto;width:46px;height:46px;border-radius:12px;border:1px solid var(--line);background:var(--card);cursor:pointer;position:relative}
.burger span{position:absolute;left:13px;right:13px;height:1.5px;background:var(--ink);transition:transform .3s var(--ease),opacity .2s}
.burger span:nth-child(1){top:17px}.burger span:nth-child(2){top:22.5px}.burger span:nth-child(3){top:28px}
.is-menu .burger span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.is-menu .burger span:nth-child(2){opacity:0}
.is-menu .burger span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
.drawer{position:fixed;inset:78px 0 0;z-index:39;background:var(--paper);padding:20px var(--gut) 40px;overflow:auto;transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .25s,transform .3s var(--ease)}
.is-menu .drawer{opacity:1;transform:none;pointer-events:auto}
.drawer a{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;border-bottom:1px solid var(--line);text-decoration:none;font-size:19px;font-weight:500}
.drawer .grp{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:22px 4px 4px}
.drawer .btn{margin-top:28px;width:100%;justify-content:center;font-size:17px}
.drawer .contact{margin-top:22px;color:var(--muted);font-size:15px;display:grid;gap:6px}
.drawer .contact a{border:0;padding:0;font-size:15px;font-weight:400;display:inline}

/* ---------- Seiten-Hero (Unterseiten) ---------- */
.phero{padding-block:clamp(48px,7vw,96px) clamp(56px,7vw,100px);position:relative;overflow:hidden}
.crumbs{display:flex;gap:10px;font-size:14px;color:var(--muted);margin-bottom:34px}
.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--g)}
.phero__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,5vw,80px);align-items:end}
.phero h1{margin-top:22px}
.phero__side{display:grid;gap:26px}
.phero__acts{display:flex;flex-wrap:wrap;gap:12px}
.phero__art{position:absolute;right:-6vw;top:-10%;width:min(46vw,640px);aspect-ratio:1;pointer-events:none;opacity:.9}

/* ---------- Start-Hero ---------- */
.hero{position:relative;padding-top:clamp(44px,6vw,84px);overflow:hidden}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;max-width:1000px}
.hero__h1{margin-top:4px}
.hero__h1 .line2{display:block;color:var(--g)}
.hero__row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,72px);align-items:end;margin-top:6px}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px}
.hero__stage{position:relative;margin-top:clamp(48px,6vw,80px);perspective:1800px}
.shot{position:relative;border-radius:var(--radius-l);background:var(--card);padding:10px;box-shadow:var(--shadow-2);border:1px solid var(--line-2);transform-origin:50% 0;will-change:transform}
.shot__bar{display:flex;align-items:center;gap:8px;padding:6px 8px 12px}
.shot__bar i{width:10px;height:10px;border-radius:50%;background:var(--line)}
.shot__bar span{margin-left:12px;font-size:12px;color:var(--muted);background:var(--paper);padding:5px 14px;border-radius:8px}
.shot img{border-radius:14px;width:100%}
.float{position:absolute;background:var(--card);border:1px solid var(--line-2);border-radius:16px;box-shadow:var(--shadow-2);padding:16px 18px;font-size:14px}
.float--agents{left:-28px;bottom:16%;width:250px}
.float--agents b{display:block;font-size:30px;font-weight:500;letter-spacing:-.02em;color:var(--g-900)}
.float--agents .bars{display:flex;gap:4px;margin-top:12px;align-items:flex-end;height:30px}
.float--agents .bars i{flex:1;background:var(--g-200);border-radius:3px;transform-origin:bottom;animation:bar 1.4s var(--ease) 1 both}
.float--agents .bars i:nth-child(odd){background:var(--g)}
@keyframes bar{from{transform:scaleY(.1)}to{transform:scaleY(1)}}
.float--msg{right:-22px;top:18%;width:270px;display:grid;gap:10px}
.float--msg .row{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start}
.float--msg .tag{font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:var(--g-50);color:var(--g);padding:4px 8px;border-radius:6px;font-weight:500}
.float--msg small{display:block;color:var(--muted);font-size:12px}
.hero__base{position:absolute;left:0;right:0;bottom:0;height:42%;background:var(--card);z-index:-1}

/* Vertrauensleiste */
.trust{background:var(--card);border-bottom:1px solid var(--line-2)}
.trust__in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;padding-block:34px}
.trust__label{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);max-width:160px;line-height:1.5}
.marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;gap:64px;width:max-content;align-items:center;animation:marq 38s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}
.mark{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:500;letter-spacing:-.02em;color:#56625B;white-space:nowrap;filter:grayscale(1);opacity:.85;transition:filter .3s,opacity .3s,color .3s}
.mark:hover{filter:none;opacity:1;color:var(--ink)}
.mark img{height:30px;width:auto}
.mark img.round{height:34px;border-radius:50%}

/* ---------- Karten ---------- */
.card{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(24px,2.4vw,34px);position:relative;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-1);border-color:var(--g-200)}
.card .h3{margin-bottom:12px}
.card p{color:var(--ink-2)}
.card--tint{background:var(--g-50);border-color:var(--g-100)}
.card--deep{background:var(--g-900);border-color:var(--g-900);color:#E4EEE6}
.card--deep p{color:#B9CDBF}.card--deep .h3{color:#fff}
.card--line{background:transparent}
.card .ix{font-size:13px;font-weight:500;color:var(--g);letter-spacing:.1em;margin-bottom:18px;display:block;font-variant-numeric:tabular-nums}
.card--deep .ix{color:var(--g-300)}
.card .more{margin-top:22px}

/* Bento */
.bento{display:grid;gap:16px;grid-template-columns:repeat(6,minmax(0,1fr))}
.bento>*{grid-column:span 2}
.bento .s2{grid-column:span 2}.bento .s3{grid-column:span 3}.bento .s4{grid-column:span 4}.bento .s6{grid-column:span 6}
.bento .r2{grid-row:span 2}

/* Ghost-Nummern */
.ghost{position:absolute;right:20px;top:6px;font-size:96px;font-weight:700;line-height:1;color:var(--g-50);letter-spacing:-.04em;pointer-events:none;font-variant-numeric:tabular-nums;z-index:0}
.card>*:not(.ghost){position:relative;z-index:1}

/* Chips (dezent) */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;padding:7px 13px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-size:14px;color:var(--ink-2);white-space:nowrap;transition:border-color .2s,color .2s}
.chip:hover{border-color:var(--g-300);color:var(--g)}
.chips--soft .chip{background:var(--g-50);border-color:var(--g-100)}
.card--deep .chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);color:#D7E5DB}

/* ---------- Zahlenband ---------- */
.band{background:var(--g-900);color:#E4EEE6;position:relative;overflow:hidden}
.band::before{content:"";position:absolute;inset:auto -10% -60% 40%;height:120%;background:radial-gradient(closest-side,rgba(61,131,88,.35),transparent);pointer-events:none}
.band .h2{color:#fff}
.band .lead{color:#B9CDBF}
.band .kicker{color:var(--g-300)}
.stats{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-l);overflow:hidden;margin-top:clamp(40px,5vw,64px)}
.stat{background:var(--g-900);padding:clamp(26px,3vw,40px);display:grid;gap:12px;align-content:space-between;grid-column:span 4}
.stat--hero{grid-column:span 6;grid-row:span 2}
.stat--wide{grid-column:span 6}
.stat--q{grid-column:span 3}
.stat .v{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;color:#fff}
.stat .v small{font-size:16px;color:var(--g-300);font-weight:400;letter-spacing:0}
.stat .v b{font-size:clamp(46px,5vw,72px);font-weight:500;letter-spacing:-.04em;line-height:1}
.stat--hero .v b{font-size:clamp(72px,9vw,132px)}
.stat .v em{font-style:normal;font-size:clamp(20px,2vw,28px);font-weight:400;color:#D7E5DB}
.stat p{color:#B9CDBF;font-size:16px;max-width:30ch}
.band__foot{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between;margin-top:36px}
.band__foot p{font-size:19px;color:#E4EEE6;max-width:52ch}

/* ---------- Schmerz-Zitate ---------- */
.quotes{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;margin-top:clamp(40px,5vw,64px)}
.quote{grid-column:span 6;background:var(--card);border-radius:var(--radius);padding:clamp(26px,3vw,40px);border:1px solid var(--line-2);display:grid;gap:18px;align-content:start}
.quote:nth-child(1){grid-column:1/span 7}
.quote:nth-child(2){grid-column:8/span 5;margin-top:56px}
.quote:nth-child(3){grid-column:2/span 5}
.quote:nth-child(4){grid-column:7/span 6;margin-top:28px}
.quote .role{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--g);font-weight:500}
.quote blockquote{margin:0;font-size:clamp(22px,2.3vw,31px);line-height:1.22;letter-spacing:-.02em;font-weight:500;color:var(--ink);text-wrap:balance}
.quote p{color:var(--muted)}

/* ---------- Wege (Bento mit Bildern) ---------- */
.ways{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin-top:clamp(40px,5vw,64px)}
.way{border-radius:var(--radius-l);padding:clamp(26px,3vw,40px);display:grid;align-content:space-between;gap:28px;text-decoration:none;color:inherit;position:relative;overflow:hidden;min-height:300px;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.way:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.way--a{grid-column:span 7;grid-row:span 2;background:var(--g-900);color:#fff}
.way--b{grid-column:span 5;background:var(--card);border:1px solid var(--line-2)}
.way--c{grid-column:span 5;background:var(--g-100)}
.way .tag{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--g)}
.way--a .tag{color:var(--g-300)}
.way h3{font-size:clamp(24px,2.4vw,34px);letter-spacing:-.025em;margin-top:14px;line-height:1.12}
.way p{margin-top:14px;color:var(--ink-2)}
.way--a p{color:#B9CDBF}
.way .go{display:inline-flex;align-items:center;gap:10px;font-weight:500}
.way .go i{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid currentColor;font-style:normal;transition:transform .3s var(--ease),background .3s}
.way:hover .go i{transform:translateX(4px)}
.way--a .go i{border-color:rgba(255,255,255,.35)}
.migr{display:grid;gap:10px;margin-top:8px}
.migr .lane{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;font-size:14px}
.migr .lane span:first-child{color:#B9CDBF;min-width:120px}
.migr .lane i{height:2px;background:linear-gradient(90deg,rgba(156,193,166,.15),rgba(156,193,166,.9));position:relative;overflow:hidden;border-radius:2px}
.migr .lane i{transform-origin:left}
.js .way:not(.in) .migr .lane i{transform:scaleX(0)}
.way.in .migr .lane i{animation:flow 1.2s var(--ease) .3s 1 both}
.way.in .migr .lane:nth-child(2) i{animation-delay:.45s}.way.in .migr .lane:nth-child(3) i{animation-delay:.6s}.way.in .migr .lane:nth-child(4) i{animation-delay:.75s}
@keyframes flow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.migr .lane b{font-weight:500;color:#fff}

/* ---------- Orbit (Ein System) ---------- */
.orbit{position:relative;width:min(760px,100%);aspect-ratio:1;margin:clamp(24px,4vw,48px) auto 0}
.orbit__ring{position:absolute;inset:0;transition:transform .1s linear}
.orbit__ring--2{inset:18%;border:1px dashed var(--g-200);border-radius:50%}
.orbit__ring--1::before{content:"";position:absolute;inset:4%;border:1px solid var(--line);border-radius:50%}
.orbit__core{position:absolute;inset:34%;border-radius:50%;background:var(--g-900);color:#fff;display:grid;place-items:center;text-align:center;box-shadow:0 30px 60px -30px rgba(15,44,29,.6),inset 0 0 0 10px rgba(255,255,255,.04)}
.orbit__core b{font-size:clamp(18px,2.2vw,26px);font-weight:500;letter-spacing:-.02em;line-height:1.15}
.orbit__core span{display:block;font-size:13px;color:var(--g-300);margin-top:6px;letter-spacing:.08em;text-transform:uppercase}
.orbit__node{position:absolute;left:calc(50% + var(--r) * sin(var(--a)));top:calc(50% - var(--r) * cos(var(--a)));transform:translate(-50%,-50%)}
.orbit__node span{display:inline-block;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 14px;font-size:15px;font-weight:500;white-space:nowrap;box-shadow:var(--shadow-1);transform:rotate(calc(var(--spin,0deg) * -1));transition:border-color .2s,color .2s}
.orbit__node span:hover{border-color:var(--g);color:var(--g)}

/* ---------- Branchen-Reiter ---------- */
.seg{display:inline-flex;gap:4px;padding:5px;border-radius:14px;background:var(--card);border:1px solid var(--line-2);margin-top:36px;flex-wrap:wrap;justify-content:center}
.seg button{font:500 15px var(--font);padding:12px 20px;border-radius:10px;border:0;background:none;color:var(--ink-2);cursor:pointer;transition:background .25s,color .25s}
.seg button[aria-selected=true]{background:var(--g);color:#fff}
.seg button:hover:not([aria-selected=true]){background:var(--g-50)}
.tabp{margin-top:34px;display:grid;gap:12px;text-align:left}
.tabp[hidden]{display:none}
.fix{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:stretch;background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);overflow:hidden;animation:rowin .5s var(--ease) both}
.fix:nth-child(2){animation-delay:.08s}.fix:nth-child(3){animation-delay:.16s}
@keyframes rowin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.fix>div{padding:22px 26px;display:grid;gap:6px;align-content:center}
.fix small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500}
.fix .to{background:var(--g-50)}
.fix .to small{color:var(--g)}
.fix .to b{font-weight:500}
.fix .arrow{display:grid;place-items:center;background:linear-gradient(90deg,var(--card) 50%,var(--g-50) 50%);color:var(--g)}
.fix .arrow i{width:34px;height:34px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-style:normal;font-size:15px}

/* ---------- Bogen-Karussell ---------- */
.arc{position:relative;margin-top:clamp(40px,5vw,72px);padding-bottom:20px}
.arc__track{display:flex;justify-content:center;gap:18px;padding-top:40px}
.arc__card{flex:0 0 clamp(240px,22vw,290px);background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:28px;display:grid;gap:14px;align-content:start;min-height:280px;transform:translateY(var(--y,0)) rotate(var(--rot,0deg));transition:transform .7s var(--ease),box-shadow .35s,border-color .35s;box-shadow:var(--shadow-1)}
.arc.is-flat .arc__card{transform:none}
.arc__card:hover{border-color:var(--g-300);box-shadow:var(--shadow-2)}
.arc__card .n{width:44px;height:44px;border-radius:12px;background:var(--g-900);color:#fff;display:grid;place-items:center;font-weight:500;font-variant-numeric:tabular-nums}
.arc__card h3{font-size:22px;letter-spacing:-.02em}
.arc__card p{color:var(--ink-2);font-size:16px}
.arc__hint{display:none}

/* ---------- Case ---------- */
.case{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:start}
.case__meta{position:sticky;top:120px;display:grid;gap:22px}
.case__logo{display:flex;align-items:center;gap:14px}
.case__logo img{width:56px;height:56px;border-radius:14px}
.case__logo b{font-size:15px;color:var(--muted);font-weight:400}
.case__wins{display:grid;gap:14px}
.win{display:grid;grid-template-columns:72px minmax(0,1fr);gap:20px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:26px}
.win .ico{width:56px;height:56px;border-radius:14px;background:var(--g-50);display:grid;place-items:center;color:var(--g)}
.win h3{font-size:21px;letter-spacing:-.015em;margin-bottom:6px}
.win p{color:var(--ink-2)}
.win:nth-child(2){margin-left:clamp(0px,3vw,40px)}
.win:nth-child(3){margin-left:clamp(0px,6vw,80px)}

/* ---------- Schnittstellen-Wolke ---------- */
.integr{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:center}
.cloud{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start}
.cloud .chip{font-size:15px;padding:10px 16px;background:var(--card)}
.cloud .chip.k{background:var(--g-900);color:#fff;border-color:var(--g-900)}
.cloud .chip.k:hover{color:#fff;background:var(--g-700)}

/* ---------- Zeitachse ---------- */
.tl{position:relative;display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:clamp(18px,3vw,40px);margin-top:clamp(40px,5vw,72px);padding-top:46px}
.tl__rail{position:absolute;left:0;right:0;top:12px;height:2px;background:var(--line)}
.tl__rail i{position:absolute;inset:0;background:var(--g);transform-origin:left;transform:scaleX(var(--p,0));transition:transform .2s linear}
.tl__step{position:relative;display:grid;gap:12px;align-content:start}
.tl__step::before{content:"";position:absolute;top:-41px;left:0;width:14px;height:14px;border-radius:50%;background:var(--paper);border:2px solid var(--g-300);transition:background .4s,border-color .4s}
.tl__step.is-on::before{background:var(--g);border-color:var(--g)}
.sec--white .tl__step::before{background:var(--card)}
.tl__step .ph{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--g);font-weight:500}
.tl__step h3{font-size:clamp(21px,2vw,26px)}
.tl__step p{color:var(--ink-2)}
.tl--dark .tl__rail{background:rgba(255,255,255,.14)}
.tl--dark .tl__rail i{background:var(--g-300)}
.tl--dark .tl__step::before{background:var(--g-900);border-color:rgba(255,255,255,.3)}
.tl--dark .tl__step.is-on::before{background:var(--g-300);border-color:var(--g-300)}
.tl--dark .tl__step .ph{color:var(--g-300)}
.tl--dark .tl__step h3{color:#fff}
.tl--dark .tl__step p{color:#B9CDBF}

/* Laufband Phasen */
.ticker{border-block:1px solid var(--line);background:var(--card);overflow:hidden}
.ticker .marquee__track{gap:48px;padding-block:22px;animation-duration:30s}
.ticker span{font-size:clamp(20px,2.2vw,30px);font-weight:500;letter-spacing:-.02em;color:var(--ink-2);white-space:nowrap;display:flex;align-items:center;gap:48px}
.ticker span::after{content:"";width:34px;height:1px;background:var(--g-300)}
.ticker em{font-style:normal;color:var(--g)}

/* ---------- Teaser-Bänder ---------- */
.split-band{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.tb{border-radius:var(--radius-l);padding:clamp(28px,3.4vw,48px);display:grid;gap:18px;align-content:space-between;min-height:300px;position:relative;overflow:hidden}
.tb--calc{grid-column:span 7;background:var(--card);border:1px solid var(--line-2)}
.tb--ws{grid-column:span 5;background:var(--g)}
.tb--ws,.tb--ws .h3{color:#fff}
.tb--ws p{color:#DCEADF}
.tb--ws .kicker{color:#C9DDCD}
.tb h2{font-size:clamp(26px,2.6vw,36px);letter-spacing:-.025em}
.gauge{display:flex;gap:6px;align-items:flex-end;height:64px}
.gauge i{flex:1;background:var(--g-100);border-radius:4px 4px 0 0;height:var(--h)}
.gauge i.on{background:var(--g)}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:start}
.faq__head{position:sticky;top:120px;display:grid;gap:20px}
.faq__head .h2{font-size:clamp(30px,3vw,44px)}
.faq__list{border-top:1px solid var(--line)}
details.qa{border-bottom:1px solid var(--line)}
details.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;font-size:clamp(18px,1.6vw,21px);font-weight:500;letter-spacing:-.01em}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary i{flex:0 0 36px;height:36px;border-radius:50%;border:1px solid var(--line);position:relative;transition:background .3s,border-color .3s,transform .4s var(--ease)}
details.qa summary i::before,details.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:var(--ink);transform:translate(-50%,-50%)}
details.qa summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s var(--ease)}
details.qa[open] summary i{background:var(--g);border-color:var(--g)}
details.qa[open] summary i::before,details.qa[open] summary i::after{background:#fff}
details.qa[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
details.qa p{padding:0 56px 26px 0;color:var(--ink-2)}
.faq__more{margin-top:28px;color:var(--muted)}
.faq__more a{color:var(--g);font-weight:500;text-decoration:none}

/* ---------- Trio (Einfach, Übersichtlich, Intelligent) ---------- */
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:clamp(40px,5vw,64px)}
.trio>div{padding:clamp(26px,3vw,40px) clamp(20px,3vw,40px) 0 0;display:grid;gap:14px;align-content:start;border-right:1px solid var(--line)}
.trio>div:not(:first-child){padding-left:clamp(20px,3vw,40px)}
.trio>div:last-child{border-right:0}
.trio h3{font-size:clamp(30px,3.4vw,46px);letter-spacing:-.03em;color:var(--g-900)}
.trio p{color:var(--ink-2);max-width:30ch}

/* ---------- Abschluss-CTA ---------- */
.final{background:var(--g-900);color:#fff;border-radius:var(--radius-l);padding:clamp(40px,6vw,88px);position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,64px);align-items:end}
.final::before{content:"";position:absolute;width:780px;height:780px;right:-260px;top:-380px;border-radius:50%;border:1px solid rgba(156,193,166,.18);box-shadow:0 0 0 70px rgba(156,193,166,.04),0 0 0 140px rgba(156,193,166,.03)}
.final h2{font-size:clamp(34px,4vw,56px);letter-spacing:-.03em;color:#fff;position:relative}
.final p{color:#B9CDBF;font-size:19px;position:relative}
.final .acts{position:relative;display:grid;gap:14px;justify-items:start}
.final .acts small{color:#9CC1A6;font-size:14px}

/* ---------- Platzhalter (aus Florians Fassung, sichtbar gelassen) ---------- */
.ph-slot{border:1.5px dashed var(--g-300);border-radius:var(--radius);background:repeating-linear-gradient(-45deg,transparent 0 12px,rgba(34,112,70,.035) 12px 24px);color:var(--g-700);padding:24px;display:grid;place-items:center;text-align:center;font-size:15px;min-height:120px}
.ph-slot::before{content:"Platzhalter";display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--g);margin-bottom:6px}
.ph-inline{background:var(--g-50);border-bottom:1.5px dashed var(--g-300);color:var(--g-700);padding:0 4px;border-radius:4px}

/* ---------- Footer ---------- */
.ftr{background:var(--g-950);color:#B9CDBF;padding-block:clamp(56px,7vw,96px) 32px;margin-top:clamp(72px,10vw,136px)}
.ftr__grid{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:40px}
.ftr__logo{background:#fff;border-radius:14px;padding:12px 16px;display:inline-block}
.ftr__logo img{height:32px}
.ftr h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#7FA58A;font-weight:500;margin-bottom:18px}
.ftr a{text-decoration:none;color:#E4EEE6}
.ftr a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr address{font-style:normal;margin-top:22px;line-height:1.7}
.ftr__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;border-top:1px solid rgba(255,255,255,.1);margin-top:56px;padding-top:24px;font-size:14px;color:#7FA58A}

/* Schwebender Demo-Button */
.fab{position:fixed;right:22px;bottom:22px;z-index:45;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .3s,transform .35s var(--ease);box-shadow:0 18px 40px -16px rgba(15,44,29,.7)}
.fab.is-on{opacity:1;transform:none;pointer-events:auto}

/* ---------- Unterseiten-Bausteine ---------- */
.feature-split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px);align-items:center}
.steps-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:clamp(40px,5vw,64px);counter-reset:s}
.flow{position:relative;padding:28px 22px 28px 0;display:grid;gap:8px;border-top:2px solid var(--line)}
.flow::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-size:13px;color:var(--g);font-weight:500;letter-spacing:.1em}
.flow::after{content:"";position:absolute;top:-2px;left:0;height:2px;width:0;background:var(--g);transition:width .9s var(--ease)}
.flow.is-in::after{width:100%}
.flow b{font-size:20px;font-weight:500;letter-spacing:-.015em}
.flow span{color:var(--muted);font-size:15px}
.cmp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:clamp(40px,5vw,64px)}
.cmp__col{border-radius:var(--radius-l);padding:clamp(28px,3vw,44px)}
.cmp__col--no{background:var(--paper-2);border:1px solid var(--line)}
.cmp__col--yes{background:var(--g-900);color:#fff}
.cmp__col h3{font-size:clamp(22px,2vw,28px);margin-bottom:24px}
.cmp ul{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.cmp li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:14px;align-items:start}
.cmp li i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-size:14px}
.cmp__col--no li i{background:#F3E2D9;color:var(--warn)}
.cmp__col--yes li i{background:rgba(156,193,166,.18);color:var(--g-300)}
.cmp__col--yes li span{color:#DCEADF}
.quote-band{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center}
.quote-band .mk{font-size:120px;line-height:.7;color:var(--g-200);font-weight:500}
.ind-nav{position:sticky;top:78px;z-index:30;background:rgba(247,246,241,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.ind-nav .wrap{display:flex;gap:6px;align-items:center;overflow:auto;padding-block:12px;scrollbar-width:none}
.ind-nav span{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:12px;white-space:nowrap}
.ind-nav a{white-space:nowrap;padding:9px 16px;border-radius:10px;text-decoration:none;font-weight:500;font-size:15px;color:var(--ink-2);transition:background .2s,color .2s}
.ind-nav a:hover,.ind-nav a.is-cur{background:var(--g);color:#fff}
.ind{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(28px,5vw,72px);align-items:start}
.ind__no{font-size:clamp(80px,10vw,150px);font-weight:500;line-height:.85;letter-spacing:-.05em;color:var(--g-100)}
.ind__cols{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.ind__cols .card{grid-column:span 3}
.ind__cols .card.wide{grid-column:span 6}
.ind__cols ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.ind__cols li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;color:var(--ink-2)}
.ind__cols li::before{content:"";width:10px;height:1.5px;background:var(--g);margin-top:12px}
.card--deep .ind__cols li,.card--deep li{color:#DCEADF}
.card--deep li::before{background:var(--g-300)}
.ref-line{display:flex;align-items:center;gap:12px;margin-top:6px;color:var(--muted);font-size:15px}
.ref-line b{color:var(--ink);font-weight:500}
.form{display:grid;gap:16px}
.form label{display:grid;gap:8px;font-size:14px;font-weight:500;color:var(--ink-2)}
.form input,.form textarea{width:100%;padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--card);font:400 16px var(--font);color:var(--ink);transition:border-color .2s,box-shadow .2s}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 4px rgba(34,112,70,.12)}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.list-check{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.list-check li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px}
.list-check li::before{content:"";width:22px;height:22px;border-radius:7px;background:var(--g-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6 11.5l3.2 3L16 8' fill='none' stroke='%23227046' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px no-repeat}
.devices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:clamp(40px,5vw,64px)}
.dev{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:24px;display:grid;gap:14px;align-content:start;transition:transform .35s var(--ease)}
.dev:nth-child(even){transform:translateY(28px)}
.dev:hover{transform:translateY(-3px)}
.dev:nth-child(even):hover{transform:translateY(24px)}
.dev svg{width:42px;height:42px;color:var(--g)}
.dev b{font-size:19px;font-weight:500}
.dev p{color:var(--muted);font-size:15px}
.agents{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:clamp(40px,5vw,64px)}
.agent{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:22px;display:grid;gap:12px;align-content:start;transition:transform .35s var(--ease),border-color .3s}
.agent:hover{transform:translateY(-3px);border-color:var(--g-200)}
.agent__top{display:flex;justify-content:space-between;align-items:center}
.agent__top b{font-weight:500;font-size:17px}
.agent__state{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--g);font-weight:500;letter-spacing:.04em}
.agent__state i{width:8px;height:8px;border-radius:2px;background:var(--g)}
.agent p{color:var(--ink-2);font-size:15px}
.agent:nth-child(1),.agent:nth-child(4),.agent:nth-child(7),.agent:nth-child(8){grid-column:span 2}
.agent:nth-child(1){background:var(--g-900);border-color:var(--g-900)}
.agent:nth-child(1) b,.agent:nth-child(1) p{color:#fff}
.agent:nth-child(1) p{color:#B9CDBF}
.agent:nth-child(1) .agent__state{color:var(--g-300)}
.agent:nth-child(1) .agent__state i{background:var(--g-300)}
.ask{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center}
.ask__q{display:grid;gap:10px}
.ask__q div{background:var(--card);border:1px solid var(--line-2);border-radius:16px 16px 16px 4px;padding:16px 20px;font-size:17px;max-width:44ch;transition:transform .3s var(--ease),border-color .3s}
.ask__q div:nth-child(even){margin-left:clamp(0px,4vw,56px);border-radius:16px 16px 4px 16px;background:var(--g-50);border-color:var(--g-100)}
.ask__q div:hover{border-color:var(--g-300);transform:translateX(4px)}
.kpi-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.kpi{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:28px;display:grid;gap:10px;grid-column:span 3}
.kpi:first-child{grid-column:span 4;background:var(--g-900);border-color:var(--g-900);color:#fff}
.kpi:last-child{grid-column:span 2}
.kpi b{font-size:clamp(36px,4vw,54px);font-weight:500;letter-spacing:-.035em;line-height:1}
.kpi span{color:var(--muted);font-size:15px}
.kpi:first-child span{color:#B9CDBF}
.pipe{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:clamp(40px,5vw,64px);position:relative}
.pipe::before{content:"";position:absolute;left:5%;right:5%;top:50%;height:2px;background:repeating-linear-gradient(90deg,var(--g-300) 0 8px,transparent 8px 16px);z-index:0}
@keyframes dash{to{background-position:16px 0}}
.pipe>div{position:relative;z-index:1;background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:22px;display:grid;gap:8px;text-align:center;align-content:center;min-height:150px}
.pipe>div:nth-child(2){background:var(--g-900);color:#fff;border-color:var(--g-900);transform:scale(1.06)}
.pipe>div:nth-child(2) span{color:#B9CDBF}
.pipe b{font-size:19px;font-weight:500}
.pipe span{color:var(--muted);font-size:14px}
.calc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:16px;align-items:start}
.calc__in{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius-l);padding:clamp(24px,3vw,40px);display:grid;gap:30px}
.calc__out{background:var(--g-900);color:#fff;border-radius:var(--radius-l);padding:clamp(24px,3vw,40px);position:sticky;top:110px;display:grid;gap:22px}
.presets{display:flex;gap:6px;padding:5px;border-radius:12px;background:var(--paper);border:1px solid var(--line-2);width:max-content}
.presets button{font:500 15px var(--font);padding:10px 18px;border-radius:9px;border:0;background:none;cursor:pointer;color:var(--ink-2)}
.presets button.active{background:var(--g);color:#fff}
.fld{display:grid;gap:12px}
.fld__top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.fld__top b{font-weight:500}
.fld__top span{color:var(--g);font-weight:500;font-variant-numeric:tabular-nums}
.fld input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:6px;background:var(--g-100) linear-gradient(var(--g),var(--g)) no-repeat;background-size:0 100%;cursor:pointer}
.fld input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--g);box-shadow:0 2px 6px rgba(0,0,0,.15)}
.fld input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--g)}
.inrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.inbox{border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:grid;gap:2px;background:var(--paper)}
.inbox.is-us{background:var(--g-50);border-color:var(--g-100)}
.inbox label{font-size:12px;color:var(--muted)}
.inbox div{display:flex;align-items:baseline;gap:6px}
.inbox input{width:100%;border:0;background:none;font:500 20px var(--font);color:var(--ink);padding:0;font-variant-numeric:tabular-nums}
.inbox input:focus{outline:none}
.inbox small{color:var(--muted);font-size:13px}
.big-res b{font-size:clamp(48px,6vw,80px);font-weight:500;letter-spacing:-.04em;line-height:1;display:block}
.big-res small{color:#B9CDBF}
.res-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.12);border-radius:14px;overflow:hidden}
.res-grid>div{background:var(--g-900);padding:18px;display:grid;gap:4px}
.res-grid b{font-size:28px;font-weight:500;letter-spacing:-.02em}
.res-grid small{color:#9CC1A6;font-size:13px}
.res-sum{display:grid;gap:10px;font-size:15px;color:#DCEADF}
.res-sum div{display:flex;justify-content:space-between;gap:12px}
.res-sum div:last-child{border-top:1px solid rgba(255,255,255,.14);padding-top:10px;font-weight:500;color:#fff}


/* Datentiefe als Treppe (Umstieg) */
.depth{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:end}
.depth__step{min-height:var(--hh,300px);border-radius:var(--radius-l);padding:clamp(24px,2.6vw,36px);display:grid;gap:12px;align-content:end;background:var(--card);border:1px solid var(--line-2);position:relative;overflow:hidden;transition:transform .35s var(--ease)}
.depth__step:nth-child(2){background:var(--g-100);border-color:var(--g-100)}
.depth__step::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--g-200)}
.depth__step:nth-child(2)::before{background:var(--g-400)}
.depth__step--deep{background:var(--g-900);border-color:var(--g-900);color:#fff}
.depth__step--deep::before{background:var(--g-300)}
.depth__step--deep p{color:#B9CDBF}.depth__step--deep .h3{color:#fff}
.depth__step .ix{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--g);font-weight:500}
.depth__step--deep .ix{color:var(--g-300)}
.depth__step:hover{transform:translateY(-4px)}
/* Reise 3 + 2 (Umstieg) */
.journey{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.journey>*{grid-column:span 2}
.journey>*:nth-child(n+4){grid-column:span 3}


/* Branchen: gespiegelte Abschnitte */
.ind .sec-head{position:sticky;top:150px}
.ind--rev{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}
.ind--rev .sec-head{order:2}
.ind__no{display:block;margin-bottom:-8px}
/* Netz-Grafik (REST API) */
.netz{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;position:relative;margin-top:8px}
.netz i{height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);position:relative}
.netz i::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:22px;background:linear-gradient(rgba(156,193,166,.6),rgba(156,193,166,0))}
.netz b{grid-column:1/-1;margin-top:22px;text-align:center;padding:14px;border-radius:12px;background:var(--g-300);color:var(--g-900);font-weight:500}
/* Nummerierte Liste */
.olist{counter-reset:o;list-style:none;margin:0;padding:0}
.olist li{counter-increment:o;display:grid;grid-template-columns:48px minmax(0,1fr);padding:18px 0;border-bottom:1px solid var(--line-2);font-size:18px}
.olist li:last-child{border-bottom:0}
.olist li::before{content:counter(o,decimal-leading-zero);color:var(--g);font-weight:500;font-variant-numeric:tabular-nums}


/* Demo-Seite */
.demo{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,4vw,56px);align-items:start}
.demo__form{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius-l);padding:clamp(24px,3.4vw,48px)}
.demo__side{display:grid;gap:14px;position:sticky;top:110px}
.list-check--dark li{color:#DCEADF}
.list-check--dark li::before{background-color:rgba(156,193,166,.16);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6 11.5l3.2 3L16 8' fill='none' stroke='%239CC1A6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.person{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;align-items:center}
.person b{display:block;font-weight:500;font-size:19px}
.person__foto{min-height:96px;padding:8px;font-size:13px;border-radius:50%;aspect-ratio:1}
.person__foto::before{font-size:9px}
/* Referenzen */
.cs-head{display:grid;grid-template-columns:auto minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,3vw,48px);align-items:end}
.cs-head img{width:64px;height:64px;border-radius:16px}
.cs-body{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,3vw,40px);align-items:start}
.cs-body .olist li{font-size:16px}
.cs-body .olist b{font-weight:500}
.cs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cs-mini{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:28px;display:grid;gap:16px;align-content:start}
.cs-mini:nth-child(2){transform:translateY(32px)}
.cs-mini__logo{height:26px;width:auto}
.cs-mini__l{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:8px}
.cs-mini ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cs-mini__an{font-size:14px;color:var(--muted);border-top:1px solid var(--line-2);padding-top:14px}
/* Über: Fakten und Kontakt */
.facts{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fact{border-radius:var(--radius-l);padding:clamp(24px,3vw,40px);background:var(--g-50);display:grid;gap:10px;align-content:end;min-height:240px}
.fact:nth-child(2){transform:translateY(40px)}
.fact b{font-size:clamp(48px,6vw,84px);font-weight:500;letter-spacing:-.04em;line-height:1;color:var(--g-900)}
.fact--deep{background:var(--g-900)}
.fact--deep b{color:#fff}.fact--deep p{color:#B9CDBF}
.contact-band{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:end;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:40px}

/* Überschriften in schmalen Spalten */
.ind .h2,.feature-split .h2,.integr .h2,.faq__head .h2,.case .h2,.ask .h2{font-size:clamp(28px,2.9vw,40px)}
.phero .h1{font-size:clamp(36px,4.6vw,62px)}
.way h3{font-size:clamp(22px,2vw,30px)}
.final h2{font-size:clamp(30px,3.4vw,48px)}

/* ---------- Bewegung ---------- */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.js .rv-l{opacity:0;transform:translateX(-24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv-l.in{opacity:1;transform:none}

/* ---------- Responsiv ---------- */
@media (max-width:1100px){
  .nav,.hdr .btn--hdr{display:none}
  .burger{display:block}
  .float--msg{right:8px}.float--agents{left:8px}
  .agents{grid-template-columns:repeat(2,minmax(0,1fr))}
  .agent:nth-child(1),.agent:nth-child(4),.agent:nth-child(7),.agent:nth-child(8){grid-column:span 2}
  .devices{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  body{font-size:16px}
  .h2{font-size:clamp(27px,7.4vw,34px)}
  .h1{font-size:clamp(32px,9vw,42px)}
  .hero__row,.phero__grid,.sec-head--split,.case,.integr,.faq,.feature-split,.ind,.calc,.ask,.final,.quote-band{grid-template-columns:minmax(0,1fr)}
  .case__meta,.faq__head,.calc__out{position:static}
  .hero__stage{perspective:none}
  .float{display:none}
  .trust__in{grid-template-columns:minmax(0,1fr);gap:16px}
  .trust__label{max-width:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat,.stat--hero,.stat--wide,.stat--q{grid-column:span 1;grid-row:auto}
  .stat--wide{grid-column:span 2}
  .stat--hero{grid-column:span 2}
  .quotes{grid-template-columns:minmax(0,1fr)}
  .quote:nth-child(n){grid-column:auto;margin-top:0}
  .ways{grid-template-columns:minmax(0,1fr)}
  .way--a,.way--b,.way--c{grid-column:auto;grid-row:auto;min-height:0}
  .bento{grid-template-columns:minmax(0,1fr)}
  .bento>*,.bento .s2,.bento .s3,.bento .s4,.bento .s6{grid-column:auto;grid-row:auto}
  .fix{grid-template-columns:minmax(0,1fr)}
  .fix .arrow{height:40px;background:linear-gradient(180deg,var(--card) 50%,var(--g-50) 50%)}
  .fix .arrow i{transform:rotate(90deg)}
  .arc__track{justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 2px 18px;scrollbar-width:none}
  .arc__card{transform:none!important;scroll-snap-align:start;flex-basis:78%}
  .arc__hint{display:block;font-size:14px;color:var(--muted);margin-top:4px}
  .tl{grid-template-columns:minmax(0,1fr);padding-top:0;padding-left:34px}
  .tl__rail{left:6px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .tl__rail i{transform-origin:top;transform:scaleY(var(--p,0))}
  .tl__step::before{top:4px;left:-34px}
  .split-band{grid-template-columns:minmax(0,1fr)}
  .tb--calc,.tb--ws{grid-column:auto}
  .trio{grid-template-columns:minmax(0,1fr)}
  .trio>div{border-right:0;border-bottom:1px solid var(--line);padding:26px 0!important}
  .ftr__grid{grid-template-columns:1fr 1fr}
  .ftr__grid>div:first-child{grid-column:span 2}
  .steps-flow{grid-template-columns:minmax(0,1fr)}
  .flow{border-top:0;border-left:2px solid var(--line);padding:4px 0 24px 22px}
  .flow::after{top:0;left:-2px;width:2px;height:0;transition:height .9s var(--ease)}
  .flow.is-in::after{width:2px;height:100%}
  .cmp,.ind__cols{grid-template-columns:minmax(0,1fr)}
  .ind__cols .card,.ind__cols .card.wide{grid-column:auto}
  .devices{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dev:nth-child(even){transform:none}
  .dev:nth-child(even):hover{transform:translateY(-3px)}
  .agents{grid-template-columns:minmax(0,1fr)}
  .agent:nth-child(n){grid-column:auto}
  .kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi:nth-child(n){grid-column:span 1}
  .kpi:first-child{grid-column:span 2}
  .pipe{grid-template-columns:minmax(0,1fr)}
  .pipe::before{left:50%;right:auto;top:4%;bottom:4%;width:2px;height:auto;background:repeating-linear-gradient(180deg,var(--g-300) 0 8px,transparent 8px 16px)}
  .pipe>div:nth-child(2){transform:none}
  .inrow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .inrow>:first-child{grid-column:span 2}
  .win:nth-child(n){margin-left:0}
  .win{grid-template-columns:minmax(0,1fr);gap:14px}
  .depth,.journey{grid-template-columns:minmax(0,1fr)}
  .ind .sec-head{position:static}
  .ind .h2{font-size:25px}
  .demo,.cs-head,.cs-body,.cs-grid,.facts{grid-template-columns:minmax(0,1fr)}
  .demo__side{position:static}
  .cs-mini:nth-child(2),.fact:nth-child(2){transform:none}
  .ways[style]{grid-template-columns:minmax(0,1fr)!important}
  .ind--rev .sec-head{order:0}
  .split-band>.tb{grid-column:auto!important}
  .depth__step{min-height:0}
  .journey>*:nth-child(n){grid-column:auto}
  .h1{font-size:clamp(34px,9.6vw,44px)}
  .faq__head .h2{font-size:30px}
  .orbit__node span{font-size:12px;padding:6px 9px}
  .phero__art{opacity:.35;width:90vw;right:-40vw}
  .form .two{grid-template-columns:minmax(0,1fr)}
  .presets{width:100%}.presets button{flex:1}
  details.qa p{padding-right:0}
  .final{padding:36px 24px}
  .fab{right:14px;bottom:14px;left:14px;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv,.js .rv-l{opacity:1;transform:none}
  .arc__card{transform:none}
  .marquee__track{animation:none}
}
.cs-body .card .h3{font-size:20px}
@media (max-width:860px){
  .btn{white-space:normal;text-align:center;justify-content:center}
  .final .btn,.band__foot .btn,.tb .btn{width:100%}
  .stats{grid-template-columns:minmax(0,1fr)}
  .stat:nth-child(n){grid-column:auto}
  .stat p{max-width:none}
  .kpi:last-child{grid-column:span 2}
}

/* =====================================================================
   Feinschliff 22.10.2026 (Leons Feedback): Vorher/Nachher klarer,
   Orbit hochwertiger, Raster ruhiger, Kopfzeilen ausgewogener.
   ===================================================================== */

/* Kopfzeilen: Lead rechts nicht mehr schmal und lang */
.sec-head--split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.phero__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}

/* KI: Gegenüberstellung Chatbot gegen Intendo-KI */
.sec-head--vs{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}
.vs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.vs p{border-radius:var(--radius);padding:20px 22px 22px;font-size:17px;line-height:1.5;display:grid;gap:12px;align-content:start}
.vs p::before{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:13px;font-weight:500}
.vs__no{background:var(--paper-2);border:1px solid var(--line);color:var(--muted)}
.vs__no::before{content:"✕";background:#F3E2D9;color:var(--warn)}
.vs__yes{background:var(--g-900);color:#E4EEE6;box-shadow:var(--shadow-2)}
.vs__yes::before{content:"✓";background:rgba(156,193,166,.18);color:var(--g-300)}
.sec--white .vs__no{background:var(--paper)}

/* Branchen-Reiter: heute gegen mit Intendo */
.fix{grid-template-columns:minmax(0,1fr) 0 minmax(0,1.08fr);background:none;border:0;overflow:visible;transition:transform .35s var(--ease)}
.fix:hover{transform:translateY(-2px)}
.fix>div:first-child{background:var(--card);border:1px solid var(--line-2);border-right:0;border-radius:var(--radius) 0 0 var(--radius);padding-right:40px}
.fix>div:first-child span{color:var(--muted)}
.fix small{display:flex;align-items:center;gap:9px}
.fix small::before{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:10px;letter-spacing:0}
.fix>div:first-child small::before{content:"✕";background:#F3E2D9;color:var(--warn)}
.fix .to{background:var(--g-900);border-radius:0 var(--radius) var(--radius) 0;padding-left:44px;position:relative;overflow:hidden}
.fix .to::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 140% at 0% 50%,rgba(61,131,88,.35),transparent 60%);pointer-events:none}
.fix .to>*{position:relative;z-index:1}
.fix .to small{color:var(--g-300)}
.fix .to small::before{content:"✓";background:rgba(156,193,166,.18);color:var(--g-300)}
.fix .to b{color:#fff;font-size:17px}
.fix>.arrow{padding:0;position:relative;z-index:3;background:none;display:block}
.fix .arrow i{position:absolute;top:50%;left:0;width:42px;height:42px;transform:translate(-50%,-50%);background:#fff;color:var(--g);border:1px solid var(--g-200);box-shadow:0 8px 20px -10px rgba(15,44,29,.6);font-size:16px}
.tabp:not([hidden]) .fix .to{animation:wipe .7s var(--ease) both}
.tabp:not([hidden]) .fix .arrow i{animation:pop .5s var(--ease) both}
.tabp:not([hidden]) .fix:nth-child(1) .to{animation-delay:.15s}.tabp:not([hidden]) .fix:nth-child(1) .arrow i{animation-delay:.35s}
.tabp:not([hidden]) .fix:nth-child(2) .to{animation-delay:.25s}.tabp:not([hidden]) .fix:nth-child(2) .arrow i{animation-delay:.45s}
.tabp:not([hidden]) .fix:nth-child(3) .to{animation-delay:.35s}.tabp:not([hidden]) .fix:nth-child(3) .arrow i{animation-delay:.55s}
@keyframes wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes pop{from{transform:translate(-50%,-50%) scale(.3);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}

/* Orbit: Speichen mit Datenfluss, umlaufender Lichtkegel, pulsierender Kern */
.orbit__ring--2{animation:spin 90s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.orbit__ring--1::before{border-color:var(--g-200)}
.orbit__sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg 290deg,rgba(61,131,88,.05) 320deg,rgba(61,131,88,.22) 359deg,transparent 360deg);-webkit-mask:radial-gradient(closest-side,transparent 34%,#000 37%,#000 90%,transparent 97%);mask:radial-gradient(closest-side,transparent 34%,#000 37%,#000 90%,transparent 97%);animation:spin 6s linear infinite;pointer-events:none}
.orbit__spoke{position:absolute;left:50%;top:11%;width:2px;margin-left:-1px;height:22%;transform-origin:50% 177%;transform:rotate(var(--a));background:repeating-linear-gradient(180deg,var(--g-400) 0 5px,transparent 5px 12px);background-size:2px 12px;-webkit-mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);opacity:.35;animation:dataflow 1.1s linear infinite,spokeOn 6s ease-out var(--d) infinite}
@keyframes dataflow{to{background-position:0 12px}}
@keyframes spokeOn{0%{opacity:.35}4%{opacity:1}22%{opacity:.35}}
.orbit__node span{transition:border-color .2s,color .2s,background .2s;animation:nodeOn 6s ease-out var(--d) infinite}
@keyframes nodeOn{0%,100%{background:var(--card);color:var(--ink);border-color:var(--line)}3%,10%{background:var(--g-900);color:#fff;border-color:var(--g-900);box-shadow:0 12px 26px -12px rgba(15,44,29,.75)}24%{background:var(--card);color:var(--ink);border-color:var(--line)}}
.orbit__core{background:radial-gradient(circle at 35% 28%,var(--g-700),var(--g-900) 62%,var(--g-950));overflow:visible;animation:breathe 4s ease-in-out infinite}
.orbit__core::before{content:"";position:absolute;inset:-7%;border-radius:50%;border:1px solid var(--g-200);opacity:.8}
.orbit__core>div{position:relative;z-index:1;display:grid;justify-items:center;gap:6px}
.orbit__core>div::before{content:"";width:34px;height:3px;border-radius:2px;background:var(--g-300);opacity:.9}
.orbit__wave{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--g-400);opacity:0;animation:wave 4s ease-out infinite;pointer-events:none}
.orbit__wave--2{animation-delay:2s}
@keyframes wave{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.75);opacity:0}}
@keyframes breathe{0%,100%{box-shadow:0 30px 60px -30px rgba(15,44,29,.6),0 0 0 0 rgba(61,131,88,0),inset 0 0 0 10px rgba(255,255,255,.04)}50%{box-shadow:0 30px 60px -30px rgba(15,44,29,.6),0 0 60px 6px rgba(61,131,88,.28),inset 0 0 0 10px rgba(255,255,255,.06)}}

/* Wege: Lichtpunkt läuft über die Migrationslinien */
.migr .lane i::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95));animation:comet 3.2s var(--ease) 1.4s infinite}
.migr .lane:nth-child(2) i::after{animation-delay:1.9s}.migr .lane:nth-child(3) i::after{animation-delay:2.4s}.migr .lane:nth-child(4) i::after{animation-delay:2.9s}
@keyframes comet{0%{left:-30%}70%,100%{left:100%}}

/* Mediashop: Kacheln mittig zur linken Spalte */
.case{align-items:center}
.case__meta{position:static}
.win{transition:transform .35s var(--ease),border-color .3s,box-shadow .35s}
.win:hover{border-color:var(--g-200);box-shadow:var(--shadow-1)}
.win .ico{transition:background .3s,color .3s}
.win:hover .ico{background:var(--g);color:#fff}

/* Schnittstellen: ruhiges Kachelraster statt Wolke */
.cloud--grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.cloud--grid .chip{justify-content:center;text-align:center;min-height:62px;border-radius:14px;font-size:15px;white-space:normal;line-height:1.25;padding:10px 12px;position:relative;transition:transform .3s var(--ease),border-color .2s,color .2s,box-shadow .3s}
.cloud--grid .chip::after{content:"";position:absolute;inset:-1px;border-radius:inherit;box-shadow:inset 0 0 0 1.5px var(--g),0 10px 24px -14px rgba(34,112,70,.6);opacity:0;animation:sig 8s ease-out calc(var(--i) * .5s) infinite;pointer-events:none}
@keyframes sig{0%,100%{opacity:0}3%{opacity:1}12%{opacity:0}}
.cloud--grid .chip:hover{transform:translateY(-2px);box-shadow:var(--shadow-1)}
.cloud--grid .chip.k::after{box-shadow:inset 0 0 0 1.5px var(--g-300),0 10px 24px -14px rgba(15,44,29,.8)}
.chip--more{border-style:dashed!important;background:transparent!important;color:var(--g)!important;gap:6px}
.chip--more::before{content:"+";font-size:18px;line-height:1}

/* Branchen-Seite: immer heute, dann Intendo, dann automatisch */
.ind__cols>.card{order:2}
.ind__cols>.card--line{order:1;background:var(--paper-2);border-color:var(--line)}
.sec:not(.sec--white) .ind__cols>.card--line{background:#EAE7DE}
.ind__cols>.card--deep{order:3}
.ind__cols>.card--line li{color:var(--muted)}
.ind__cols>.card--line li::before{content:"✕";width:auto;height:auto;background:none;margin-top:1px;color:var(--warn);font-size:12px}
.ind__cols>.card:not(.card--line):not(.card--deep){background:var(--g-50);border-color:var(--g-200)}
.ind__cols>.card:not(.card--line):not(.card--deep) li::before{content:"✓";width:auto;height:auto;background:none;margin-top:0;color:var(--g);font-size:14px;font-weight:500}
.ind__cols>.card:not(.card--line):not(.card--deep)::after{content:"→";position:absolute;left:-25px;top:50%;width:36px;height:36px;margin-top:-18px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-size:15px;z-index:3;box-shadow:0 8px 18px -8px rgba(15,44,29,.7)}
.ind__cols>.card--deep li::before{content:"→";width:auto;height:auto;background:none;margin-top:0;color:var(--g-300);font-size:14px}

/* Zahlen: große Kachel mit ruhigen Ringen statt Leerraum */
.stat--hero{position:relative;overflow:hidden;align-content:end;gap:22px}
.stat--hero::before,.stat--hero::after{content:"";position:absolute;right:-18%;top:-34%;width:78%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(156,193,166,.16);box-shadow:0 0 0 46px rgba(156,193,166,.035),0 0 0 92px rgba(156,193,166,.025);pointer-events:none;transition:transform 1.6s var(--ease)}
.stat--hero::after{width:40%;right:1%;top:-14%;border-color:rgba(156,193,166,.24);box-shadow:none;animation:spin 40s linear infinite;border-style:dashed}
.js .stat--hero:not(.in)::before{transform:scale(.7)}
.stat--hero>*{position:relative}
.faq__more a,a[href^="tel:"]{white-space:nowrap}

/* Sprachumschalter (DE, EN, NL, HU wie in Florians Fassung) */
.lang{display:flex;gap:2px;margin-right:auto;align-items:center}
.lang a{padding:3px 8px;border-radius:6px;font-size:12px;font-weight:500;letter-spacing:.06em;text-decoration:none;color:#9CC1A6;transition:background .2s,color .2s}
.lang a:hover{color:#fff}
.lang a[aria-current]{background:rgba(255,255,255,.12);color:#fff}
.drawer .lang{margin:24px 0 0;gap:6px}
.drawer .lang a{border:1px solid var(--line);color:var(--ink-2);font-size:14px;padding:8px 14px;justify-content:center}
.drawer .lang a[aria-current]{background:var(--g);border-color:var(--g);color:#fff}
@media (max-width:480px){.topbar__mail{display:none}.topbar .wrap{gap:16px}}

/* Lange Wörter in NL und HU (z. B. kennismakingsgesprek) dürfen in Überschriften getrennt werden */
:lang(nl) :is(h1,h2,h3),:lang(hu) :is(h1,h2,h3,p,.fix span,.fix b,li){hyphens:auto;-webkit-hyphens:auto}
h1,h2,h3,p,li{overflow-wrap:break-word}

/* Umbrüche: kein Wort allein in der letzten Zeile */
.stat--q p{font-size:15px}
.inbox small{white-space:nowrap}
.cloud--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.phero__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.phero .h1{font-size:clamp(34px,3.9vw,56px)}
.tb--ws h2{font-size:clamp(24px,2.2vw,31px)}
/* Zwischenbreite (Tablet quer): schmale Spalten untereinander */
@media (max-width:1100px){
  .ind,.ind--rev,.cs-body,.integr{grid-template-columns:minmax(0,1fr)}
  .ind .sec-head{position:static}
  .ind--rev .sec-head{order:0}
  .arc__track{gap:12px}
  .arc__card{flex-basis:calc((100% - 36px) / 4 - 8px);padding:22px;min-height:250px}
}
@media (max-width:860px){.phero .h1{hyphens:auto;-webkit-hyphens:auto}}@media (max-width:480px){
  .final{padding:32px 18px}
  .final .btn,.tb .btn,.calc__out .btn{font-size:14px;padding:15px 12px}
  .final .btn .arr,.tb .btn .arr,.calc__out .btn .arr{display:none}
}
@media (max-width:860px){
  .card[style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
  .kicker{gap:10px}.kicker::before{width:18px}
  .final .btn,.tb .btn,.calc__out .btn{font-size:15px;padding:15px 16px;gap:8px}
}
@media (max-width:480px){
  .ftr__grid{grid-template-columns:minmax(0,1fr)}
  .ftr__grid>div:first-child{grid-column:auto}
}

/* Updates: Vergleich mit klarer Seite */
.cmp{position:relative;align-items:stretch}
.cmp__col--no li span{color:var(--muted)}
.cmp__col--no h3{color:var(--ink-2)}
.cmp__col--yes{position:relative;overflow:hidden;box-shadow:var(--shadow-2)}
.cmp__col--yes::before{content:"";position:absolute;inset:-40% -30% auto auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(61,131,88,.4),transparent);pointer-events:none}
.cmp__col--yes>*{position:relative}
.cmp::after{content:"→";position:absolute;left:50%;top:50%;width:52px;height:52px;transform:translate(-50%,-50%);border-radius:50%;background:#fff;color:var(--g);border:1px solid var(--g-200);display:grid;place-items:center;font-size:20px;box-shadow:0 10px 24px -12px rgba(15,44,29,.6);z-index:2}
.js .cmp__col li{opacity:0;transform:translateY(10px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.js .cmp__col.in li{opacity:1;transform:none}
.cmp__col.in li:nth-child(2){transition-delay:.12s}.cmp__col.in li:nth-child(3){transition-delay:.24s}.cmp__col.in li:nth-child(4){transition-delay:.36s}

/* KI-Prinzipien: Karten fächern beim Einblenden auf */
.arc__card{transition:transform 1s var(--ease) var(--dl,0s),opacity .7s var(--ease) var(--dl,0s),box-shadow .35s,border-color .35s}
.js .arc:not(.in) .arc__card{opacity:0;transform:translateX(var(--sx,0)) translateY(50px) rotate(0deg)}
.arc__card .n{transition:background .3s}
.arc__card:hover .n{background:var(--g)}

/* Nummern in Karten: oben statt hinter dem Titel */
.ghost{position:static;display:block;font-size:44px;line-height:1;color:var(--g-200);margin-bottom:18px;letter-spacing:-.03em}
.card--deep .ghost{color:var(--g-700)!important}

/* Über: Kontaktband-Linien auf Inhaltsbreite */
.wrap.contact-band{border:0;background:linear-gradient(var(--line),var(--line)) top/calc(100% - 2 * var(--gut)) 1px no-repeat,linear-gradient(var(--line),var(--line)) bottom/calc(100% - 2 * var(--gut)) 1px no-repeat}

@media (max-width:860px){
  .sec-head--split,.sec-head--vs,.phero__grid{grid-template-columns:minmax(0,1fr)}
  .orbit__core b{font-size:15px}
  .orbit__node span{font-size:10px;padding:4px 6px;border-radius:8px;letter-spacing:0}
  .hero__base{height:24%}
  .orbit__core>div::before{width:22px}
  .vs{grid-template-columns:minmax(0,1fr)}
  .fix{grid-template-columns:minmax(0,1fr)}
  .fix>div:first-child{border-right:1px solid var(--line-2);border-bottom:0;border-radius:var(--radius) var(--radius) 0 0;padding-right:26px;padding-bottom:30px}
  .fix>.arrow{height:0}
  .fix .arrow i{left:50%;transform:translate(-50%,-50%) rotate(90deg)}
  .tabp:not([hidden]) .fix .arrow i{animation:none}
  .fix .to{border-radius:0 0 var(--radius) var(--radius);padding-left:26px;padding-top:32px}
  .cloud--grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ind__cols>.card:not(.card--line):not(.card--deep)::after{left:50%;top:-25px;margin:0 0 0 -18px;transform:rotate(90deg)}
  .cmp::after{display:none}
  .ghost{font-size:36px}
}

.cal__acts{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}.cal__note{font-size:14px;margin-top:20px;max-width:720px}.cal__frame{margin-top:28px}.cal__frame iframe{display:block;width:100%;height:760px;border:0;border-radius:var(--radius)}.cal{margin-bottom:clamp(32px,4vw,56px)}
.cal [hidden]{display:none!important}
.person__img{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 18%;box-shadow:0 6px 18px rgba(15,44,29,.15)}
.cal--in{margin:0}.cal__sep{border:0;border-top:1px solid var(--line-2);margin:clamp(32px,4vw,48px) 0}.cal--in .cal__acts{gap:18px 32px}.cal--in .cal__frame{margin-top:24px}.cal--in .cal__frame iframe{height:720px}
.legal{max-width:860px}.legal h2{font-size:clamp(20px,2vw,26px);margin:2em 0 .5em;font-weight:500}.legal h2:first-child{margin-top:0}.legal h3{font-size:18px;margin:1.6em 0 .4em;font-weight:500}.legal p,.legal li{line-height:1.7;margin:.6em 0}.legal ul{padding-left:1.2em}.ftr__base a{color:inherit;text-decoration:none}.ftr__base a:hover{text-decoration:underline}
