@font-face{font-family:Poppins;font-weight:300;src:url(fonts/poppins-light.woff) format("woff");font-display:swap}
@font-face{font-family:Poppins;font-weight:400;src:url(fonts/poppins-regular.woff) format("woff");font-display:swap}
@font-face{font-family:Poppins;font-weight:500;src:url(fonts/poppins-medium.woff) format("woff");font-display:swap}
:root{--weiss:#FAF8F5;--sand:#E8E1D6;--salbei:#B7C4B1;--gruen:#5E6F64;--gruen-dunkel:#4A5950;--text:#2E2E2E;--leise:#5E6F64}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--weiss);color:var(--text);font:400 1.0625rem/1.75 Poppins,"Segoe UI",Helvetica,Arial,sans-serif}
img{max-width:100%;display:block}
a{color:var(--gruen-dunkel)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--gruen);outline-offset:3px}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.5rem}
.schmal{max-width:42rem}
header{position:sticky;top:0;z-index:5;background:rgba(250,248,245,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--sand)}
.kopf{display:flex;align-items:center;justify-content:space-between;height:4.5rem;gap:1rem}
.marke{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--text);font-weight:300;font-size:1.6rem;letter-spacing:.01em}
.marke svg{width:1.7rem;height:1.7rem;flex:none}
nav{display:flex;align-items:center;gap:1.6rem}
nav a{text-decoration:none;color:var(--text);font-size:.95rem}
nav a:hover{color:var(--gruen)}
.knopf{display:inline-block;background:var(--gruen);color:#fff;text-decoration:none;padding:.8rem 1.4rem;border-radius:2px;font-weight:500;font-size:.95rem;transition:background .2s}
.knopf:hover{background:var(--gruen-dunkel)}
.knopf.hell{background:transparent;color:var(--gruen-dunkel);box-shadow:inset 0 0 0 1px var(--gruen)}
.knopf.hell:hover{background:var(--sand)}
nav .knopf{color:#fff;padding:.55rem 1rem}
@media(max-width:760px){nav a:not(.knopf){display:none}.marke{font-size:1.4rem}}
h1,h2,h3{font-weight:300;line-height:1.2;margin:0 0 1rem}
h1{font-size:clamp(2.6rem,6vw,4.4rem);letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,3.6vw,2.6rem)}
h3{font-size:1.2rem;font-weight:500}
section{padding:5.5rem 0}
.hero{padding:4.5rem 0 6rem;overflow-x:clip}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:4rem;align-items:center}
.hero p.einleitung{font-size:1.15rem;max-width:34rem;margin:0 0 2rem}
.claim{color:var(--leise);font-style:italic;font-weight:300;font-size:1.25rem;margin:0 0 1.5rem}
.aktionen{display:flex;flex-wrap:wrap;gap:.8rem}
.rahmen{position:relative;padding:1.4rem;border:2px solid var(--gruen);width:100%;max-width:25rem;justify-self:end;isolation:isolate}
.rahmen::after{content:"";position:absolute;width:26%;aspect-ratio:1;background:var(--salbei);right:-13%;bottom:-13%;z-index:-1}
.rahmen img{aspect-ratio:4/5;object-fit:cover;width:100%;height:auto}
@media(max-width:860px){.hero .wrap{grid-template-columns:1fr;gap:3rem}.rahmen{justify-self:start;max-width:20rem;margin-left:0}}
.sand{background:var(--sand)}
.schritte{list-style:none;padding:0;margin:2.5rem 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;counter-reset:s}
.schritte li{counter-increment:s;border-top:2px solid var(--gruen);padding-top:1.2rem}
.schritte li::before{content:counter(s);display:block;font-weight:300;font-size:2.4rem;color:var(--gruen);line-height:1;margin-bottom:.8rem}
.schritte p{margin:0}
@media(max-width:760px){.schritte{grid-template-columns:1fr;gap:2rem}}
.leistungen{display:grid;grid-template-columns:repeat(2,1fr);gap:0 3rem;margin-top:2rem}
.leistungen div{padding:1.3rem 0;border-bottom:1px solid var(--sand)}
.leistungen p{margin:.2rem 0 0;color:var(--leise)}
@media(max-width:760px){.leistungen{grid-template-columns:1fr}}
.preise{margin-top:2rem;border-top:1px solid var(--salbei)}
.preis{display:grid;grid-template-columns:1fr auto;gap:.2rem 2rem;padding:1.4rem 0;border-bottom:1px solid var(--salbei)}
.preis strong{font-weight:500;font-size:1.1rem}
.preis .betrag{font-weight:300;font-size:1.8rem;line-height:1;align-self:center;grid-row:span 2}
.preis span{color:var(--leise)}
.angebot{margin:2rem 0;padding:1.5rem 1.8rem;background:var(--weiss);border-left:4px solid var(--gruen)}
.angebot p{margin:0}
.klein{font-size:.9rem;color:var(--leise)}
.zitat{font-weight:300;font-size:clamp(1.4rem,2.6vw,1.8rem);line-height:1.45;color:var(--gruen-dunkel);margin:0 0 2rem;padding-left:1.4rem;border-left:4px solid var(--salbei)}
.orte{color:var(--leise)}
details{border-bottom:1px solid var(--sand);padding:1rem 0}
summary{cursor:pointer;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::after{content:"+";font-weight:300;font-size:1.4rem;line-height:1;color:var(--gruen)}
details[open] summary::after{content:"–"}
details p{margin:.7rem 0 0}
.kontakt{background:var(--gruen);color:#fff}
.kontakt a{color:#fff}
.kontakt .knopf{background:#fff;color:var(--gruen-dunkel)}
.kontakt .knopf:hover{background:var(--sand)}
.kontaktwege{font-size:1.3rem;font-weight:300;margin:1.5rem 0 2rem;line-height:2}
footer{padding:2rem 0;font-size:.85rem;color:var(--leise)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
footer a{color:var(--leise);margin-left:1.2rem}
.recht h1{font-size:2.4rem;margin-top:3rem}
.recht h2{font-size:1.3rem;font-weight:500;margin-top:2.2rem}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.checkliste{background:var(--sand)}
.checkliste form{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.5rem}
.checkliste input[type=email]{flex:1;min-width:12rem;padding:.8rem 1rem;border:1px solid var(--salbei);border-radius:2px;font:400 1rem Poppins,sans-serif;background:#fff}
.checkliste .knopf{border:none;cursor:pointer;font:500 .95rem Poppins,sans-serif}
.anmelde-platzhalter{max-width:30rem}
.sprachen{display:inline-block;margin:-1rem 0 2rem;padding:.35rem .9rem;background:var(--sand);border-radius:2px;font-size:.9rem;color:var(--gruen-dunkel)}
.uebergaenge .intro{max-width:42rem;margin-bottom:2.5rem}
.karten{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.karte{background:#fff;border:1px solid var(--sand);border-top:3px solid var(--gruen);padding:1.4rem 1.4rem 1.2rem;border-radius:2px}
.karte h3{margin-bottom:.5rem}
.karte p{margin:0;color:var(--leise);font-size:.97rem}
.karte.hell{background:var(--gruen);border-color:var(--gruen)}
.karte.hell h3,.karte.hell p{color:#fff}
@media(max-width:860px){.karten{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.karten{grid-template-columns:1fr}}
.sprachwahl{display:inline-flex;gap:.1rem;border:1px solid var(--sand);border-radius:2px;padding:.15rem}
.sprachwahl a{padding:.25rem .5rem;font-size:.8rem;color:var(--leise)}
.sprachwahl a.aktiv{background:var(--sand);color:var(--text)}
@media(max-width:760px){nav .sprachwahl{display:inline-flex}}
html[dir="rtl"] body{font-family:"Vazirmatn","Segoe UI","Tahoma","Noto Naskh Arabic","Geeza Pro",sans-serif;line-height:1.95}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3{font-family:"Vazirmatn","Segoe UI","Tahoma","Noto Naskh Arabic","Geeza Pro",sans-serif;letter-spacing:0}
html[dir="rtl"] .marke,html[dir="rtl"] .sprachwahl{font-family:Poppins,"Segoe UI",sans-serif}
html[dir="rtl"] .rahmen{justify-self:start}
html[dir="rtl"] .rahmen::after{right:auto;left:-13%}
html[dir="rtl"] .angebot{border-left:0;border-right:4px solid var(--gruen)}
html[dir="rtl"] .zitat{padding-left:0;border-left:0;padding-right:1.4rem;border-right:4px solid var(--salbei)}
html[dir="rtl"] footer a{margin-left:0;margin-right:1.2rem}
@media(max-width:760px){nav .sprachwahl a{display:inline-block!important;padding:.2rem .4rem}nav{gap:.6rem}}
@media(max-width:420px){.marke{font-size:1.2rem;gap:.45rem}.marke svg{width:1.4rem;height:1.4rem}nav .knopf{padding:.5rem .7rem;font-size:.85rem}.wrap.kopf{padding:0 1rem}}
.klaeri-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:4rem;align-items:center}
.klaeri-bild{background:var(--sand);border-radius:50%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;max-width:22rem}
.klaeri-svg{width:62%}
.klaeri-label{color:var(--gruen);font-weight:500;font-size:.9rem;margin:0 0 .4rem}
.klaeri-liste{padding-left:1.1rem;margin:0 0 1.2rem;color:var(--leise)}
.klaeri-liste li{margin:.2rem 0}
.klaeri-preis{margin:0 0 1.5rem}
@media(max-width:760px){.klaeri-wrap{grid-template-columns:1fr;gap:2rem}.klaeri-bild{max-width:12rem}}
.versprechen{margin:2rem 0 1rem;padding:1.5rem 1.8rem;background:var(--gruen);color:#fff;border-radius:2px}
.versprechen h3{color:#fff;margin:0 0 .5rem}
.versprechen p{margin:0;opacity:.95}
@media(max-width:1150px){nav a[href$="#ablauf"],nav a[href$="#checkliste"],nav a[href$="#process"]{display:none}}
.verschenken .intro{max-width:42rem;margin-bottom:2.5rem}
.business{border-top:1px solid var(--sand)}

nav a,.sprachwahl{white-space:nowrap}
@media(max-width:1400px){nav{gap:1.2rem}}
@media(max-width:960px){nav a[href$="#uebergaenge"],nav a[href$="#klaeri"],nav a[href$="#transitions"]{display:none}}