:root{--accent:#ff6b1a;--on-accent:#fff;--navy:#0b1b33;--blue:#13294b;--orange:#ff6b1a;--ink:#0b1b33;--gray:#eef2f7;--muted:#5b6b82}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink);background:#fff}
h1,h2,.logo,.big,.facts b{font-family:Archivo,sans-serif;font-weight:900;letter-spacing:-.02em;line-height:1.02}
h1{font-size:clamp(42px,5.6vw,76px);margin:20px 0}h1 span,h2 span{color:var(--orange)}
h2{font-size:clamp(32px,3.8vw,52px);margin-bottom:30px}
.kick{font:800 13px Archivo;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin-bottom:12px}
.muted{color:var(--muted);font-size:18px}
.sos{background:var(--orange);color:#fff;font-size:14px}.sos-in{display:flex;justify-content:space-between;padding:8px 0;gap:10px}.sos a{color:#fff;font-weight:700;text-decoration:none}
.top{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e3e8ef}
.top-in{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:22px}.logo small{display:block;font-size:10px;letter-spacing:.32em;color:var(--muted);font-weight:600}
.mark{width:44px;height:44px;background:var(--navy);color:var(--orange);display:grid;place-items:center;border-radius:12px;font-size:24px;transform:skew(-8deg)}
nav{display:flex;gap:30px}nav a{text-decoration:none;font-weight:600;font-size:15px}nav a:hover{color:var(--orange)}
.top-r{display:flex;gap:10px;align-items:center}.burger{display:none;background:none;border:0;font-size:24px}
.btn{display:inline-block;background:var(--orange);color:#fff;font-weight:700;padding:16px 26px;border-radius:12px;text-decoration:none;border:2px solid var(--orange);transition:.2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(255,107,26,.3)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--ink)}.btn-full{width:100%;text-align:center;margin-top:18px}
.hero{background:linear-gradient(180deg,#f5f8fc,#fff);padding:70px 0 90px}
.hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.lead{font-size:20px;color:var(--muted);max-width:560px}.btns{display:flex;gap:12px;margin:30px 0;flex-wrap:wrap}
.facts{display:flex;gap:40px;margin-top:20px}.facts b{font-size:42px;display:block;color:var(--navy)}.facts span{color:var(--muted);font-size:14px}
.hero-vis svg{width:100%;filter:drop-shadow(0 30px 50px rgba(11,27,51,.25))}
.pipe{stroke-dasharray:900;stroke-dashoffset:900;animation:flow 2.6s ease forwards}@keyframes flow{to{stroke-dashoffset:0}}
.drop{animation:drip 2.2s ease-in-out infinite;transform-origin:232px 230px}@keyframes drip{50%{transform:translateY(10px)}}
.sec{padding:100px 0}.sec-blue{background:var(--navy);color:#fff}.sec-blue .muted{color:#a9b8cf}.sec-gray{background:var(--gray)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:1px solid #e3e8ef;border-radius:20px;padding:30px;transition:.25s;background:#fff;position:relative;overflow:hidden}
.card:hover{border-color:var(--orange);transform:translateY(-4px);box-shadow:0 20px 40px rgba(11,27,51,.08)}
.card .ic{width:56px;height:56px;border-radius:14px;background:#fff1e8;display:grid;place-items:center;font-size:28px;margin-bottom:18px}
.card h3{font:800 22px Archivo;margin-bottom:8px}.card p{color:var(--muted)}.card .from{margin-top:16px;font-weight:700;color:var(--orange)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.diag{background:#13294b;border-radius:24px;padding:30px;min-height:330px}
.diag-q h3{font:800 24px Archivo;margin-bottom:18px}.diag-q button{display:block;width:100%;text-align:left;background:#0b1b33;color:#fff;border:1px solid #2d4c7c;padding:16px 18px;border-radius:14px;margin-bottom:10px;font-weight:500;transition:.2s}
.diag-q button:hover{border-color:var(--orange);background:#1a3560}
.diag-a{display:none}.diag-a.show{display:block}.diag-a .lvl{display:inline-block;padding:6px 12px;border-radius:999px;font-weight:700;font-size:13px;margin-bottom:12px}
.lvl.red{background:#ff3b3b}.lvl.yel{background:#ffb020;color:#000}.lvl.grn{background:#22c55e}
.diag-a p{font-size:18px;margin-bottom:18px;color:#d6e0ee}.diag-a .back{background:none;border:0;color:#a9b8cf;text-decoration:underline;margin-left:14px}
.calc{margin-top:26px;display:flex;flex-direction:column;gap:10px}.calc label{font-weight:700;font-size:14px;margin-top:10px}
.seg{display:flex;flex-wrap:wrap;gap:8px}.seg button{border:2px solid #e3e8ef;background:#fff;padding:12px 16px;border-radius:12px;font-weight:600}
.seg button.on{border-color:var(--orange);background:#fff1e8;color:#c24a00}
input[type=range]{accent-color:var(--orange);width:100%}.chk{display:flex;gap:10px;align-items:center;font-weight:500!important}
.result{background:var(--navy);color:#fff;border-radius:28px;padding:36px;position:sticky;top:100px;box-shadow:0 30px 60px rgba(11,27,51,.25)}
.result>span{color:#a9b8cf;font-size:14px;text-transform:uppercase;letter-spacing:.14em}
.big{font-size:clamp(38px,4vw,54px);margin:10px 0 16px;color:#fff}.bar{height:10px;background:#1f3a66;border-radius:9px;overflow:hidden;margin-bottom:20px}
.bar i{display:block;height:100%;background:linear-gradient(90deg,#ff6b1a,#ffb347);transition:width .5s;border-radius:9px}
.result ul{list-style:none}.result li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #1f3a66;color:#d6e0ee;font-size:15px}
.subsidy{margin-top:16px;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);padding:12px 14px;border-radius:12px;color:#9ff0b9;font-size:14px;display:none}.subsidy.show{display:block}
.result small{display:block;margin-top:12px;color:#7f93b2;font-size:12px}
.plz{display:flex;gap:10px;margin-top:10px}.plz input{flex:1;font:700 22px Archivo;padding:14px 18px;border-radius:12px;border:2px solid #cfd8e3;letter-spacing:.2em}
.plz-out{margin-top:18px;font-size:18px;font-weight:600;min-height:28px}.plz-out.ok{color:#15803d}.plz-out.mid{color:#b45309}.plz-out.no{color:#b91c1c}
.map{position:relative;aspect-ratio:1;background:radial-gradient(circle,#fff 0,#e6edf6 70%);border-radius:50%;overflow:hidden}
.ring{position:absolute;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);border:2px dashed}
.r1{width:36%;height:36%;background:rgba(255,107,26,.18);border-color:var(--orange)}.r2{width:66%;height:66%;background:rgba(255,107,26,.08);border-color:#ffb347}.r3{width:94%;height:94%;border-color:#cfd8e3}
.pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:var(--navy);color:var(--orange);display:grid;place-items:center;font:900 22px Archivo;box-shadow:0 0 0 10px rgba(11,27,51,.15);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 22px rgba(11,27,51,0)}}
.town{position:absolute;font-size:13px;font-weight:600;color:var(--muted);transform:translate(-50%,-50%)}
.tl{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:t}
.tl div{border-top:4px solid var(--orange);padding-top:20px;counter-increment:t}.tl div::before{content:"0" counter(t);font:900 46px Archivo;color:#e3e8ef;display:block}
.tl b{font:800 20px Archivo;display:block;margin:6px 0}.tl p{color:var(--muted)}
.hours{width:100%;margin-top:26px;border-collapse:collapse}.hours td{padding:10px 0;border-bottom:1px solid #1f3a66;color:#d6e0ee}.hours td:last-child{text-align:right}.hours tr.today td{color:var(--orange);font-weight:700}
.form{display:flex;flex-direction:column;gap:12px;background:#13294b;padding:30px;border-radius:24px}
.form input,.form select,.form textarea{background:#0b1b33;border:1px solid #2d4c7c;color:#fff;padding:15px;border-radius:12px;font:inherit}
.up{border:2px dashed #2d4c7c;border-radius:12px;padding:16px;text-align:center;cursor:pointer;color:#a9b8cf}
.foot{padding:28px 0;color:var(--muted);font-size:14px}
@media(max-width:900px){nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;flex-direction:column;padding:20px;gap:14px}nav.open{display:flex}.burger{display:block}
.hero-in,.two{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.tl{grid-template-columns:1fr 1fr}.facts{gap:20px}.result{position:static}.sec{padding:70px 0}}

/* v10: echte Bilder */
.hero-vis .photo-frame{position:relative;aspect-ratio:6/5;border-radius:28px;overflow:hidden;background:var(--blue);border:10px solid var(--blue);box-shadow:0 30px 50px rgba(11,27,51,.25)}
.photo-frame picture,.photo-frame img{display:block;width:100%;height:100%;object-fit:cover;border-radius:18px}
.photo-frame .temp{position:absolute;top:18px;right:18px;background:var(--navy);color:#7cf29c;font:800 20px Archivo,sans-serif;padding:10px 14px;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.photo-frame .ph-tag{position:absolute;left:18px;bottom:18px;background:#fff;color:var(--navy);font-weight:700;font-size:14px;padding:10px 14px;border-radius:10px;border-left:4px solid var(--orange)}
.facts{flex-wrap:wrap;gap:20px 40px}.facts b{font-size:34px}.facts span{display:block;max-width:180px}
.refs-intro{margin:-12px 0 30px}
.refs{display:grid;grid-template-columns:1.15fr 1fr 1fr;grid-template-rows:290px 290px;gap:18px}
.ref{position:relative;margin:0;border-radius:20px;overflow:hidden;background:var(--blue)}
.ref:first-child{grid-row:span 2}
.ref picture,.ref img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ref:hover img{transform:scale(1.04)}
.ref figcaption{position:absolute;left:14px;bottom:14px;max-width:calc(100% - 28px);background:rgba(11,27,51,.85);color:#fff;font-weight:600;font-size:14px;padding:9px 12px;border-radius:10px}
@media(max-width:900px){.refs{grid-template-columns:1fr 1fr;grid-template-rows:360px 220px 220px}.ref:first-child{grid-row:auto;grid-column:span 2}.facts b{font-size:28px}}
.plz input{min-width:0;width:100%}
@media(max-width:900px){.ref figcaption{font-size:12px;padding:7px 9px;left:8px;bottom:8px;max-width:calc(100% - 16px)}}