@font-face{font-family:Inter;src:url(../fonts/Inter-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/Inter-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/Inter-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url(../fonts/Inter-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--b:#1A48A6;--c:#3fb6ff;--bg:#04060b;--n:#0B1628;--t:#e8edf5;--m:#8a97ad;--p:0}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--t);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;overflow-x:hidden;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;color:#000;padding:8px}
.nav{position:fixed;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:18px 5vw;z-index:20;background:linear-gradient(#04060bdd,#04060b00);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.logo{height:26px;width:auto}.nav nav{display:flex;gap:28px;align-items:center}.nav nav a{color:var(--t);text-decoration:none;font-size:14px;position:relative}
.nav nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--c);transform:scaleX(0);transform-origin:left;transition:transform .35s}.nav nav a:not(.btn):hover::after{transform:scaleX(1)}
.burger{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;position:relative}.burger span{position:absolute;left:9px;right:9px;height:2px;background:#fff;transition:transform .3s,top .3s}.burger span:first-child{top:15px}.burger span:last-child{top:23px}
.menu-open .burger span:first-child{top:19px;transform:rotate(45deg)}.menu-open .burger span:last-child{top:19px;transform:rotate(-45deg)}
.btn{display:inline-flex;gap:10px;align-items:center;padding:14px 24px;border-radius:40px;background:var(--b);color:#fff;text-decoration:none;font-weight:600;border:1px solid #3fb6ff33;transition:transform .3s,box-shadow .3s,background .3s}.btn.sm{padding:8px 16px;font-size:14px}.btn.ghost{background:transparent;border-color:#ffffff33}
.btn span,.link span,.card i{transition:transform .3s;display:inline-block}.btn:hover{transform:translateY(-3px);box-shadow:0 10px 40px #3fb6ff55}.btn:hover span,.link:hover span,.card:hover i{transform:translateX(6px)}
.eyebrow{color:var(--c);letter-spacing:.2em;text-transform:uppercase;font-size:12px;font-weight:600;margin-bottom:18px}.eyebrow a{text-decoration:none}
h1{font-size:clamp(38px,6vw,88px);line-height:1.02;letter-spacing:-.03em;font-weight:700}h1 em{font-style:normal;background:linear-gradient(90deg,#ffb36b,var(--c) 60%,var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
h2{font-size:clamp(28px,4vw,56px);letter-spacing:-.02em;line-height:1.08;max-width:820px;margin-bottom:48px}.lead{color:var(--m);font-size:clamp(16px,1.5vw,19px);margin:24px 0 32px;max-width:480px}
/* Hero */
.hero{position:relative;height:320vh}.hero-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;padding:90px 5vw 40px}
.hero-light{position:absolute;inset:0;background:radial-gradient(ellipse 40% 55% at calc(45% + var(--p)*30%) 55%,#1A48A655,transparent 70%),radial-gradient(ellipse 30% 40% at calc(85% - var(--p)*25%) 40%,#ff9a4a14,transparent 70%);pointer-events:none}
#turn,.hero-still{position:absolute;right:0;top:0;width:62%;height:100%;object-fit:contain;-webkit-mask:radial-gradient(ellipse 50% 50% at 50% 52%,#000 62%,transparent 100%);mask:radial-gradient(ellipse 50% 50% at 50% 52%,#000 62%,transparent 100%)}
.hero-still{display:none}.hero-text{position:relative;z-index:2;opacity:calc(1 - var(--p)*1.6);transform:translateY(calc(var(--p)*-80px))}
.scrollhint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--m);display:flex;flex-direction:column;align-items:center;gap:10px;opacity:calc(1 - var(--p)*4)}.scrollhint span{width:1px;height:36px;background:linear-gradient(var(--c),transparent);animation:hint 2s infinite}
@keyframes hint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* Kennzahlen */
.figs{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #ffffff14;margin:0 5vw}.fig{padding:56px 24px;text-align:center}.fig+.fig{border-left:1px solid #ffffff14}.fig b{display:block;font-size:clamp(34px,4.5vw,64px);font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.fig span{color:var(--m)}
/* Kochen */
.kochen{position:relative;height:280vh}.kochen-sticky{position:sticky;top:0;height:100vh;overflow:hidden}#kochenc,.kochen-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.kochen-still{display:none}
.kochen-steam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.kochen-sticky::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#04060bee 0%,#04060b88 35%,transparent 60%),linear-gradient(#04060b 0%,transparent 14%,transparent 86%,#04060b 100%);pointer-events:none}
.kochen-text{position:absolute;left:5vw;top:50%;transform:translateY(-50%);max-width:460px;z-index:2}.kochen-text h2{margin-bottom:20px}.kochen-text p:last-child{color:var(--m);font-size:18px}
/* Sections */
.sec{position:relative;padding:120px 5vw}.steam-band{position:absolute;left:0;right:0;width:100%;height:260px;pointer-events:none;z-index:0}.steam-band.top{top:-130px}.sec>*:not(canvas){position:relative;z-index:1}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{position:relative;padding:32px;border-radius:20px;background:linear-gradient(160deg,#0B1628,#070b14);border:1px solid #ffffff12;transition:transform .35s,box-shadow .35s,border-color .35s;overflow:hidden}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,0%),#3fb6ff22,transparent 50%);opacity:0;transition:opacity .35s}.card:hover::before{opacity:1}
.card:hover{transform:translateY(-6px);border-color:#3fb6ff66;box-shadow:0 20px 60px #1A48A644}.card h3{font-size:21px;margin-bottom:12px}.card p{color:var(--m)}.card i{font-style:normal;color:var(--c);margin-top:20px}
.sys{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:96px}.imgwrap{display:block;border-radius:20px;overflow:hidden;background:#000}.imgwrap img{width:100%;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}.imgwrap:hover img{transform:scale(1.04)}
.sys h3{font-size:44px;margin-bottom:16px}.sys p{color:var(--m);font-size:18px;margin-bottom:22px}.link{color:var(--c);text-decoration:none;font-weight:600}.tag{display:inline-block;font-size:12px;padding:4px 12px;border:1px solid var(--c);border-radius:20px;color:var(--c);margin-bottom:14px}
.sys.wide{grid-template-columns:1.6fr 1fr}.clip{clip-path:inset(0 100% 0 0 round 20px);transition:clip-path 1s cubic-bezier(.7,0,.2,1)}.clip.in{clip-path:inset(0 0 0 0 round 20px)}
.contact{text-align:center;background:radial-gradient(ellipse at 50% 100%,#1A48A655,transparent 60%);overflow:hidden;padding-top:160px}.contact .steam-band{top:0;height:100%}.contact h2{margin:0 auto 16px}.contact p{color:var(--m);margin-bottom:32px}.ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
footer{padding:32px 5vw;color:var(--m);font-size:13px;border-top:1px solid #ffffff10;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}footer a{margin-left:20px;text-decoration:none}footer a:hover{color:var(--t)}
.subhero{padding:180px 5vw 40px}.mhero{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:140px 5vw 40px}.mhero img{border-radius:20px;-webkit-mask:radial-gradient(ellipse 52% 52% at 50% 50%,#000 70%,transparent 100%);mask:radial-gradient(ellipse 52% 52% at 50% 50%,#000 70%,transparent 100%)}
.two{display:grid;grid-template-columns:1fr 1.2fr;gap:56px}.prose p{color:var(--m);font-size:18px;margin-bottom:18px}.prose b{color:var(--t)}.note{color:var(--m);font-size:14px;margin:-32px 0 24px}
.spec{width:100%;border-collapse:collapse;font-size:16px}.spec caption{text-align:left;color:var(--m);font-size:13px;letter-spacing:.15em;text-transform:uppercase;padding-bottom:12px}.spec th,.spec td{text-align:left;padding:16px 12px;border-bottom:1px solid #ffffff14;vertical-align:top}.spec th{color:var(--m);font-weight:500;width:34%}.spec tr{transition:background .3s}.spec tr:hover{background:#1A48A61f}
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s;margin-top:32px}.steps li{counter-increment:s;padding:28px;border-radius:18px;border:1px solid #ffffff12;background:#070b14;color:var(--m)}.steps li::before{content:counter(s,decimal-leading-zero);display:block;color:var(--c);font-weight:700;margin-bottom:12px}.steps b{display:block;color:var(--t);margin-bottom:6px}
.faq details{border-bottom:1px solid #ffffff14;padding:20px 0}.faq summary{cursor:pointer;font-size:19px;font-weight:600;list-style:none}.faq summary::after{content:"+";float:right;color:var(--c);transition:transform .3s}.faq details[open] summary::after{transform:rotate(45deg)}.faq p{color:var(--m);margin-top:12px;max-width:760px}
.legal h2{font-size:22px;margin:36px 0 10px}.legal p{color:var(--m)}.placeholder{border:1px dashed #ffb36b;color:#ffb36b!important;padding:16px;border-radius:12px}.ph{color:#ffb36b;background:#ffb36b14;padding:0 4px;border-radius:4px}
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s,transform .9s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:900px){.burger{display:block}.nav nav{position:fixed;inset:64px 0 auto;flex-direction:column;align-items:flex-start;gap:20px;padding:28px 5vw 36px;background:#04060bf5;transform:translateY(-10px);opacity:0;visibility:hidden;transition:opacity .3s,transform .3s,visibility .3s}.menu-open .nav nav{opacity:1;visibility:visible;transform:none}.nav nav a{font-size:20px}
.hero-sticky{grid-template-columns:1fr;align-items:start;padding-top:100px}#turn,.hero-still{width:100%;height:58%;top:auto;bottom:4%}.cards{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.kochen-text{top:auto;bottom:8%;transform:none;right:5vw}.kochen-sticky::after{background:linear-gradient(transparent 40%,#04060bf2 85%),linear-gradient(#04060b 0%,transparent 14%)}}
@media(max-width:700px){.figs,.cards,.sys,.sys.wide,.two,.mhero,.steps{grid-template-columns:1fr}.fig+.fig{border-left:0;border-top:1px solid #ffffff14}.sec{padding:80px 5vw}.sys{gap:28px;margin-bottom:64px}.sys h3{font-size:34px}.spec th{width:40%}.spec th,.spec td{padding:12px 6px;font-size:14px}footer a{margin:0 16px 0 0}}
html.static .hero,html.static .kochen{height:auto}html.static .hero-sticky,html.static .kochen-sticky{position:relative;min-height:100vh}html.static #turn,html.static #kochenc{display:none}html.static .hero-still,html.static .kochen-still{display:block}html.static{--p:0}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1!important;transform:none!important}.clip{clip-path:none!important}.steam-band,.scrollhint{display:none}}
/* ===== D3 ===== */
:root{--ease:cubic-bezier(.2,.7,.2,1)}
h1,h2,.giant{letter-spacing:-.035em}h2{line-height:1.04}
.hero{height:460vh}.hero-text{opacity:calc(1 - var(--p)*5.5);transform:translateY(calc(var(--p)*-160px))}
.turn-lines{list-style:none;position:absolute;left:5vw;top:50%;transform:translateY(-50%);width:min(520px,42vw);height:220px;z-index:2;pointer-events:none}
.turn-lines li{position:absolute;inset:0 0 auto;font-size:clamp(30px,3.6vw,54px);line-height:1.08;font-weight:600;letter-spacing:-.03em;color:var(--m);opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.turn-lines li b{display:block;color:var(--t);font-weight:700}.turn-lines li.on{opacity:1;transform:none}.turn-lines li.off{opacity:0;transform:translateY(-30px)}
.turn-bar{position:absolute;left:5vw;bottom:40px;width:160px;height:2px;background:#ffffff1a;opacity:calc((var(--p) - .12)*8)}.turn-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--c),var(--b));transform-origin:left;transform:scaleX(var(--p))}
.pin{position:relative;--q:0}.pin-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:90px 5vw 40px}
.statement{height:220vh;background:linear-gradient(var(--bg),#060a14 50%,var(--bg))}.giant{font-size:clamp(40px,7.4vw,124px);font-weight:700;line-height:1.02;max-width:14ch}
.words .w{opacity:.14;transition:opacity .25s linear}.words .w.lit{opacity:1}.words .w.hl{background:linear-gradient(90deg,#ffb36b,var(--c));-webkit-background-clip:text;background-clip:text;color:transparent}
.count{height:200vh}.count .pin-sticky{align-items:center;text-align:center;background:radial-gradient(ellipse 50% 45% at 50% 45%,#1A48A633,transparent 70%)}
.bignum{display:flex;align-items:baseline;gap:.25em;justify-content:center;line-height:.9}.bignum b{font-size:clamp(140px,26vw,380px);font-weight:700;letter-spacing:-.06em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff 30%,#8fb3e8);-webkit-background-clip:text;background-clip:text;color:transparent}.bignum .pre{font-size:clamp(20px,2.4vw,36px);color:var(--m);font-weight:600}
.bigsub{font-size:clamp(18px,2vw,26px);color:var(--t);margin-top:12px}.minis{display:grid;grid-template-columns:repeat(3,minmax(0,220px));gap:20px;margin-top:56px;opacity:calc((var(--q) - .45)*4);transform:translateY(calc((1 - min(1,max(0,(var(--q) - .45)*4)))*30px))}
.minis div{border-top:1px solid #ffffff22;padding-top:16px}.minis b{display:block;font-size:clamp(22px,2.4vw,34px);letter-spacing:-.02em}.minis span{color:var(--m);font-size:14px}
.light{background:#eef1f6;color:#0a0f1a;transition:background .6s}.light .eyebrow{color:var(--b)}.light p{color:#4a5568}
.steps-pin{height:320vh;background:linear-gradient(var(--bg) 0,#eef1f6 12%,#eef1f6 88%,var(--bg) 100%)}.steps-pin .pin-sticky{display:grid;grid-template-columns:1fr 1.2fr;gap:6vw;align-items:center}
.stepbar{width:100%;max-width:320px;height:3px;background:#0a0f1a1a;margin-top:8px}.stepbar span{display:block;height:100%;background:var(--b);transform-origin:left;transform:scaleX(var(--q))}
.stepper{list-style:none;position:relative;height:300px}.stepper li{position:absolute;inset:0;opacity:0;transform:translateY(40px);transition:opacity .6s var(--ease),transform .6s var(--ease)}.stepper li.on{opacity:1;transform:none}.stepper li.off{transform:translateY(-40px)}
.stepper i{font-style:normal;font-weight:700;color:var(--b);font-size:18px}.stepper h3{font-size:clamp(48px,6.4vw,104px);letter-spacing:-.045em;line-height:1;margin:12px 0 18px;color:#0a0f1a}.stepper p{font-size:clamp(18px,1.6vw,22px);max-width:30ch}
.hscroll{height:300vh}.hscroll .pin-sticky{justify-content:center;gap:40px}.h-head h2{margin-bottom:0}.h-track{display:flex;gap:24px;will-change:transform;transform:translateX(var(--hx,0px))}
.hcard{flex:0 0 min(440px,78vw);min-height:340px;padding:40px;border-radius:24px;background:linear-gradient(160deg,#0f1d36,#070b14);border:1px solid #ffffff14;display:flex;flex-direction:column;transition:transform .4s var(--ease),border-color .4s}.hcard:hover{transform:translateY(-6px);border-color:#3fb6ff66}
.hcard span{color:var(--c);font-weight:700;margin-bottom:auto}.hcard h3{font-size:clamp(26px,2.4vw,36px);letter-spacing:-.025em;margin:40px 0 14px}.hcard p{color:var(--m)}.hcard.accent{background:linear-gradient(160deg,#1A48A6,#0b1a3a)}.hcard.accent p{color:#d6e2f7}.hcard .link{margin-top:18px}
.next{height:260vh}.next .pin-sticky{padding:0;justify-content:flex-end}.next-img{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.next-img img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.25 - var(--q)*.25));clip-path:inset(calc((1 - min(1,var(--q)*1.8))*38%) calc((1 - min(1,var(--q)*1.8))*38%) round 24px);filter:brightness(calc(.4 + var(--q)*.6))}
.next-text{position:relative;z-index:2;padding:0 5vw 9vh;opacity:calc((var(--q) - .5)*3);background:linear-gradient(transparent,#04060bcc 40%)}.giant-s{font-size:clamp(64px,11vw,180px);margin:0 0 8px}.next-text p{color:var(--t);font-size:clamp(18px,2vw,26px);margin-bottom:18px}
.cta-bertha h3{font-size:clamp(28px,3vw,44px);letter-spacing:-.03em}
@media(max-width:900px){.turn-lines{left:5vw;right:5vw;width:auto;top:96px;transform:none;height:160px}.turn-lines li{font-size:28px}.steps-pin .pin-sticky{grid-template-columns:1fr;gap:20px;align-content:center}.stepper{height:260px}.minis{grid-template-columns:repeat(3,1fr);gap:10px}.minis b{font-size:18px}}
html.static .pin{height:auto}html.static .pin-sticky{position:relative;height:auto;min-height:0;padding:100px 5vw}html.static .hero{height:auto}
html.static .turn-lines{position:relative;transform:none;top:auto;left:auto;height:auto;width:auto;padding:0 0 40px}html.static .turn-lines li,html.static .stepper li{position:relative;opacity:1;transform:none;margin-bottom:24px}html.static .stepper{height:auto}
html.static .words .w{opacity:1}html.static .minis,html.static .next-text{opacity:1;transform:none}html.static .h-track{flex-wrap:wrap;transform:none}html.static .next-img{position:relative;height:60vh}html.static .next-img img{clip-path:none;transform:none;filter:none}html.static .turn-bar{display:none}
