:root{--navy:#0b2a66;--blue:#0a66c8;--text:#0f1b33;--muted:#5b6b86;--line:rgb(16 32 56/.12);--ease:cubic-bezier(.32,.72,0,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:15px/1.5 Inter,system-ui,sans-serif;color:var(--text);background:#eef2f8;background-image:radial-gradient(900px 520px at 6% -8%,rgb(120 170 255/.3),transparent 62%),radial-gradient(820px 480px at 100% 2%,rgb(110 215 195/.22),transparent 58%);background-attachment:fixed;min-height:100vh}
a{color:var(--blue)}.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.nav{position:sticky;top:0;z-index:20;background:rgb(255 255 255/.7);-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border-bottom:.5px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:14px;height:66px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--navy);text-decoration:none;font-size:17px}.brand img{height:40px}
.sp{flex:1}.right{display:flex;gap:8px;align-items:center}
.seg{display:inline-flex;background:rgb(16 32 56/.07);border-radius:999px;padding:3px;flex-wrap:wrap}
.seg button{border:0;background:none;font:inherit;font-weight:600;padding:7px 16px;border-radius:999px;cursor:pointer;color:var(--muted);transition:.25s var(--ease)}
.seg button.on{background:#fff;color:var(--text);box-shadow:0 1px 3px rgb(16 32 56/.18)}
.btn{display:inline-flex;align-items:center;gap:8px;border:.5px solid var(--line);background:#fff;color:var(--text);font:inherit;font-weight:600;padding:9px 18px;border-radius:999px;cursor:pointer;text-decoration:none;transition:.2s var(--ease)}
.btn:hover{transform:translateY(-1px)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.pri{background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;border-color:transparent}
.btn.dc{background:#5865f2;color:#fff;border-color:#4752c4}.btn.sm{padding:5px 12px;font-size:13px}.btn.bad{color:#b42318}
.card{background:rgb(255 255 255/.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:.5px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 1px 2px rgb(16 32 56/.05),0 16px 32px -22px rgb(16 32 56/.4)}
.hero{padding:72px 0 36px;text-align:center}.hero img{height:120px}
.hero h1{font-size:clamp(34px,6vw,56px);letter-spacing:-.03em;line-height:1.08;margin:10px 0 16px;color:var(--navy)}
.hero p{max-width:620px;margin:0 auto 26px;color:var(--muted);font-size:18px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:22px 0}
.tile.dark{background:linear-gradient(135deg,#0b2a66,#1a4d9c);color:#fff}.tile b{display:block;font-size:34px;letter-spacing:-.02em}
.muted{color:var(--muted)}.mono{font-family:"IBM Plex Mono",ui-monospace,monospace}
.badge{display:inline-block;font:600 11px/1 "IBM Plex Mono",monospace;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:999px;background:rgb(16 32 56/.08)}
.badge.ok{background:#dcf5e6;color:#12703a}.badge.warn{background:#fff1d6;color:#8a5a00}.badge.no{background:#fde2e0;color:#b42318}
.logos{display:flex;flex-wrap:wrap;gap:36px;justify-content:center;align-items:center;filter:grayscale(1);opacity:.7}.logos img{height:42px;max-width:150px;object-fit:contain}
input,select,textarea{width:100%;font:inherit;padding:10px 14px;border-radius:14px;border:.5px solid var(--line);background:#fff}
label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:10px 0 4px}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:10px 8px;border-bottom:.5px solid var(--line);vertical-align:top}
.scroll{overflow-x:auto}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.modal{position:fixed;inset:0;background:rgb(11 22 33/.45);display:grid;place-items:center;z-index:50;padding:20px}.modal .card{max-width:420px;width:100%;text-align:center}
.code{font:700 34px "IBM Plex Mono",monospace;letter-spacing:.12em;color:var(--navy);margin:14px 0}
.hidden{display:none!important}footer{padding:40px 0;color:var(--muted);font-size:13px;text-align:center}
section{padding:26px 0}h2{font-size:28px;letter-spacing:-.02em;margin:0 0 14px}h3{margin:0 0 6px}
.logo-sm{height:44px;max-width:120px;object-fit:contain}
.avatar{width:22px;height:22px;border-radius:50%}
.gate{max-width:520px;margin:80px auto;text-align:center}
.brand .mk{height:34px;width:auto}
@media(max-width:760px){.nav .wrap{flex-wrap:wrap;height:auto;padding:10px 20px}.nav .seg{order:3;width:100%;justify-content:center}.nav .sp{display:none}.nav .right{margin-left:auto}.hero h1{font-size:34px}.split{grid-template-columns:1fr!important}}
/* Startseite */
.hero{padding:56px 0 30px}.hero .logo-big{height:auto;width:min(420px,78vw);margin:0 auto 8px;display:block;filter:drop-shadow(0 18px 24px rgb(11 42 102/.18))}
.hero .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.btn.lg{padding:13px 26px;font-size:16px}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}
.split .txt h2{font-size:34px}.split .txt p{font-size:17px;color:var(--muted)}
.sec-head{text-align:center;max-width:640px;margin:0 auto 26px}.sec-head p{color:var(--muted);font-size:17px;margin:0}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;counter-reset:s}
.step{position:relative;padding-top:54px}.step::before{counter-increment:s;content:counter(s);position:absolute;top:18px;left:22px;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;display:grid;place-items:center;font-weight:700}
.step .ic{position:absolute;top:14px;right:20px;font-size:26px}.step p{margin:0;color:var(--muted)}
.mock{background:linear-gradient(135deg,#0b2a66,#1a58b0);color:#fff;border-radius:28px;padding:26px;box-shadow:0 30px 60px -28px rgb(11 42 102/.7);transform:rotate(1.5deg)}
.mock .lbl{opacity:.75;font-size:13px}.mock .big{font-size:52px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.mock .chips{display:grid;gap:10px;margin-top:18px}.mock .chip{display:flex;align-items:center;gap:10px;background:rgb(255 255 255/.14);border:.5px solid rgb(255 255 255/.25);border-radius:16px;padding:11px 14px}
.mock .chip b{margin-left:auto;font-family:"IBM Plex Mono",monospace}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.fact{text-align:center}.fact b{display:block;font-size:20px;color:var(--navy)}.fact span{color:var(--muted);font-size:14px}
.ex{display:flex;flex-direction:column;gap:6px}.ex .pt{margin-top:auto;font-family:"IBM Plex Mono",monospace;font-weight:600;color:var(--blue)}
.demo-tag{font-size:12px;color:var(--muted);text-align:center;margin-top:12px}
.calc{display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap;font-size:20px;font-weight:600}.calc .arrow{color:var(--blue)}.calc .pill{background:#fff;border:.5px solid var(--line);border-radius:999px;padding:10px 20px}.calc .pill.hl{background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff}
.sec-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.sec-list .card{padding:18px}.sec-list .card .ic{font-size:24px}.sec-list p{margin:4px 0 0;color:var(--muted);font-size:14px}
details{background:rgb(255 255 255/.78);border:.5px solid var(--line);border-radius:18px;padding:16px 20px;margin-bottom:10px}summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:10px}summary::after{content:"+";color:var(--blue);font-size:20px;line-height:1}details[open] summary::after{content:"–"}details p{margin:10px 0 0;color:var(--muted)}
.band{background:linear-gradient(135deg,#0b2a66,#1a58b0);color:#fff;border-radius:32px;text-align:center;padding:44px 24px}.band h2{color:#fff;margin-bottom:8px}.band p{opacity:.85;margin:0 auto 22px;max-width:520px}
.band .btn{background:#fff;color:var(--navy)}
.dc-mock{background:#313338;color:#dbdee1;border-radius:14px;padding:16px;font-size:14px;max-width:440px;margin:0 auto;text-align:left}
.dc-mock .bar{border-left:4px solid #0a66c8;background:#2b2d31;border-radius:8px;padding:14px}.dc-mock h4{margin:0 0 6px;color:#fff;font-size:16px}
.dc-mock .b{display:inline-block;padding:7px 16px;border-radius:6px;font-weight:600;color:#fff;margin:10px 8px 0 0}.dc-mock .g{background:#248046}.dc-mock .r{background:#da373c}
.dc-mock .tag{background:#5865f240;color:#c9cdfb;border-radius:4px;padding:0 4px}
.partner-empty{border:1.5px dashed rgb(16 32 56/.25);border-radius:22px;padding:22px;text-align:center;color:var(--muted)}
