/* ============================================================ Grundlagen */
:root{
  --tief:#0C201A;          /* Grundton der dunklen Abschnitte */
  --tief-2:#14312A;        /* dunkle Karte */
  --tief-3:#081611;        /* Fussbereich */
  --gruen:#2FB570;
  --gruen-hell:#4BD08B;
  --gruen-tief:#1B8B54;
  --gruen-titel:#1B8B54;   /* grosse Ueberschrift auf hellem Grund */
  --gruen-text:#127544;    /* kleiner gruener Text auf hellem Grund */
  --papier:#F1F4F1;
  --weiss:#fff;
  --tinte:#0B1512;
  --grau:#56675F;
  --linie:rgba(11,21,18,.10);
  --linie-hell:rgba(255,255,255,.12);
  --r:18px;
  --bogen:72px;
  --kopf:78px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--kopf) + 18px);-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--weiss);color:var(--tinte);
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:16px;line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,form{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit}

.breite{width:100%;max-width:1230px;margin-inline:auto;padding-inline:clamp(20px,5vw,44px)}
.sprung{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gruen);color:#05231A;
  padding:12px 20px;border-radius:0 0 12px 0;font-weight:700}
.sprung:focus{left:0}
:focus-visible{outline:3px solid var(--gruen-hell);outline-offset:3px;border-radius:6px}

/* ================================================================ Schrift */
.titel{
  font-weight:800;text-transform:uppercase;line-height:1.02;
  letter-spacing:-.018em;font-size:clamp(28px,4.1vw,50px);color:var(--tinte);
  text-wrap:balance;
}
.titel--hell{color:var(--weiss)}
.titel--held{font-size:clamp(36px,6.4vw,74px);line-height:.98;letter-spacing:-.026em}
.gruen{color:var(--gruen)}
.abschnitt--papier .gruen,.abschnitt--weiss .gruen{color:var(--gruen-titel)}
.weiss{color:var(--weiss)}

.augenbraue{
  font-size:14px;font-weight:700;color:var(--grau);margin-bottom:14px;
}
.augenbraue--hell{color:rgba(255,255,255,.62)}

.fliess{font-size:16.5px;color:var(--grau);margin-top:20px;max-width:56ch}
.fliess--hell{color:rgba(255,255,255,.68)}
.fliess--kurz{max-width:46ch}

/* ================================================================ Knoepfe */
.knopf{
  display:inline-flex;align-items:center;gap:14px;text-decoration:none;
  padding:15px 20px 15px 28px;border-radius:999px;border:0;cursor:pointer;
  font-size:13px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease;
  white-space:nowrap;
}
.knopf:hover{transform:translateY(-2px)}
.knopf--gruen{background:var(--gruen);color:#04231a;box-shadow:0 12px 26px -16px rgba(47,181,112,.9)}
.knopf--gruen:hover{background:var(--gruen-hell)}
.knopf--tinte{background:var(--tinte);color:var(--weiss)}
.knopf--tinte:hover{background:#17302a}
.knopf--klein{padding:12px 18px;font-size:11.5px;letter-spacing:.06em}
.knopf .pfeil{
  width:26px;height:26px;border-radius:999px;flex:0 0 auto;
  background:rgba(255,255,255,.22) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/15px no-repeat;
}
.knopf--gruen .pfeil{
  background-color:rgba(4,35,26,.18);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2304231a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* ============================================================== Kopfleiste */
.kopf{position:sticky;top:0;z-index:60;background:var(--tief);border-bottom:1px solid rgba(255,255,255,.07)}
.kopf__reihe{display:flex;align-items:center;gap:clamp(16px,3vw,40px);min-height:var(--kopf)}
.marke{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--weiss);flex:0 0 auto}
.marke__zeichen{width:32px;height:36px;color:var(--gruen)}
.marke__text{display:flex;flex-direction:column;line-height:1.1}
.marke__text b{font-size:17px;font-weight:800;letter-spacing:.14em}
.marke__text i{font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;color:rgba(255,255,255,.5)}

.nav{display:flex;gap:clamp(14px,2vw,28px);margin-inline:auto}
.nav a{text-decoration:none;color:rgba(255,255,255,.82);font-size:14.5px;font-weight:500;
  padding:6px 0;border-bottom:2px solid transparent;transition:color .16s,border-color .16s}
.nav a:hover{color:var(--weiss);border-color:var(--gruen)}

.kopf__rechts{display:flex;align-items:center;gap:16px;margin-left:auto}
.kopf__tel{display:flex;flex-direction:column;align-items:flex-end;text-decoration:none;color:var(--weiss);line-height:1.25}
.kopf__tel span{font-size:10.5px;font-weight:600;letter-spacing:.06em;color:rgba(255,255,255,.5)}
.kopf__tel b{font-size:16px;font-weight:800;letter-spacing:.01em}
.brenner{display:none;width:42px;height:42px;border:1px solid var(--linie-hell);background:none;
  border-radius:12px;padding:0;place-items:center;cursor:pointer}
.brenner span{display:block;width:18px;height:2px;background:var(--weiss);margin:3.5px auto;border-radius:2px;transition:.2s}
.brenner[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.brenner[aria-expanded="true"] span:nth-child(2){opacity:0}
.brenner[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

/* ================================================================ Abschnitt */
.abschnitt{padding:clamp(64px,8vw,116px) 0}
.abschnitt--papier{background:var(--papier)}
.abschnitt--weiss{background:var(--weiss)}
.abschnitt--tief{background:var(--tief);color:var(--weiss)}
.abschnitt--naht{padding-top:0}

.kopfzeile{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;
  margin-bottom:clamp(34px,4vw,54px);flex-wrap:wrap}

/* ================================================================= Bogen */
.bogen{position:relative;border-radius:0 var(--bogen) 0 var(--bogen);overflow:hidden;margin:0}
.bogen img{width:100%;height:100%;object-fit:cover}
.bogen--rahmen{isolation:isolate}
.bogen--rahmen::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset;
}

/* ================================================================ Kopfbild */
.held{background:var(--tief);color:var(--weiss);padding:clamp(46px,6vw,74px) 0 clamp(56px,7vw,96px);
  position:relative;overflow:hidden}
.held::after{
  content:"";position:absolute;right:-14vw;top:-8vw;width:44vw;height:44vw;border-radius:50%;
  background:radial-gradient(circle,rgba(47,181,112,.16),transparent 66%);pointer-events:none;
}
.held__gitter{display:grid;grid-template-columns:1.02fr .82fr;gap:clamp(28px,5vw,64px);align-items:center;
  position:relative;z-index:1}
.held__zeile{margin:26px 0 30px;font-size:17px;color:rgba(255,255,255,.72);max-width:44ch}
.held__marken{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.held__marken li{font-size:12px;font-weight:600;letter-spacing:.04em;color:rgba(255,255,255,.72);
  border:1px solid var(--linie-hell);border-radius:999px;padding:8px 15px}
.held__bild{position:relative;justify-self:end;width:100%;max-width:430px}
.held__bild::before{
  content:"";position:absolute;top:-20px;right:-20px;bottom:20px;left:20px;
  border:1.5px solid var(--gruen);border-radius:0 var(--bogen) 0 var(--bogen);
}
.held__bild .bogen{aspect-ratio:4/5}

/* ================================================================ Probleme */
.probleme__gitter{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(28px,4.5vw,64px);align-items:start}
.probleme__text .knopf{margin-top:30px}
.probleme__karten{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linie);
  border-radius:0 var(--bogen) 0 var(--bogen);overflow:hidden}
.pkarte{background:var(--weiss);padding:clamp(22px,2.4vw,30px);position:relative;overflow:hidden;
  display:flex;flex-direction:column;gap:10px}
.pkarte__ziffer{position:absolute;right:14px;bottom:-16px;font-size:96px;font-weight:800;line-height:1;
  color:transparent;-webkit-text-stroke:1.4px rgba(11,21,18,.11);letter-spacing:-.03em}
.pkarte__zeichen{width:42px;height:42px;border-radius:999px;background:var(--gruen);color:#04231a;
  display:grid;place-items:center;flex:0 0 auto}
.pkarte__zeichen svg{width:22px;height:22px}
.pkarte h3{font-size:17px;font-weight:800;line-height:1.25;position:relative;z-index:1}
.pkarte p{font-size:14.5px;color:var(--grau);position:relative;z-index:1;padding-right:46px}
.pkarte--hell{background:var(--gruen);color:#04231a}
.pkarte--hell p{color:rgba(4,35,26,.78)}
.pkarte--hell .pkarte__zeichen{background:#04231a;color:var(--gruen)}
.pkarte--hell .pkarte__ziffer{-webkit-text-stroke-color:rgba(4,35,26,.17)}

/* =================================================================== Ueber */
.ueber__gitter{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(30px,5vw,72px);align-items:center}
.ueber__bild{aspect-ratio:4/5;max-width:420px}
.zahlen{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:38px}
.zahlen li{display:flex;flex-direction:column;gap:2px}
.zahlen__zeichen{width:44px;height:44px;border-radius:999px;background:var(--gruen);color:#04231a;
  display:grid;place-items:center;margin-bottom:12px}
.zahlen__zeichen svg{width:23px;height:23px}
.zahlen b{font-size:clamp(28px,3.4vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.zahlen__wort{font-size:13px;font-weight:700}
.zahlen__zusatz{font-size:13px;color:var(--grau);line-height:1.45;margin-top:4px}

/* =============================================================== Leistungen */
.lkarten{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.lkarte{background:var(--weiss);border-radius:20px 20px 20px 20px;padding:24px;display:flex;
  flex-direction:column;gap:16px;border:1px solid var(--linie)}
.lkarte h3{font-size:18px;font-weight:800;letter-spacing:-.01em}
.lkarte figure{border-radius:12px 12px 56px 12px;overflow:hidden;aspect-ratio:25/16;margin:0}
.lkarte figure img{width:100%;height:100%;object-fit:cover}
.lkarte__zeile{font-size:14.5px;font-weight:600;line-height:1.45}
.lkarte__fuss{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}

.haken{display:grid;gap:9px}
.haken li{position:relative;padding-left:26px;font-size:14.5px;color:var(--grau);line-height:1.45}
.haken li::before{
  content:"";position:absolute;left:0;top:2px;width:17px;height:17px;border-radius:999px;
  border:1.4px solid var(--gruen-titel);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B8B54' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5 10 17l9-10'/%3E%3C/svg%3E") center/10px no-repeat;
}
.haken--hell li{color:rgba(255,255,255,.74)}
.haken--hell li::before{
  border-color:var(--gruen);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232FB570' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5 10 17l9-10'/%3E%3C/svg%3E");
}
.haken--zwei{grid-template-columns:1fr 1fr;gap:14px 26px;margin-top:28px}

.kanaele{display:flex;gap:8px}
.kanal{width:32px;height:32px;border-radius:999px;display:grid;place-items:center;color:var(--weiss);
  text-decoration:none;transition:transform .16s}
.kanal:hover{transform:translateY(-2px)}
.kanal svg{width:18px;height:18px}
.kanal--wa{background:#1FA855}
.kanal--sig{background:#2C6BED}
.kanal--mail{background:#41564D}

/* ================================================================ Vorteile */
.vkarten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vkarte{background:var(--tief-2);border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:12px}
.vkarte:nth-child(2),.vkarte:nth-child(5){transform:translateY(26px)}
.vkarte__zeichen{width:42px;height:42px;border-radius:999px;background:rgba(255,255,255,.07);
  color:var(--gruen);display:grid;place-items:center;margin-bottom:6px}
.vkarte__zeichen svg{width:22px;height:22px}
.vkarte h3{font-size:16.5px;font-weight:800;color:var(--weiss);line-height:1.3}
.vkarte p{font-size:14.5px;color:rgba(255,255,255,.66);line-height:1.55}

/* ================================================================== Ablauf */
.ablauf__gitter{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:start}
.ablauf__text{position:sticky;top:calc(var(--kopf) + 34px)}
.ablauf__text .knopf{margin-top:28px}
.schritte{display:grid;gap:16px}
.schritt{position:relative;overflow:hidden;background:var(--papier);padding:26px 30px;
  border-radius:18px 84px 84px 18px}
.schritt__ziffer{position:absolute;right:24px;bottom:-22px;font-size:104px;font-weight:800;line-height:1;
  color:transparent;-webkit-text-stroke:1.4px rgba(11,21,18,.09);letter-spacing:-.03em}
.schritt__marke{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gruen-text)}
.schritt h3{font-size:19px;font-weight:800;margin:6px 0 8px;position:relative;z-index:1}
.schritt p{font-size:14.5px;color:var(--grau);position:relative;z-index:1;max-width:54ch;padding-right:56px}

/* =================================================================== Faelle */
.faelle__gitter{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(28px,5vw,64px);align-items:start}
.faelle__text .knopf{margin-top:28px}
.faelle__buehne{min-width:0}
.faelle__bahn{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;padding-bottom:6px}
.faelle__bahn::-webkit-scrollbar{display:none}
.fall{flex:0 0 100%;scroll-snap-align:start;background:var(--tief-2);border-radius:24px;overflow:hidden}
.fall__kopf{background:var(--gruen);color:#04231a;padding:18px 26px;text-align:center;
  font-size:14px;font-weight:600;border-radius:0 0 64px 0}
.fall__kopf b{display:block;font-size:17px;font-weight:800;margin-top:3px}
.fall__leib{padding:24px 26px 30px;display:grid;gap:8px}
.fall__leib h3{font-size:13px;font-weight:800;color:var(--gruen);letter-spacing:.06em;
  text-transform:uppercase;margin-top:12px}
.fall__leib h3:first-child{margin-top:0}
.fall__leib>p{font-size:14.5px;color:rgba(255,255,255,.74)}
.punkte{display:flex;justify-content:center;gap:9px;margin-top:24px;flex-wrap:wrap}
.punkte button{width:9px;height:9px;border-radius:999px;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.24);transition:.18s}
.punkte button[aria-selected="true"]{background:var(--gruen);transform:scale(1.5)}

/* ============================================================ Dringlichkeit */
.jetzt__gitter{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(28px,5vw,64px);align-items:center;
  padding-top:clamp(48px,6vw,86px);border-top:1px solid rgba(255,255,255,.08)}
.jetzt__text .knopf{margin-top:32px}
.jetzt__bild{position:relative;max-width:430px;justify-self:end;width:100%}
.jetzt__bild::before{
  content:"";position:absolute;top:-20px;left:-20px;bottom:20px;right:20px;
  border:1.5px solid var(--gruen);border-radius:var(--bogen) 0 var(--bogen) 0;
}
.jetzt__bild .bogen{aspect-ratio:4/5;border-radius:var(--bogen) 0 var(--bogen) 0}

/* =================================================================== Fragen */
.fragen__gitter{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(28px,4.5vw,58px);align-items:start}
.fragen__bild{aspect-ratio:4/5;max-width:380px}
.fragen__liste{display:grid;gap:12px}
.frage{background:var(--weiss);border-radius:16px;border:1px solid var(--linie);overflow:hidden;
  transition:background-color .2s}
.frage summary{list-style:none;cursor:pointer;padding:19px 58px 19px 24px;position:relative;
  font-size:16px;font-weight:700;line-height:1.35}
.frage summary::-webkit-details-marker{display:none}
.frage summary::after{
  content:"";position:absolute;right:22px;top:50%;width:16px;height:16px;margin-top:-8px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1512' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/16px no-repeat;
  transition:transform .2s;
}
.frage[open]{background:var(--tinte);border-color:var(--tinte);color:var(--weiss)}
.frage[open] summary::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
}
.frage__leib{padding:0 24px 22px}
.frage__leib p{font-size:14.5px;color:rgba(255,255,255,.72);line-height:1.6}

/* ================================================================== Kontakt */
.kontakt__gitter{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,60px);align-items:start}
.kontakt__liste{display:grid;gap:12px;margin-top:32px}
.kontakt__liste li{display:flex;align-items:center;gap:16px;background:var(--papier);
  border-radius:14px;padding:14px 18px}
.kontakt__zeichen{width:42px;height:42px;border-radius:999px;background:var(--gruen);color:#04231a;
  display:grid;place-items:center;flex:0 0 auto}
.kontakt__zeichen svg{width:22px;height:22px}
.kontakt__liste i{display:block;font-style:normal;font-size:12px;font-weight:600;color:var(--grau)}
.kontakt__liste a,.kontakt__liste b{font-size:16px;font-weight:800;text-decoration:none}
.kontakt__liste b{font-weight:700;font-size:15px}
.kontakt__sozial{display:flex;align-items:center;gap:9px;margin-top:26px;padding-top:22px;
  border-top:1px solid var(--linie);font-size:14px;font-weight:600;color:var(--grau)}

.formular{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}
.feld{display:grid;gap:6px}
.feld--breit{grid-column:1/-1}
.feld label{font-size:12.5px;font-weight:700;color:var(--grau)}
.feld input,.feld textarea{
  font:inherit;font-size:15px;padding:13px 15px;border:1px solid var(--linie);border-radius:12px;
  background:var(--weiss);color:var(--tinte);width:100%;resize:vertical;
}
.feld input::placeholder,.feld textarea::placeholder{color:#77867F}
.feld input:focus,.feld textarea:focus{border-color:var(--gruen);outline:none;
  box-shadow:0 0 0 3px rgba(47,181,112,.18)}
.haekchen{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--grau);line-height:1.5}
.haekchen input{margin-top:2px;width:17px;height:17px;accent-color:var(--gruen);flex:0 0 auto}
.formular__hinweis{grid-column:1/-1;font-size:13.5px;font-weight:700;color:var(--gruen-text);min-height:1px}
.formular button{justify-content:center}

.kontakt__karte{position:sticky;top:calc(var(--kopf) + 28px);border-radius:0 var(--bogen) 0 var(--bogen);overflow:hidden;
  aspect-ratio:4/3;background:var(--papier)}
.kontakt__karte img{width:100%;height:100%;object-fit:cover}
.karte__nadel{position:absolute;left:50%;top:52%;width:46px;height:46px;margin:-46px 0 0 -23px;
  color:var(--gruen);filter:drop-shadow(0 6px 10px rgba(0,0,0,.28))}
.karte__nadel svg{width:100%;height:100%}
.karte__schild{position:absolute;left:20px;top:20px;background:var(--weiss);border-radius:12px;
  padding:12px 16px;box-shadow:0 12px 30px -14px rgba(0,0,0,.4);line-height:1.35}
.karte__schild b{display:block;font-size:15px;font-weight:800}
.karte__schild span{font-size:12.5px;color:var(--grau)}

/* ===================================================================== Fuss */
.fuss{background:var(--tief-3);color:var(--weiss);padding:clamp(44px,5vw,68px) 0 34px}
.fuss__block{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;
  background:rgba(255,255,255,.045);border-radius:22px;padding:28px 32px}
.marke--hell .marke__zeichen{color:var(--gruen)}
.fuss__daten{display:flex;gap:clamp(20px,4vw,54px);flex-wrap:wrap}
.fuss__daten i{display:block;font-style:normal;font-size:12px;color:rgba(255,255,255,.5);font-weight:600}
.fuss__daten a,.fuss__daten span{font-size:15.5px;font-weight:700;text-decoration:none}
.fuss__zeile{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  margin-top:26px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);
  font-size:13.5px;color:rgba(255,255,255,.6)}
.fuss__nav{display:flex;gap:22px;flex-wrap:wrap}
.fuss__nav a{text-decoration:none}
.fuss__nav a:hover{color:var(--gruen)}
.fuss__hinweis{margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.52)}

/* =============================================================== Einblenden */
.js .einblenden{opacity:0;transform:translateY(22px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.22,.7,.3,1)}
.js .einblenden.sichtbar{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .einblenden{opacity:1;transform:none;transition:none}
  .knopf:hover,.kanal:hover{transform:none}
}

/* ================================================================== Schmal */
@media (max-width:1080px){
  .lkarten,.vkarten{grid-template-columns:1fr 1fr}
  .vkarte:nth-child(2),.vkarte:nth-child(5){transform:none}
  .zahlen{gap:18px}
}
@media (max-width:920px){
  .nav{
    position:absolute;top:var(--kopf);left:0;right:0;background:var(--tief);
    flex-direction:column;gap:0;padding:8px clamp(20px,5vw,44px) 20px;
    border-bottom:1px solid rgba(255,255,255,.09);display:none;margin:0;
  }
  .nav.offen{display:flex}
  .nav a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:16px}
  .brenner{display:grid}
  .kopf__tel{display:none}
  .kopf .knopf--klein{display:none}
  .held__gitter,.probleme__gitter,.ueber__gitter,.ablauf__gitter,
  .faelle__gitter,.jetzt__gitter,.fragen__gitter,.kontakt__gitter{grid-template-columns:1fr}
  .held__bild,.jetzt__bild{justify-self:start;max-width:360px;margin-top:10px}
  .held__bild::before{top:-13px;right:-13px;bottom:13px;left:13px}
  .jetzt__bild::before{top:-13px;left:-13px;bottom:13px;right:13px}
  .ueber__bild,.fragen__bild{max-width:340px}
  .ablauf__text{position:static}
  .lkarten{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  :root{--bogen:52px}
  .probleme__karten{grid-template-columns:1fr;border-radius:0 44px 0 44px}
  .lkarten,.vkarten{grid-template-columns:1fr}
  .zahlen{grid-template-columns:1fr 1fr}
  .haken--zwei{grid-template-columns:1fr}
  .formular{grid-template-columns:1fr}
  .schritt{border-radius:16px 52px 52px 16px;padding:22px 24px}
  .kopfzeile{align-items:flex-start}
  .fuss__block{padding:22px}
}
@media (max-width:420px){
  .zahlen{grid-template-columns:1fr}
  .knopf{padding:13px 16px 13px 22px;font-size:12px}
}