/* Patch 73: Startseite und Landingpages in der Sprache des Ablaufs.
   Ein Stilblatt fuer alle drei Vorlagen (Start, Bezirk/Vorgang, Rahmen-Seiten), als letztes geladen.
   Bausteine aus dem Ablauf: blauer Kopf mit weichen Lichtflaechen, weisse Schrift, gelbe Akzente,
   nummerierte Schritte mit Fortschrittsbalken, Karten mit duennem Rand, gelb-blau gestreiftes Band. */
:root{
  --band-licht:radial-gradient(760px 300px at 88% 62%,rgba(255,255,255,.12),transparent 70%);
  --streifen:repeating-linear-gradient(-45deg,var(--tinte) 0 14px,var(--gelb) 14px 28px);
}

/* ---------- Kopf: blau wie im Ablauf ---------- */
.kopf{background:var(--blau);color:#fff;border-bottom:0!important;box-shadow:none!important}
.kopf .marke{color:#fff}
.kopf .marke-zusatz{white-space:nowrap;color:rgba(255,255,255,.82)!important;border-left-color:rgba(255,255,255,.32)!important}
.kopf .hauptnav a{color:#fff!important;background:transparent}
.kopf .hauptnav a:hover{background:rgba(255,255,255,.12)!important}
.kopf .hauptnav a[aria-current]{background:rgba(255,255,255,.16)!important;color:#fff!important}
.kopf .hilfe-link,.kopf .kopf-hinweis{box-sizing:border-box;line-height:30px;padding:0 12px;border-radius:8px;
  background:transparent!important;border:2px solid rgba(255,255,255,.6)!important;color:#fff!important;font-size:14px;font-weight:700;text-decoration:none}
.kopf .hilfe-link:hover{border-color:#fff!important}
.kopf .zs-sprache summary{background:transparent!important;color:#fff!important;border:2px solid rgba(255,255,255,.6)!important;height:34px!important;font-size:14px}
.kopf .zs-sprache[open] summary{border-color:#fff!important}
.kopf :focus-visible{outline-color:#fff}
.kopf .menue-knopf,.kopf [data-menue]{color:#fff;border-color:rgba(255,255,255,.6)}

/* ---------- Held: dasselbe Blau, nahtlos unter dem Kopf ---------- */
.held,.seo-held{color:#fff;background:var(--band-licht),var(--blau)!important;border:0!important}
.held{isolation:isolate}
/* Variante A: Raster schraeg und gross, zur Mitte ausgeblendet.
   Patch 75: Das Raster liegt in einem eigenen Element (.held-muster), das selbst abschneidet. Der Held
   schneidet nichts mehr ab - sonst wurden Ortssuche und Fahrzeugwahl unten gekappt. */
.held::before,.held::after,.sl-held::after{display:none!important}
.held,.seo-held,.sl-held{overflow:visible!important;clip-path:none!important}
.held-muster{position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);overflow:hidden;z-index:-1;pointer-events:none}
.held-muster::before{content:"";position:absolute;inset:-25%;background:#fff;opacity:.09;transform:rotate(-14deg);
  -webkit-mask:url("/assets/monogramm-raster.png") 0 0/260px 260px repeat,radial-gradient(70% 70% at 50% 50%,transparent 30%,#000 75%);-webkit-mask-composite:source-in;
  mask:url("/assets/monogramm-raster.png") 0 0/260px 260px repeat,radial-gradient(70% 70% at 50% 50%,transparent 30%,#000 75%);mask-composite:intersect}
/* Inhalt des Helds liegt ueber der Strasse - Aufklapplisten fallen ueber die Fahrbahn. */
.held > .wrap,.seo-held > *:not(.strasse):not(.held-muster){position:relative;z-index:2}
.held .start-karte,.seo-held .start-karte,.held .sl,.seo-held .sl{color:var(--tinte)}
.held h1,.held h1.start-h1,.seo-held h1{color:#fff!important}
.held h1 .ort,.seo-held h1 .ort{color:#fff!important}
.held .lead,.seo-held .lead{color:rgba(255,255,255,.84)!important}
.held .lead b,.seo-held .lead b,.held .lead a,.seo-held .lead a{color:#fff!important}
.held .krumen ol,.seo-held .krumen ol{color:rgba(255,255,255,.72)}
.held .krumen a,.seo-held .krumen a{color:#fff!important}
.held .krumen li+li::before,.seo-held .krumen li+li::before{color:rgba(255,255,255,.4)}
.seo-held .kicker,.held .kicker{color:rgba(255,255,255,.86)}
.held .kicker{background:rgba(255,255,255,.12)!important;color:#fff!important}
.held .kicker .status{border-left-color:rgba(255,255,255,.3)!important}
.held .privat-zeile,.seo-held .seo-privat,.held .zahl-zeile,.seo-held .zahl-zeile{color:rgba(255,255,255,.84)!important}
.held .privat-zeile::before,.seo-held .seo-privat::before{background:rgba(255,255,255,.18)!important;color:#fff!important}
.held .schwung path,.held .held-schwung path,.seo-held .schwung path{stroke:var(--gelb)!important;opacity:.95}
.held .held-schwung{opacity:.5}
/* Die Suche bleibt eine weisse Karte - sie traegt jetzt den Schatten auf dem Blau. */
.held .start-karte,.seo-held .start-karte{box-shadow:0 30px 60px -28px rgba(8,12,40,.65)!important}
/* Rahmen-Seiten: der Held steht in main.wrap - das Blau reicht trotzdem ueber die volle Breite. */
html,body{overflow-x:clip}
.seo-held{position:relative;isolation:isolate;background:var(--blau)!important;margin-bottom:0;padding-top:36px}
.seo-held::before{content:"";position:absolute;z-index:-2;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);background:var(--band-licht),var(--blau);pointer-events:none}
.seo-held::after{display:none!important}
main.wrap:has(> .seo-seite > .seo-held:first-child),main.wrap:has(> .seo-held:first-child){padding-top:0;margin-top:0}
.seo-seite > .seo-held:first-child{margin-top:0}
.seo-held .landmarke{box-shadow:0 0 0 1.5px rgba(255,255,255,.5)}
.seo-held .seo-preischips > *{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.3)!important;box-shadow:none!important}
.seo-held .seo-preischips > * *{color:var(--gelb)!important}
/* Folgt ein farbiges Band, schliesst es direkt an - kein weisser Streifen zwischen Blau und Grau. */
.seo-held + .seo-band{margin-top:0!important}
/* Patch 75: Die drei Vorgaenge sind gleichwertig - alle weiss, gelb beim Zeigen. Keiner sticht hervor. */
.seo-held .knopf,.seo-held .knopf.leise{background:#fff!important;color:var(--blau)!important;box-shadow:none!important}
.seo-held .knopf:hover,.seo-held .knopf.leise:hover{background:var(--gelb)!important;color:var(--tinte)!important}
.seo-kz-wege .knopf.leise{background:#fff;color:var(--blau);box-shadow:inset 0 0 0 2px var(--linie)}
/* Die Suchseiten (sl-held) hatten ein eigenes Monogramm-Raster und einen weissen Schein. */
.sl-held{background:var(--blau)!important;border:0!important}
.sl-held::before{-webkit-mask:none!important;mask:none!important;opacity:1!important}
.sl-held .kicker{background:rgba(255,255,255,.12)!important;box-shadow:none!important;color:#fff!important}
.seo-held,.sl-held{overflow:visible!important}
.seo-held .glas,.held .glas{background:#fff!important;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 22px 44px -22px rgba(8,12,40,.6)}

/* ---------- Abschnitte: kleine gelbe Marke ueber jeder Ueberschrift ---------- */
.abschnitt h2::before,.seo-block > h2::before{
  content:"";display:block;width:40px;height:5px;border-radius:3px;background:var(--gelb);margin:0 0 18px}

/* ---------- Ablauf in drei Schritten: wie der Fortschritt im Ablauf ---------- */
.dreischritt{gap:16px!important}
.dreischritt li{padding-top:22px}
.dreischritt li::before{width:40px!important;height:40px!important;font-size:17px!important;font-weight:800;margin-bottom:16px!important;
  background:#fff!important;color:var(--blau)!important;box-shadow:inset 0 0 0 2px var(--linie)}
.dreischritt li:first-child::before{background:var(--gelb)!important;color:var(--tinte)!important;box-shadow:0 0 0 5px rgba(255,194,14,.28)}
.dreischritt li::after{content:""!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:5px;border:0!important;border-radius:3px;background:var(--linie)}
.dreischritt li:first-child::after{background:linear-gradient(90deg,var(--gelb) 0 50%,var(--linie) 50%)}
[dir="rtl"] .dreischritt li:first-child::after{background:linear-gradient(270deg,var(--gelb) 0 50%,var(--linie) 50%)}

/* ---------- Karten: duenner Rand statt Schatten, blauer Rand beim Zeigen ---------- */
.karte:not(.blau):not(.wege-zs):not(.seo-cta),.seo-kachel,.vorgangskarte{box-shadow:none!important;border:1.5px solid var(--linie)!important;border-radius:16px!important}
a.karte:hover,a.vorgangskarte:hover,a.seo-kachel:hover,.seo-vk:hover{border-color:var(--blau)!important;transform:translateY(-2px)}
a.karte,a.vorgangskarte,a.seo-kachel{transition:border-color .15s,transform .15s}
@media (prefers-reduced-motion:reduce){a.karte,a.vorgangskarte,a.seo-kachel{transition:none}a.karte:hover,a.vorgangskarte:hover,a.seo-kachel:hover{transform:none}}


/* ---------- Fuss: blau, oben das gestreifte Band aus dem Codes-Abschnitt ---------- */
.fuss{position:relative;background:var(--blau)!important;color:rgba(255,255,255,.76)!important;padding-top:58px!important;border-top:0!important}
.fuss::before{content:"";position:absolute;left:0;right:0;top:0;height:12px;background:var(--streifen)}
.fuss b,.fuss strong{color:#fff!important}
.fuss a{color:#fff!important;text-decoration-color:rgba(255,255,255,.4)}
.fuss a:hover{text-decoration-color:var(--gelb)}
/* Zahlarten-Chips auf dem Blau: weiss statt grau durchscheinend. */
.held .sl-zahl > span:not(.mc),.seo-held .sl-zahl > span:not(.mc){background:#fff!important;opacity:1!important;box-shadow:none!important}

/* ---------- Kopf: kleineres Logo, Hilfe und Sprache als Paar ---------- */
.kopf .marke .logo{height:32px!important;width:auto}
.kopf .wrap > .zs-sprache{margin-inline-start:-22px}
@media (max-width:1080px){
  /* Ohne Menue: Logo links, die Knoepfe gesammelt rechts. */
  .kopf .marke{margin-inline-end:auto}
}
@media (max-width:620px){
  .kopf .marke .logo{height:25px!important}
  .kopf .wrap{padding-top:14px;padding-bottom:14px}
}

/* ---------- Ein bisschen Bewegung ---------- */
/* Der gelbe Strich unter Ort bzw. "anmelden" zieht sich beim Laden einmal durch. */
.held h1 .ort svg path,.seo-held h1 .ort svg path{stroke-dasharray:240;stroke-dashoffset:240;animation:zs-strich .9s .35s cubic-bezier(.6,0,.2,1) forwards}
@keyframes zs-strich{to{stroke-dashoffset:0}}
/* Vorgangskarten: beim Zeigen schiebt sich oben ein gelber Balken ein - wie der Fortschritt im Ablauf. */
a.karte,a.vorgangskarte,a.seo-kachel{position:relative;overflow:hidden}
a.karte::before,a.vorgangskarte::before,a.seo-kachel::before{content:"";position:absolute;left:0;top:0;height:5px;width:100%;background:var(--gelb);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
[dir="rtl"] a.karte::before,[dir="rtl"] a.vorgangskarte::before,[dir="rtl"] a.seo-kachel::before{transform-origin:right}
a.karte:hover::before,a.vorgangskarte:hover::before,a.seo-kachel:hover::before{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){
  .held h1 .ort svg path,.seo-held h1 .ort svg path{animation:none;stroke-dashoffset:0}
  a.karte::before,a.vorgangskarte::before,a.seo-kachel::before{transition:none}
}

/* ---------- Patch 74: Strasse zwischen Held und Seite ---------- */
/* Eine Asphaltstrasse in Seitenansicht schliesst den blauen Bereich ab. Ab und zu faehrt ein
   Fahrzeug im Comic-Stil vorbei: Auto, Motorrad, Auto mit Anhaenger - immer nur eines, dazwischen
   ist die Strasse leer. Flacher 2D-Stil wie die Zeichnungen im Ablauf: runde Formen, keine Konturen, ZS24-Farben. */
.held,.seo-held{padding-bottom:0!important}
.strasse{--fahrbahn:46px;position:relative;z-index:0;display:block;height:108px;margin-top:28px;width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;
  background:
    linear-gradient(#454B70,#454B70) 0 calc(100% - var(--fahrbahn))/100% 3px no-repeat,
    repeating-linear-gradient(90deg,rgba(232,236,246,.75) 0 40px,transparent 40px 76px) 0 calc(100% - 17px)/100% 4px no-repeat,
    linear-gradient(#2E3350,#2E3350) 0 100%/100% var(--fahrbahn) no-repeat}
.strasse .fz{position:absolute;left:0;bottom:calc(var(--fahrbahn) - 12px);background:no-repeat center bottom/contain;will-change:transform;transform:translateX(-300px);
  animation:zs-fahrt 36s linear infinite,zs-wippen .34s ease-in-out infinite alternate}
.strasse .fz-auto{width:132px;height:56px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 56'%3E%3Cellipse cx='66' cy='53' rx='58' ry='2.6' fill='%23000' fill-opacity='.22'/%3E%3Cg transform='translate(2 0)'%3E%3Cpath d='M34 25 L46 9 Q49 5 55 5 L84 5 Q90 5 94 10 L106 25 Z' fill='%23FFC20E'/%3E%3Cpath d='M50 11 Q52 9 56 9 L67 9 L67 24 L40 24 Z' fill='%23CFE3FF'/%3E%3Cpath d='M71 9 L84 9 Q88 9 90 12 L99 24 L71 24 Z' fill='%23CFE3FF'/%3E%3Cpath d='M56 9 L50 24' stroke='%23fff' stroke-opacity='.7' stroke-width='3' stroke-linecap='round'/%3E%3Crect x='4' y='22' width='122' height='22' rx='11' fill='%23FFC20E'/%3E%3Cpath d='M6 36 L124 36 Q123 44 115 44 L15 44 Q7 44 6 36 Z' fill='%23E0A600'/%3E%3Crect x='113' y='27' width='10' height='5' rx='2.5' fill='%23FFF6D6'/%3E%3Crect x='6' y='27' width='6' height='5' rx='2.5' fill='%23E2505F'/%3E%3Crect x='14' y='33' width='16' height='7' rx='1.6' fill='%23fff'/%3E%3Crect x='14' y='33' width='3.5' height='7' rx='1.2' fill='%2327348F'/%3E%3Crect x='19.8' y='35.7' width='8.3' height='1.7' rx='.8' fill='%23C9D2EA'/%3E%3Crect x='68' y='29' width='8' height='2.6' rx='1.3' fill='%23E0A600'/%3E%3Ccircle cx='32' cy='44' r='9' fill='%23172055'/%3E%3Ccircle cx='32' cy='44' r='4.1' fill='%23E3F0FF'/%3E%3Ccircle cx='100' cy='44' r='9' fill='%23172055'/%3E%3Ccircle cx='100' cy='44' r='4.1' fill='%23E3F0FF'/%3E%3C/g%3E%3C/svg%3E");animation-delay:-2s,0s}
.strasse .fz-motorrad{width:101px;height:70px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -12 104 72'%3E%3Cellipse cx='52' cy='57' rx='40' ry='2.6' fill='%23000' fill-opacity='.22'/%3E%3Crect x='28' y='36' width='34' height='10' rx='5' fill='%23172055'/%3E%3Cpath d='M22 30 Q22 25 28 25 L44 25 Q48 25 48 29 L48 34 L22 34 Z' fill='%23172055'/%3E%3Cpath d='M44 34 Q44 22 58 22 L66 22 Q74 22 76 30 L76 34 Z' fill='%23FFC20E'/%3E%3Cpath d='M48 34 L76 34 Q75 39 70 39 L50 39 Z' fill='%23E0A600'/%3E%3Cpath d='M74 24 L84 46' stroke='%23172055' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M70 18 L80 14' stroke='%23172055' stroke-width='4.5' stroke-linecap='round'/%3E%3Cpath d='M34 26 Q32 12 44 8 L50 7 Q56 8 58 14 L60 20 L46 28 Z' fill='%23FFFFFF'/%3E%3Cpath d='M50 13 L66 18 L74 17' fill='none' stroke='%23DCE1EE' stroke-width='6' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40 27 L52 34 L48 44' fill='none' stroke='%231E2A6B' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='52' cy='2' r='8.5' fill='%23FFC20E'/%3E%3Cpath d='M53 -2 Q61 -2 60.5 3 Q58 6 53 5 Z' fill='%23172055'/%3E%3Crect x='80' y='23' width='6' height='5' rx='2.5' fill='%23FFF6D6'/%3E%3Crect x='12' y='34' width='13' height='6' rx='1.6' fill='%23fff'/%3E%3Crect x='12' y='34' width='2.9' height='6' rx='1.2' fill='%2327348F'/%3E%3Crect x='16.7' y='36.3' width='6.8' height='1.4' rx='.8' fill='%23C9D2EA'/%3E%3Ccircle cx='22' cy='47' r='11' fill='%23172055'/%3E%3Ccircle cx='22' cy='47' r='5.1' fill='%23E3F0FF'/%3E%3Ccircle cx='84' cy='47' r='11' fill='%23172055'/%3E%3Ccircle cx='84' cy='47' r='5.1' fill='%23E3F0FF'/%3E%3C/svg%3E");animation-name:zs-fahrt-schnell,zs-wippen;animation-delay:-14s,-.1s}
.strasse .fz-anh{width:210px;height:56px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 210 56'%3E%3Cellipse cx='110' cy='53' rx='104' ry='2.6' fill='%23000' fill-opacity='.22'/%3E%3Crect x='4' y='14' width='58' height='28' rx='7' fill='%23E3F0FF'/%3E%3Crect x='4' y='34' width='58' height='8' rx='4' fill='%23C3D6F2'/%3E%3Crect x='12' y='19' width='42' height='4' rx='2' fill='%23C3D6F2'/%3E%3Crect x='8' y='24' width='15' height='6.5' rx='1.6' fill='%23fff'/%3E%3Crect x='8' y='24' width='3.3' height='6.5' rx='1.2' fill='%2327348F'/%3E%3Crect x='13.4' y='26.5' width='7.8' height='1.6' rx='.8' fill='%23C9D2EA'/%3E%3Crect x='60' y='33' width='20' height='4' rx='2' fill='%23172055'/%3E%3Ccircle cx='33' cy='44' r='8' fill='%23172055'/%3E%3Ccircle cx='33' cy='44' r='3.7' fill='%23E3F0FF'/%3E%3Cg transform='translate(78 0)'%3E%3Cpath d='M34 25 L46 9 Q49 5 55 5 L84 5 Q90 5 94 10 L106 25 Z' fill='%23FFFFFF'/%3E%3Cpath d='M50 11 Q52 9 56 9 L67 9 L67 24 L40 24 Z' fill='%23CFE3FF'/%3E%3Cpath d='M71 9 L84 9 Q88 9 90 12 L99 24 L71 24 Z' fill='%23CFE3FF'/%3E%3Cpath d='M56 9 L50 24' stroke='%23fff' stroke-opacity='.7' stroke-width='3' stroke-linecap='round'/%3E%3Crect x='4' y='22' width='122' height='22' rx='11' fill='%23FFFFFF'/%3E%3Cpath d='M6 36 L124 36 Q123 44 115 44 L15 44 Q7 44 6 36 Z' fill='%23DCE1EE'/%3E%3Crect x='113' y='27' width='10' height='5' rx='2.5' fill='%23FFF6D6'/%3E%3Crect x='6' y='27' width='6' height='5' rx='2.5' fill='%23E2505F'/%3E%3Crect x='14' y='33' width='16' height='7' rx='1.6' fill='%23fff'/%3E%3Crect x='14' y='33' width='3.5' height='7' rx='1.2' fill='%2327348F'/%3E%3Crect x='19.8' y='35.7' width='8.3' height='1.7' rx='.8' fill='%23C9D2EA'/%3E%3Crect x='68' y='29' width='8' height='2.6' rx='1.3' fill='%23DCE1EE'/%3E%3Ccircle cx='32' cy='44' r='9' fill='%23172055'/%3E%3Ccircle cx='32' cy='44' r='4.1' fill='%23E3F0FF'/%3E%3Ccircle cx='100' cy='44' r='9' fill='%23172055'/%3E%3Ccircle cx='100' cy='44' r='4.1' fill='%23E3F0FF'/%3E%3C/g%3E%3C/svg%3E");animation-delay:-26s,-.2s}
/* 30 % der Zeit faehrt es, den Rest steht es ausserhalb des Bilds - so kommt alle 12 s eins vorbei. */
@keyframes zs-fahrt{0%{transform:translateX(-300px)}30%,100%{transform:translateX(calc(100vw + 40px))}}
@keyframes zs-fahrt-schnell{0%{transform:translateX(-300px)}24%,100%{transform:translateX(calc(100vw + 40px))}}
@keyframes zs-wippen{from{translate:0 0}to{translate:0 -1px}}
[dir="rtl"] .strasse{transform:scaleX(-1)}
@media (max-width:620px){
  .strasse{--fahrbahn:38px;height:84px;margin-top:22px}
  .strasse .fz{bottom:calc(var(--fahrbahn) - 10px)}
  .strasse .fz-auto{width:90px;height:38px}.strasse .fz-motorrad{width:70px;height:49px}.strasse .fz-anh{width:143px;height:38px}
}
@media (prefers-reduced-motion:reduce){
  .strasse .fz{animation:none!important;transform:translateX(-300px)}
  .strasse .fz-auto{transform:translateX(62vw)}
}

/* ---------- Glanz ueber den Haupt-Knoepfen ---------- */
/* Ein heller Streifen zieht alle paar Sekunden schraeg ueber jeden Haupt-Knopf (Suche, Start, Weiter).
   Umrandete und gesperrte Knoepfe glaenzen nicht. */
.sl-los,.mcta,.knopf:not(.leise):not(.fehlt):not(.klein):not([disabled]):not(.seo-kz-wege .knopf){position:relative;overflow:hidden;isolation:isolate}
.sl-los::after,.mcta::after,.knopf:not(.leise):not(.fehlt):not(.klein):not([disabled]):not(.seo-kz-wege .knopf)::after{
  content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:38%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.38) 50%,rgba(255,255,255,0) 100%);
  transform:translateX(-160%) skewX(-18deg);animation:zs-glanz 4.2s 1.2s cubic-bezier(.4,0,.2,1) infinite}
.sl-los:hover::after,.mcta:hover::after,.knopf:not(.leise):not(.fehlt):not(.klein):not([disabled]):hover::after{animation-duration:1.4s;animation-delay:0s}
@keyframes zs-glanz{0%{transform:translateX(-160%) skewX(-18deg)}28%,100%{transform:translateX(320%) skewX(-18deg)}}
[dir="rtl"] .sl-los::after,[dir="rtl"] .mcta::after,[dir="rtl"] .knopf:not(.leise):not(.fehlt):not(.klein):not([disabled])::after{animation-direction:reverse}
@media (prefers-reduced-motion:reduce){.sl-los::after,.mcta::after,.knopf:not(.leise):not(.fehlt):not(.klein):not([disabled])::after{animation:none;display:none}}