/* Bakenkontor – Stylesheet
   Leitbild: klar und hell wie die Seiten guter Software-Firmen und Handwerksbetriebe.
   Kräftige Überschriften in IBM Plex Sans, echte Fotos, das Postfach selbst zeigen,
   Grün als Fläche für das Wichtige. Newsreader nur für persönliche Worte (Brief, Zitat).
   Marke: Markenhandbuch (02 Marke). Alle Schriften liegen auf dem eigenen Server. */

@font-face{font-family:"Newsreader";font-style:normal;font-weight:400;font-display:swap;src:url("/schriften/newsreader-400.woff2") format("woff2")}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:500;font-display:swap;src:url("/schriften/newsreader-500.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/schriften/plex-sans-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("/schriften/plex-sans-500.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;src:url("/schriften/plex-sans-600.woff2") format("woff2")}

:root{
  --gruen:#2E6A53;
  --gruen-tief:#21503E;
  --gruen-nacht:#173B2E;
  --gruen-mittel:#CDE2D6;
  --gruen-hell:#E8F1EC;
  --sand:#A87A32;
  --sand-tief:#7E5A1C;
  --sand-hell:#F7F0E4;
  --anthrazit:#1B2320;
  --text:#3A4641;
  --grau:#5B6963;
  --linie:#DEE5E1;
  --linie-stark:#BCC8C2;
  --flaeche:#F3F6F4;

  --serif:"Newsreader",Georgia,serif;
  --sans:"IBM Plex Sans",Arial,Helvetica,sans-serif;

  --breite:80rem;
  --rand:clamp(1rem,4vw,2.5rem);
  --abstand:clamp(4.5rem,9vw,7.5rem);
  --r:1rem;
  --r-klein:.6rem;
  --r-gross:1.5rem;
  --schatten:0 1px 2px rgba(27,35,32,.05),0 8px 24px -10px rgba(27,35,32,.14);
  --schatten-gross:0 2px 6px rgba(27,35,32,.08),0 30px 70px -20px rgba(23,59,46,.40);
}

/* ---------- Grundlagen ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:6rem;scrollbar-color:#A9B7B0 transparent;accent-color:var(--gruen)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:#fff;color:var(--text);font:400 clamp(1rem,.97rem + .15vw,1.0625rem)/1.65 var(--sans);font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img,svg,picture{display:block;max-width:100%;height:auto}
figure{margin:0}
a{color:var(--gruen);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--gruen-tief);text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--sand);outline-offset:3px}
::selection{background:var(--gruen-mittel);color:var(--anthrazit)}
input,textarea{caret-color:var(--gruen)}
p{margin:0 0 1em;text-wrap:pretty}
ul,ol{margin:0 0 1em;padding-left:1.2em}
li{margin-bottom:.35em}
strong{font-weight:600;color:var(--anthrazit)}

h1,h2,h3,h4{font-family:var(--sans);font-weight:600;color:var(--anthrazit);margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.1rem,1.45rem + 2.6vw,3.6rem);line-height:1.07;letter-spacing:-.03em}
h2{font-size:clamp(1.75rem,1.4rem + 1.5vw,2.6rem);line-height:1.12;letter-spacing:-.025em}
h3{font-size:clamp(1.1rem,1.05rem + .25vw,1.25rem);line-height:1.3;letter-spacing:-.01em}
h4{font-size:1.05rem}
.akzent{color:var(--gruen)}
.lead{font-size:clamp(1.08rem,1rem + .35vw,1.25rem);line-height:1.6;max-width:40em;color:var(--text)}
.klein{font-size:.9rem;color:var(--grau)}
.mono{font-size:.85rem;font-weight:500;color:var(--grau)}
.text-breite{max-width:40rem}
.symbol{width:1.5rem;height:1.5rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

.nur-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sprung{position:absolute;left:1rem;top:-4rem;z-index:100;background:var(--anthrazit);color:#fff;padding:.7rem 1rem;border-radius:var(--r-klein);text-decoration:none}
.sprung:focus{top:1rem;color:#fff}
.vorschau-band{background:#7A5520;color:#fff;text-align:center;font:500 .8rem/1.4 var(--sans);padding:.45rem 1rem}
mark.offen{background:#FFE7B8;color:#5C3D00;padding:.05em .3em;outline:1px dashed #C08A2E}

.huelle{width:100%;max-width:var(--breite);margin:0 auto;padding-left:var(--rand);padding-right:var(--rand)}

/* ---------- Kopf ---------- */
.seitenkopf{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--linie)}
.seitenkopf .huelle{display:flex;align-items:center;gap:.75rem;min-height:4.5rem}
.logo{display:flex;align-items:center;gap:.65rem;margin-right:auto;color:var(--anthrazit);text-decoration:none}
.logo:hover{color:var(--anthrazit)}
.logo svg{width:2rem;height:2rem;flex:none}
.logo__wort{font:600 1.35rem/1 var(--sans);letter-spacing:-.025em}
.logo__zeile{display:block;font:400 .8rem/1 var(--sans);color:#A3B2AB;margin-top:.4rem;white-space:nowrap}
.navi ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:.15rem}
.navi li{margin:0}
.navi a{display:block;padding:.5rem .7rem;border-radius:var(--r-klein);color:var(--anthrazit);text-decoration:none;font-weight:500;font-size:.95rem;white-space:nowrap}
.navi a:hover{background:var(--flaeche);color:var(--anthrazit)}
.navi a[aria-current="page"]{background:var(--gruen-hell);color:var(--gruen-tief)}
.navi__mobil{display:none}
.kopf-tel{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border-radius:var(--r-klein);color:var(--anthrazit);font-weight:600;font-size:.95rem;text-decoration:none;white-space:nowrap;font-variant-numeric:tabular-nums}
.kopf-tel:hover{background:var(--flaeche);color:var(--anthrazit)}
.kopf-tel .symbol{width:1.2rem;height:1.2rem;color:var(--gruen)}
.kopf-knopf{min-height:2.75rem;padding:.55rem 1.1rem;font-size:.95rem}
.kopf-anmelden{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .6rem;border-radius:var(--r-klein);color:var(--anthrazit);font-weight:500;font-size:.95rem;text-decoration:none;white-space:nowrap}
.kopf-anmelden:hover{background:var(--flaeche);color:var(--anthrazit)}
.kopf-anmelden .symbol{width:1.2rem;height:1.2rem;color:var(--gruen)}
@media (max-width:75rem){.kopf-anmelden{display:none}}
@media (max-width:80rem){.kopf-tel__nummer{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}}
.menue-knopf{display:none;align-items:center;gap:.55rem;min-height:2.75rem;background:#fff;border:1px solid var(--linie-stark);border-radius:var(--r-klein);padding:.5rem .85rem;font:500 .95rem var(--sans);color:var(--anthrazit);cursor:pointer}
.menue-knopf__linien{position:relative;width:1rem;height:1.5px;background:currentColor}
.menue-knopf__linien::before,.menue-knopf__linien::after{content:"";position:absolute;left:0;width:100%;height:1.5px;background:currentColor;transition:transform .2s}
.menue-knopf__linien::before{top:-5px}
.menue-knopf__linien::after{top:5px}
.menue-knopf[aria-expanded="true"] .menue-knopf__linien{background:transparent}
.menue-knopf[aria-expanded="true"] .menue-knopf__linien::before{transform:translateY(5px) rotate(45deg)}
.menue-knopf[aria-expanded="true"] .menue-knopf__linien::after{transform:translateY(-5px) rotate(-45deg)}
@media (max-width:75rem){
  .js .menue-knopf{display:inline-flex}
  .js .navi{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--linie);box-shadow:0 24px 40px -24px rgba(27,35,32,.3);display:none;padding:.5rem var(--rand) 1.5rem}
  .js .navi.offen{display:block}
  .navi ul{flex-direction:column;align-items:stretch;gap:0}
  .navi a{padding:1rem .25rem;border-radius:0;border-bottom:1px solid var(--linie);font-size:1.15rem}
  .navi a:hover,.navi a[aria-current="page"]{background:none;color:var(--gruen)}
  .navi__mobil{display:block}
  .navi .knopf{display:flex;justify-content:center;margin-top:1.25rem;border-bottom:0;width:100%;color:#fff;font-size:1rem;padding:.9rem;border-radius:var(--r-klein)}
  .navi .knopf:hover{background:var(--gruen-tief);color:#fff}
  html:not(.js) .seitenkopf{position:static}
  html:not(.js) .seitenkopf .huelle{flex-wrap:wrap;padding-top:.75rem;padding-bottom:.75rem}
  html:not(.js) .navi{order:5;width:100%}
}
@media (max-width:40rem){.seitenkopf .kopf-knopf{display:none}.logo__wort{font-size:1.25rem}}
@media (max-width:22.5rem){.seitenkopf .huelle{gap:.35rem}.logo{gap:.45rem}.logo svg{width:1.7rem;height:1.7rem}.logo__wort{font-size:1.15rem}.menue-knopf{padding:.5rem .6rem;gap:.45rem}}

/* ---------- Knöpfe und Verweise ---------- */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3rem;padding:.75rem 1.35rem;border:1px solid var(--gruen);border-radius:var(--r-klein);background:var(--gruen);color:#fff;font:600 1rem/1.2 var(--sans);text-decoration:none;cursor:pointer;box-shadow:0 1px 2px rgba(23,59,46,.2),inset 0 1px 0 rgba(255,255,255,.12);transition:background-color .15s,border-color .15s,color .15s}
.knopf:hover{background:var(--gruen-tief);border-color:var(--gruen-tief);color:#fff}
.knopf--still{background:#fff;border-color:var(--linie-stark);color:var(--anthrazit);box-shadow:0 1px 2px rgba(27,35,32,.06)}
.knopf--still:hover{background:var(--flaeche);border-color:var(--anthrazit);color:var(--anthrazit)}
.knopf--gross{min-height:3.4rem;padding:.9rem 1.6rem;font-size:1.05rem}
.knopfzeile{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
.weiter{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;color:var(--gruen);text-decoration:none}
.weiter::after{content:"";width:.42em;height:.42em;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);transition:transform .15s}
.weiter:hover{color:var(--gruen-tief);text-decoration:underline;text-decoration-thickness:1px}
.weiter:hover::after{transform:translateX(2px) rotate(45deg)}

/* ---------- Auftakt der Startseite ---------- */
.auftakt{padding:clamp(3rem,7vw,5.5rem) 0 0;background:linear-gradient(180deg,var(--flaeche) 0,#fff 34rem)}
.auftakt__text{text-align:center}
.auftakt h1{max-width:19ch;margin:0 auto 1.35rem;font-size:clamp(2.05rem,1.2rem + 3.4vw,4rem);line-height:1.04}
.auftakt .lead{margin:0 auto 2rem;max-width:42rem}
.auftakt .knopfzeile{justify-content:center}
.ansprechpartner{display:flex;align-items:center;justify-content:center;gap:.85rem;margin-top:1.75rem;font-size:.95rem;color:var(--grau);text-align:left}
.ansprechpartner p{margin:0;line-height:1.45}
.ansprechpartner a{font-weight:600;color:var(--anthrazit);text-decoration:none;font-variant-numeric:tabular-nums}
.ansprechpartner a:hover{color:var(--gruen);text-decoration:underline}
.avatar{flex:none}
.avatar img{width:3rem;height:3rem;border-radius:50%;object-fit:cover;object-position:50% 18%;box-shadow:0 0 0 3px #fff,0 0 0 4px var(--linie)}

.auftakt__abb{margin-top:clamp(2.5rem,5vw,3.75rem)}
.auftakt__abb figcaption{font-size:.85rem;color:var(--grau);text-align:center;padding-top:.85rem}
.buehne{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-gross);padding:clamp(1.5rem,5vw,4rem) clamp(.75rem,7vw,7rem) 0;background:var(--gruen-nacht)}
.buehne__foto,.buehne__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.buehne__foto img{object-position:50% 60%}

/* Programmfenster: so sieht das Postfach aus */
.fenster{position:relative;max-width:46rem;margin:0 auto;background:#fff;border-radius:.85rem .85rem 0 0;box-shadow:0 0 0 1px rgba(255,255,255,.35),0 40px 90px -20px rgba(0,0,0,.55);overflow:hidden;font-size:.9rem;line-height:1.5;color:var(--text);text-align:left}
.fenster__leiste{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;background:#F7F9F8;border-bottom:1px solid var(--linie)}
.fenster__punkte{display:flex;gap:.4rem}
.fenster__punkte i{width:.65rem;height:.65rem;border-radius:50%;background:#D5DCD8}
.fenster__titel{flex:1;text-align:center;font-weight:500;font-size:.8rem;color:var(--grau);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fenster__zahl{font-size:.75rem;font-weight:600;color:var(--gruen-tief);background:var(--gruen-hell);border-radius:999px;padding:.15rem .55rem}
.fenster__koerper{display:grid;grid-template-columns:11rem minmax(0,1fr)}
.fenster__ordner{list-style:none;margin:0;padding:1rem .75rem;border-right:1px solid var(--linie);background:#FAFBFA;font-size:.85rem}
.fenster__ordner li{display:flex;justify-content:space-between;margin:0 0 .15rem;padding:.45rem .6rem;border-radius:.45rem;color:var(--grau)}
.fenster__ordner li:first-child{background:var(--gruen-hell);color:var(--gruen-tief);font-weight:600}
.fenster__ordner b{font-weight:600}
.post{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:.85rem;padding:1rem 1.25rem;border-bottom:1px solid var(--linie)}
.post:last-child{border-bottom:0}
.post__bild{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:#E3E8F3;color:#3B4A6B;font-size:.75rem;font-weight:600}
.post__bild--entwurf{background:var(--gruen);color:#fff}
.post__bild--entwurf .symbol{width:1.1rem;height:1.1rem}
.post__bild--portal{background:#F3E7D3;color:var(--sand-tief)}
.post__kopf{display:flex;justify-content:space-between;gap:1rem}
.post__kopf b{font-weight:600;color:var(--anthrazit)}
.post__kopf span{font-size:.78rem;color:var(--grau);font-variant-numeric:tabular-nums}
.post__betreff{font-weight:500;color:var(--anthrazit)}
.post p{margin:.15rem 0 .5rem;color:var(--grau)}
.post--entwurf{background:#F1F7F3}
.post--entwurf p{color:var(--text)}
.etikett{display:inline-block;margin:.1rem .3rem .1rem 0;padding:.15rem .55rem;border-radius:999px;font-size:.72rem;font-weight:600;line-height:1.5;background:#EDF0EE;color:var(--grau)}
.etikett--gruen{background:var(--gruen-mittel);color:var(--gruen-tief)}
.etikett--sand{background:#F3E7D3;color:var(--sand-tief)}
.post__knoepfe{display:flex;gap:.5rem;margin-top:.6rem}
.post__knoepfe span{padding:.35rem .85rem;border-radius:.45rem;font-size:.8rem;font-weight:600;border:1px solid var(--linie-stark);background:#fff;color:var(--anthrazit)}
.post__knoepfe span:first-child{background:var(--gruen);border-color:var(--gruen);color:#fff}
.notiz{position:absolute;left:clamp(1rem,3vw,2.5rem);bottom:clamp(1.5rem,4vw,3rem);width:16.5rem;padding:1.1rem 1.2rem;background:#fff;border-radius:var(--r);box-shadow:var(--schatten-gross);font-size:.85rem;line-height:1.45;text-align:left}
.notiz__titel{margin:0 0 .6rem;font-weight:600;color:var(--anthrazit)}
.notiz ul{list-style:none;margin:0;padding:0}
.notiz li{position:relative;margin:0 0 .45rem;padding-left:1.6rem}
.notiz li:last-child{margin-bottom:0}
.notiz li::before{content:"";position:absolute;left:0;top:.05rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--gruen-hell)}
.notiz li::after{content:"";position:absolute;left:.4rem;top:.28rem;width:.3rem;height:.52rem;border-right:2px solid var(--gruen);border-bottom:2px solid var(--gruen);transform:rotate(45deg)}
.notiz .nein::before{background:#F3E7D3}
.notiz .nein::after{left:.3rem;top:.35rem;width:.5rem;height:.5rem;border:0;transform:none;background:linear-gradient(45deg,transparent calc(50% - 1px),var(--sand-tief) calc(50% - 1px),var(--sand-tief) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(-45deg,transparent calc(50% - 1px),var(--sand-tief) calc(50% - 1px),var(--sand-tief) calc(50% + 1px),transparent calc(50% + 1px))}
@media (max-width:62rem){.notiz{display:none}}
@media (max-width:44rem){.fenster__koerper{grid-template-columns:minmax(0,1fr)}.fenster__ordner{display:none}.post{padding:.9rem 1rem}}

/* Vertrauenszeile unter dem Auftakt */
.vertrauen{list-style:none;margin:0;padding:clamp(1.75rem,4vw,2.5rem) 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem 2rem;border-bottom:1px solid var(--linie)}
.vertrauen li{display:flex;gap:.85rem;align-items:flex-start;margin:0;font-size:.92rem;line-height:1.45;color:var(--grau)}
.vertrauen strong{display:block;font-size:1rem;color:var(--anthrazit)}
.vertrauen .symbol{width:1.6rem;height:1.6rem;color:var(--gruen);margin-top:.05rem}
@media (max-width:62rem){.vertrauen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:30rem){.vertrauen{grid-template-columns:minmax(0,1fr)}}

/* ---------- Einleitung der Unterseiten ---------- */
.einleitung{padding:clamp(1.75rem,4vw,2.75rem) 0 clamp(3rem,6vw,4.5rem);background:var(--flaeche)}
.einleitung:has(.panorama){padding-bottom:0;background:linear-gradient(180deg,var(--flaeche) 0,var(--flaeche) calc(100% - clamp(5rem,12vw,10rem)),#fff calc(100% - clamp(5rem,12vw,10rem)))}
.einleitung__raster{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:2.5rem clamp(2.5rem,5vw,5rem);align-items:center}
.einleitung h1{max-width:22ch;font-size:clamp(2rem,1.4rem + 2.2vw,3.25rem);margin-bottom:1.1rem}
.einleitung+.abschnitt--muschel{padding-top:0}
.einleitung .lead{margin-bottom:0}
.einleitung .knopfzeile{margin-top:2rem}
@media (max-width:60rem){.einleitung__raster{grid-template-columns:minmax(0,1fr);align-items:start}}

.brotkrumen{font-size:.86rem;color:var(--grau);margin-bottom:1.5rem}
.brotkrumen ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.brotkrumen li{margin:0;display:flex;gap:.4rem}
.brotkrumen li+li::before{content:"/";color:var(--linie-stark)}
.brotkrumen a{color:inherit;text-decoration:none}
.brotkrumen a:hover{color:var(--gruen);text-decoration:underline}

/* Kurzübersicht als Karte */
.aushang,.rechnung{background:#fff;border:1px solid var(--linie);border-radius:var(--r-gross);box-shadow:var(--schatten);padding:1.5rem 1.6rem 1.6rem}
.aushang__titel{font:600 1rem/1.4 var(--sans);color:var(--anthrazit);margin:0 0 .5rem}
.aushang .weiter{margin-top:1.1rem;font-size:.95rem}
.leisten{list-style:none;margin:0;padding:0}
.leisten li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin:0;padding:.65rem 0;border-bottom:1px solid var(--linie)}
.leisten li:last-child{border-bottom:0}
.leisten li>span:last-child{font-weight:600;font-variant-numeric:tabular-nums lining-nums;color:var(--anthrazit);white-space:nowrap;text-align:right}

/* Bilder */
.panorama{margin-top:clamp(2.5rem,5vw,3.5rem)}
.panorama img{width:100%;aspect-ratio:21/8;object-fit:cover;border-radius:var(--r-gross)}
.bild img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.bild--hoch img{aspect-ratio:4/5}
.bild--person{max-width:24rem}
.panorama figcaption,.bild figcaption{display:flex;gap:1rem;font-size:.85rem;color:var(--grau);padding:.7rem 0 0}
.panorama figcaption span+span,.bild figcaption span+span{display:none}
@media (max-width:44rem){.panorama img{aspect-ratio:3/2}}

/* ---------- Abschnitte ---------- */
.abschnitt{padding:var(--abstand) 0}
.abschnitt:not(.abschnitt--muschel,.abschnitt--sand,.abschnitt--eng)+.abschnitt:not(.abschnitt--muschel,.abschnitt--sand){padding-top:0}
.abschnitt--muschel{background:var(--flaeche)}
.abschnitt--sand{background:var(--sand-hell)}
.abschnitt--eng{padding:clamp(2.5rem,5vw,3.5rem) 0}
.abschnitt__kopf{max-width:46rem;margin-bottom:clamp(2rem,4vw,3rem)}
.abschnitt__kopf .lead{margin-bottom:0}
.abschnitt__kopf--mitte{margin-left:auto;margin-right:auto;text-align:center}
.abschnitt__kopf--mitte .lead{margin-left:auto;margin-right:auto}

/* Überschrift über dem Inhalt (frühere Randspalte) */
.spalten{display:block}
.rand{margin-bottom:clamp(1.5rem,3vw,2.25rem)}
.rand h2{margin:0;max-width:24ch}
.haupt{min-width:0}
.haupt>:last-child{margin-bottom:0}
.haupt>.lead,.haupt>p{max-width:46rem}

.zwei{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem clamp(2.5rem,5vw,5rem);align-items:start}
.zwei--mitte{align-items:center}
.haupt.zwei--mitte{align-items:start}
.zwei h2{font-size:clamp(1.6rem,1.3rem + 1.1vw,2.25rem)}
@media (max-width:56rem){.zwei{grid-template-columns:minmax(0,1fr)}}

/* ---------- Zwei Angebote (Startseite) ---------- */
.angebote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1rem,2vw,1.5rem)}
.angebot{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-gross);background:var(--gruen-hell)}
.angebot--sand{background:var(--sand-hell)}
.angebot__bild img{width:100%;aspect-ratio:16/9;object-fit:cover}
.angebot__text{display:flex;flex-direction:column;flex:1;padding:clamp(1.5rem,3vw,2.25rem)}
.angebot__preis{align-self:flex-start;margin:0 0 1rem;padding:.3rem .8rem;border-radius:999px;background:#fff;font-size:.88rem;font-weight:600;color:var(--gruen-tief);font-variant-numeric:tabular-nums}
.angebot--sand .angebot__preis{color:var(--sand-tief)}
.angebot h3{font-size:clamp(1.45rem,1.25rem + .8vw,1.9rem);letter-spacing:-.02em;margin-bottom:.6rem}
.angebot .knopf{margin-top:auto;align-self:flex-start}
@media (max-width:52rem){.angebote{grid-template-columns:minmax(0,1fr)}}

/* Listen */
.strich{list-style:none;padding:0;margin:0 0 1.25rem}
.strich li{position:relative;padding-left:1.25rem;margin-bottom:.5em}
.strich li::before{content:"";position:absolute;left:.1rem;top:.62em;width:.4rem;height:.4rem;border-radius:50%;background:var(--gruen)}
.haken{list-style:none;padding:0;margin:0 0 1.75rem}
.haken li{position:relative;padding-left:1.85rem;margin-bottom:.6em}
.haken li::before{content:"";position:absolute;left:0;top:.18em;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--gruen)}
.haken li::after{content:"";position:absolute;left:.46rem;top:.4em;width:.32rem;height:.6rem;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)}
.gestrichen{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1.5rem}
.gestrichen li{position:relative;margin:0;padding:.15rem 0 .15rem 2.1rem;font-weight:500;color:var(--anthrazit)}
.gestrichen li::before{content:"";position:absolute;left:0;top:.1rem;width:1.4rem;height:1.4rem;border-radius:50%;background:#F3E7D3}
.gestrichen li::after{content:"";position:absolute;left:.42rem;top:.52rem;width:.56rem;height:.56rem;background:linear-gradient(45deg,transparent calc(50% - 1px),var(--sand-tief) calc(50% - 1px),var(--sand-tief) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(-45deg,transparent calc(50% - 1px),var(--sand-tief) calc(50% - 1px),var(--sand-tief) calc(50% + 1px),transparent calc(50% + 1px))}
.gestrichen--klein{grid-template-columns:minmax(0,1fr);gap:.4rem}
.gestrichen--klein li{font-weight:400;font-size:.95rem;color:var(--text)}
@media (max-width:44rem){.gestrichen{grid-template-columns:minmax(0,1fr)}}

/* ---------- Zeitleiste: ein Morgen in der Saison ---------- */
.zeitleiste{list-style:none;margin:0;padding:0}
.zeitleiste li{position:relative;display:grid;grid-template-columns:4.25rem minmax(0,1fr);gap:1rem;margin:0;padding:0 0 1.6rem}
.zeitleiste li:last-child{padding-bottom:0}
.zeitleiste li::before{content:"";position:absolute;left:calc(5.625rem - 1px);top:.6rem;bottom:-.5rem;width:2px;background:var(--gruen-mittel)}
.zeitleiste li:last-child::before{display:none}
.zeitleiste time{font-weight:600;color:var(--gruen-tief);font-variant-numeric:tabular-nums;padding-top:.05rem}
.zeitleiste li>div{position:relative;padding-left:1.5rem}
.zeitleiste li>div::before{content:"";position:absolute;left:0;top:.42rem;width:.75rem;height:.75rem;border-radius:50%;background:#fff;border:2px solid var(--gruen)}
.zeitleiste h3{margin:0 0 .25rem;font-size:1.08rem}
.zeitleiste p{margin:0}
.zeitleiste .still>div::before{border-color:var(--sand)}

/* ---------- Schritte (Startseite) ---------- */
.schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;counter-reset:schritt}
.schritte li{display:flex;flex-direction:column;margin:0;padding:1.5rem 1.4rem 1.25rem;background:#fff;border:1px solid var(--linie);border-radius:var(--r)}
.schritte li::before{counter-increment:schritt;content:counter(schritt);display:grid;place-items:center;width:2.4rem;height:2.4rem;margin-bottom:1.1rem;border-radius:50%;background:var(--gruen-hell);color:var(--gruen-tief);font-weight:600}
.schritte h3{margin-bottom:.4rem}
.schritte p{font-size:.95rem}
.schritte__fuss{display:flex;justify-content:space-between;gap:.75rem;margin:auto 0 0!important;padding-top:1rem;border-top:1px solid var(--linie);font-size:.9rem!important;color:var(--grau)}
.schritte__fuss strong{text-align:right}
@media (max-width:64rem){.schritte{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:36rem){.schritte{grid-template-columns:minmax(0,1fr)}}

/* ---------- Ablauf als nummerierte Zeilen ---------- */
.buch{list-style:none;margin:0;padding:0;counter-reset:zeile;display:grid;gap:.75rem}
.buch>li{display:grid;grid-template-columns:2.4rem minmax(0,1fr) auto 10rem;gap:.25rem 1.25rem;align-items:center;margin:0;padding:1.25rem 1.5rem;background:#fff;border:1px solid var(--linie);border-radius:var(--r)}
.buch>li::before{counter-increment:zeile;content:counter(zeile);display:grid;place-items:center;align-self:start;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--gruen-hell);color:var(--gruen-tief);font-weight:600}
.buch h3{margin:.3rem 0 .3rem}
.buch p{margin:0;max-width:38rem}
.buch__dauer{justify-self:end;padding:.2rem .65rem;border-radius:999px;background:var(--flaeche);font-size:.85rem;color:var(--grau);white-space:nowrap;font-variant-numeric:tabular-nums}
.buch__preis{text-align:right;font-weight:600;color:var(--anthrazit);font-variant-numeric:tabular-nums lining-nums}
.buch.buch--schlicht>li{grid-template-columns:2.4rem minmax(0,1fr)}
@media (max-width:48rem){.buch>li{grid-template-columns:2.4rem minmax(0,1fr);padding:1.15rem}.buch__dauer,.buch__preis{grid-column:2;justify-self:start;text-align:left}.buch__dauer{margin-top:.6rem}}

/* ---------- Karten in Rastern ---------- */
.felder,.klauseln{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.klauseln--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.feld-text,.klausel{padding:1.5rem 1.5rem 1.6rem;background:var(--flaeche);border-radius:var(--r)}
.abschnitt--muschel .feld-text,.abschnitt--muschel .klausel,.abschnitt--sand .klausel{background:#fff}
.feld-text h3,.klausel h3{margin-bottom:.4rem}
.feld-text p,.klausel p{margin:0}
.klausel__symbol{display:grid;place-items:center;width:2.75rem;height:2.75rem;margin-bottom:1rem;border-radius:.75rem;background:var(--gruen-hell);color:var(--gruen)}
.klausel__symbol .symbol{width:1.4rem;height:1.4rem}
@media (max-width:64rem){.klauseln--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:48rem){.felder,.klauseln,.klauseln--3{grid-template-columns:minmax(0,1fr)}}

.grenzen{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:1.5rem clamp(2rem,5vw,4rem);margin-top:clamp(2.5rem,5vw,3.5rem);padding:clamp(1.5rem,4vw,2.5rem);background:#fff;border-radius:var(--r-gross)}
.grenzen h3{font-size:clamp(1.3rem,1.15rem + .6vw,1.6rem);letter-spacing:-.02em}
.grenzen p{margin:0}
.grenzen .klein{grid-column:1 / -1;padding-top:1.25rem;border-top:1px solid var(--linie)}
@media (max-width:56rem){.grenzen{grid-template-columns:minmax(0,1fr)}}

/* ---------- Brief ---------- */
.brief{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:2.5rem clamp(2.5rem,6vw,6rem);align-items:center}
.brief__bild img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r-gross)}
.brief__bild{max-width:24rem}
.brief__satz{font:400 clamp(1.15rem,1.05rem + .45vw,1.4rem)/1.55 var(--serif);color:var(--anthrazit);max-width:36rem}
.brief__satz p{margin-bottom:.9em}
.brief__name{margin:1.5rem 0 1.25rem;line-height:1.4}
.brief__name strong{display:block}
.brief__name span{font-size:.92rem;color:var(--grau)}
@media (max-width:56rem){.brief{grid-template-columns:minmax(0,1fr)}.brief__bild{max-width:18rem}}

.zitat{margin:2rem 0 0;font:500 clamp(1.3rem,1.15rem + .7vw,1.75rem)/1.35 var(--serif);letter-spacing:-.01em;color:var(--anthrazit)}
.zitat p{margin:0}

/* ---------- Fragen ---------- */
.fragen-raster{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:2rem clamp(2.5rem,6vw,6rem);align-items:start}
.fragen-raster__kopf p{color:var(--grau)}
.fragen-raster__kopf a{font-weight:600}
@media (max-width:56rem){.fragen-raster{grid-template-columns:minmax(0,1fr)}}
.fragen{display:grid;gap:.6rem}
.frage{background:#fff;border:1px solid var(--linie);border-radius:var(--r);transition:border-color .15s}
.frage[open]{border-color:var(--linie-stark)}
.frage summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.25rem;padding:1.1rem 1.35rem;font:600 1.02rem/1.4 var(--sans);color:var(--anthrazit);border-radius:var(--r)}
.frage summary::-webkit-details-marker{display:none}
.frage summary::after{content:"";flex:none;width:.55rem;height:.55rem;margin-right:.2rem;border-right:2px solid var(--gruen);border-bottom:2px solid var(--gruen);transform:translateY(-.15rem) rotate(45deg);transition:transform .2s}
.frage[open] summary::after{transform:translateY(.1rem) rotate(-135deg)}
.frage summary:hover{color:var(--gruen)}
.frage__antwort{padding:0 1.35rem 1.25rem;max-width:44rem}
.frage__antwort>:last-child{margin-bottom:0}

/* ---------- Abschluss: Anruf ---------- */
.abschluss{background:var(--gruen-nacht);color:#C9DBD1;padding:var(--abstand) 0}
.abschluss h2{color:#fff;max-width:16ch}
.abschluss p{max-width:32rem}
.abschluss__raster{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2.5rem clamp(2.5rem,6vw,6rem);align-items:center}
.abschluss .lead{color:#C9DBD1}
.anruf{background:#fff;color:var(--text);border-radius:var(--r-gross);padding:clamp(1.5rem,3vw,2rem);box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.anruf__person{display:flex;align-items:center;gap:.85rem;margin:0 0 1rem;line-height:1.4;font-size:.92rem;color:var(--grau)}
.anruf__person strong{display:block;font-size:1rem}
.anruf__nummer{display:inline-block;font:600 clamp(1.75rem,1.4rem + 1.5vw,2.4rem)/1.1 var(--sans);letter-spacing:-.025em;color:var(--anthrazit);text-decoration:none;margin:.25rem 0 .4rem;font-variant-numeric:tabular-nums}
.anruf__nummer:hover{color:var(--gruen)}
.anruf__mail{display:block;margin-bottom:1.5rem}
.anruf .knopf{width:100%}
.anruf .mono{color:var(--grau);margin:0}
.kontakt-raster{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:3rem clamp(2.5rem,6vw,6rem);align-items:start}
@media (max-width:60rem){.kontakt-raster{grid-template-columns:minmax(0,1fr)}}
.kontakt-raster aside h2{font-size:1.4rem;margin-bottom:.25rem}
@media (max-width:60rem){.abschluss__raster{grid-template-columns:minmax(0,1fr)}}

/* ---------- Tarife ---------- */
.tarifblatt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.tarifblatt--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tarif{display:flex;flex-direction:column;padding:1.75rem 1.5rem;background:#fff;border:1px solid var(--linie);border-radius:var(--r-gross)}
.tarifblatt .tarif--empfohlen{border:2px solid var(--gruen);box-shadow:var(--schatten);padding:calc(1.75rem - 1px) calc(1.5rem - 1px)}
.tarif__marke{display:inline-block;vertical-align:.25em;margin-left:.35rem;padding:.2rem .55rem;border-radius:999px;background:var(--gruen-hell);font:600 .72rem/1.3 var(--sans);letter-spacing:0;color:var(--gruen-tief)}
.tarif h3{font-size:1.4rem;letter-spacing:-.02em;margin-bottom:.35rem}
.tarif__fuer{font-size:.92rem;color:var(--grau);margin-bottom:1.25rem}
@media (min-width:60rem){.tarif__fuer{min-height:4.8em}}
.tarif__preis{font:600 2.4rem/1 var(--sans);letter-spacing:-.035em;color:var(--anthrazit);margin:0 0 .3rem;font-variant-numeric:tabular-nums}
.tarif__preis small{font:400 .9rem var(--sans);letter-spacing:0;color:var(--grau)}
.tarif .leisten{font-size:.9rem;margin:1rem 0 1.25rem}
.tarif .leisten li{padding:.5rem 0}
.tarif .strich{font-size:.93rem}
.tarif .weiter{margin-top:auto;align-self:flex-start;font-size:.95rem}
.tarif>.knopf{margin-top:auto;width:100%}
.tarif .strich li,.tafel .strich li{padding-left:1.7rem}
.tarif .strich li::before,.tafel .strich li::before{left:0;top:.22em;width:1.1rem;height:1.1rem;background:var(--gruen-hell)}
.tarif .strich li::after,.tafel .strich li::after{content:"";position:absolute;left:.41rem;top:.42em;width:.27rem;height:.5rem;border-right:2px solid var(--gruen);border-bottom:2px solid var(--gruen);transform:rotate(45deg)}
.tarif--spaeter{background:var(--flaeche);border-style:dashed;color:var(--grau)}
@media (max-width:68rem){.tarifblatt:not(.tarifblatt--3){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:60rem){.tarifblatt--3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:40rem){.tarifblatt:not(.tarifblatt--3){grid-template-columns:minmax(0,1fr)}}

/* ---------- Tarifwähler (Preisseite), ohne Skript: Auswahlknöpfe steuern die Tafel ---------- */
.waehler{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);background:#fff;border:1px solid var(--linie);border-radius:var(--r-gross);box-shadow:var(--schatten);overflow:hidden}
.waehler>input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.waehler__liste{border:0;margin:0;min-width:0;padding:1.5rem;background:var(--flaeche);border-right:1px solid var(--linie)}
.waehler__liste legend{float:left;width:100%;padding:0;margin-bottom:.9rem;font:600 1rem/1.4 var(--sans);color:var(--anthrazit)}
.waehler__wahl{clear:both;display:grid;grid-template-columns:1.1rem minmax(0,1fr);gap:.1rem .8rem;padding:.85rem 1rem;margin:0 0 .5rem;background:#fff;border:1px solid var(--linie);border-radius:var(--r-klein);cursor:pointer;transition:border-color .15s,background-color .15s}
.waehler__wahl::before{content:"";grid-row:1 / span 2;width:1.1rem;height:1.1rem;margin-top:.2rem;border:1.5px solid #8E9C95;border-radius:50%;box-sizing:border-box;background:#fff;transition:border-width .15s}
.waehler__wahl strong{font-weight:600}
.waehler__wahl span{grid-column:2;font-size:.88rem;color:var(--grau)}
.waehler__wahl:hover{border-color:var(--linie-stark)}
.waehler__tafel{min-width:0;padding:clamp(1.5rem,3vw,2.25rem)}
.tafel{display:none}
.tafel h3{font-size:clamp(1.5rem,1.3rem + .8vw,1.9rem);letter-spacing:-.02em;margin-bottom:.3rem}
.tafel__fuer{color:var(--grau);font-size:.95rem;margin-bottom:1rem}
.tafel .leisten{margin:1rem 0 1.25rem;max-width:30rem}
.tafel__spalten{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 2rem;margin-bottom:1.5rem}
.tafel__titel{font:600 .95rem/1.4 var(--sans);color:var(--anthrazit);margin:0 0 .6rem}
@media (max-width:52rem){.waehler{grid-template-columns:minmax(0,1fr)}.waehler__liste{border-right:0;border-bottom:1px solid var(--linie)}.tafel__spalten{grid-template-columns:minmax(0,1fr)}}
#g-starter:checked~.waehler__liste label[for="g-starter"],#g-kompakt:checked~.waehler__liste label[for="g-kompakt"],#g-standard:checked~.waehler__liste label[for="g-standard"],#g-gross:checked~.waehler__liste label[for="g-gross"],#g-betrieb:checked~.waehler__liste label[for="g-betrieb"]{background:var(--gruen-hell);border-color:var(--gruen)}
#g-starter:checked~.waehler__liste label[for="g-starter"]::before,#g-kompakt:checked~.waehler__liste label[for="g-kompakt"]::before,#g-standard:checked~.waehler__liste label[for="g-standard"]::before,#g-gross:checked~.waehler__liste label[for="g-gross"]::before,#g-betrieb:checked~.waehler__liste label[for="g-betrieb"]::before{border:5px solid var(--gruen)}
#g-starter:focus-visible~.waehler__liste label[for="g-starter"],#g-kompakt:focus-visible~.waehler__liste label[for="g-kompakt"],#g-standard:focus-visible~.waehler__liste label[for="g-standard"],#g-gross:focus-visible~.waehler__liste label[for="g-gross"],#g-betrieb:focus-visible~.waehler__liste label[for="g-betrieb"]{outline:2px solid var(--sand);outline-offset:2px}
#g-starter:checked~.waehler__tafel .tafel--starter,#g-kompakt:checked~.waehler__tafel .tafel--kompakt,#g-standard:checked~.waehler__tafel .tafel--standard,#g-gross:checked~.waehler__tafel .tafel--gross,#g-betrieb:checked~.waehler__tafel .tafel--betrieb{display:block}

/* ---------- Rechnung (KI-Check) ---------- */
.rechnung dl{margin:.5rem 0 0}
.rechnung dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:.75rem 0;border-bottom:1px solid var(--linie)}
.rechnung dt{font-size:.95rem}
.rechnung dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums lining-nums;color:var(--anthrazit);white-space:nowrap}
.rechnung .summe{border-bottom:0;margin-top:.25rem;padding:.9rem 1rem;background:var(--gruen-hell);border-radius:var(--r-klein)}
.rechnung .summe dt,.rechnung .summe dd{font-weight:600;color:var(--gruen-tief)}

/* ---------- Katalog ---------- */
.katalog{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.katalog li{margin:0;padding:1.5rem;background:#fff;border:1px solid var(--linie);border-radius:var(--r)}
.katalog h3{margin-bottom:.4rem}
.katalog p{margin:0 0 .5rem;font-size:.97rem}
.katalog .mono{display:inline-block;margin-top:.25rem;padding:.15rem .6rem;border-radius:999px;background:var(--flaeche);font-size:.8rem}
@media (max-width:48rem){.katalog{grid-template-columns:minmax(0,1fr)}}

/* ---------- Tabellen ---------- */
.tabelle-huelle{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--linie);border-radius:var(--r);scrollbar-width:thin;background:#fff}
table{width:100%;border-collapse:collapse;font-size:.95rem}
table:has(thead th:nth-child(4)){min-width:40rem}
th,td{text-align:left;vertical-align:top;padding:.9rem 1.1rem;border-bottom:1px solid var(--linie)}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}
thead th{font:600 .85rem/1.4 var(--sans);color:var(--grau);background:var(--flaeche)}
tbody th{font-weight:600;color:var(--anthrazit)}
.zahl{text-align:right;white-space:nowrap}
td.zahl{font-weight:600;font-variant-numeric:tabular-nums lining-nums;color:var(--anthrazit)}

/* ---------- Hinweise ---------- */
.hinweis{padding:1.35rem 1.5rem;margin:0;background:var(--sand-hell);border-radius:var(--r)}
.hinweis h3{margin-bottom:.4rem}
.hinweis>:last-child{margin-bottom:0}
.hinweis--gruen{background:var(--gruen-hell)}
.kasten{background:var(--flaeche);padding:clamp(1.25rem,3vw,1.75rem);border-radius:var(--r)}
.app-uebersicht{margin-top:clamp(4rem,8vw,6rem)}
.app-uebersicht .kasten .haken{margin-bottom:1.25rem}
@media (max-width:52rem){.app-uebersicht .zwei{grid-template-columns:minmax(0,1fr)}}
.abschnitt--muschel .kasten{background:#fff}
.kasten>:last-child{margin-bottom:0}
.kasten h2,.kasten h3{font-size:1.25rem}
.steuerhinweis{font-size:.88rem;color:var(--grau);margin-top:1.25rem;max-width:46rem}

/* ---------- Formular ---------- */
.formular{display:grid;gap:1.25rem}
.formular__zeile{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
@media (max-width:40rem){.formular__zeile{grid-template-columns:minmax(0,1fr)}}
.feld label{display:block;font-weight:600;font-size:.92rem;color:var(--anthrazit);margin-bottom:.4rem}
.feld .optional{font-weight:400;color:var(--grau)}
.feld input,.feld select,.feld textarea{width:100%;font:inherit;font-size:1rem;color:var(--anthrazit);background:#fff;border:1px solid var(--linie-stark);border-radius:var(--r-klein);padding:.8rem .95rem;min-height:3.1rem;transition:border-color .15s,box-shadow .15s}
.feld textarea{min-height:9.5rem;resize:vertical}
.feld input:hover,.feld select:hover,.feld textarea:hover{border-color:#8E9C95}
.feld input:focus,.feld select:focus,.feld textarea:focus{outline:none;border-color:var(--gruen);box-shadow:0 0 0 4px rgba(46,106,83,.18)}
.feld select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--anthrazit) 50%),linear-gradient(135deg,var(--anthrazit) 50%,transparent 50%);background-position:calc(100% - 1.25rem) 55%,calc(100% - .9rem) 55%;background-size:.35rem .35rem;background-repeat:no-repeat;padding-right:2.5rem}
.formular__hinweis{font-size:.86rem;color:var(--grau);margin:0}
.ohne-js{margin:0}
.js .ohne-js,html:not(.js) #anfrage{display:none}
.ersatz__text{display:block;width:100%;margin:.25rem 0 1rem;padding:.75rem .9rem;font:400 .9rem/1.5 var(--sans);color:var(--anthrazit);background:#fff;border:1px solid var(--linie-stark);border-radius:var(--r-klein);resize:vertical}
#ersatz[hidden]{display:none}
.kontaktwege{list-style:none;padding:.5rem 1.5rem;margin:0;background:#fff;border:1px solid var(--linie);border-radius:var(--r-gross);box-shadow:var(--schatten)}
.kontaktwege li{padding:1rem 0;border-bottom:1px solid var(--linie);margin:0}
.kontaktwege li:last-child{border-bottom:0}
.kontaktwege .mono{display:block;margin-bottom:.2rem}
.kontaktwege a{font-weight:600}
.kontaktwege .anruf__nummer{font-size:clamp(1.6rem,1.35rem + 1vw,2.1rem);margin:0}

/* ---------- Rechtstexte ---------- */
.rechtstext>*{max-width:46rem}
.rechtstext h2{font-size:clamp(1.25rem,1.15rem + .45vw,1.5rem);letter-spacing:-.015em;margin-top:2.5rem}
.rechtstext h2:first-of-type{margin-top:0}
.rechtstext address{font-style:normal;margin-bottom:1em}
.rechtstext dl{margin:0 0 1em}
.rechtstext dt{font-weight:600;color:var(--anthrazit)}
.rechtstext dd{margin:0 0 .75em}

/* ---------- Fuß ---------- */
.seitenfuss{background:var(--anthrazit);color:#B9C6C0;padding:clamp(3.5rem,7vw,5rem) 0 2rem;font-size:.93rem}
.seitenfuss a{color:#E9EEEB;text-decoration:none}
.seitenfuss a:hover{color:#fff;text-decoration:underline}
.seitenfuss__raster{display:grid;grid-template-columns:minmax(0,5fr) repeat(3,minmax(0,2fr));gap:2.5rem 3rem}
@media (max-width:62rem){.seitenfuss__raster{grid-template-columns:1fr 1fr}}
@media (max-width:36rem){.seitenfuss__raster{grid-template-columns:minmax(0,1fr)}}
.seitenfuss h2{font:600 .95rem/1.4 var(--sans);letter-spacing:0;color:#fff;margin:0 0 1rem}
.seitenfuss ul{list-style:none;padding:0;margin:0}
.seitenfuss li{margin-bottom:.5rem}
.seitenfuss .logo{color:#fff;margin-bottom:1.25rem}
.seitenfuss address{font-style:normal;line-height:1.75}
.seitenfuss .klein{color:#A9B7B0;max-width:28rem}
.seitenfuss__unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:3.5rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.12);font-size:.85rem;color:#93A39C}

/* ---------- Abbildungen auf den Unterseiten ---------- */
.abbildung figcaption{font-size:.85rem;color:var(--grau);padding-top:.85rem}
.fenster--rund{border-radius:.85rem;box-shadow:0 0 0 1px var(--linie),var(--schatten-gross)}
/* Hausakte */
.akte{margin:0;padding:.35rem 1.25rem .75rem;font-size:.88rem}
.akte>div{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--linie)}
.akte>div:last-child{border-bottom:0}
.akte dt{font-weight:600;color:var(--anthrazit)}
.akte dd{margin:0}
@media (max-width:30rem){.akte>div{grid-template-columns:minmax(0,1fr);gap:0}}
/* Ablage mit Belegen */
.datei{display:grid;grid-template-columns:2.25rem minmax(0,1fr) auto;gap:.85rem;align-items:center;padding:.85rem 1.25rem;border-bottom:1px solid var(--linie)}
.datei__symbol{display:grid;place-items:center;width:2.25rem;height:2.7rem;border-radius:.35rem;background:#EEF1EF;color:var(--grau);font-size:.62rem;font-weight:600;letter-spacing:.04em}
.datei b{display:block;font-size:.85rem;font-weight:600;color:var(--anthrazit);overflow-wrap:anywhere}
.datei__info{display:block;font-size:.78rem;color:var(--grau)}
.datei .etikett{margin:0}
.datei--pruefen{background:#FBF6EC}
.erinnerung{display:flex;gap:.65rem;align-items:center;padding:.85rem 1.25rem;background:var(--gruen-hell);color:var(--gruen-tief);font-size:.85rem;font-weight:500}
.erinnerung .symbol{width:1.15rem;height:1.15rem}
@media (max-width:30rem){.datei{grid-template-columns:2.25rem minmax(0,1fr)}.datei .etikett{grid-column:2;justify-self:start}}
/* Maßnahmenplan als Blatt */
.blatt{background:#fff;border-radius:.6rem;box-shadow:0 0 0 1px var(--linie),var(--schatten-gross);padding:clamp(1.25rem,3vw,2rem);font-size:.88rem;color:var(--text)}
.blatt__kopf{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.25rem 1rem;margin:0 0 1rem;padding-bottom:.75rem;border-bottom:2px solid var(--gruen);font-size:.8rem;color:var(--grau)}
.blatt__kopf b{font-weight:600;color:var(--gruen-tief)}
.blatt h3{font-size:1.15rem;margin-bottom:.5rem}
.blatt table{font-size:.85rem}
.blatt th,.blatt td{padding:.6rem .75rem .6rem 0}
.blatt thead th{background:none;padding-top:.25rem;font-size:.75rem;white-space:normal}
@media (max-width:30rem){.blatt th,.blatt td{padding-right:.5rem}.leisten li>span:last-child{white-space:normal}}
.blatt__nr{display:inline-grid;place-items:center;width:1.35rem;height:1.35rem;margin-right:.5rem;border-radius:50%;background:var(--gruen-hell);color:var(--gruen-tief);font-size:.72rem;font-weight:600;vertical-align:.05em}
.blatt__summe{display:flex;justify-content:space-between;gap:1rem;margin:.75rem 0 0;padding:.7rem .9rem;background:var(--gruen-hell);border-radius:var(--r-klein);font-weight:600;color:var(--gruen-tief)}
.blatt__notiz{margin:.85rem 0 0;font-size:.8rem;color:var(--grau)}

/* ---------- Über mich ---------- */
.bake{display:grid;place-items:center;gap:1rem;padding:clamp(2rem,5vw,3.5rem);background:#fff;border-radius:var(--r-gross);text-align:center}
.bake svg{width:clamp(6rem,14vw,9rem);height:auto}
.bake figcaption{font-size:.88rem;color:var(--grau)}
.orte{list-style:none;margin:1.5rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.orte li{margin:0;padding:.35rem .85rem;border-radius:999px;background:var(--gruen-hell);color:var(--gruen-tief);font-size:.92rem;font-weight:500}

/* ---------- Kontakt ---------- */
.karte{background:#fff;border:1px solid var(--linie);border-radius:var(--r-gross);box-shadow:var(--schatten);padding:clamp(1.25rem,3vw,2.25rem)}
.kontaktwege__person{display:flex;align-items:center;gap:.85rem;line-height:1.4}
.kontaktwege__person strong{display:block}

/* ---------- Hilfsklassen (zuletzt, damit sie gewinnen) ---------- */
.abstand-oben{margin-top:clamp(1.75rem,3.5vw,2.5rem)}
.mitte{text-align:center}

@media print{
  .seitenkopf,.seitenfuss,.abschluss,.menue-knopf,.vorschau-band,.buehne{display:none}
  a{color:#000}
}