*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--surface);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:1.125rem;line-height:1.65;overflow-wrap:anywhere}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:var(--brand);text-underline-offset:.2em;text-decoration-thickness:.08em}
a:hover{text-decoration-thickness:.14em}
a:focus-visible,button:focus-visible{outline:3px solid var(--brand-dark);outline-offset:3px}
p{max-width:70ch;margin:0 0 1.15rem}
h1,h2,h3{margin:0 0 1rem;line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
h1{font-size:clamp(2.75rem,8vw,5rem);max-width:14ch}
h2{font-size:clamp(1.85rem,4.5vw,2.8rem)}
h3{font-size:1.35rem}
.sprungziel{scroll-margin-top:7rem}
.demo-only{display:none}
body.is-demo .demo-only{display:revert}
.entwurfsband{position:relative;z-index:1100;background:var(--brand-dark);color:var(--on-brand);padding:.45rem 1rem;text-align:center;font-size:.8rem;letter-spacing:.02em}
.bv-kopf{position:relative;z-index:900;background:var(--surface);border-bottom:1px solid var(--border)}
.bv-kopf__bahn{width:min(76rem,100%);min-height:4.5rem;margin-inline:auto;padding:.7rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.marke{display:inline-flex;align-items:center;gap:.7rem;color:var(--text);font-size:1.12rem;font-weight:800;text-decoration:none;letter-spacing:-.02em}
.marke img{width:2.7rem;height:2.7rem}
.marke small{display:block;color:var(--text-muted);font-size:.7rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.bv-kopf__tel{display:none}
.bahn{width:min(76rem,100%);margin-inline:auto;padding:clamp(3.5rem,8vw,7rem) 1rem}
.bahn--eng{width:min(64rem,100%)}
.sektion--wechsel{background:var(--surface-2)}
.ueberzeile{margin:0 0 .8rem;color:var(--brand);font-size:.86rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.hero{position:relative;overflow:hidden;background:var(--text);color:var(--on-brand)}
.hero::before{position:absolute;inset:0;content:"";background:linear-gradient(108deg,var(--text) 0%,var(--text) 48%,transparent 82%);z-index:1}
.hero__bild{position:absolute;inset:0 0 0 35%;width:65%;height:100%;object-fit:cover;opacity:.66}
.hero__inhalt{position:relative;z-index:2;width:min(76rem,100%);min-height:clamp(35rem,75vh,45rem);margin-inline:auto;padding:clamp(4rem,9vw,7rem) 1rem;display:flex;align-items:center}
.hero__text{max-width:45rem}
.hero .ueberzeile{color:var(--on-brand)}
.hero-titel{max-width:11ch;margin:0 0 1rem;font-size:clamp(3.25rem,9vw,6.6rem);font-weight:850;line-height:.91;letter-spacing:-.065em}
.hero-titel span{display:block;color:var(--surface-2)}
.hero-claim{max-width:34ch;margin:0 0 1.6rem;font-size:clamp(1.25rem,3vw,1.7rem);font-weight:650}
.hero-aus-einer-hand{max-width:36ch;margin-bottom:1.5rem;border-left:.34rem solid var(--accent);padding-left:1rem}
.aktionszeile{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.knopf{display:inline-flex;min-height:3.25rem;align-items:center;justify-content:center;gap:.55rem;border:2px solid var(--brand);border-radius:.5rem;padding:.72rem 1.05rem;background:var(--brand);color:var(--on-brand);font-weight:750;line-height:1.2;text-decoration:none}
.knopf:hover{background:var(--brand-dark);border-color:var(--brand-dark);text-decoration:none}
.knopf--hell{background:var(--surface);color:var(--brand)}
.knopf--hell:hover{background:var(--surface-2);color:var(--brand-dark)}
.hero .knopf--hell{border-color:var(--surface);background:transparent;color:var(--on-brand)}
.hero .knopf--hell:hover{background:var(--surface);color:var(--brand-dark)}
.intro-zeile{display:grid;gap:1.5rem;margin-bottom:2.4rem}
.intro-zeile p{color:var(--text-muted)}
.leistungs-karten{display:grid;gap:1rem}
.leistungs-karte{position:relative;overflow:hidden;border:1px solid var(--border);background:var(--surface)}
.leistungs-karte::before{position:absolute;inset:.85rem auto .85rem 0;width:.3rem;background:var(--accent);content:""}
.leistungs-karte img{width:100%;aspect-ratio:16/9;object-fit:cover}
.leistungs-karte__text{padding:1.5rem 1.5rem 1.7rem 1.8rem}
.leistungs-karte h3{font-size:1.45rem}
.leistungs-karte p{color:var(--text-muted);font-size:1rem}
.textspalten{display:grid;gap:2rem}
.handwerk-bild{position:relative;overflow:hidden;min-height:25rem;background:var(--text)}
.handwerk-bild img{width:100%;height:100%;object-fit:cover;opacity:.82}
.handwerk-bild__marke{position:absolute;right:0;bottom:0;width:min(78%,27rem);background:var(--brand);color:var(--on-brand);padding:1.4rem 1.5rem;font-weight:800;font-size:clamp(1.35rem,3vw,2rem);line-height:1.15}
.haken-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:2rem 0 1.5rem;padding:0;list-style:none}
.haken-liste li{display:flex;align-items:center;gap:.75rem;min-height:3.25rem;border-bottom:1px solid var(--border);font-weight:700}
.haken{width:1.45rem;height:1.45rem;flex:none;color:var(--accent)}
.einwand-raster{display:grid;gap:1rem;margin-top:2.5rem}
.einwand{border-top:.32rem solid var(--accent);background:var(--surface);padding:1.35rem}
.einwand p{margin:0;font-weight:650}
.ablauf-schritte{position:relative;display:grid;gap:0;margin:2.4rem 0 0;padding:0;list-style:none;counter-reset:ablauf}
.ablauf-schritte::before{position:absolute;top:1.6rem;bottom:1.6rem;left:1.58rem;width:.2rem;background:var(--accent);content:""}
.ablauf-schritte li{position:relative;display:grid;grid-template-columns:3.3rem 1fr;gap:1rem;padding:0 0 2.2rem;counter-increment:ablauf}
.ablauf-schritte li::before{position:relative;z-index:1;display:grid;width:3.3rem;height:3.3rem;place-items:center;border:.22rem solid var(--accent);border-radius:50%;background:var(--surface);color:var(--brand-dark);content:counter(ablauf);font-weight:850}
.ablauf-schritte p{margin:0;color:var(--text-muted)}
.faq-raster{display:grid;gap:.75rem}
.faq{border-left:.3rem solid var(--accent);padding:1.2rem 1.4rem;background:var(--surface-2)}
.faq h3{font-size:1.08rem}
.faq p{margin:0;font-size:1rem}
.gebiet-grid{display:grid;gap:2rem}
.gebiet-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:1.5rem 0;padding:0;list-style:none}
.gebiet-liste li{border-bottom:1px solid var(--border);padding:.65rem 0;font-weight:700}
.fragekarte{border:2px dashed var(--brand);background:var(--surface-2);padding:1.5rem}
.fragekarte p:last-child{margin-bottom:0}
.kontaktfeld{display:grid;gap:1.5rem;padding:clamp(2rem,5vw,3.6rem);background:var(--text);color:var(--on-brand)}
.kontaktfeld h2{max-width:15ch}
.kontaktfeld a:not(.knopf){color:var(--on-brand)}
.kontakt-daten{font-style:normal}
.kontakt-daten p{margin-bottom:.45rem}
.seite-kopf{background:var(--surface-2)}
.seite-kopf .bahn{padding-block:clamp(3rem,7vw,6rem)}
.seite-kopf h1{color:var(--brand-dark)}
.seite-raster{display:grid;gap:2.5rem}
.seite-bild{position:relative}
.seite-bild::after{position:absolute;right:-.5rem;bottom:-.5rem;width:42%;height:42%;border-right:.45rem solid var(--accent);border-bottom:.45rem solid var(--accent);content:""}
.seite-bild img{width:100%;aspect-ratio:7/5;object-fit:cover}
.satz-lead{font-size:1.3rem;font-weight:720;line-height:1.45}
.rufblock{margin-top:2rem;border-left:.35rem solid var(--accent);padding:1rem 0 1rem 1.3rem}
.rufblock p{margin-bottom:.8rem}
.recht-warnung{border:2px dashed var(--brand);background:var(--surface-2);padding:1.3rem}
.platzhalter{display:block;margin:.85rem 0;border:2px dashed var(--brand);padding:.85rem;background:var(--surface-2);color:var(--brand-dark);font-weight:800}
.textseite h2{margin-top:2.4rem;font-size:1.7rem}
.textseite h3{margin-top:1.8rem;font-size:1.3rem}
.bv-fuss{background:var(--text);color:var(--on-brand)}
.fuss-nav{width:min(76rem,100%);margin-inline:auto;padding:3.5rem 1rem 2rem;display:grid;gap:2rem}
.fuss-nav h2{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase}
.fuss-nav ul{margin:0;padding:0;list-style:none}
.fuss-nav li{margin:.45rem 0}
.fuss-nav a{color:var(--on-brand)}
.fuss-stand{width:min(76rem,100%);margin-inline:auto;border-top:1px solid var(--text-muted);padding:1.2rem 1rem 2rem;color:var(--surface-2);font-size:.86rem}
.bv-kontaktleiste{display:none}
.bv-kbtn{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--bar-btn);padding:.5rem .75rem;border-radius:.75rem;font-family:inherit;font-weight:650;line-height:1.15;text-decoration:none;-webkit-tap-highlight-color:transparent}
.bv-kbtn--anruf{flex-grow:1.35;border:1px solid var(--brand);background:var(--brand);color:var(--on-brand)}
.bv-kbtn--mail{border:2px solid var(--brand);background:var(--surface);color:var(--brand)}
.bv-kbtn__text{display:flex;min-width:0;flex-direction:column;align-items:flex-start}
.bv-kbtn__label{font-size:1rem}
.bv-kbtn__wert{font-size:.875rem;font-weight:500;white-space:nowrap}
.bv-kbtn__icon{width:1.4rem;height:1.4rem;flex:none;fill:currentColor}
.bv-kbtn--mail .bv-kbtn__icon{fill:none}
.bv-kbtn--anruf:active{border-color:var(--brand-dark);background:var(--brand-dark)}
.bv-kbtn--mail:active{background:var(--surface-2)}
.bv-kbtn:focus-visible,.bv-kopf__tel:focus-visible{outline:3px solid var(--brand-dark);outline-offset:2px;box-shadow:0 0 0 2px var(--surface)}
@media (min-width:40em){
  .leistungs-karten{grid-template-columns:repeat(2,minmax(0,1fr))}
  .intro-zeile,.textspalten,.gebiet-grid,.kontaktfeld,.seite-raster{grid-template-columns:repeat(2,minmax(0,1fr))}
  .einwand-raster,.faq-raster{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fuss-nav{grid-template-columns:1.35fr 1fr 1fr 1fr}
}
@media (min-width:48em){
  .bv-kopf{position:sticky;top:0}
  .bv-kopf__bahn{padding-inline:1.5rem}
  .bv-kopf__tel{display:inline-flex;min-height:2.75rem;align-items:center;gap:.5rem;border-radius:.5rem;padding:.7rem 1rem;background:var(--brand);color:var(--on-brand);font-weight:700;text-decoration:none;white-space:nowrap}
  html{scroll-padding-top:calc(4.5rem + 1rem)}
  .leistungs-karten{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:47.99em){
  .bv-kontaktleiste{position: fixed;inset:auto 0 0 0;z-index:1000;display:flex;gap:.75rem;box-sizing:border-box;min-height:var(--bar-total);padding-top:var(--bar-gap);padding-bottom: calc(var(--bar-gap) + var(--bar-safe));padding-left:max(.75rem,env(safe-area-inset-left,0px));padding-right:max(.75rem,env(safe-area-inset-right,0px));border-top:var(--bar-line) solid var(--border);background:var(--surface);box-shadow:0 -.12rem .7rem color-mix(in srgb,var(--text) 12%,transparent)}
  body{padding-bottom: calc(var(--bar-total) + 8px)}
  html{scroll-padding-bottom:calc(var(--bar-total) + 16px)}
  body:has(:is(input,textarea,select,[contenteditable="true"]):focus) .bv-kontaktleiste{display:none}
}
@media (max-width:47.99em) and (max-height:22em){.bv-kontaktleiste{display:none}}
@media (max-width:47.99em) and (orientation:landscape) and (max-height:30em){:root{--bar-btn:44px}.bv-kbtn__wert{display:none}}
@media (max-width:39.99em){
  .hero::before{background:linear-gradient(0deg,var(--text) 0%,var(--text) 42%,transparent 100%)}
  .hero__bild{inset:0;width:100%;height:58%;opacity:.74}
  .hero__inhalt{align-items:flex-end}
  .hero-titel{font-size:clamp(3rem,15vw,4.5rem)}
  .haken-liste,.gebiet-liste{grid-template-columns:1fr}
  .handwerk-bild{min-height:19rem}
}
@media (forced-colors:active){.bv-kontaktleiste{border-top:1px solid CanvasText;background:Canvas}.bv-kbtn{border:1px solid ButtonText}.bv-kbtn:focus-visible{outline:3px solid Highlight;outline-offset:2px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.demo-only,.bv-kontaktleiste{display:none!important}.bv-kopf{position:relative}body{padding-bottom:0!important}.hero{background:var(--surface);color:var(--text)}.hero__bild{display:none}.hero .ueberzeile,.hero .knopf--hell{color:var(--text)}}