:root{--bg:#f3f4f6;--card:#fff;--text:#111827;--muted:#4b5563;--line:#e5e7eb;--accent:#0F766E;--accent-ink:#fff}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,sans-serif}
a{color:var(--accent)}
.top{display:flex;align-items:center;justify-content:space-between;max-width:1080px;margin:0 auto;padding:18px 20px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.2rem;color:var(--text);text-decoration:none;letter-spacing:-.01em}
.brand .dot{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(15,118,110,.15)}
.top nav a{font-weight:600;text-decoration:none;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--card)}
main{max-width:1080px;margin:0 auto;padding:8px 20px 32px}
.hero{padding:40px 0 28px}
.eyebrow{margin:0 0 10px;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem}
h1{margin:0 0 16px;font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.12;letter-spacing:-.02em}
.lead{max-width:720px;color:var(--muted);font-size:1.08rem;margin:0 0 24px}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:0}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:12px 22px;border-radius:12px;background:var(--accent);color:var(--accent-ink);font-weight:700;text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.hint{color:var(--muted);font-size:.9rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:8px 0 16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:0 1px 2px rgba(17,24,39,.04)}
.card h2{margin:0 0 6px;font-size:1.02rem}
.card p{margin:0;color:var(--muted)}
.note{margin-top:16px}
.legal{max-width:760px;margin:24px auto}
.legal h1{font-size:1.6rem}.legal h2{margin:18px 0 4px}.legal p{margin:0 0 8px}
.meta{font-size:.85rem}
footer{max-width:1080px;margin:0 auto;padding:16px 20px 40px;text-align:center;color:var(--muted);font-size:.88rem}
footer span{font-size:.8rem}
@media (max-width:600px){.hero{padding:20px 0 16px}.card{padding:16px 18px}.grid{grid-template-columns:1fr}.top nav{flex-wrap:wrap;justify-content:flex-end}}
/* v2: Logo */
.brand img{height:46px;width:auto;display:block}
@media (max-width:600px){.brand img{height:36px}}

/* v2: DIY-Kit coming soon */
.kit-soon-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:4px 0 24px;padding:14px 18px;background:#171A20;color:#fff;border-radius:14px;border-left:4px solid #E82127}
.kit-soon-note p{margin:0;color:#d1d5db;font-size:.95rem}
.kit-soon-badge{display:inline-block;padding:4px 11px;border-radius:999px;background:#E82127;color:#fff;font-size:.74rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}

/* intro video v4: klein neben Coming-soon */
.kit-soon-note{flex-wrap:nowrap;justify-content:space-between;gap:16px 24px}
.ks-text{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;min-width:0;flex:1 1 auto}
.iv-frame{position:relative;aspect-ratio:16/9;flex:0 0 auto;width:340px;max-width:100%;border-radius:10px;overflow:hidden;background:#171A20}
.iv-frame video,.iv-frame .iv-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.iv-frame .iv-poster{display:none}
.iv-rm .iv-frame .iv-poster{display:block}
.iv-btn{position:absolute;right:6px;bottom:6px;z-index:2;width:30px;height:30px;padding:0;display:flex;align-items:center;justify-content:center;background:rgba(23,26,32,.85);color:#fff;border:1px solid #E82127;border-radius:50%;font:14px/1 system-ui,sans-serif;cursor:pointer}
.iv-btn:hover,.iv-btn:focus-visible{background:#E82127;outline:none}
@media (max-width:720px){.kit-soon-note{flex-direction:column;align-items:stretch}.ks-text{justify-content:center;text-align:center}.iv-frame{width:100%;max-width:260px;margin:0 auto}}
.steps{margin:6px 0 8px;padding-left:1.3em;color:var(--muted)}.steps li{margin:2px 0}

/* v6: FAQ */
.top nav{display:flex;gap:8px}
.faq-short{margin-top:16px}.faq-short h2{font-size:1.25rem;margin-bottom:10px}
.faq-item{border-top:1px solid var(--line);padding:2px 0}
.faq-item:first-of-type{border-top:0}
.faq-item summary{cursor:pointer;font-weight:650;padding:10px 0;list-style-position:outside}
.faq-item div{color:var(--muted);padding:0 0 12px}
.faq-item ul{margin:6px 0;padding-left:1.2em}
.faq-more{margin-top:10px!important}
.faq-page .lead{font-size:1rem}
.faq-page h1{margin-bottom:8px}

/* v7: Erklärvideo */
.video-sec{margin:0 0 20px}.video-sec h2{font-size:1.25rem}.video-sec p{margin:0 0 12px}
.vid-wrap{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#0b1020;width:100%;max-width:100%;margin:0 auto}
.vid-wrap video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

.hero-teaser{max-width:720px;color:var(--muted);font-size:.98rem;margin:-12px 0 24px}
.btn-ghost{background:transparent;color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}
.btn-ghost:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);filter:none}
#anleitung{scroll-margin-top:16px}

.card .shot{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--line);margin:0 0 12px}
.reqs{margin:6px 0 0;padding-left:20px}.who{margin-top:10px;color:var(--muted)}
.kit-soon-note .cta{margin:0}
.kf label{display:block;margin:12px 0 4px;font-weight:600}.kf input:not([type=checkbox]),.kf textarea,.kf select{display:block;width:100%;box-sizing:border-box;margin-top:4px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;font-weight:400}
.kf-check{display:flex!important;gap:10px;font-weight:400!important}.kf-check input{margin-top:4px}.kf-err{color:#b3121b;margin:4px 0}.kf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.kf .btn{border:0;cursor:pointer;font:inherit}