:root{--tinte:#22303c;--grau:#66717b;--sand:#f5f2ec;--linie:#e1ddd4;--akzent:#2f6f6a;--akzent-dunkel:#245853}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Helvetica Neue',Arial,sans-serif;color:var(--tinte);line-height:1.65;background:#fff}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:normal;line-height:1.25;color:var(--tinte);margin:0}
a{color:var(--akzent)}
.wrap{max-width:1040px;margin:0 auto;padding:0 22px}
header{background:#fff;border-bottom:1px solid var(--linie);position:sticky;top:0;z-index:10}
header .wrap{display:flex;justify-content:space-between;align-items:center;min-height:68px;flex-wrap:wrap;gap:8px}
.logo{font-family:Georgia,serif;font-size:1.45rem;color:var(--tinte);text-decoration:none}
.logo b{color:var(--akzent);font-weight:normal}
nav a{margin-left:22px;text-decoration:none;font-size:.9rem;color:var(--grau)}
nav a:hover{color:var(--akzent)}
.hero{background:var(--sand);padding:84px 0 76px}
.hero .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center}
.hero h1{font-size:2.45rem;margin-bottom:18px}
.hero p{font-size:1.1rem;color:var(--grau);margin:0 0 28px;max-width:560px}
.btn{display:inline-block;background:var(--akzent);color:#fff;padding:13px 28px;text-decoration:none;font-size:.95rem;border-radius:2px}
.btn:hover{background:var(--akzent-dunkel)}
.btn.zweit{background:transparent;color:var(--akzent);border:1px solid var(--akzent);margin-left:10px}
.btn.zweit:hover{background:var(--akzent);color:#fff}
.hero-box{background:#fff;border:1px solid var(--linie);padding:26px}
.hero-box h3{font-size:1.05rem;margin-bottom:12px}
.hero-box ul{list-style:none;margin:0;padding:0;font-size:.95rem;color:var(--grau)}
.hero-box li{padding:7px 0 7px 22px;position:relative;border-top:1px solid var(--linie)}
.hero-box li:first-child{border-top:0}
.hero-box li::before{content:"";position:absolute;left:0;top:17px;width:10px;height:2px;background:var(--akzent)}

.hero{background:#8e96a2;padding:70px 0}
.hero .wrap{grid-template-columns:1fr 1.1fr;gap:40px}
.hero h1{color:#16212b}
.hero p{color:#1c2733}
.hero .btn{background:#16212b}
.hero .btn:hover{background:#000}
.hero .btn.zweit{background:transparent;color:#16212b;border:1px solid #16212b}
.hero .btn.zweit:hover{background:#16212b;color:#fff}
.hero-logo img{display:block;width:100%;max-width:620px;margin:0 auto}
section{padding:74px 0}
section.sand{background:var(--sand)}
.kopf{max-width:680px;margin-bottom:38px}
h2{font-size:1.85rem;margin-bottom:10px}
.kopf p{color:var(--grau);margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.karte{background:#fff;border:1px solid var(--linie);padding:26px}
section.sand .karte{background:#fff}
.karte .nr{display:block;font-family:Georgia,serif;color:var(--akzent);font-size:1.4rem;margin-bottom:8px}
.karte h3{font-size:1.15rem;margin-bottom:8px}
.karte p{margin:0;color:var(--grau);font-size:.96rem}
.zielgruppe{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.zg{background:#fff;border:1px solid var(--linie);border-top:3px solid var(--akzent);padding:30px}
.zg h3{font-size:1.35rem;margin-bottom:12px}
.zg p{color:var(--grau);margin:0 0 12px}
.zg ul{margin:0;padding-left:18px;color:var(--grau);font-size:.97rem}
.zg li{margin:6px 0}
.alter{margin-top:26px;background:var(--akzent);color:#fff;padding:36px;display:grid;grid-template-columns:1fr 1.1fr;gap:38px;align-items:start}
.alter h3{color:#fff;font-size:1.5rem;margin-bottom:12px}
.alter p{margin:0 0 12px;color:#e4efed;font-size:.98rem}
.alter-faelle{display:grid;gap:12px}
.alter-faelle div{background:rgba(255,255,255,.12);border-left:3px solid #fff;padding:13px 16px;font-size:.94rem;color:#f0f6f5}
.alter-faelle span{display:block;font-weight:600;color:#fff;margin-bottom:2px}
.hf{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.hf p{color:var(--grau);margin:0 0 14px}
.merk{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.merk li{border-left:3px solid var(--akzent);background:var(--sand);padding:14px 18px;font-size:.97rem}
.merk strong{display:block;color:var(--tinte);font-weight:600}
.merk span{color:var(--grau)}
.ueber{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}
.foto{aspect-ratio:4/5;background:var(--linie);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--grau);font-size:.9rem;overflow:hidden}
.foto img{width:100%;height:100%;object-fit:cover;object-position:top}
.ueber p{color:var(--grau);margin:0 0 14px}
.quali{list-style:none;padding:0;margin:20px 0 0;font-size:.95rem}
.quali li{padding:9px 0;border-top:1px solid var(--linie)}
.quali b{font-weight:600;color:var(--tinte)}
.kontakt{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.kontakt p{margin:0 0 10px;color:var(--grau)}
.kontakt .daten p{color:var(--tinte)}
.schritte{counter-reset:s;list-style:none;margin:0;padding:0}
.schritte li{counter-increment:s;padding:10px 0 10px 40px;position:relative;color:var(--grau)}
.schritte li::before{content:counter(s);position:absolute;left:0;top:10px;width:26px;height:26px;border:1px solid var(--akzent);color:var(--akzent);text-align:center;line-height:24px;font-size:.85rem;border-radius:50%}
.recht{padding:56px 0}
.recht h2{font-size:1.5rem;margin-bottom:22px}
.recht h3{font-family:'Helvetica Neue',Arial,sans-serif;font-size:.95rem;font-weight:600;margin:18px 0 6px}
.recht h3:first-child{margin-top:0}
.recht p{font-size:.9rem;color:var(--grau);margin:0 0 10px}
.recht-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px}
@media(max-width:800px){.recht-grid{grid-template-columns:1fr}}
footer{background:var(--tinte);color:#aeb7c0;padding:26px 0;font-size:.85rem}
footer a{color:#aeb7c0;margin-left:2px}
@media(max-width:800px){
 .hero .wrap,.zielgruppe,.hf,.ueber,.kontakt,.alter{grid-template-columns:1fr}
 .hero h1{font-size:1.95rem}
 nav a{margin:0 16px 0 0}
 .foto{max-width:320px}
}
.legal-page{padding:60px 0 80px}
.legal-page h1{font-size:2rem;margin-bottom:26px}
.legal-page h2{font-size:1.2rem;font-family:'Helvetica Neue',Arial,sans-serif;font-weight:600;margin:28px 0 8px}
.legal-page p{color:var(--grau);margin:0 0 12px;max-width:760px}

/* ===== Version 2: neue Hero, Problem, Pakete, Ablauf, FAQ ===== */
.nav-cta{display:inline-block;margin-left:22px;background:var(--akzent);color:#fff!important;padding:9px 16px;border-radius:2px;font-size:.85rem}
.nav-cta:hover{background:var(--akzent-dunkel)}
.eyebrow{font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:#16212b;margin:0 0 12px;font-weight:600}
.hero .wrap{grid-template-columns:1.15fr .85fr}
.hero h1{font-size:2.6rem}
.hero p.sub{font-size:1.08rem;color:#1c2733;margin:0 0 20px;max-width:580px}
.bullets{list-style:none;margin:0 0 26px;padding:0;max-width:580px}
.bullets li{position:relative;padding:7px 0 7px 26px;color:#1c2733;font-size:1rem}
.bullets li::before{content:"";position:absolute;left:0;top:18px;width:14px;height:2px;background:#16212b}
.bullets b{font-weight:600}
.hero .zeile{margin:14px 0 0;font-size:.95rem;color:#1c2733}
.hero .fuss{margin:10px 0 0;font-size:.8rem;color:#2a3744}
.problem .zwei{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:26px}
.problem .karte h3{font-size:1.2rem}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0;padding:0;list-style:none}
.chips li{background:var(--sand);border:1px solid var(--linie);padding:7px 14px;font-size:.9rem;color:var(--tinte);border-radius:20px}
.chips-kopf{margin:0;color:var(--tinte);font-weight:600}
.pakete{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.paket{background:#fff;border:1px solid var(--linie);border-top:3px solid var(--akzent);padding:28px}
.paket .label{display:block;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--akzent);font-weight:600;margin-bottom:8px}
.paket h3{font-size:1.3rem;margin-bottom:10px}
.paket p{margin:0;color:var(--grau);font-size:.97rem}
.ablauf{counter-reset:a;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.ablauf li{counter-increment:a;background:#fff;border:1px solid var(--linie);padding:20px 18px;position:relative}
.ablauf li::before{content:counter(a);display:block;width:28px;height:28px;border:1px solid var(--akzent);color:var(--akzent);text-align:center;line-height:26px;font-size:.85rem;border-radius:50%;margin-bottom:10px}
.ablauf b{display:block;font-family:Georgia,serif;font-weight:normal;font-size:1.08rem;color:var(--tinte);margin-bottom:6px}
.ablauf span{font-size:.92rem;color:var(--grau);display:block}
.zielgruppe.drei{grid-template-columns:repeat(3,1fr)}
.zielgruppe.vier{grid-template-columns:repeat(2,1fr)}
.bau-kopf{margin:34px 0 14px}
.faq{max-width:780px}
.faq details{border-top:1px solid var(--linie);padding:16px 0}
.faq details:last-child{border-bottom:1px solid var(--linie)}
.faq summary{cursor:pointer;font-family:Georgia,serif;font-size:1.12rem;color:var(--tinte);list-style:none;position:relative;padding-right:30px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:-2px;font-size:1.5rem;color:var(--akzent)}
.faq details[open] summary::after{content:"–"}
.faq p{margin:12px 0 0;color:var(--grau)}
.kontakt-lead{color:var(--tinte)!important}
@media(max-width:900px){
 .ablauf{grid-template-columns:1fr 1fr}
 .zielgruppe.drei,.zielgruppe.vier{grid-template-columns:1fr}
}
@media(max-width:800px){
 .hero .wrap,.problem .zwei,.pakete{grid-template-columns:1fr}
 .hero-logo{order:-1;max-width:300px;margin:0 auto 10px}
 .ablauf{grid-template-columns:1fr}
 .hero h1{font-size:2rem}
 .nav-cta{margin:6px 0 0}
}

.auf-wunsch{margin:28px 0 0;max-width:800px;color:var(--tinte);font-size:1.03rem;border-left:3px solid var(--akzent);padding:4px 0 4px 18px}

.chips li.mehr{background:transparent;border-style:dashed;color:var(--grau);font-style:italic}

/* v3 Vertrauen */
.vertrauen{padding:26px 0;background:#fff;border-bottom:1px solid var(--linie)}
.vertrauen ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.vertrauen li{border-left:3px solid var(--akzent);padding:2px 0 2px 14px;font-size:.92rem;color:var(--grau);line-height:1.45}
.vertrauen b{display:block;color:var(--tinte);font-weight:600;font-size:1rem;margin-bottom:2px}
@media(max-width:900px){.vertrauen ul{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vertrauen ul{grid-template-columns:1fr}}
/* v4 */
.pakete{grid-template-columns:repeat(3,1fr)}
.ablauf{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.pakete{grid-template-columns:1fr}.ablauf{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ablauf{grid-template-columns:1fr}}

/* v13 Logo-Hintergrund */
.hero{background:#8c9aac}