:root{
  --kalk:#F2F0EA;
  --flaeche:#FAF9F6;
  --schiefer:#263038;
  --schiefer-2:#56616A;
  --linie:#D9D5CB;
  --salbei:#A6B2A3;
  --salbei-hell:#E3E6DF;
  --messing:#A8854F;
  --messing-tief:#7D6236;
  --messing-hell:#CDAE78;
  --nacht:#222B32;
  --nacht-tief:#141A1F;
  --nacht-text:#C9CDCF;
  --weiss:#FFFFFF;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-text:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --gutter:clamp(16px,4vw,40px);
  --kopf:64px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--kalk);color:var(--schiefer);font-family:var(--f-text);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--f-display);font-weight:500;line-height:1.08;letter-spacing:-.01em;text-wrap:balance;margin:0}
p{margin:0}
a{color:var(--schiefer);text-decoration-color:var(--messing);text-underline-offset:4px}
a:hover{color:#000000}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--schiefer);outline-offset:3px}
.mono{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--messing-tief)}
.wrap{max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;font:600 16px/1 var(--f-text);text-decoration:none;cursor:pointer;border:1px solid var(--schiefer);transition:background .2s,color .2s}
.btn-primaer{background:var(--schiefer);color:var(--kalk)}
.btn-primaer:hover{background:#000000;color:var(--kalk)}
.btn-sekundaer{background:transparent;color:var(--schiefer)}
.btn-sekundaer:hover{background:var(--schiefer);color:var(--kalk)}
.messlinie{height:12px;border-top:1px solid var(--messing);background-image:repeating-linear-gradient(90deg,var(--messing) 0 1px,transparent 1px 8px),repeating-linear-gradient(90deg,var(--messing) 0 1px,transparent 1px 80px);background-size:100% 5px,100% 11px;background-repeat:no-repeat;background-position:left top,left top}

/* ---------- Kopfzeile ---------- */
.kopf{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(242,240,234,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--linie)}
.kopf .wrap{min-height:var(--kopf);display:flex;align-items:center;justify-content:space-between;gap:16px 28px}
.marke{display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--schiefer)}
.marke b{font:600 23px/1 var(--f-display);letter-spacing:.16em}
.marke small{display:flex;align-items:center;gap:8px;font:400 12px/1.2 var(--f-text);color:var(--schiefer-2)}
.marke small::before{content:"";width:18px;height:1px;background:var(--messing)}
.nav{display:flex;flex-wrap:wrap;gap:4px 26px;font:500 15px/1.4 var(--f-text)}
.nav a{text-decoration:none;padding:10px 0}
.kopf-aktion{display:flex;align-items:center;gap:18px}
.tel{font:500 15px/1 var(--f-mono);text-decoration:none;padding:12px 0;white-space:nowrap}
.kopf .btn{min-height:44px;padding:0 20px;font-size:15px}
.menu-btn,.kopf-anruf{display:none}
.mobil-nav{border-top:1px solid var(--linie);background:var(--kalk)}
.mobil-nav nav{display:grid;padding:8px var(--gutter) 16px}
.mobil-nav a{padding:12px 0;border-bottom:1px solid var(--linie);text-decoration:none;font-weight:600}

.fuss{position:relative;z-index:1;background:var(--schiefer);color:var(--nacht-text);padding-block:56px 40px}
.fuss .oben{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px 56px;margin-bottom:40px}
.fuss .spalte{display:grid;gap:6px;align-content:start;font-size:15px}
.fuss .spalte span.mono{color:var(--messing-hell)}
.fuss a{color:var(--kalk);text-decoration:none}
.fuss .unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px;padding-top:22px;border-top:1px solid #3E4950;font-size:13px}
.fuss .unten a{color:var(--nacht-text);text-decoration:underline}
.fuss-messlinie{position:relative;z-index:1;background:var(--salbei-hell)}
.fuss-messlinie .messlinie{border-top:0;border-bottom:1px solid var(--messing);background-position:left bottom,left bottom}
.anrufleiste{display:none}
@media (max-width:860px){
  .nav,.kopf-aktion{display:none}
  .menu-btn,.kopf-anruf{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;border:1px solid var(--linie);background:var(--flaeche);color:var(--schiefer);cursor:pointer}
  .kopf-anruf{background:var(--schiefer);border-color:var(--schiefer);color:var(--kalk)}
  .kopf-knoepfe{display:flex;gap:8px}
}
@media (min-width:861px){.kopf-knoepfe{display:none}}

/* ---------- Logo ---------- */
.marke{display:flex;align-items:center}
.logo-c{display:block;height:36px;width:auto}
.fuss-logo{height:44px;width:auto}
@media (max-width:860px){.kopf .logo-c{height:30px}}
@media (max-width:380px){.kopf .logo-c{height:26px}}
.nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--messing);text-underline-offset:6px}


/* ---------- Kopfzeile: transparent, liegt über Bühne bzw. Seitenkopf ---------- */
.kopf{position:fixed;top:0;left:0;right:0;z-index:40;padding-top:env(safe-area-inset-top,0px);background:rgba(17,23,28,.42);border-bottom:1px solid rgba(255,255,255,.10);color:#F2F0EA;transition:background-color .3s ease,border-color .3s ease,transform .35s ease}
.kopf .nav a,.kopf .tel,.kopf .marke{color:#F2F0EA}
.kopf .nav a:hover,.kopf .tel:hover{color:#FFFFFF}
.kopf.auf-buehne .nav a,.kopf.auf-buehne .tel{text-shadow:0 1px 10px rgba(10,14,18,.55)}
.kopf .nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--messing-hell);text-underline-offset:6px}
.kopf .btn-primaer,.unterseite .kopf .btn-primaer{background:#F2F0EA;color:#1B2730;border-color:#F2F0EA}
.kopf .btn-primaer:hover,.unterseite .kopf .btn-primaer:hover{background:#FFFFFF;color:#000000}
.kopf .menu-btn,.unterseite .kopf .menu-btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#F2F0EA}
.kopf .kopf-anruf,.unterseite .kopf .kopf-anruf,.unterseite .kopf-anruf:hover{background:#F2F0EA;border-color:#F2F0EA;color:#1B2730}
.kopf.fest{background:rgba(17,23,28,.80);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-bottom-color:rgba(255,255,255,.08)}
.mobil-nav{background:rgba(17,23,28,.96);border-top-color:rgba(255,255,255,.1)}
.mobil-nav a,.unterseite .mobil-nav a{color:#F2F0EA;border-bottom-color:rgba(255,255,255,.12)}
.unterseite .kopf a{color:#F2F0EA}
.unterseite .kopf .btn{color:#1B2730}
.marke .logo-auf-hell{display:none}
.kopf.oben .marke .logo-auf-dunkel{display:none}
.kopf.oben .marke .logo-auf-hell{display:block}
.unterseite .kopf.oben .nav a,.unterseite .kopf.oben .tel{color:#1B2730}
.unterseite .kopf.oben .nav a:hover,.unterseite .kopf.oben .tel:hover{color:#000000}
.unterseite .kopf.oben .nav a[aria-current="page"]{text-decoration-color:var(--messing)}
.unterseite .kopf.oben .btn-primaer{background:#1B2730;color:#F2F0EA;border-color:#1B2730}
.unterseite .kopf.oben .btn-primaer:hover{background:#000000;color:#FFFFFF}
.unterseite .kopf.oben .menu-btn{background:transparent;border-color:rgba(27,39,48,.3);color:#1B2730}
.unterseite .kopf.oben .kopf-anruf{background:#1B2730;border-color:#1B2730;color:#F2F0EA}
body.unterseite{padding-top:calc(var(--kopf) + env(safe-area-inset-top,0px))}
@media (prefers-reduced-motion:reduce){.kopf{transition:none}}
.logo-c{height:46px}
@media (max-width:860px){.kopf .logo-c{height:38px}}
@media (max-width:380px){.kopf .logo-c{height:32px}}

/* ---------- Unterseiten im neuen Erscheinungsbild ---------- */
body.unterseite{background:var(--kalk);color:var(--schiefer);font-family:var(--f-text)}
.unterseite h1,.unterseite h2,.unterseite h3{font-family:var(--f-display);font-weight:500;letter-spacing:-.01em;color:var(--schiefer)}
.unterseite main{padding:40px 0 80px}
.unterseite .wrap{max-width:1040px}
.unterseite .art.wrap,.unterseite .faq.wrap{max-width:780px}
.unterseite a{color:var(--schiefer);text-decoration:none}
.unterseite main p a:not(.btn),.unterseite main li a:not(.btn),.unterseite .art a:not(.btn){text-decoration:underline;text-decoration-color:var(--messing);text-underline-offset:4px}
.unterseite a:hover{color:#000}
.unterseite .crumbs{font:500 12px/1.6 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--schiefer-2);margin:28px 0 0}
.unterseite .crumbs a{text-decoration:none;color:var(--messing-tief)}
.unterseite .cat,.unterseite .eyebrow{font:500 12px/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--messing-tief)}
.unterseite .eyebrow::before{background:var(--messing)}
.unterseite .art h1,.unterseite .hero h1{font-size:clamp(34px,5vw,52px);line-height:1.06;font-weight:500;margin:10px 0 0}
.unterseite .art h2{font-size:clamp(24px,3vw,30px);margin:44px 0 12px}
.unterseite .art h3{font-size:20px;margin:28px 0 8px}
.unterseite .art p,.unterseite .art li{font-size:17.5px;line-height:1.7}
.unterseite .art .meta{font:500 12px/1.5 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--schiefer-2);margin:14px 0 0}
.unterseite .lead{font-size:20px !important;line-height:1.6 !important;color:var(--schiefer);margin-top:22px}
.unterseite .note,.unterseite .callout{background:var(--flaeche);border:1px solid var(--linie);border-left:3px solid var(--messing);border-radius:6px;padding:20px 22px}
.unterseite .cta{background:var(--schiefer);color:var(--kalk);border-radius:14px;padding:30px}
.unterseite .cta h2,.unterseite .cta h3,.unterseite .cta p{color:var(--kalk)}
.unterseite .cta a:not(.btn){color:var(--kalk)}
.unterseite .btn,.unterseite a.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font:600 15px/1 var(--f-text);text-decoration:none;background:var(--schiefer);color:var(--kalk);border:1px solid var(--schiefer)}
.unterseite .btn:hover{background:#000;color:var(--kalk)}
.unterseite .cta .btn{background:var(--kalk);color:var(--schiefer);border-color:var(--kalk)}
.unterseite .cta .btn:hover{background:#fff;color:#000}
.unterseite .btn.ghost{background:transparent;color:var(--schiefer)}
.unterseite .q,.unterseite .faq details{border-color:var(--linie)}
.unterseite .card,.unterseite .card-soft,.unterseite .post,.unterseite .svc{background:var(--flaeche);border-color:var(--linie)}
.unterseite .chips span,.unterseite .chips a{border-color:var(--linie);background:var(--flaeche);color:var(--schiefer)}
.unterseite input[type=number],.unterseite select{font-family:var(--f-text);border-color:#B9B4A8}
.unterseite .res-main .big,.unterseite .res-main .u,.unterseite .res-row .v{font-family:var(--f-display);color:var(--schiefer)}
.unterseite .result{background:var(--flaeche)}
.unterseite .thumb{background-color:var(--salbei-hell)}

/* ---------- Rechtstexte ---------- */
.rechtstext{max-width:780px}
.rechtstext h1{font-size:clamp(34px,5vw,48px);margin:10px 0 28px}
.rechtstext h2,.rechtstext h3{font-size:22px;margin:34px 0 10px}
.rechtstext h4{font:600 17px/1.4 var(--f-text);margin:24px 0 8px}
.rechtstext p,.rechtstext li{font-size:16.5px;line-height:1.7;margin:0 0 12px}
.rechtstext .hinweis-pruefen{background:#FFF4D6;border:1px solid #E2C46F;border-radius:6px;padding:12px 14px;font-size:14px}

.unterseite .kopf .wrap,.unterseite .fuss .wrap,.unterseite .fuss-messlinie .wrap{max-width:1280px}
.unterseite .kopf a,.unterseite .mobil-nav a{text-decoration:none}
.unterseite .kopf .btn{white-space:nowrap}
.unterseite .nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--messing);text-underline-offset:6px}
.unterseite .fuss a{color:var(--kalk);text-decoration:none}
.unterseite .fuss .unten a{color:var(--nacht-text);text-decoration:underline}
.kopf .btn{white-space:nowrap}
.nav{flex-wrap:nowrap}
@media (max-width:1100px){.nav{gap:4px 18px;font-size:14px}}
.unterseite .post .thumb{color:var(--kalk)}
.unterseite .lp-cta{background:var(--schiefer)}

html:has(body.unterseite){overflow-x:clip}
.unterseite .lp-hero h1 br{display:none}

/* Anfrage-Kasten in Fachbeiträgen bündig mit der Textspalte */
.unterseite main > .cta{box-sizing:border-box;width:calc(100% - 2 * var(--gutter));max-width:calc(780px - 2 * var(--gutter));margin:48px auto 8px;padding:30px 32px}
.unterseite main > .cta h2{font-size:clamp(22px,2.6vw,28px);line-height:1.15;margin:0}
.unterseite main > .cta p{margin:10px 0 0;max-width:46ch}
@media (max-width:640px){.unterseite main > .cta{padding:24px 22px}.unterseite main > .cta .btn{width:100%}}
/* Standortseiten: dunkler Anfrage-Kasten lesbar, Überschrift ohne Einzelzeichen-Zeile */
.unterseite .lp-cta h2{color:#F2F0EA}
.unterseite .lp-cta p{color:rgba(242,240,234,.78)}
.unterseite .lp-cta .btn{background:#F2F0EA;color:var(--schiefer);border-color:#F2F0EA}
.unterseite .lp-cta .btn:hover{background:#FFFFFF;color:#000000}
.unterseite .lp-hero h1{max-width:22ch}
.unterseite .lp-hero .in{padding-left:var(--gutter);padding-right:var(--gutter)}