:root{--bg:#07060d;--text:#ecebf4;--leise:#9a97ad;--lila:#C084E8;--lila2:#7B1FA2;--amber:#FFA000;--glas:rgba(20,16,34,.72);--linie:rgba(255,255,255,.1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.6 Inter,system-ui,sans-serif}
#kosmos{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.kopf,main,.fuss{position:relative;z-index:1}
.kopf{position:fixed;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;gap:24px;padding:14px 24px;background:linear-gradient(#07060dcc,#07060d00)}
.marke{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font:500 22px 'Space Grotesk',sans-serif}.marke b{font-weight:700;color:var(--amber)}
nav{display:flex;gap:20px;margin-left:auto}nav a{color:var(--leise);text-decoration:none;font-size:15px}nav a:hover,nav a:focus-visible{color:var(--text)}
.regler{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--leise)}.regler input{accent-color:var(--amber);width:44px}
.buehne{min-height:100vh;display:flex;flex-direction:column;justify-content:center;max-width:980px;margin:0 auto;padding:110px 16px 60px}
.buehne.breit{max-width:1120px}
.kicker{color:var(--amber);letter-spacing:.14em;text-transform:uppercase;font-size:13px;margin:0 0 16px}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;line-height:1.05;letter-spacing:-.03em;margin:0 0 .4em}
h1{font-size:clamp(38px,8vw,96px);font-weight:700}h1 em{font-style:normal;background:linear-gradient(90deg,var(--lila),var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent}
h2{font-size:clamp(32px,5vw,56px);font-weight:700}h3{font-size:21px;letter-spacing:-.01em;line-height:1.2}
.lead{font-size:clamp(18px,2.2vw,22px);color:#cfcde0;max-width:620px}.lead.klein{font-size:16px;color:var(--leise)}
.aktion{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:28px}
.knopf{display:inline-block;border:0;border-radius:999px;background:var(--amber);color:#2a1600;padding:14px 26px;font:700 16px 'Space Grotesk',sans-serif;text-decoration:none;cursor:pointer;min-height:48px}
.knopf:hover{background:#ffb333}.knopf:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--lila);outline-offset:3px}
.leise{color:var(--leise);text-decoration:none}.leise:hover{color:var(--text)}
.drei{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.drei article,.form,details,.handy-in{background:var(--glas);border:1px solid var(--linie);border-radius:16px;padding:22px}
.drei p,details p{color:var(--leise);margin:0}
.punkt{display:block;width:12px;height:12px;border-radius:50%;margin-bottom:16px}.punkt.p{background:var(--lila)}.punkt.a{background:var(--amber)}.punkt.g{background:#6fd49a}
.geraet{margin-top:24px;perspective:1600px}.geraet .app{transform:rotateX(5deg) rotateY(-6deg);transition:transform .4s;box-shadow:0 40px 100px #7b1fa255,0 0 0 1px #ffffff14;min-height:430px}
.geraet .app:hover{transform:none}
.zwei{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center}
.hinweis{color:var(--amber);font-size:15px}
.handy{justify-self:center;width:230px;border:8px solid #22202f;border-radius:34px;background:#121419;padding:14px;box-shadow:0 30px 80px #7b1fa244}
.handy-in{display:flex;flex-direction:column;gap:10px;font-size:13px;border:0;padding:8px;background:none}.handy-in b{font:700 15px 'Space Grotesk'}
.handy-in span{background:#232731;border-radius:10px;padding:10px}.handy-in button{background:var(--amber);border:0;border-radius:10px;padding:10px;font-weight:700}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#6fd49a;margin-right:7px}.dot.w{background:var(--amber)}
details{margin-bottom:10px}summary{cursor:pointer;font:500 18px 'Space Grotesk';list-style:none;min-height:32px}summary::after{content:"+";float:right;color:var(--amber)}details[open] summary::after{content:"–"}details p{margin-top:10px}
.form{max-width:560px}.form label{display:block;font-size:14px;color:var(--leise);margin-bottom:8px}.form div{display:flex;gap:10px;flex-wrap:wrap}
.form input{flex:1;min-width:200px;background:#0d0b16;border:1px solid var(--linie);border-radius:999px;color:var(--text);padding:14px 20px;font-size:16px}
.form p{color:var(--amber);font-size:14px;margin:12px 0 0}
.fuss{display:flex;gap:24px;flex-wrap:wrap;padding:30px 24px;color:var(--leise);font-size:14px;border-top:1px solid var(--linie);background:#07060dd9}.fuss a{color:var(--leise)}
@media (max-width:760px){nav{display:none}.kopf{gap:12px}.regler{margin-left:auto}.drei,.zwei{grid-template-columns:1fr}.geraet .app{transform:none}.buehne{padding-top:90px}}
body.fast .geraet .app,body.fast .handy{box-shadow:none}body.fast .geraet .app{transform:none;transition:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.geraet .app{transform:none}}