@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url("/assets/fonts/manrope-latin-wght-normal.woff2") format("woff2")}
@font-face{font-family:"Lora";font-style:italic;font-weight:500;font-display:swap;src:url("/assets/fonts/lora-latin-500-italic.woff2") format("woff2")}
@font-face{font-family:"Lora";font-style:italic;font-weight:600;font-display:swap;src:url("/assets/fonts/lora-latin-600-italic.woff2") format("woff2")}
:root{
  --bg:#FAFAF7;
  --tint:#F2F0EA;
  --card:#FFFFFF;
  --ink:#1E2420;
  --ink-2:#39423C;
  --soft:#616B63;
  --line:#E6E4DB;
  --green:#1C2126;
  --green-deep:#02070C;
  --green-dark:#1C2126;
  --green-soft:rgba(28,33,38,.09);
  --amber:#C9932F;
  --amber-soft:rgba(201,147,47,.13);
  --amber-deep:#8A6316;
  --font:"Manrope","Segoe UI",Arial,sans-serif;
  --serif:"Lora",Georgia,serif;
  --r:20px;
  --shadow:0 10px 30px rgba(30,36,32,.07);
  --shadow-lg:0 22px 50px rgba(30,36,32,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:6px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--green);color:#fff;padding:.6rem 1rem;z-index:400;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
.wrap{max-width:1160px;margin:0 auto;padding:0 26px}
section{scroll-margin-top:84px}
::selection{background:var(--green);color:#fff}

/* ============ Kopfzeile ============ */
.topbar{position:fixed;top:0;left:0;right:0;z-index:200;background:rgb(28,33,38);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08);transition:box-shadow .3s}
.topbar.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.4)}
.topbar-inner{display:flex;align-items:center;gap:20px;height:74px;transition:height .35s cubic-bezier(.2,.7,.2,1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:46px;width:auto;transition:height .35s cubic-bezier(.2,.7,.2,1)}
.brand-name{font-weight:800;font-size:1.2rem;letter-spacing:-.01em;line-height:1;color:var(--ink)}
.brand-name small{display:block;font-size:.66rem;font-weight:600;letter-spacing:.12em;color:var(--soft);margin-top:4px;text-transform:uppercase}
.nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.nav a{text-decoration:none;color:rgba(255,255,255,.72);font-weight:600;font-size:.93rem;padding:.55rem .95rem;border-radius:99px;transition:background .25s,color .25s}
.nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav a.active{color:#F0C96A;background:rgba(240,201,106,.12)}
.top-cta{display:flex;align-items:center;gap:10px;margin-left:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-family:var(--font);font-weight:700;font-size:.98rem;padding:.95rem 1.8rem;border-radius:14px;border:none;cursor:pointer;text-decoration:none;line-height:1.15;transition:background .25s,transform .25s,box-shadow .25s,color .25s}
.btn svg{width:19px;height:19px;stroke:currentColor;flex:none}
.btn-green{background:var(--green);color:#fff;box-shadow:0 10px 24px rgba(28,33,38,.25)}
.btn-green:hover{background:var(--green-deep);transform:translateY(-2px);box-shadow:0 16px 32px rgba(28,33,38,.3)}
.btn-ghost{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--green);color:var(--green);transform:translateY(-2px);box-shadow:var(--shadow)}
.btn-white{background:var(--bg);color:var(--green-deep)}
.btn-white:hover{background:#fff;transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}
.btn-gold{background:#F0C96A;color:#1F2326;box-shadow:0 10px 24px rgba(0,0,0,.3)}
.btn-gold:hover{background:#FFE3A6;transform:translateY(-2px)}
.btn-ghost-dark{background:rgba(255,255,255,.06);color:#FAFAF7;border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost-dark:hover{background:#FAFAF7;color:#1F2326;transform:translateY(-2px)}
.btn-sm{padding:.6rem 1.2rem;font-size:.88rem;border-radius:11px}
.burger{display:none}

/* ============ Hero ============ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:#1C2126}
.hero-media{position:absolute;top:0;right:0;bottom:0;width:58%;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
@media (prefers-reduced-motion:no-preference){
  .hero-media img{animation:kenburns 32s ease-in-out infinite alternate}
  @keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.07)}}
}
.hero-media::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#1F2326 0%,rgba(28,33,38,.88) 26%,rgba(28,33,38,.32) 56%,rgba(28,33,38,.05) 80%),linear-gradient(0deg,#1F2326 0%,rgba(28,33,38,0) 22%)}
.hero-inner{position:relative;z-index:2;width:100%;padding-top:130px;padding-bottom:70px}
.pill{display:inline-flex;align-items:center;gap:.6rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:99px;padding:.55rem 1.1rem;font-size:.83rem;font-weight:600;color:rgba(255,255,255,.85);backdrop-filter:blur(6px);margin-bottom:26px}
h1 .pill{display:flex;width:fit-content;letter-spacing:0;line-height:1.4;font-family:var(--font);font-style:normal}
.pill .dot{width:9px;height:9px;border-radius:50%;background:#F0C96A;flex:none}
h1{font-weight:800;font-size:clamp(2.5rem,5.2vw,4.2rem);line-height:1.06;letter-spacing:-.025em;max-width:15ch;margin-bottom:22px;color:#FAFAF7}
h1 em{font-family:var(--serif);font-style:italic;font-weight:600;color:#F0C96A;letter-spacing:-.01em}
.sweep{width:230px;height:6px;margin:2px 0 26px}
.sweep span{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#F0C96A,rgba(240,201,106,0));transform:skewX(-32deg);transform-origin:left center}
.hero-sub{font-size:1.12rem;color:rgba(255,255,255,.78);max-width:38ch;margin-bottom:34px}
.hero-actions{display:flex;flex-wrap:wrap;gap:13px;margin-bottom:40px}
.hero-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:760px}
.hcard{display:flex;align-items:center;gap:13px;background:rgba(23,28,32,.82);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:16px 18px;box-shadow:0 10px 26px rgba(0,0,0,.35)}
.hcard .ic{width:40px;height:40px;border-radius:12px;background:rgba(240,201,106,.14);display:grid;place-items:center;flex:none}
.hcard .ic svg{width:20px;height:20px;stroke:#F0C96A}
.hcard .t{font-weight:700;font-size:.92rem;line-height:1.3;color:#FAFAF7}
.hcard .d{font-size:.78rem;color:rgba(255,255,255,.6);line-height:1.35}
@media (prefers-reduced-motion:no-preference){
  .hero .pill,.hero h1,.hero .sweep,.hero-sub,.hero-actions,.hero-cards{animation:rise .8s cubic-bezier(.2,.7,.3,1) both}
  .hero h1{animation-delay:.1s}.hero .sweep{animation-delay:.18s}.hero-sub{animation-delay:.2s}.hero-actions{animation-delay:.3s}.hero-cards{animation-delay:.42s}
  @keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
}

/* ============ Sektionen ============ */
.section{padding:96px 0}
.section.tint{background:var(--tint)}
.sec-head{max-width:680px;margin-bottom:50px}
.sec-head.center{margin:0 auto 50px;text-align:center}
.kicker{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:16px}
.kicker::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--amber)}
.sec-head.center .kicker::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--amber)}
h2{font-weight:800;font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.12;letter-spacing:-.022em}
h2 em{font-family:var(--serif);font-style:italic;font-weight:600;color:var(--green);letter-spacing:-.01em}
.sec-head>p{color:var(--soft);margin-top:14px;font-size:1.04rem}

/* ============ Leistungen ============ */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:32px 30px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s}
.svc:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:rgba(28,33,38,.25)}
.svc-icon{width:54px;height:54px;border-radius:16px;background:var(--green-soft);display:grid;place-items:center;margin-bottom:20px}
.svc-icon svg{width:26px;height:26px;stroke:var(--green)}
.svc h3{font-size:1.14rem;font-weight:800;letter-spacing:-.01em;margin-bottom:8px}
.svc p{color:var(--soft);font-size:.93rem}
.svc.has-media{padding:0;overflow:hidden}
.svc.has-media .svc-body{padding:24px 30px 32px}
.svc-media{position:relative;display:flex;aspect-ratio:16/10}
.svc-media img{width:100%;height:100%;object-fit:cover;display:block}
.svc-media .ba{position:relative;flex:1;min-width:0}
.svc-media .ba+.ba{border-left:3px solid var(--card)}
.svc-media .pill{position:absolute;left:12px;bottom:12px}

/* ============ Ablauf ============ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:32px 28px;position:relative;transition:transform .3s,box-shadow .3s}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.step-num{width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;font-weight:800;font-size:1.05rem;display:grid;place-items:center;margin-bottom:20px;box-shadow:0 8px 18px rgba(28,33,38,.28)}
.step h3{font-size:1.08rem;font-weight:800;letter-spacing:-.01em;margin-bottom:8px}
.step p{color:var(--soft);font-size:.9rem}

/* ============ Pauschalen ============ */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.price-card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:38px 32px 34px;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}
.price-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.price-card.featured{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 24px 54px rgba(28,33,38,.35)}
.badge{position:absolute;top:-15px;left:50%;transform:translateX(-50%);background:#F0C96A;color:#1F2326;font-size:.72rem;font-weight:800;letter-spacing:.06em;padding:.45rem 1.1rem;border-radius:99px;white-space:nowrap;box-shadow:0 8px 18px rgba(201,147,47,.35)}
.price-card h3{font-size:1.28rem;font-weight:800;letter-spacing:-.01em}
.price-card .sub{color:var(--soft);font-size:.88rem;margin:5px 0 24px}
.price-card.featured .sub{color:rgba(255,255,255,.7)}
.price-val{font-weight:800;font-size:2.5rem;letter-spacing:-.03em;margin-bottom:26px;line-height:1.05}
.price-val small{display:block;font-size:.95rem;font-weight:600;color:var(--soft);margin-bottom:6px;letter-spacing:0}
.price-card.featured .price-val small{color:rgba(255,255,255,.65)}
.price-val .cur{color:var(--green)}
.price-card.featured .price-val .cur{color:#F0C96A}
.price-card ul{list-style:none;margin-bottom:30px}
.price-card li{display:flex;gap:11px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.92rem;color:var(--ink-2);align-items:flex-start}
.price-card li:last-child{border-bottom:none}
.price-card.featured li{border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.85)}
.price-card li svg{width:17px;height:17px;stroke:var(--green);flex:none;margin-top:4px}
.price-card.featured li svg{stroke:#F0C96A}
.price-card .btn{margin-top:auto;width:100%}
.price-note{text-align:center;font-size:.8rem;color:var(--soft);margin-top:24px}
.form-hinweis{border-radius:14px;padding:14px 18px;font-size:.92rem;line-height:1.5;margin:0 0 18px}
.form-hinweis.ok{background:#EAF5EE;color:#1E5B35;border:1px solid #BFE0CB}
.form-hinweis.fehler{background:#FBEDEA;color:#8C3223;border:1px solid #EFC9C0}
.form-hinweis a{color:inherit;font-weight:800}

/* ============ Warum ============ */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.why{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;transition:transform .3s,box-shadow .3s}
.why:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.why .ic{width:48px;height:48px;border-radius:50%;background:var(--amber-soft);display:grid;place-items:center;margin-bottom:16px}
.why .ic svg{width:23px;height:23px;stroke:var(--amber)}
.why h3{font-size:1.02rem;font-weight:800;letter-spacing:-.01em;margin-bottom:7px}
.why p{font-size:.89rem;color:var(--soft)}


/* ============ Galerie ============ */
.tag{font-size:.64rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:.38rem .8rem;border-radius:99px;flex:none}
.tag-vorher{background:var(--ink);color:#fff}
.tag-nachher{background:#F0C96A;color:#1F2326}

/* ============ Festpreis-Band ============ */
.cta-band{background:linear-gradient(135deg,var(--green) 0%,var(--green-deep) 100%);color:#fff;padding:100px 0;position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;top:-160px;right:-120px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.09),transparent 65%)}
.cta-band::after{content:"";position:absolute;bottom:-180px;left:-100px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(201,147,47,.18),transparent 60%)}
.band-inner{position:relative;z-index:1;text-align:center;max-width:720px;margin:0 auto}
.band-inner .kicker{color:#F0C96A;justify-content:center}
.band-inner .kicker::before{background:#F0C96A}
.band-inner h2{color:#fff}
.band-inner p.lede{color:rgba(255,255,255,.75);margin:16px auto 34px;font-size:1.06rem;max-width:52ch}
.band-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.band-mini{margin-top:26px;font-size:.85rem;color:rgba(255,255,255,.6)}

/* ============ FAQ ============ */
.faq-list{max-width:780px;margin:0 auto}
.faq{background:var(--card);border:1px solid var(--line);border-radius:16px;margin-bottom:12px;overflow:hidden;transition:box-shadow .25s,border-color .25s}
.faq.open{box-shadow:var(--shadow);border-color:rgba(28,33,38,.3)}
.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;background:none;border:none;cursor:pointer;text-align:left;font-family:var(--font);font-weight:700;font-size:1rem;color:var(--ink);padding:19px 24px}
.faq-q .plus{flex:none;width:30px;height:30px;border-radius:50%;background:var(--green-soft);display:grid;place-items:center;transition:background .25s}
.faq-q .plus svg{width:14px;height:14px;stroke:var(--green);transition:transform .3s}
.faq-q[aria-expanded="true"] .plus{background:var(--green)}
.faq-q[aria-expanded="true"] .plus svg{stroke:#fff;transform:rotate(45deg)}
.faq-a{overflow:hidden;transition:max-height .35s ease}
.js .faq-a{max-height:0}
.faq-a p{padding:0 24px 22px;color:var(--soft);font-size:.95rem}

/* ============ Kontakt ============ */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:stretch}
.form-card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:40px 38px;box-shadow:var(--shadow)}
.form-card h3{font-size:1.3rem;font-weight:800;letter-spacing:-.015em;margin-bottom:6px}
.form-card>p{color:var(--soft);font-size:.9rem;margin-bottom:26px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);margin-bottom:7px}
.field label b{color:var(--amber)}
.field input,.field select,.field textarea{width:100%;font-family:var(--font);font-size:.96rem;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:13px;padding:.85rem 1rem;transition:border-color .25s,box-shadow .25s,background .25s}
.field textarea{resize:vertical;min-height:96px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);background:#fff;box-shadow:0 0 0 4px var(--green-soft)}
.field .err{display:none;color:#B3401F;font-size:.79rem;margin-top:6px}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#B3401F}
.field.invalid .err{display:block}
.consent{display:flex;gap:11px;align-items:flex-start;margin:4px 0 20px}
.consent input{width:19px;height:19px;margin-top:2px;accent-color:var(--green);flex:none}
.consent label{font-size:.84rem;color:var(--soft);text-transform:none;letter-spacing:0;font-weight:500;margin:0}
.consent button{background:none;border:none;color:var(--green);text-decoration:underline;cursor:pointer;font-size:.84rem;padding:0;font-family:var(--font)}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.send-note{font-size:.83rem;color:var(--soft);margin-top:14px;text-align:center}
.form-success{display:none;background:var(--green-soft);border:1.5px solid var(--green);border-radius:14px;padding:16px 18px;margin-top:16px;font-size:.92rem;color:var(--green-deep)}
.form-success.show{display:block}
.contact-card{background:linear-gradient(160deg,var(--green) 0%,var(--green-dark) 100%);color:#fff;border-radius:24px;padding:40px 36px;position:relative;overflow:hidden;display:flex;flex-direction:column}
.contact-card::before{content:"";position:absolute;top:-100px;right:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.1),transparent 65%)}
.contact-card h3{font-size:1.35rem;font-weight:800;letter-spacing:-.015em;margin-bottom:22px;position:relative}
.c-line{display:flex;gap:14px;align-items:flex-start;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.14);position:relative}
.c-line:last-of-type{border-bottom:none}
.c-line .ic{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center;flex:none}
.c-line .ic svg{width:19px;height:19px;stroke:#F0C96A}
.c-line .t{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:3px}
.c-line .v{font-weight:700;font-size:.99rem}
.c-line .v a{color:#fff;text-decoration:none;transition:color .2s}
.c-line .v a:hover{color:#F0C96A}
.c-line .hint{font-size:.78rem;color:rgba(255,255,255,.55);font-weight:400}
.contact-card .btn{margin-top:auto;padding-top:1rem}
.contact-card .btn-inner{margin-top:26px;position:relative}

/* ============ Footer ============ */
footer{background:var(--green-dark);color:rgba(255,255,255,.72);padding:52px 0 32px}
.foot-top{display:flex;flex-wrap:wrap;gap:26px;align-items:center;justify-content:space-between;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
.foot-brand{display:flex;align-items:center;gap:12px;color:#fff}
.foot-brand img{height:52px;width:auto}
.foot-brand .n{font-weight:800;font-size:1.1rem}
.foot-brand .d{font-size:.74rem;color:rgba(255,255,255,.55)}
.foot-links{display:flex;gap:6px;flex-wrap:wrap}
.foot-links button,.foot-links a{background:none;border:none;color:rgba(255,255,255,.72);font-family:var(--font);font-size:.88rem;font-weight:600;cursor:pointer;text-decoration:none;padding:.5rem .9rem;border-radius:99px;transition:background .2s,color .2s}
.foot-links button:hover,.foot-links a:hover{background:rgba(255,255,255,.1);color:#fff}
.foot-legal{padding-top:24px;display:flex;justify-content:center;text-align:center;gap:14px;flex-wrap:wrap;font-size:.78rem;color:rgba(255,255,255,.66)}

/* ============ Dialoge ============ */
dialog{margin:auto;border:none;border-radius:22px;max-width:640px;width:92vw;padding:0;box-shadow:0 30px 80px rgba(0,0,0,.35)}
dialog::backdrop{background:rgba(28,33,38,.6);backdrop-filter:blur(4px)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;background:var(--green);color:#fff;padding:20px 26px;border-radius:22px 22px 0 0}
.dlg-head h3{font-weight:800;font-size:1.15rem;letter-spacing:-.01em}
.dlg-close{background:rgba(255,255,255,.14);border:none;color:#fff;width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:1rem;display:grid;place-items:center;transition:background .2s}
.dlg-close:hover{background:rgba(255,255,255,.28)}
.dlg-body{padding:26px;color:var(--ink-2);font-size:.93rem;max-height:60vh;overflow-y:auto}
.dlg-body h4{color:var(--ink);margin:18px 0 7px;font-weight:800}
.dlg-body h4:first-child{margin-top:0}
.dlg-body a{color:var(--amber-deep);text-decoration:underline}
.dlg-body .ph{background:var(--amber-soft);border:1.5px dashed var(--amber);border-radius:12px;padding:.75rem .95rem;margin:10px 0;font-size:.85rem;color:#7A5A14}

/* ============ Sonstiges ============ */
.to-top{position:fixed;right:24px;bottom:24px;width:48px;height:48px;border-radius:50%;background:var(--green);border:none;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s,background .2s;z-index:150}
.to-top{visibility:hidden}
.to-top.show{opacity:1;pointer-events:auto;visibility:visible}
.to-top:hover{transform:translateY(-3px);background:var(--green-deep)}
.to-top svg{width:20px;height:20px;stroke:#fff}

/* ============ Responsive ============ */
@media (max-width:1020px){
  .nav a{padding:.5rem .7rem}
  .hero-media{width:100%;opacity:.25}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .price-grid{grid-template-columns:1fr;max-width:540px;margin:0 auto}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .wrap{padding:0 20px}
  .nav{display:none;position:fixed;top:74px;left:0;right:0;background:rgb(28,33,38);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08);flex-direction:column;align-items:stretch;padding:12px 18px 18px;gap:2px;box-shadow:var(--shadow-lg)}
  .nav.open{display:flex}
  .nav a{padding:.9rem 1.1rem;font-size:1rem;border-radius:12px;color:rgba(255,255,255,.85)}
  .top-cta{margin-left:auto}
  .top-cta .btn span{display:none}
  .top-cta .btn{padding:.65rem .8rem}
  .burger{display:grid;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.3);border-radius:12px;width:46px;height:46px;cursor:pointer;place-items:center;flex:none}
  .burger svg{width:20px;height:20px;stroke:#FAFAF7}
  .burger[aria-expanded="true"] .i-open{display:none}
  .burger[aria-expanded="false"] .i-close{display:none}
  .section{padding:66px 0}
  .svc-grid,.steps,.why-grid,.hero-cards{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
  .hero-actions .btn{width:100%}
  .hero-media{width:100%;opacity:.2}
  .hero-inner{padding-top:110px;padding-bottom:56px}
  .form-card{padding:30px 24px}
  .contact-card{padding:30px 24px}
  .price-card.featured{transform:none}
}

/* Hero Desktop: dunkle Textzone breiter, Bildkante weich ausgeblendet, kein Schatten-Halo */
@media (min-width:1025px){
  .hero-media{width:48%}
  .hero-media::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#1C2126 0%,rgba(28,33,38,.55) 14%,rgba(28,33,38,0) 46%)}
  .hero h1{max-width:min(560px,40vw);text-shadow:none}
  .hero p{max-width:min(520px,38vw);text-shadow:none}
}

/* =====================================================================
   v2 – Erweiterungen: Animationen, Vorher/Nachher, Über uns, Einsatzgebiet
   ===================================================================== */
:root{--ease:cubic-bezier(.2,.7,.2,1)}

/* Kopfzeile wird beim Scrollen schlanker */
.topbar.scrolled .topbar-inner{height:62px}
.topbar.scrolled .brand img{height:38px}

/* Goldener Besenstrich unter jeder Überschrift – Motiv aus dem Logo */
.sec-head h2::after{content:"";display:block;width:96px;height:5px;margin-top:18px;border-radius:3px;
  background:linear-gradient(90deg,var(--amber),rgba(201,147,47,0));transform:skewX(-32deg);transform-origin:left center}
.sec-head.center h2::after{margin-left:auto;margin-right:auto;transform-origin:center}
.band-inner h2::after{content:"";display:block;width:96px;height:5px;margin:18px auto 0;border-radius:3px;background:linear-gradient(90deg,#F0C96A,rgba(240,201,106,0));transform:skewX(-32deg)}

/* Gold-Button: sanfter Lichtschimmer beim Überfahren */
.btn-gold{position:relative;overflow:hidden;isolation:isolate}
.btn-gold::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.btn-gold:hover::after{transform:translateX(120%)}
.btn:active{transform:translateY(0) scale(.98)}

/* Bilder in Leistungskarten: weicher Zoom */
.svc-media{overflow:hidden}
.svc-media>img{transition:transform 1.1s var(--ease)}
.svc:hover .svc-media>img{transform:scale(1.05)}

/* ---------- Vorher/Nachher-Slider ---------- */
.ba-slider{position:relative;display:block;user-select:none;touch-action:pan-y}
.ba-slider .ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0);z-index:1}
.ba-slider .tag{position:absolute;bottom:12px;z-index:3;pointer-events:none}
.ba-slider .tag-vorher{left:12px}
.ba-slider .tag-nachher{right:12px}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:3px;margin-left:-1.5px;background:#fff;z-index:2;pointer-events:none;box-shadow:0 0 12px rgba(0,0,0,.35)}
.ba-handle>span{position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3);transition:transform .25s var(--ease)}
.ba-handle svg{width:20px;height:20px;stroke:var(--ink)}
.ba-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:4;-webkit-appearance:none;appearance:none}
.ba-slider:hover .ba-handle>span,.ba-range:focus-visible~.ba-handle>span{transform:scale(1.12)}
.ba-range:focus-visible{opacity:0}
.ba-slider:has(.ba-range:focus-visible){outline:3px solid var(--amber);outline-offset:-3px}

/* ---------- Ablauf: Schritte füllen sich nacheinander ---------- */
.steps{position:relative}
.step:not(:last-child)::after{content:"";position:absolute;top:54px;right:-21px;width:22px;height:2px;background:var(--amber);transform:scaleX(1);transform-origin:left;z-index:1}

/* ---------- Über uns ---------- */
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.about-card{background:var(--green);color:#fff;border-radius:28px;padding:40px 34px 34px;text-align:center;position:relative;overflow:hidden;box-shadow:0 30px 60px rgba(28,33,38,.22)}
.about-card::before{content:"";position:absolute;left:-40px;right:-40px;top:118px;height:8px;background:linear-gradient(90deg,rgba(240,201,106,0),#F0C96A 50%,rgba(240,201,106,0));transform:skewY(-6deg);opacity:.45}
.monogram{width:168px;height:168px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#2B3238,#151A1E);border:2px solid rgba(240,201,106,.55);position:relative;z-index:1}
.monogram span{font-family:var(--serif);font-style:italic;font-weight:600;font-size:3.6rem;color:#F0C96A;letter-spacing:-.02em}
.about-photo{width:100%;max-width:320px;aspect-ratio:6/7;object-fit:cover;border-radius:20px;margin:0 auto 22px;position:relative;z-index:1}
.about-name{font-weight:800;font-size:1.3rem;position:relative;z-index:1}
.about-role{color:rgba(255,255,255,.65);font-size:.92rem;margin-bottom:24px;position:relative;z-index:1}
.about-card .btn{width:100%;position:relative;z-index:1}
.about-text .sec-head{margin-bottom:22px}
.about-lede{font-size:1.15rem;color:var(--ink);margin-bottom:14px;max-width:60ch}
.about-text>p{color:var(--soft);max-width:60ch}
.promise{list-style:none;margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:12px 22px}
.promise li{display:flex;gap:11px;align-items:flex-start;font-size:.95rem;color:var(--ink-2)}
.promise svg{width:22px;height:22px;flex:none;stroke:#fff;background:var(--amber);border-radius:50%;padding:4px;margin-top:1px}

/* ---------- Einsatzgebiet ---------- */
.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.city-list{display:grid;gap:10px}
.city{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 20px;text-decoration:none;transition:border-color .3s,transform .35s var(--ease),box-shadow .35s}
.city b{display:block;font-size:1.02rem}
.city small{display:block;color:var(--soft);font-size:.84rem}
.city .chev{width:20px;height:20px;stroke:var(--amber);flex:none;transition:transform .35s var(--ease)}
.city:hover{border-color:var(--amber);transform:translateX(4px);box-shadow:var(--shadow)}
.city:hover .chev{transform:translateX(4px)}
.map-card{background:var(--green);border-radius:28px;padding:26px 22px 18px;box-shadow:0 30px 60px rgba(28,33,38,.22)}
.map{width:100%;height:auto;overflow:visible}
.map .hills ellipse{fill:none;stroke:rgba(255,255,255,.07);stroke-width:1.2}
.map .route{fill:none;stroke:#F0C96A;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.map .route-minor{stroke:rgba(240,201,106,.35);stroke-width:2;stroke-dasharray:4 6}
.map .town circle{fill:#1C2126;stroke:#F0C96A;stroke-width:2.5}
.map .town text{fill:rgba(255,255,255,.6);font-family:var(--font);font-size:12px;font-weight:600}
.map .town.main circle{fill:#F0C96A;stroke:#1C2126}
.map .town.main text{fill:#fff;font-size:14px;font-weight:800}
.map a:hover .town circle,.map a:focus-visible .town circle{fill:#fff}
.map a:hover text{fill:#F0C96A}
.home-pulse{fill:none;stroke:#F0C96A;stroke-width:2;transform-box:fill-box;transform-origin:center}
.map-note{display:flex;align-items:center;gap:8px;justify-content:center;color:rgba(255,255,255,.6);font-size:.82rem;margin-top:6px}
.home-dot{width:10px;height:10px;border-radius:50%;background:#F0C96A;box-shadow:0 0 0 4px rgba(240,201,106,.25)}

/* ---------- Footer-Städte ---------- */
.foot-cities{display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:center;padding-top:22px;font-size:.84rem;color:rgba(255,255,255,.66)}
.foot-cities a{color:rgba(255,255,255,.75);text-decoration:none}
.foot-cities a:hover{color:#F0C96A}

/* ---------- Mobile Aktionsleiste ---------- */
.action-bar{display:none}
@media (max-width:760px){
  .action-bar{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:180;
    transform:translateY(140%);transition:transform .5s var(--ease)}
  .action-bar{visibility:hidden;transition:transform .5s var(--ease),visibility 0s .5s}
  .action-bar.show{transform:none;visibility:visible;transition:transform .5s var(--ease),visibility 0s}
  .action-bar a{display:flex;align-items:center;justify-content:center;gap:9px;padding:15px 10px;border-radius:16px;font-weight:800;font-size:1rem;text-decoration:none;box-shadow:0 12px 30px rgba(0,0,0,.28)}
  .action-bar svg{width:20px;height:20px;stroke:currentColor}
  .ab-call{background:#F0C96A;color:#1F2326}
  .ab-wa{background:#1C2126;color:#fff;border:1px solid rgba(255,255,255,.18)}
  .to-top{bottom:92px;right:16px;width:44px;height:44px}
  footer{padding-bottom:110px}
  .about-grid,.area-grid{grid-template-columns:1fr;gap:34px}
  .promise{grid-template-columns:1fr}
  .monogram{width:132px;height:132px}
  .monogram span{font-size:2.8rem}
  .step:not(:last-child)::after{top:auto;bottom:-21px;left:50px;right:auto;width:2px;height:22px;transform-origin:top}
  .hero-media{opacity:.3}
}
@media (min-width:761px) and (max-width:1020px){
  .about-grid{grid-template-columns:1fr 1.3fr;gap:36px}
  .area-grid{grid-template-columns:1fr;gap:34px}
  .step:nth-child(2n)::after{display:none}
}

/* =====================================================================
   Bewegung – nur wenn JS aktiv und keine reduzierte Bewegung gewünscht
   ===================================================================== */
@media (prefers-reduced-motion:no-preference){
  .js .sweep span{animation:sweep 1s .35s var(--ease) both}
  @keyframes sweep{from{transform:skewX(-32deg) scaleX(0)}to{transform:skewX(-32deg) scaleX(1)}}

  .js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--d,0) * 90ms)}
  .js [data-reveal].is-in{opacity:1;transform:none}
  .js .svc[data-reveal].is-in:hover,.js .step[data-reveal].is-in:hover,.js .why[data-reveal].is-in:hover{transition-delay:0s}
  .js .svc[data-reveal].is-in:hover{transform:translateY(-5px)}
  .js .step[data-reveal].is-in:hover,.js .why[data-reveal].is-in:hover{transform:translateY(-4px)}
  .js .price-card[data-reveal].is-in:hover{transform:translateY(-6px);transition-delay:0s}

  .js .sec-head h2::after{transform:skewX(-32deg) scaleX(0);transition:transform 1s .25s var(--ease)}
  .js .sec-head.is-in h2::after{transform:skewX(-32deg) scaleX(1)}

  .js .step-num{background:transparent;color:var(--soft);box-shadow:inset 0 0 0 2px var(--line);transition:background .5s var(--ease),color .5s,box-shadow .5s;transition-delay:calc(var(--d,0) * 260ms + 300ms)}
  .js .step.is-in .step-num{background:var(--green);color:#fff;box-shadow:0 8px 18px rgba(28,33,38,.28)}
  .js .step:not(:last-child)::after{transform:scaleX(0);transition:transform .5s var(--ease);transition-delay:calc(var(--d,0) * 260ms + 500ms)}
  .js .step.is-in:not(:last-child)::after{transform:scaleX(1)}
  @media (max-width:760px){
    .js .step:not(:last-child)::after{transform:scaleY(0)}
    .js .step.is-in:not(:last-child)::after{transform:scaleY(1)}
  }

  .js .map .route:not(.route-minor){stroke-dashoffset:1;transition:stroke-dashoffset 2s .3s cubic-bezier(.6,.1,.3,1)}
  .js .map-card.is-in .route:not(.route-minor){stroke-dashoffset:0}
  .js .map .route-minor{opacity:0;transition:opacity 1s 1.8s}
  .js .map-card.is-in .route-minor{opacity:1}
  .js .map .town{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;transition:opacity .5s var(--ease),transform .6s cubic-bezier(.3,1.6,.5,1);transition-delay:calc(var(--i) * 180ms + 400ms)}
  .js .map-card.is-in .town{opacity:1;transform:none}
  .home-pulse{animation:pulse 2.4s 2.4s ease-out infinite;opacity:0}
  @keyframes pulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(3.2)}}

  .faq-a p{transition:opacity .4s .1s,transform .4s .1s var(--ease)}
  .js .faq:not(.open) .faq-a p{opacity:0;transform:translateY(-6px)}
  .form-hinweis:not([hidden]){animation:pop .6s var(--ease)}
  @keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
}
/* Feine Kante am Hero-Bild vermeiden (Parallax-Ebene) */
.hero-media{will-change:transform}
.hero-media::before{left:-2px!important}

/* ---------- Städteseiten ---------- */
.page-hero{min-height:auto}
.page-hero .hero-inner{padding-top:150px;padding-bottom:90px}

.crumbs{display:flex;gap:10px;flex-wrap:wrap;font-size:.86rem;color:rgba(255,255,255,.55);margin-bottom:22px}
.crumbs a{color:rgba(255,255,255,.8);text-decoration:none}
.crumbs a:hover{color:#F0C96A}
.local-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:start}
.local-p{color:var(--ink-2);margin-bottom:14px;max-width:62ch;font-size:1.03rem}
.text-link{color:var(--ink);font-weight:700;text-decoration-color:var(--amber);text-underline-offset:4px;text-decoration-thickness:2px}
.parts-card{background:var(--green);color:#fff;border-radius:24px;padding:32px 30px;box-shadow:0 30px 60px rgba(28,33,38,.2)}
.parts-card h3{font-size:1.15rem;font-weight:800;margin-bottom:18px}
.local-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.local-list li{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:99px;padding:.4rem .85rem;font-size:.86rem;font-weight:600}
.parts-note{margin-top:16px;font-size:.84rem;color:rgba(255,255,255,.55)}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.info-item{display:flex;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;text-decoration:none;transition:border-color .3s,box-shadow .35s}
.info-item:hover{border-color:var(--amber);box-shadow:var(--shadow)}
.info-item svg{width:26px;height:26px;flex:none;stroke:#fff;background:var(--amber);border-radius:50%;padding:5px}
.info-item b{display:block}
.info-item small{color:var(--soft);font-size:.86rem}
.city-list-row{grid-template-columns:repeat(3,1fr);max-width:980px;margin:0 auto}
@media (max-width:1020px){
  .local-grid{grid-template-columns:1fr;gap:34px}
  .info-grid{grid-template-columns:repeat(2,1fr)}
  .city-list-row{grid-template-columns:1fr}
}
@media (max-width:760px){
  .info-grid{grid-template-columns:1fr}
  .page-hero .hero-inner{padding-top:120px;padding-bottom:64px}
}

/* Illustrationen */
.hero-media img{object-position:center 62%}
.svc-media img{background:#F2F0EA}
@media (max-width:1020px){ .hero-media{opacity:.25!important} }

/* Hinweis Symbolbilder */
.img-note{text-align:center;font-size:.8rem;color:var(--soft);margin-top:18px}

/* ---------- Rechtstexte & 404 ---------- */
.legal-wrap{padding-top:140px}
.legal{max-width:780px}
.legal h1{color:var(--ink);font-size:clamp(2rem,4vw,2.8rem);max-width:none;margin-bottom:18px}
.legal h1::after{content:"";display:block;width:96px;height:5px;margin-top:16px;border-radius:3px;background:linear-gradient(90deg,var(--amber),rgba(201,147,47,0));transform:skewX(-32deg)}
.legal h2{font-size:1.25rem;font-weight:800;margin:36px 0 10px;letter-spacing:-.01em}
.legal p,.legal li{color:var(--ink-2);margin-bottom:12px;max-width:68ch}
.legal ul{padding-left:1.2rem;margin-bottom:12px}
.legal a:not(.btn){color:var(--ink);font-weight:700;text-decoration-color:var(--amber);text-underline-offset:3px;text-decoration-thickness:2px}
.legal-lede{font-size:1.1rem}
.legal-box{background:var(--tint);border-left:4px solid var(--amber);border-radius:0 12px 12px 0;padding:14px 18px}
.legal-date{margin-top:36px;font-size:.88rem;color:var(--soft)!important}
.legal .btn{margin:6px 8px 6px 0}
@media (max-width:760px){.legal-wrap{padding-top:110px}}

/* =====================================================================
   v4 – Neuaufbau: größere Schrift, Situationen, Garantien, Formular in Schritten, Ratgeber
   ===================================================================== */
html{font-size:106.25%}            /* 17 px Grundschrift – besser lesbar für ältere Besucher */
body{line-height:1.7}
.svc p,.step p,.why p,.city small,.info-item small,.faq-a p{font-size:.98rem}
.hero-sub{font-size:1.18rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.btn-lg{padding:1.1rem 1.9rem;font-size:1.05rem}
.btn svg{width:20px;height:20px;stroke:currentColor;flex:none}
.hero-alt{margin:-22px 0 34px;color:rgba(255,255,255,.75);font-size:.98rem}
.hero-alt a{color:#F0C96A;font-weight:700;text-underline-offset:4px}
.page-hero .hero-alt{margin:16px 0 0}
.center-link{text-align:center;margin-top:28px}
.nav a[aria-current="page"]{color:#F0C96A;background:rgba(240,201,106,.12)}

/* ---------- Situationen ---------- */
.sit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sit-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:30px 28px;text-decoration:none;transition:border-color .3s,box-shadow .35s,transform .35s var(--ease)}
.sit-card:hover{border-color:var(--amber);box-shadow:var(--shadow-lg)}
.js .sit-card[data-reveal].is-in:hover{transform:translateY(-4px);transition-delay:0s}
.sit-ic{width:52px;height:52px;border-radius:16px;background:var(--amber-soft);display:grid;place-items:center;margin-bottom:18px}
.sit-ic svg{width:26px;height:26px;stroke:var(--amber-deep)}
.sit-card h3{font-size:1.18rem;font-weight:800;letter-spacing:-.01em;margin-bottom:8px}
.sit-card p{color:var(--soft);font-size:.98rem;margin-bottom:18px}
.sit-more{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.95rem;color:var(--ink)}
.sit-more svg{width:18px;height:18px;stroke:var(--amber);transition:transform .3s var(--ease)}
.sit-card:hover .sit-more svg,.art-card:hover .sit-more svg{transform:translateX(4px)}

/* ---------- Garantien ---------- */
.g-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.g-card{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:30px 26px;position:relative;overflow:hidden}
.g-card::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:linear-gradient(90deg,var(--amber),#F0C96A)}
.g-ic{width:50px;height:50px;border-radius:50%;background:var(--green);display:grid;place-items:center;margin-bottom:16px}
.g-ic svg{width:24px;height:24px;stroke:#F0C96A}
.g-card h3{font-size:1.1rem;font-weight:800;margin-bottom:6px}
.g-card p{color:var(--soft);font-size:.96rem}

.steps-3{grid-template-columns:repeat(3,1fr)}

/* ---------- Was mit Ihren Sachen passiert ---------- */
.flow{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:f}
.flow-item{position:relative;text-align:center;padding:10px 12px}
.flow-item:not(:last-child)::after{content:"";position:absolute;top:38px;left:calc(50% + 46px);right:calc(-50% + 46px);height:2px;background:repeating-linear-gradient(90deg,var(--amber) 0 6px,transparent 6px 12px)}
.flow-ic{width:76px;height:76px;margin:0 auto 16px;border-radius:50%;background:var(--tint);border:2px solid var(--line);display:grid;place-items:center;transition:background .4s,border-color .4s}
.flow-ic svg{width:32px;height:32px;stroke:var(--ink)}
.flow-item:hover .flow-ic{background:var(--amber-soft);border-color:var(--amber)}
.flow-item h3{font-size:1.08rem;font-weight:800;margin-bottom:6px}
.flow-item p{color:var(--soft);font-size:.96rem}

/* ---------- Ratgeber-Karten ---------- */
.art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.art-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:28px;text-decoration:none;transition:border-color .3s,box-shadow .35s}
.art-card:hover{border-color:var(--amber);box-shadow:var(--shadow-lg)}
.art-ic{width:44px;height:44px;border-radius:12px;background:var(--green-soft);display:grid;place-items:center;margin-bottom:16px}
.art-ic svg{width:22px;height:22px;stroke:var(--ink)}
.art-card h3,.art-card h2{font-size:1.15rem;font-weight:800;line-height:1.3;margin-bottom:8px}
.art-card p{color:var(--soft);font-size:.96rem;margin-bottom:16px}

/* ---------- Kontakt-Karte (neu) ---------- */
.c-big{display:flex;gap:14px;align-items:center;padding:16px;margin-bottom:10px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);text-decoration:none;color:#fff;position:relative;transition:background .25s,border-color .25s}
.c-big:hover{background:rgba(240,201,106,.12);border-color:rgba(240,201,106,.5)}
.c-big .ic{width:44px;height:44px;border-radius:12px;background:rgba(240,201,106,.15);display:grid;place-items:center;flex:none}
.c-big .ic svg{width:22px;height:22px;stroke:#F0C96A}
.c-big b{display:block;font-size:1.02rem;word-break:break-word}
.c-big small{display:block;color:rgba(255,255,255,.65);font-size:.86rem}
.contact-card .c-line{margin-top:8px}

/* ---------- Formular in Schritten ---------- */
.msform fieldset{border:0;padding:0;margin:0;min-width:0}
.msform legend{font-size:1.3rem;font-weight:800;letter-spacing:-.01em;margin-bottom:18px;padding:0;outline:none}
.ms-head{margin-bottom:26px}
.ms-steps{list-style:none;display:flex;justify-content:space-between;margin-bottom:10px;font-size:.88rem;font-weight:700;color:var(--soft)}
.ms-steps li{counter-increment:ms;display:flex;align-items:center;gap:8px}
.ms-steps li::before{content:counter(ms);width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--tint);border:2px solid var(--line);font-size:.8rem;transition:background .3s,border-color .3s,color .3s}
.ms-steps li.is-cur,.ms-steps li.is-done{color:var(--ink)}
.ms-steps li.is-cur::before{background:#F0C96A;border-color:#F0C96A;color:#1F2326}
.ms-steps li.is-done::before{background:var(--green);border-color:var(--green);color:#fff}
.ms-progress{height:6px;border-radius:3px;background:var(--tint);overflow:hidden}
.ms-bar{display:block;height:100%;width:33.33%;background:linear-gradient(90deg,var(--amber),#F0C96A);border-radius:3px;transition:width .5s var(--ease)}
.ms-step+.ms-step{margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}
.js .ms-head{display:block}
.ms-head{display:none}
.js .ms-step{display:none;margin-top:0;padding-top:0;border-top:0}
.js .ms-step.is-active{display:block;animation:stepIn .45s var(--ease)}
@keyframes stepIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.ms-nav{display:none;gap:12px;justify-content:space-between;margin-top:22px}
.js .ms-nav{display:flex}
.ms-nav .btn{flex:1}
.ms-nav .ms-next:only-child{flex:none;margin-left:auto;min-width:50%}
.ms-submit{display:inline-flex}
html:not(.js) .ms-step[data-step="3"] .ms-nav{display:flex}
html:not(.js) .ms-step[data-step="3"] .ms-back{display:none}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;min-height:118px;padding:16px 10px;border:2px solid var(--line);border-radius:16px;background:var(--bg);cursor:pointer;font-weight:700;font-size:.95rem;line-height:1.3;transition:border-color .25s,background .25s,transform .25s var(--ease)}
.tile input{position:absolute;opacity:0;inset:0;cursor:pointer}
.tile-ic svg{width:30px;height:30px;stroke:var(--ink)}
.tile:hover{border-color:rgba(201,147,47,.6)}
.tile:has(input:checked){border-color:var(--amber);background:var(--amber-soft)}
.tile:has(input:checked) .tile-ic svg{stroke:var(--amber-deep)}
.tile:has(input:focus-visible){outline:3px solid var(--amber);outline-offset:2px}
.tile:active{transform:scale(.98)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip span{display:inline-block;padding:.55rem 1rem;border:1.5px solid var(--line);border-radius:99px;background:var(--bg);font-size:.92rem;font-weight:600;transition:border-color .2s,background .2s}
.chip:hover span{border-color:rgba(201,147,47,.6)}
.chip input:checked+span{border-color:var(--amber);background:var(--amber-soft)}
.chip input:focus-visible+span{outline:3px solid var(--amber);outline-offset:2px}
.label-like{display:block;font-size:.82rem;font-weight:700;letter-spacing:.02em;color:var(--soft);margin-bottom:9px}
.field label{text-transform:none;letter-spacing:.01em;font-size:.88rem}
.opt{font-weight:500;color:var(--soft)}
.hint{font-size:.86rem;color:var(--soft);margin-top:8px}
.field.group.invalid .tiles .tile{border-color:#E7B4A6}
.group.invalid .err{display:block}
.consent label a{color:var(--ink);font-weight:700}
.consent b{color:var(--amber)}
.consent .err{display:none;flex-basis:100%;margin:6px 0 0 30px;color:#B3401F;font-size:.84rem}
.consent{flex-wrap:wrap}
.consent.invalid .err{display:block}

/* ---------- Situations-Seiten ---------- */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.worries{list-style:none;display:grid;gap:12px}
.worries li{position:relative;background:var(--tint);border-radius:16px;padding:18px 20px 18px 54px;font-size:1.05rem;color:var(--ink-2);font-style:italic}
.q-mark{position:absolute;left:18px;top:6px;font-family:var(--serif);font-size:2.6rem;color:var(--amber);line-height:1;font-style:normal}
.worries-after{margin-top:18px;font-weight:700;color:var(--ink)}
.how-list{display:grid;gap:16px}
.how-item{display:flex;gap:14px;align-items:flex-start}
.how-ic{width:30px;height:30px;border-radius:50%;background:var(--amber);display:grid;place-items:center;flex:none;margin-top:2px}
.how-ic svg{width:17px;height:17px;stroke:#fff}
.how-item h3{font-size:1.08rem;font-weight:800;margin-bottom:3px}
.how-item p{color:var(--soft);font-size:.98rem}
.tip-box{margin-top:26px;background:var(--green);color:#fff;border-radius:20px;padding:24px 26px}
.tip-box h3{font-size:1.08rem;font-weight:800;margin-bottom:6px;color:#F0C96A}
.tip-box p{color:rgba(255,255,255,.82);font-size:.98rem;margin-bottom:12px}
.tip-box p:last-child{margin-bottom:0}
.tip-box a:not(.btn){color:#F0C96A;font-weight:700}
.tip-box .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.tip-box .btn-ghost:hover{background:#fff;color:var(--ink)}
.city-list-4{grid-template-columns:repeat(2,1fr);max-width:900px}
.city-list-2{grid-template-columns:repeat(2,1fr);max-width:900px}

/* ---------- Preise-Seite ---------- */
.incl{list-style:none;display:grid;gap:10px}
.incl li{display:flex;gap:12px;align-items:flex-start;font-size:1.02rem;color:var(--ink-2)}
.incl svg{width:24px;height:24px;flex:none;stroke:#fff;background:var(--amber);border-radius:50%;padding:4px;margin-top:2px}
.fac-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.fac{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px 20px}
.fac h3{font-size:1.04rem;font-weight:800;margin-bottom:4px}
.fac p{color:var(--soft);font-size:.94rem}

/* ---------- Artikel ---------- */
.page-h1{color:var(--ink)!important;font-size:clamp(2rem,4.2vw,2.9rem)!important;max-width:24ch!important;margin-bottom:14px}
.crumbs-light{color:var(--soft)}
.crumbs-light a{color:var(--ink)}
.article{max-width:780px}
.art-meta{color:var(--soft);font-size:.92rem;margin-bottom:28px}
.art-lede{font-size:1.2rem;color:var(--ink);margin-bottom:10px}
.article h2{font-size:1.4rem;font-weight:800;margin:38px 0 12px;letter-spacing:-.01em}
.article p,.article li{color:var(--ink-2);margin-bottom:12px}
.article ul{padding-left:1.3rem;margin-bottom:14px}
.article li::marker{color:var(--amber)}
.article a:not(.btn){color:var(--ink);font-weight:700;text-decoration-color:var(--amber);text-underline-offset:3px;text-decoration-thickness:2px}
.art-note{margin-top:30px;padding:14px 18px;border-left:4px solid var(--amber);background:var(--tint);border-radius:0 12px 12px 0;font-size:.92rem}
.art-table{overflow-x:auto;margin:6px 0 16px}
.art-table table{width:100%;border-collapse:collapse;font-size:1rem}
.art-table th,.art-table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}
.art-table th{background:var(--tint);font-weight:800}
.art-table td:last-child{font-weight:800;white-space:nowrap}
.art-cta{margin-top:44px;background:var(--green);color:#fff;border-radius:24px;padding:30px}
.art-cta h2{color:#fff;margin-top:0!important}
.art-cta p{color:rgba(255,255,255,.8)!important}
.art-cta .btn{margin:6px 8px 0 0}
.art-cta .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

/* ---------- Footer (neu) ---------- */
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.12)}
.foot-about img{height:52px;width:auto;margin-bottom:14px}
.foot-about p{font-size:.92rem;color:rgba(255,255,255,.72);max-width:34ch}
.foot-contact{display:grid;gap:8px;margin-top:14px}
.foot-contact a{display:inline-flex;align-items:center;gap:9px;color:#fff;text-decoration:none;font-weight:700;font-size:.95rem}
.foot-contact a:hover{color:#F0C96A}
.foot-contact svg{width:18px;height:18px;stroke:#F0C96A}
.foot-h{font-weight:800;color:#fff;margin-bottom:12px;font-size:1rem}
.foot-col ul{list-style:none;display:grid;gap:8px}
.foot-col a{color:rgba(255,255,255,.75);text-decoration:none;font-size:.93rem}
.foot-col ul a:hover{color:#F0C96A}
.foot-legal{justify-content:space-between;text-align:left}
.foot-legal a{color:rgba(255,255,255,.8);text-decoration:none;margin-left:14px}
.foot-legal a:hover{color:#F0C96A}

/* ---------- Responsive (neu) ---------- */
@media (max-width:1020px){
  .sit-grid,.art-grid{grid-template-columns:repeat(2,1fr)}
  .g-grid{grid-template-columns:repeat(2,1fr)}
  .flow{grid-template-columns:repeat(2,1fr);row-gap:30px}
  .flow-item:nth-child(2n)::after{display:none}
  .fac-grid{grid-template-columns:repeat(3,1fr)}
  .two-col{grid-template-columns:1fr;gap:40px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .steps-3{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:760px){
  .sit-grid,.art-grid,.g-grid,.steps-3{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .flow-item::after{display:none}
  .fac-grid{grid-template-columns:1fr 1fr}
  .tiles{grid-template-columns:1fr 1fr}
  .tile{min-height:100px}
  .city-list-4,.city-list-2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:26px}
  .foot-legal{flex-direction:column;align-items:center;text-align:center}
  .hero-alt{margin:-26px 0 30px}
  .hero-actions .btn-lg{width:100%}
  .ms-steps{font-size:.8rem}
}
@media (max-width:420px){ .fac-grid{grid-template-columns:1fr} }
@media (min-width:761px) and (max-width:1020px){ .steps-3 .step:nth-child(2n)::after{display:block} }
/* Korrekturen */
.hero-media{overflow:hidden}
.field .tile{display:flex;margin:0;font-size:.95rem;font-weight:700;color:var(--ink);letter-spacing:0}
.field .chip{display:inline-block;margin:0;font-size:inherit;color:var(--ink)}
.consent{flex-wrap:nowrap;align-items:flex-start}
.consent label{flex:1 1 0;min-width:0;display:block;margin:0}
.consent .err{position:absolute;left:30px;bottom:-24px;margin:0}
.consent{position:relative}
.consent.invalid{margin-bottom:34px}
.next-steps{list-style:none;counter-reset:n;margin-top:16px;display:grid;gap:10px}
.next-steps li{counter-increment:n;display:flex;gap:10px;align-items:flex-start;color:#1E5B35}
.next-steps li::before{content:counter(n);flex:none;width:24px;height:24px;border-radius:50%;background:#1E5B35;color:#fff;font-weight:800;font-size:.8rem;display:grid;place-items:center;margin-top:2px}
.form-hinweis.ok{padding:22px 24px}
.page-hero h1{font-size:clamp(2.1rem,3.9vw,3.3rem)}
