:root{--bg:#031018;--bg2:#061b27;--card:#082431;--cyan:#20dff1;--cyan2:#00bcd5;--text:#eefbff;--muted:#a9c1ca;--line:rgba(32,223,241,.28);--ok:#53e3b6;--warn:#ffc857;--bad:#ff6b6b;--max:1240px;--shadow:0 24px 70px rgba(0,0,0,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% -10%,rgba(32,223,241,.11),transparent 28%),#020c12;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.topbar{position:sticky;top:0;z-index:60;background:rgba(2,12,18,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{height:72px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:11px;font-weight:850;font-size:22px;letter-spacing:-.025em}.brand img{width:34px;height:34px}.navlinks{display:flex;gap:18px;margin-left:auto;align-items:center;font-size:13px;color:#bfd4dc}.navlinks a:hover,.navlinks a.active{color:var(--cyan)}.mobile{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;border-radius:8px;border:1px solid var(--cyan);background:linear-gradient(135deg,var(--cyan),#13bfd9);color:#001016;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(32,223,241,.16)}.btn.secondary{background:transparent;color:var(--text);border-color:rgba(83,210,229,.5)}.hero,.pagehero{padding:64px 0 50px;border-bottom:1px solid var(--line)}.hero-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:46px;align-items:center}.eyebrow{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);font-weight:850}.hero h1,.pagehero h1{font-size:clamp(44px,5.8vw,78px);line-height:.98;letter-spacing:-.045em;margin:13px 0 20px}.pagehero h1{font-size:clamp(42px,5vw,66px)}h1 span,h2 span,.accent{color:var(--cyan)}.lead{font-size:18px;color:#c6d9e0;max-width:780px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:27px 0}.trustrow{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px;font-size:13px;color:#bbd0d8}.trustrow b{display:block;color:var(--cyan);font-size:22px}.photo{border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);background:#071923}.photo img{width:100%;height:auto}.section{padding:72px 0;border-bottom:1px solid rgba(32,223,241,.13)}.section.alt{background:linear-gradient(180deg,rgba(8,31,43,.55),rgba(3,15,22,.25))}.section-head{display:flex;align-items:end;justify-content:space-between;gap:26px;margin-bottom:30px}.section h2{font-size:clamp(31px,4vw,50px);line-height:1.06;letter-spacing:-.035em;margin:7px 0}.section h3{letter-spacing:-.015em}.sub{color:var(--muted);max-width:800px}.grid{display:grid;gap:15px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.card{background:linear-gradient(180deg,rgba(8,34,48,.94),rgba(4,21,30,.95));border:1px solid var(--line);border-radius:14px;padding:22px;transition:.25s}.card:hover{transform:translateY(-3px);border-color:rgba(32,223,241,.65)}.card h3{margin:8px 0 7px;font-size:19px}.card p,.card li{font-size:14px;color:#acc5ce}.icon{font-size:28px;color:var(--cyan)}.pillrow{display:flex;gap:8px;flex-wrap:wrap}.pill{padding:7px 11px;border:1px solid var(--line);border-radius:100px;color:#bee6ec;font-size:12px}.check{list-style:none;padding:0;margin:18px 0}.check li{position:relative;padding-left:25px;margin:8px 0;color:#bed2d9}.check li:before{content:'✓';position:absolute;left:0;color:var(--ok);font-weight:900}.split{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}.kpi{background:#061923;padding:24px}.kpi strong{display:block;color:var(--cyan);font-size:30px;line-height:1.05;margin-bottom:7px}.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.flow .node{min-height:145px;border:1px solid var(--line);background:#071c28;border-radius:12px;padding:17px;position:relative}.flow .node:not(:last-child):after{content:'→';position:absolute;right:-14px;top:48%;z-index:2;color:var(--cyan);font-weight:900;font-size:22px}.flow .n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--cyan);color:#001016;font-weight:900;font-size:12px}.flow strong{display:block;margin:13px 0 5px}.flow small{color:#9fb8c2}.modulegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.module-card{min-height:218px}.module-card .tag{font-size:10px;color:var(--cyan);letter-spacing:.17em;font-weight:800}.module-card .more{display:inline-block;margin-top:10px;color:var(--cyan);font-weight:750}.smartflow{position:relative;display:grid;grid-template-columns:1.05fr .85fr .85fr 1.05fr;grid-template-rows:auto auto auto;gap:18px;margin-top:32px}.sfbox{border:1px solid var(--line);background:linear-gradient(180deg,#082633,#051923);border-radius:12px;padding:17px;min-height:112px;position:relative}.sfbox h3{margin:0 0 7px;font-size:16px}.sfbox p{margin:0;color:#a8c1ca;font-size:13px}.sfbox .sfnum{color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:.15em}.sfbox.decision{border-style:dashed;border-color:rgba(255,200,87,.7)}.sfbox.decision h3{color:var(--warn)}.yes{color:var(--ok);font-weight:800}.no{color:var(--warn);font-weight:800}.branchline{grid-column:1/-1;border-top:1px dashed rgba(32,223,241,.35);margin:2px 6% 0}.rolegrid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.role{padding:16px;border:1px solid var(--line);border-radius:12px;background:#071b27}.role strong{display:block;color:#fff;margin-bottom:5px}.role span{font-size:12px;color:#9eb7c0}.timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.timeline .t{padding:17px;border:1px solid var(--line);border-radius:12px;background:#071a25}.t strong{display:block;margin:7px 0}.t small{color:#9eb8c1}.cta{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px;border:1px solid rgba(32,223,241,.38);border-radius:16px;background:linear-gradient(135deg,rgba(9,45,61,.95),rgba(3,18,27,.95))}.cta h3{font-size:28px;margin:0 0 5px}.breadcrumbs{font-size:13px;color:#7fa4b1;margin-bottom:14px}.notice{border-left:3px solid var(--cyan);padding:14px 17px;background:rgba(32,223,241,.06);color:#bed3db}.tablewrap{overflow:auto;border:1px solid var(--line);border-radius:12px}.table{width:100%;border-collapse:collapse;min-width:720px;background:#061923}.table th,.table td{text-align:left;padding:13px 14px;border-bottom:1px solid rgba(32,223,241,.12);font-size:13px}.table th{color:var(--cyan)}.faq details{border:1px solid var(--line);border-radius:10px;padding:15px 17px;background:#071c28;margin:9px 0}.faq summary{cursor:pointer;font-weight:750}.form{display:grid;gap:13px}.form input,.form textarea,.form select{width:100%;padding:14px;border-radius:9px;border:1px solid var(--line);background:#04151f;color:#fff}.form textarea{min-height:150px}.footer{padding:42px 0 24px}.footgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}.footer h4{margin:0 0 10px}.footer a{display:block;color:#9eb8c2;margin:6px 0;font-size:13px}.copy{border-top:1px solid rgba(32,223,241,.14);margin-top:28px;padding-top:17px;color:#7696a1;font-size:12px;display:flex;justify-content:space-between}.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:80;background:#061923;border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;gap:16px;justify-content:space-between;align-items:center;box-shadow:var(--shadow)}.cookie[hidden]{display:none}.cookie p{margin:0;color:#abc4cd;font-size:12px}.cookie .actions{display:flex;gap:8px;flex-shrink:0}
@media(max-width:1050px){.navlinks{display:none}.mobile{display:block;margin-left:auto}.hero-grid,.split{grid-template-columns:1fr}.modulegrid,.g4,.g3{grid-template-columns:repeat(2,1fr)}.flow{grid-template-columns:repeat(2,1fr)}.flow .node:after{display:none}.kpis{grid-template-columns:repeat(2,1fr)}.rolegrid{grid-template-columns:repeat(3,1fr)}.timeline{grid-template-columns:repeat(3,1fr)}.smartflow{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.wrap{width:min(var(--max),calc(100% - 24px))}.hero,.pagehero,.section{padding:48px 0}.hero h1,.pagehero h1{font-size:42px}.modulegrid,.g4,.g3,.g2,.kpis,.rolegrid,.timeline,.smartflow{grid-template-columns:1fr}.section-head,.cta,.cookie{align-items:flex-start;flex-direction:column}.flow{display:flex;overflow-x:auto;padding-bottom:8px}.flow .node{min-width:190px}.footgrid{grid-template-columns:1fr 1fr}.copy{flex-direction:column;gap:7px}.nav>.btn{display:none}.cookie .actions{flex-wrap:wrap}}


/* ZUSAMMENFUEHRUNG V6 + bisheriger Stand */
/* Kartenraster: V6 setzt .g2/.g3/.g4 ohne .grid ein - ohne diese Regel stehen die Karten untereinander */
.g2,.g3,.g4{display:grid;gap:15px}
/* Neues Logo */
.brand img.logo{width:auto;height:68px}
.nav{height:84px}
/* Slogan wie im Logo, aber als echter Text: im Bild waere er bei Header-Groesse nur ~5px hoch.
   Mittig unter dem Schriftzug (Schriftzug = 33-99 % der Logobreite, endet bei ~56 % der Hoehe). */
.brand{position:relative}
.brand .brand-slogan{position:absolute;left:66%;top:62%;transform:translateX(-50%);white-space:nowrap;font-size:10px;font-weight:500;letter-spacing:.12em;line-height:1;color:#c9d6de;pointer-events:none}
.footer .brand img.logo-full{width:260px;max-width:100%;height:auto}
@media(max-width:650px){.nav{height:72px}.brand img.logo{height:54px}.brand .brand-slogan{font-size:8px;letter-spacing:.06em}}
/* V5-Produktgrafiken als erklaerende Abbildungen */
.grafik{margin:26px 0 0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#03131d;position:relative;box-shadow:var(--shadow)}
.grafik img{width:100%;height:auto}
.grafik figcaption{padding:10px 14px;color:#85a9b6;font-size:13px;border-top:1px solid rgba(32,223,241,.12)}
.photo{position:relative}
/* Bausteine aus dem bisherigen Stand, die V6 nicht kennt */
.badge{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:100px;padding:7px 10px;color:#bde7ee;font-size:12px}
.process{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.step{border:1px solid var(--line);border-radius:12px;padding:18px 12px;background:rgba(8,34,48,.66);min-height:120px}
.step small{color:var(--cyan);font-weight:800}
.step strong{display:block;margin-top:14px;font-size:14px}
.module-index{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.module-card .num{font-size:11px;color:var(--cyan);letter-spacing:.18em}
.pipeline{display:grid;grid-template-columns:repeat(7,1fr);gap:9px}
.pipe{position:relative;min-height:150px;border:1px solid var(--line);border-radius:13px;padding:18px 14px;background:linear-gradient(180deg,rgba(8,34,48,.95),rgba(4,18,27,.92))}
.pipe:not(:last-child):after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);z-index:2;color:var(--cyan);font-size:22px;font-weight:900}
.pipe span{display:inline-flex;width:30px;height:30px;border-radius:50%;align-items:center;justify-content:center;background:var(--cyan);color:#001019;font-weight:900;font-size:12px}
.pipe b{display:block;margin:16px 0 6px;font-size:15px}
.pipe small{color:#9fbac4;line-height:1.4}
.time-save{margin-top:24px;padding:20px 22px;border:1px solid rgba(37,224,244,.35);border-radius:14px;background:linear-gradient(90deg,rgba(37,224,244,.08),rgba(7,28,40,.5));display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:start}
.time-save strong{color:var(--cyan);font-size:20px}
.time-save span{color:#c0d6de}
.emphasis{border-color:rgba(37,224,244,.5);box-shadow:0 20px 70px rgba(0,210,235,.08)}
@media(max-width:1100px){.pipeline{grid-template-columns:repeat(4,1fr)}.pipe:nth-child(4):after{display:none}}
@media(max-width:1050px){.module-index{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.pipeline{grid-template-columns:1fr 1fr}.pipe:nth-child(even):after{display:none}.time-save{grid-template-columns:1fr}}
@media(max-width:650px){.module-index{grid-template-columns:1fr}}
@media(max-width:520px){.pipeline{grid-template-columns:1fr}.pipe:after{display:none}}
/* Navigation: In V6 ueberschreibt .btn die Regel .mobile{display:none} (Menue-Knopf auf dem Desktop sichtbar),
   und .nav>.btn{display:none} bis 650px blendet auch den Menue-Knopf aus (auf dem Handy keine Navigation).
   Ausserdem darf das Logo nicht gestaucht werden. */
.brand,.brand img.logo{flex-shrink:0}
.nav .mobile{display:none}
@media(max-width:1050px){.nav .mobile{display:inline-flex;margin-left:auto}}
@media(max-width:650px){.nav>.btn.mobile{display:inline-flex}}
/* 10 Menuepunkte + Logo passen erst ab ~1180px in eine Zeile: bis 1260px Menue-Knopf (Puffer fuer breitere Schriften) */
@media(max-width:1260px){.navlinks{display:none}.nav .mobile{display:inline-flex;margin-left:auto}}
/* Sprachumschalter DE | EN (neben Menue-Knopf / Demo-Knopf) */
.lang-switch{display:flex;flex-shrink:0;border:1px solid rgba(83,210,229,.5);border-radius:8px;overflow:hidden;font-size:12px;font-weight:800;letter-spacing:.06em;line-height:1}
.lang-switch a{padding:10px 10px;color:#bfd4dc}
.lang-switch a:hover{color:var(--cyan)}
.lang-switch a.aktiv{background:rgba(32,223,241,.16);color:var(--cyan)}
@media(max-width:650px){.nav{gap:10px}.lang-switch a{padding:9px 8px}}
/* Englische Seiten: Footer-Logo ohne eingebrannten deutschen Slogan, Slogan als Text */
.footer .brand .brand-slogan{font-size:12px}
/* sehr schmale Handys (320px): Logo, Menue-Knopf und Umschalter passen sonst nicht nebeneinander */
@media(max-width:380px){.nav{gap:8px}.brand img.logo{height:46px}.nav .mobile{padding:10px 12px}.lang-switch a{padding:9px 6px}}


/* BILDANSICHT: Bilder/Grafiken anklicken -> gross mit Abschnitts-Infos (site.js) */
html.lb-offen,html.lb-offen body{overflow:hidden}
.zoombar{cursor:zoom-in}.shot{position:relative}
.zoom-hinweis{position:absolute;right:12px;bottom:12px;z-index:2;padding:6px 10px;border-radius:8px;background:rgba(2,13,20,.84);border:1px solid var(--line);color:#cfeff5;font-size:12px;font-weight:700;pointer-events:none}
.lb{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;background:#020c12}.lb[hidden]{display:none}
.lb-bar{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line);background:#03111a}
.lb-info{min-width:0;max-width:900px}.lb-info h2{margin:4px 0 0;font-size:clamp(18px,2.2vw,26px);line-height:1.2;letter-spacing:-.02em}.lb-info p{margin:6px 0 0;color:var(--muted);font-size:14px;max-height:4.8em;overflow:auto}
.lb-knoepfe{display:flex;gap:8px;align-items:center;flex-shrink:0}.lb-zahl{color:#85a9b6;font-size:13px;margin-right:4px;white-space:nowrap}
.lb-btn{min-width:44px;height:44px;padding:0 12px;border-radius:9px;border:1px solid rgba(95,220,238,.45);background:transparent;color:var(--text);font:inherit;font-size:22px;line-height:1;cursor:pointer}.lb-btn.lb-modus{font-size:13px;font-weight:700}.lb-btn:hover{border-color:var(--cyan);color:var(--cyan)}.lb-btn[hidden]{display:none}
.lb-buehne{flex:1;min-height:0;overflow:auto;padding:20px}
.lb-medium{display:block;margin:0 auto;max-width:100%;height:auto;border-radius:10px;cursor:zoom-out}svg.lb-medium{width:100%}
.lb-ganz .lb-buehne{display:flex;align-items:center;justify-content:center;overflow:hidden}.lb-ganz .lb-medium{max-height:100%;width:auto;cursor:zoom-in}.lb-ganz svg.lb-medium{width:100%;height:100%}
@media(max-width:620px){.lb-bar{flex-direction:column-reverse;gap:10px;padding:12px}.lb-knoepfe{align-self:flex-end}.lb-info p{max-height:3.6em}.lb-buehne{padding:10px}}

/* PROZESSGRAFIKEN (Inline-SVG, breit/schmal je nach Bildschirm) */
.dia{margin:0;position:relative;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(8,34,48,.55),rgba(4,18,27,.55));padding:18px}
.dia svg{display:block;width:100%;height:auto}.dia .dia-schmal{display:none}.dia figcaption{margin-top:12px;color:#85a9b6;font-size:13px}
.dia-box{fill:#082230;stroke:rgba(38,224,245,.45);stroke-width:1.5}.dia-box.mensch{fill:#07241f;stroke:#55f3c0}
.dia-lane{fill:rgba(37,224,244,.05);stroke:rgba(38,224,245,.2)}.dia-lane.mensch{fill:rgba(85,243,192,.05);stroke:rgba(85,243,192,.3)}
.dia-bus{fill:rgba(37,224,244,.1);stroke:#25e0f4;stroke-width:1.5}
.dia-t{fill:#eefbff;font-size:14px;font-weight:700}.dia-s{fill:#a8c0ca;font-size:13px}.dia-n{fill:#25e0f4;font-size:12px;font-weight:800;letter-spacing:.08em}
.dia-k{fill:#25e0f4;font-size:12px;font-weight:800;letter-spacing:.16em}.dia-k.mensch{fill:#55f3c0}
.dia-pfeil{stroke:#25e0f4;stroke-width:2;fill:none}.dia-spitze{fill:#25e0f4}.dia-verb{stroke:rgba(37,224,244,.55);stroke-width:1.5}.dia-knoten{fill:#25e0f4}
.dia-gate{fill:#07241f;stroke:#55f3c0;stroke-width:1.5}.dia-gate-t{fill:#55f3c0;font-size:12px;font-weight:800}
.dia-rueck{stroke:#55f3c0;stroke-width:2;fill:none}.dia-rueck-spitze{fill:#55f3c0}.dia-rueck-t{fill:#55f3c0;font-size:13px;font-weight:700}
.dia-fach{fill:#17a6b8}.dia-rout{fill:#c98500}.dia-korr{fill:rgba(201,133,0,.2);stroke:#c98500;stroke-width:1.5}.dia-frei{fill:none;stroke:rgba(168,192,202,.55);stroke-width:1.5}
.dia-in{fill:#001019;font-size:13px;font-weight:800}.dia-achse{stroke:rgba(168,192,202,.4);stroke-width:1}
.dia-tabelle{margin-top:14px;color:#abc4cd;font-size:14px}.dia-tabelle summary{cursor:pointer;color:var(--cyan);font-weight:700}
.dia-tabelle table{margin-top:10px;border-collapse:collapse;width:100%}.dia-tabelle th,.dia-tabelle td{border-bottom:1px solid rgba(37,224,244,.14);padding:8px 10px;text-align:left;vertical-align:top}.dia-tabelle th{color:#eefbff}
@media(max-width:760px){.dia .dia-breit{display:none}.dia .dia-schmal{display:block}.dia{padding:12px}}

/* MODULSEITEN: Problem heute, Pruefpunkte, Eingang/Ergebnis, Prozesskette */
.pain{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.pain li{padding:14px 16px 14px 44px;position:relative;border:1px solid rgba(201,133,0,.35);border-radius:12px;background:rgba(201,133,0,.06);color:#d6e4e9}
.pain li:before{content:"↻";position:absolute;left:16px;top:13px;color:#e0a23a;font-weight:900}
.gate .icon{color:var(--ok)}
.io{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch}.io-pfeil{align-self:center;font-size:30px;color:var(--cyan);font-weight:900}
.chain{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;align-items:stretch}
.chain small{color:var(--cyan);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:11px}
.chain .jetzt{border-color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(37,224,244,.35)}
.chain ul{list-style:none;padding:0;margin:12px 0 0}.chain li{margin:6px 0}.chain li a{color:var(--cyan);font-weight:700}
@media(max-width:760px){.io,.chain{grid-template-columns:1fr}.io-pfeil{transform:rotate(90deg);justify-self:center}}