@font-face{font-family:Inter;
  src:url("/assets/schrift/inter-var.woff2?v=96818a07") format("woff2");
  font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:InterErsatz;font-weight:400 500;
  src:local('Arial'),local('ArialMT'),local('Helvetica Neue'),local('Helvetica'),
      local('Liberation Sans'),local('Roboto');
  size-adjust:106.15%;ascent-override:91.27%;descent-override:22.72%;
  line-gap-override:0%}
@font-face{font-family:InterErsatz;font-weight:600;
  src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Bold'),
      local('Helvetica-Bold'),local('Liberation Sans Bold');
  size-adjust:102.05%;ascent-override:94.93%;descent-override:23.64%;
  line-gap-override:0%}
@font-face{font-family:InterErsatz;font-weight:700;
  src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Bold'),
      local('Helvetica-Bold'),local('Liberation Sans Bold');
  size-adjust:103.80%;ascent-override:93.33%;descent-override:23.24%;
  line-gap-override:0%}

:root{
  --grund:#EDF1F6;
  --karte:#FFFFFF;
  --ruhe:#E3E9F1;
  --tinte:#0F1926;
  --mittel:#48566B;
  --leise:#5A6779;
  --haar:rgba(15,25,38,.12);
  --haar-stark:rgba(15,25,38,.22);
  --akzent:#17406B;
  --akzent-tief:#0E2C4B;
  --akzent-hell:#DEE7F1;
  --gruen:#15734A;
  --gruen-hell:#DFF0E7;
  --warm:#8C5409;
  --warm-hell:#F6EBDB;
  --dunkel:#0B1420;
  --schrift: Inter,InterErsatz,ui-sans-serif,-apple-system,
             BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,
             sans-serif;
  --pfeil:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h14.5M13 6.5 18.5 12 13 17.5' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --breit:1180px;
  --eng:760px;
  --rand:clamp(20px,5vw,60px);
  --luft:clamp(56px,8vw,112px);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--grund);color:var(--tinte);font-family:var(--schrift);
  font-size:17.5px;line-height:1.62;overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;
  min-height:100svh;display:flex;flex-direction:column}

main{flex:1 0 auto}
.fuss{flex:0 0 auto}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--akzent);outline-offset:3px;border-radius:3px}
.buehne :focus-visible,.band :focus-visible,.kopf.ueber :focus-visible{outline-color:#fff}

.huelle{max-width:var(--breit);margin:0 auto;padding-inline:var(--rand)}
.skip{position:fixed;left:12px;top:-80px;z-index:90;background:var(--akzent);
  color:#fff;padding:11px 18px;border-radius:8px;text-decoration:none;font-size:15px}
.skip:focus{top:12px}

.bild{display:block;position:relative;overflow:hidden;
  background-size:cover;background-position:center;background-color:var(--ruhe)}
.bild img{width:100%;height:100%;object-fit:cover}

.kopf{background:var(--karte);border-bottom:1px solid var(--haar)}
.kopf .zeile{display:flex;align-items:center;justify-content:space-between;
  gap:20px;min-height:74px;flex-wrap:wrap}
.marke{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.marke .wm{display:block;line-height:1.24}
.marke .wm b{display:block;font-size:15px;font-weight:700;letter-spacing:.055em;
  text-transform:uppercase;color:var(--tinte)}
.marke .wm i{display:block;font-style:normal;font-size:13px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--leise)}
.kopf nav{display:flex;gap:6px;flex-wrap:wrap}
.kopf nav a{display:inline-flex;align-items:center;min-height:36px;padding:0 11px;
  font-size:15.5px;color:var(--mittel);text-decoration:none;border-radius:7px}
.kopf nav a:hover{color:var(--akzent);background:var(--akzent-hell)}

.kopf.ueber{position:absolute;top:0;left:0;right:0;z-index:4;
  background:transparent;border-bottom:none;isolation:isolate}

.kopf.ueber::before{content:"";position:absolute;inset:0 0 auto 0;height:196px;
  z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,
    rgba(5,10,17,.52) 0%, rgba(5,10,17,.38) 40%, rgba(5,10,17,.17) 70%,
    rgba(5,10,17,.05) 88%, rgba(5,10,17,0) 100%)}
.kopf.ueber .marke .wm b{color:#fff}
.kopf.ueber .marke .wm i{color:rgba(255,255,255,.82)}
.kopf.ueber .zeichen rect{stroke:rgba(255,255,255,.5)}
.kopf.ueber .zeichen path{stroke:#fff}
.kopf.ueber nav a{color:rgba(255,255,255,.92)}
.kopf.ueber nav a:hover{color:#fff;background:rgba(255,255,255,.16)}

.buehne{position:relative;isolation:isolate;min-height:clamp(520px,86svh,860px);
  display:flex;align-items:flex-end;background:var(--dunkel)}
.buehne .bild{position:absolute;inset:0;z-index:-2}

.buehne::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to bottom,
    rgba(7,13,21,.34) 0%, rgba(7,13,21,.10) 20%,
    rgba(7,13,21,.46) 46%, rgba(7,13,21,.80) 74%,
    rgba(7,13,21,.92) 100%)}
.buehne-text{width:100%;padding-block:clamp(40px,7vw,86px) clamp(34px,6vw,72px);
  color:#fff}
.buehne .ort{font-size:13.5px;letter-spacing:.17em;text-transform:uppercase;
  color:rgba(255,255,255,.86);margin-bottom:18px}
.buehne h1{font-size:clamp(34px,6.2vw,66px);line-height:1.06;font-weight:700;
  letter-spacing:-.022em;text-wrap:balance;max-width:16em;
  text-shadow:0 2px 24px rgba(4,9,15,.45)}
.buehne .fuehrung{margin-top:20px;max-width:34em;font-size:clamp(17px,2vw,20.5px);
  line-height:1.58;color:rgba(255,255,255,.94);
  text-shadow:0 1px 16px rgba(4,9,15,.5)}

.merkmale{background:var(--karte);border-bottom:1px solid var(--haar)}
.merkmale ul{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.merkmale li{flex:1 1 230px;display:flex;gap:12px;align-items:flex-start;
  padding:24px 26px 24px 0;border-right:1px solid var(--haar)}
.merkmale li:last-child{border-right:none}
.merkmale li+li{padding-left:26px}
.merkmale li .marke-z{flex:0 0 auto;margin-top:5px;color:var(--gruen)}
.merkmale li:nth-child(2) .marke-z,.merkmale li:nth-child(3) .marke-z{color:var(--akzent)}
.merkmale b{display:block;font-size:clamp(20px,2.4vw,26px);line-height:1.2;
  letter-spacing:-.015em;color:var(--akzent)}
.merkmale span{display:block;margin-top:4px;font-size:15.5px;color:var(--leise)}

.rubrik{font-size:13px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--leise);margin-bottom:14px}
h2{font-size:clamp(27px,3.9vw,41px);line-height:1.14;font-weight:700;
  letter-spacing:-.02em;text-wrap:balance}
h2+p,h2+.satz{margin-top:18px}
p+p{margin-top:15px}
.satz{max-width:40em;color:var(--mittel);font-size:clamp(17px,1.9vw,19px)}

.doppel{padding-block:var(--luft)}
.paar{display:grid;gap:clamp(28px,4.5vw,60px);align-items:center;
  grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){
  .paar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .doppel.gedreht .paar>.bild{order:-1}
}
.wort p{color:var(--mittel);max-width:38em}
.doppel .bild{border-radius:14px;aspect-ratio:3/2;box-shadow:0 18px 44px rgba(11,20,32,.13)}

.band{position:relative;isolation:isolate;display:flex;align-items:center;
  min-height:clamp(300px,46svh,470px);background:var(--dunkel)}
.band.schmal{min-height:clamp(250px,38svh,400px)}
.band .bild{position:absolute;inset:0;z-index:-2}
.band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,
    rgba(6,12,20,.86) 0%, rgba(6,12,20,.78) 38%,
    rgba(6,12,20,.56) 62%, rgba(6,12,20,.22) 88%,
    rgba(6,12,20,.10) 100%)}
.band-text{width:100%;color:#fff}
.band-text p{font-size:clamp(23px,3.5vw,38px);line-height:1.2;font-weight:600;
  letter-spacing:-.018em;max-width:20em;text-wrap:balance;
  text-shadow:0 2px 20px rgba(4,9,15,.5)}

.spalten{padding-block:var(--luft);background:var(--karte)}
.drei{display:grid;gap:clamp(26px,3.4vw,44px);margin-top:clamp(30px,4vw,48px);
  grid-template-columns:minmax(0,1fr)}
@media (min-width:820px){.drei{grid-template-columns:repeat(3,minmax(0,1fr))}}
.drei>div{padding-top:20px;border-top:2px solid var(--akzent)}
.drei b{display:block;font-size:19px;line-height:1.32;letter-spacing:-.012em}
.drei p{margin-top:10px;color:var(--mittel);font-size:16.5px}

.ablauf{padding-block:var(--luft)}
.schritte{list-style:none;margin:clamp(30px,4vw,48px) 0 0;padding:0}
.schritte li{display:flex;gap:clamp(18px,3vw,34px);padding:22px 0;
  border-top:1px solid var(--haar)}
.schritte li:last-child{border-bottom:1px solid var(--haar)}
.schritte .nr{flex:0 0 auto;display:inline-flex;align-items:center;
  justify-content:center;width:38px;height:38px;border-radius:50%;
  background:var(--akzent-hell);color:var(--akzent);
  font-size:14px;font-weight:700;letter-spacing:.04em}
.schritte b{display:block;font-size:19px;line-height:1.34;letter-spacing:-.012em}
.schritte p{margin-top:7px;color:var(--mittel);font-size:16.5px;max-width:44em}

.quote{display:flex;gap:16px;align-items:flex-start;
  margin-top:clamp(28px,3.4vw,42px);padding:22px 24px;
  background:var(--gruen-hell);border-radius:14px}
.quote>svg{flex:0 0 auto;margin-top:1px}
.quote b{display:block;font-size:clamp(18px,2.1vw,21px);line-height:1.32;
  letter-spacing:-.012em}
.quote p{margin-top:7px;color:var(--mittel);font-size:16px;line-height:1.55;
  max-width:44em}

.klar{list-style:none;margin:26px 0 0;padding:0}
.klar li{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--haar)}
.klar li svg{flex:0 0 auto;margin-top:1px}
.klar span{color:var(--mittel);font-size:16.5px}
.klar b{color:var(--tinte)}

.ort-block{padding-block:var(--luft);background:var(--karte)}
.ort-block .bild{border-radius:14px;aspect-ratio:3/2;
  box-shadow:0 18px 44px rgba(11,20,32,.13)}
@media (min-width:900px){.ort-block .paar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.angaben{padding-block:clamp(44px,6vw,76px);border-top:1px solid var(--haar)}
.angaben h2{font-size:clamp(19px,2.2vw,22px);letter-spacing:.01em}
.angaben dl{display:grid;gap:0 clamp(24px,4vw,56px);margin-top:22px;
  grid-template-columns:minmax(0,1fr)}
@media (min-width:720px){.angaben dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.angaben dl>div{display:flex;gap:16px;padding:11px 0;border-top:1px solid var(--haar);
  font-size:15.5px}
.angaben dt{flex:0 0 42%;color:var(--leise)}
.angaben dd{color:var(--mittel)}
.angaben dd a{display:inline-flex;align-items:center;min-height:36px;
  color:var(--akzent);text-decoration:underline;text-underline-offset:3px}
.quelle{margin-top:22px;font-size:15.5px;color:var(--leise);max-width:46em}
.pruefen{display:inline-flex;align-items:center;gap:8px;min-height:40px;
  color:var(--akzent);font-weight:600;text-decoration:underline;
  text-underline-offset:3px}
.pruefen::after{content:"";flex:0 0 auto;width:.82em;height:.82em;
  background:currentColor;
  -webkit-mask:var(--pfeil) center/contain no-repeat;
          mask:var(--pfeil) center/contain no-repeat;
  transform:translateY(.02em);transition:transform .2s cubic-bezier(.2,.8,.3,1)}
.pruefen:hover::after{transform:translate(2px,.02em)}
@media (prefers-reduced-motion:reduce){.pruefen::after{transition:none}
  .pruefen:hover::after{transform:translateY(.02em)}}

.auf{padding-block:clamp(44px,6vw,80px)}
.text{max-width:var(--eng)}
.text h1{font-size:clamp(30px,4.4vw,44px);line-height:1.12;font-weight:700;
  letter-spacing:-.022em}
.text h2{font-size:clamp(19px,2.3vw,23px);margin-top:34px;letter-spacing:-.008em}
.text h2+p,.text h2+ul,.text h2+address{margin-top:11px}
.text p,.text li,.text address{color:var(--mittel);font-size:16.5px}
.text address{font-style:normal;line-height:1.62}
.text ul{margin:0 0 0 20px}
.text li{margin-top:7px}
.text a[href^="tel:"],.text a[href^="mailto:"]{display:inline-flex;align-items:center;
  min-height:40px;color:var(--akzent);text-decoration:underline;text-underline-offset:3px}
.text .vorlauf{font-size:19px;color:var(--mittel);margin-top:16px}

.fuss{background:var(--dunkel);color:rgba(255,255,255,.72);
  padding-block:clamp(32px,4vw,48px);font-size:15.5px}
.fuss .zeile{display:flex;flex-wrap:wrap;gap:12px 24px;
  justify-content:space-between;align-items:center}
.fuss nav{display:flex;gap:18px;flex-wrap:wrap}
.fuss a{display:inline-flex;align-items:center;min-height:38px;
  color:rgba(255,255,255,.88);text-decoration:underline;text-underline-offset:3px}
.fuss a:hover{color:#fff}
.fuss .register{margin-top:16px;padding-top:16px;font-size:14px;line-height:1.6;
  color:rgba(255,255,255,.66);border-top:1px solid rgba(255,255,255,.14);max-width:60em}

.verlauf{margin:clamp(30px,4vw,48px) 0 0}
.verlauf svg{display:block;width:100%;height:clamp(96px,11vw,150px)}
.verlauf figcaption{display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;margin-top:10px;padding-top:11px;border-top:1px solid var(--haar);
  font-size:14.5px;color:var(--leise)}
.verlauf-ende{font-weight:700;color:var(--akzent)}

.formen{padding-block:var(--luft);background:var(--karte)}
.formen .satz{margin-top:16px}
.formliste{list-style:none;display:grid;gap:clamp(14px,1.8vw,20px);padding:0;
  margin:clamp(32px,4vw,48px) 0 0;grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){.formliste{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:960px){.formliste{grid-template-columns:repeat(3,minmax(0,1fr))}}
.formliste li{padding:20px 20px 22px;border:1px solid var(--haar);border-radius:14px;
  background:var(--grund);
  transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease}
.formliste li:hover{border-color:var(--akzent);transform:translateY(-3px);
  box-shadow:0 14px 32px rgba(11,20,32,.10)}
.formliste b{display:block;margin-top:15px;font-size:17.5px;letter-spacing:-.008em}
.formliste p{margin-top:6px;color:var(--mittel);font-size:15.5px;line-height:1.55}
.marke-z{display:block;color:var(--akzent)}
.formliste li .marke-z{display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:12px;background:var(--akzent-hell);
  padding:9px;box-sizing:content-box;width:26px;height:26px}

.stufen{padding-block:var(--luft);background:var(--ruhe)}
.stufen .satz{margin-top:16px;max-width:44em}
.stufen .quelle{margin-top:clamp(26px,3vw,36px);padding-top:18px;
  border-top:1px solid var(--haar)}
.stufenliste{list-style:none;display:grid;gap:clamp(20px,2.6vw,32px);padding:0;
  margin:clamp(32px,4vw,48px) 0 0;grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.stufenliste{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (min-width:1000px){.stufenliste{grid-template-columns:repeat(3,minmax(0,1fr))}}
.stufenliste li{display:flex;gap:14px;align-items:flex-start;padding-top:19px;
  border-top:2px solid var(--gruen)}
.stufenliste .marke-z{flex:0 0 auto;margin-top:1px;color:var(--gruen)}
.stufenliste b{display:block;font-size:18px;letter-spacing:-.01em}
.stufenliste p{margin-top:7px;color:var(--mittel);font-size:15.5px;line-height:1.55}

.center{padding-block:var(--luft);background:var(--karte)}
.center-kopf{max-width:46em}
.center .satz{margin-top:16px;max-width:42em}
.center .quelle{margin-top:clamp(26px,3.2vw,38px);padding-top:18px;
  border-top:1px solid var(--haar);max-width:48em}
.center-paar{display:grid;gap:clamp(30px,4.5vw,56px);align-items:start;
  margin-top:clamp(32px,4vw,52px);grid-template-columns:minmax(0,1fr)}
@media (min-width:920px){.center-paar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.center-punkte{list-style:none;margin:0;padding:0}
.center-punkte li{display:flex;gap:13px;align-items:flex-start;padding:18px 0;
  border-top:1px solid var(--haar)}
.center-punkte li .marke-z{flex:0 0 auto;margin-top:2px;color:var(--gruen)}
.center-punkte li:last-child{border-bottom:1px solid var(--haar)}
.center-punkte b{display:block;font-size:18px;letter-spacing:-.01em}
.center-punkte p{margin-top:6px;color:var(--mittel);font-size:16px;line-height:1.55}

.kc{margin:0}
.kc-rahmen{background:var(--karte);color:var(--tinte);border-radius:16px;
  overflow:hidden;border:1px solid var(--haar-stark);
  box-shadow:0 18px 44px rgba(11,20,32,.10)}
.kc-oben{padding:17px 20px;border-bottom:1px solid var(--haar);
  background:var(--grund)}
.kc-oben b{font-size:15.5px;letter-spacing:-.005em}
.kc-zeile+.kc-zeile,.kc-fuss{border-top:1px solid var(--haar)}
.kc-kopf{display:flex;align-items:center;gap:12px;padding:15px 20px}
.kc-pu{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px}
.kc-pu{background:var(--akzent-hell);color:var(--akzent)}
.kc-pu .marke-z{stroke-width:1.5}
.kc-kopf b{font-size:15.5px;font-weight:600;letter-spacing:-.005em}
.kc-stand{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  font-size:13.5px;font-weight:600;padding:4px 11px 4px 9px;border-radius:999px}
.kc-stand i{width:7px;height:7px;border-radius:50%;background:currentColor;
  flex:0 0 auto}
.kc-stand.kc-fertig{color:var(--gruen);background:var(--gruen-hell)}
.kc-stand.kc-laeuft{color:var(--warm);background:var(--warm-hell)}
.kc-pf{flex:0 0 auto;color:var(--leise)}
.kc-auf{background:var(--akzent-hell)}
.kc-auf .kc-kopf b{color:var(--akzent)}
.kc-auf .kc-pf{color:var(--akzent)}
.kc-detail{padding:0 20px 18px 62px}
.kc-detail p{font-size:14.5px;line-height:1.6;color:var(--mittel)}
.kc-firma{font-weight:700;color:var(--tinte);margin-bottom:5px}
.kc-links{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:11px}
.kc-link{font-size:14.5px;color:var(--akzent);text-decoration:underline;
  text-underline-offset:3px}
.kc-fuss{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;
  padding:15px 20px;background:var(--grund);font-size:14.5px;color:var(--mittel)}
.kc-fw{display:inline-flex;align-items:center;gap:9px}
.kc-fuss .marke-z{flex:0 0 auto;color:var(--leise);stroke-width:1.5}
.kc figcaption{margin-top:13px;font-size:14px;line-height:1.5;color:var(--leise)}
@media (max-width:480px){
  .kc-detail{padding-left:20px}
  .kc-kopf{flex-wrap:wrap;row-gap:10px}
  .kc-kopf b{flex:1 1 auto;min-width:0}
  .kc-stand{order:3;margin-left:48px}
  .kc-pf{margin-left:auto;order:2}
}

.leise-kontakt{padding-block:clamp(30px,3.6vw,46px);background:var(--ruhe)}
.leise-kontakt p{max-width:58em;color:var(--mittel);font-size:16px;
  line-height:1.6}
.leise-kontakt a{display:inline-flex;align-items:center;min-height:40px;
  color:var(--akzent);text-decoration:underline;text-underline-offset:3px}

.marken{padding-block:var(--luft)}
.markenliste{list-style:none;display:grid;gap:0 clamp(24px,4vw,52px);padding:0;
  margin:clamp(30px,4vw,44px) 0 0;grid-template-columns:minmax(0,1fr)}
@media (min-width:700px){.markenliste{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (min-width:1050px){.markenliste{grid-template-columns:repeat(3,minmax(0,1fr))}}
.markenliste li{display:flex;gap:13px;align-items:flex-start;padding:17px 0;
  border-top:1px solid var(--haar)}
.markenliste .marke-z{flex:0 0 auto;margin-top:2px;color:var(--gruen)}
.markenliste b{display:block;font-size:16.5px;letter-spacing:-.006em}
.markenliste span{display:block;margin-top:3px;color:var(--leise);font-size:15px;
  line-height:1.5}

@media (prefers-reduced-motion:no-preference){

  .buehne .bild img{animation:heran 28s ease-out both}
  @keyframes heran{from{transform:scale(1.06)}to{transform:scale(1)}}

  @supports (animation-timeline: view()){
    .auf-sicht,.formliste li,.markenliste li,.stufenliste li,.schritte li,.center-punkte li{
      animation:auftauchen linear both;
      animation-timeline:view();
      animation-range:entry 8% cover 26%}
    @keyframes auftauchen{
      from{opacity:0;transform:translateY(18px)}
      to{opacity:1;transform:none}}

    .formliste li{animation-name:einordnen-unten}
    @keyframes einordnen-unten{
      from{opacity:0;transform:translate3d(0,30px,0) scale(.965)}
      to{opacity:1;transform:none}}
    @keyframes einordnen-links{
      from{opacity:0;transform:translate3d(-34px,16px,0) scale(.965)}
      to{opacity:1;transform:none}}
    @keyframes einordnen-rechts{
      from{opacity:0;transform:translate3d(34px,16px,0) scale(.965)}
      to{opacity:1;transform:none}}
    @media (min-width:960px){
      .formliste li:nth-child(3n+1){animation-name:einordnen-links}
      .formliste li:nth-child(3n){animation-name:einordnen-rechts}

      .formliste li:nth-child(3n+2){animation-range:entry 4% cover 24%}
      .formliste li:nth-child(3n){animation-range:entry 12% cover 30%}
    }
    @media (min-width:600px) and (max-width:959px){
      .formliste li:nth-child(2n+1){animation-name:einordnen-links}
      .formliste li:nth-child(2n){animation-name:einordnen-rechts}
    }

    @media (min-width:1000px){
      .stufenliste li:nth-child(3n+1){animation-range:entry 6% cover 24%}
      .stufenliste li:nth-child(3n){animation-range:entry 14% cover 32%}
    }
  }

  .formliste li .marke-z{transition:transform .28s cubic-bezier(.2,.8,.3,1)}
  .formliste li:hover .marke-z{transform:translateY(-2px) rotate(-6deg) scale(1.08)}
}

@media (max-width:620px){
  .merkmale li{flex:1 1 100%;border-right:none;border-bottom:1px solid var(--haar);
    padding:18px 0}
  .merkmale li+li{padding-left:0}
  .merkmale li:last-child{border-bottom:none}
  .kopf .zeile{padding-block:12px}
  .kopf nav a{padding:0 9px;font-size:15px}
  .schritte li{gap:14px}
}

@media (max-width:1150px){
  .band::before{background:linear-gradient(to bottom,
    rgba(6,12,20,.56) 0%, rgba(6,12,20,.68) 48%, rgba(6,12,20,.82) 100%)}
}
@media (max-width:760px){
  .kopf.ueber::before{height:272px;
    background:linear-gradient(to bottom,
      rgba(5,10,17,.68) 0%, rgba(5,10,17,.58) 34%, rgba(5,10,17,.40) 58%,
      rgba(5,10,17,.16) 82%, rgba(5,10,17,0) 100%)}
  .buehne::before{background:linear-gradient(to bottom,
    rgba(7,13,21,.30) 0%, rgba(7,13,21,.12) 22%,
    rgba(7,13,21,.44) 52%, rgba(7,13,21,.76) 74%,
    rgba(7,13,21,.92) 100%)}
}
@media (max-width:420px){

  .buehne::before{background:linear-gradient(to bottom,
    rgba(7,13,21,.30) 0%, rgba(7,13,21,.14) 20%,
    rgba(7,13,21,.64) 48%, rgba(7,13,21,.82) 72%,
    rgba(7,13,21,.93) 100%)}
}

@media print{
  .auf-sicht,.formliste li,.markenliste li,.stufenliste li,.schritte li,.center-punkte li,.buehne .bild img{
    animation:none!important;opacity:1!important;transform:none!important}
}