@font-face{font-family:"DM Sans";font-style:normal;font-weight:300 700;font-display:swap;src:url(shrift/dm-sans.woff2) format("woff2")}
:root{--creme:#f9faf2;--gruen:#2c3d2e;--gruen-tief:#1d2a1f;--blass:#dfe8d9;--linie:#c3ccba;--text:#26301f;--leise:#5a6650;--hell:#f9faf2;--hell-leise:rgba(249,250,242,.82);
--o1:8px;--o2:16px;--o3:24px;--o4:40px;--o5:64px;--o6:104px;--rand:clamp(20px,5.5vw,80px);--radius:14px}
*{box-sizing:border-box}
body{margin:0;background:var(--creme);color:var(--text);font:400 18px/1.7 "DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
.breite{max-width:1280px;margin:0 auto;padding:0 var(--rand)}
svg.z{width:1em;height:1em;fill:currentColor;flex:none}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.marke{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--leise)}
.marke::before{content:"[\00a0\00a0\00a0"} .marke::after{content:"\00a0\00a0\00a0]"}

.kopf{background:var(--gruen-tief);color:var(--hell)}
.leiste{display:flex;align-items:center;justify-content:space-between;gap:var(--o3);padding-top:var(--o3);padding-bottom:var(--o2);flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:var(--o1);min-height:44px;text-decoration:none;font-size:20px;font-weight:300;letter-spacing:.01em}
.logo svg{font-size:22px}
.menue{display:flex;gap:clamp(4px,2.2vw,36px);flex-wrap:wrap;margin-right:-6px}
.menue a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-size:13px;letter-spacing:.07em;text-transform:uppercase;text-decoration:none;opacity:.92}
.menue a:hover,.menue a[aria-current]{opacity:1;text-decoration:underline;text-underline-offset:6px}
.titel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center;padding-top:var(--o4);padding-bottom:var(--o5)}
.pfad{font-size:14px;color:var(--hell-leise)}
.pfad a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;text-underline-offset:5px}
.pfad span{margin:0 10px}
h1{margin-top:var(--o2);font-size:clamp(44px,7vw,96px);line-height:1;letter-spacing:-.02em;text-transform:uppercase;font-weight:300}
h1 b{display:block;font-weight:600;font-size:.42em;letter-spacing:0;text-transform:none;line-height:1.2;margin-top:var(--o3);opacity:.86}
.vorspann{margin-top:var(--o3);max-width:30em;color:var(--hell-leise);font-size:19px;line-height:1.55}
.titel img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius)}

.inhalt{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.9fr);gap:clamp(40px,8vw,120px);align-items:start;padding-top:var(--o6);padding-bottom:var(--o6)}
.text{max-width:40em}
.text h2{margin:var(--o5) 0 var(--o2);font-size:clamp(24px,2.6vw,32px);font-weight:600;line-height:1.2;letter-spacing:-.01em}
.text h2:first-child{margin-top:0}
.text p{margin-bottom:var(--o3)}
.text p.gross{font-size:clamp(22px,2.2vw,28px);line-height:1.35;color:var(--gruen)}
.text ul{margin:0 0 var(--o3)}
.text ul li{position:relative;padding:var(--o2) 0 var(--o2) 28px;border-bottom:1px solid var(--linie)}
.text ul li:first-child{border-top:1px solid var(--linie)}
.text ul li::before{content:"";position:absolute;left:4px;top:1.55em;width:8px;height:8px;border-radius:50%;background:var(--gruen)}
.text li b{font-weight:600}
.rand{position:sticky;top:var(--o3);display:grid;gap:var(--o3)}
.kasten{background:var(--blass);border-radius:var(--radius);padding:var(--o3) var(--o3) var(--o1)}
.kasten h2{margin-top:var(--o2);font-size:22px;font-weight:600;line-height:1.25}
.kasten ol{margin-top:var(--o2);counter-reset:k}
.kasten ol li{counter-increment:k;display:grid;grid-template-columns:2.2em minmax(0,1fr);padding:14px 0;border-top:1px solid var(--linie);font-size:16px;line-height:1.5}
.kasten ol li::before{content:counter(k,decimal-leading-zero);font-weight:600;color:var(--leise)}
.weiter li{border-bottom:1px solid var(--text);font-size:20px}
.weiter a{display:flex;justify-content:space-between;align-items:center;gap:var(--o2);min-height:64px;text-decoration:none;transition:padding .2s}
.weiter a:hover{padding-left:var(--o1);color:var(--leise)}
.weiter b{font-weight:600;font-variant-numeric:tabular-nums}
.zurueck{display:inline-flex;align-items:center;gap:10px;min-height:52px;margin-top:var(--o4);padding:0 26px;background:var(--gruen);color:var(--hell);font-weight:600;font-size:16px;text-decoration:none;border-radius:2px;transition:background .2s}
.zurueck:hover{background:var(--gruen-tief)}
.zurueck svg{transform:rotate(-135deg)}

.fuss{background:var(--blass);color:var(--leise);font-size:15px;line-height:1.6}
.fuss .breite{display:flex;justify-content:space-between;align-items:center;gap:var(--o3);flex-wrap:wrap;padding-top:var(--o4);padding-bottom:var(--o4)}
.fuss .logo{color:var(--gruen);font-size:24px}
.fuss .logo svg{font-size:26px}
.fuss p{max-width:38em}

@media (max-width:900px){
  :root{--o6:64px}
  .titel,.inhalt{grid-template-columns:1fr}
  .titel{gap:var(--o4)}
  .rand{position:static}
}
@media (max-width:600px){
  body{font-size:17px}
  .leiste{gap:0}
  .menue{width:100%;margin-left:-6px;gap:2px}
  .menue a{font-size:12px;letter-spacing:.04em}
  .vorspann{font-size:17px}
}
@media (max-width:360px){.menue{gap:0}.menue a{font-size:11px;letter-spacing:.02em;padding:0 5px}}