/* Leinegrafik · Kategorieseite Animiertes Storytelling (kst-) · v1. Inhalte sind Webflow-Elemente, komplexe Teile baut kat-story-v1.js. */
.kat{--koralle:#EA4524; --anthrazit:#353535; --creme:#FFFEF8; --blatt:#FFFFFF;
  --mint:#C0D8D1; --mint-tief:#9DC2B8; --altrosa:#E3A9B4;
  --linie:rgba(53,53,53,.16); --leise:rgba(53,53,53,.66);
  --exo:"Exo 2",Helvetica,Arial,sans-serif; --gara:"EB Garamond",Georgia,serif;
  --ease:cubic-bezier(.333,0,.667,1); --feder:cubic-bezier(.34,1.56,.64,1); --raus:cubic-bezier(.16,1,.3,1);
  --schatten:0 2px 6px rgba(53,53,53,.06),0 34px 60px -26px rgba(234,69,36,.38),0 18px 40px -24px rgba(53,53,53,.22);}
.kat .kat-section{position:relative}
.kat-zwei-kopf > *{min-width:0}
.kat-faq-grid > *{min-width:0}
.kst-abstand{margin-bottom:clamp(36px,4vw,48px)}
.kst-abstand-gross{margin-bottom:clamp(36px,5vw,56px)}
.kst-ohne-unten{padding-bottom:0}
.kst-frage-satz{font-size:22px}
.kst-video{display:block}
.kst-blatt .kst-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--creme)}
.kst-a0{right:6%;top:-8%}
.kst-a1{left:4%;top:30%}
.kst-a2{right:3%;top:12%}
.kst-a3{right:4%;top:20%}
.kst-a4{left:3%;top:8%}
.kst-a5{right:4%;top:14%}
.kst-a6{right:13%;top:34%}
/* ===== NEU: kst- (Animiertes Storytelling) ===== */

/* Hero: Mint statt Nacht oder Creme. Bildschirm rechts, Biene bricht aus. */
.kst-hero{background:var(--creme);padding-block:clamp(24px,4vw,56px) clamp(64px,8vw,112px);position:relative;overflow-x:clip}
.kst-hero .kat-crumb{color:rgba(53,53,53,.62)}
.kst-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center;position:relative;z-index:1}
.kst-hero-grid > *{min-width:0}
.kst-hero .kat-h1{font-size:clamp(48px,6.4vw,96px)}
.kst-h1-zeile{display:block}
.kst-h1-sub{display:block;margin-top:.45em;margin-left:.06em;font-family:var(--gara);font-style:italic;font-weight:400;font-size:.36em;letter-spacing:-.01em;line-height:1.12;color:var(--anthrazit)}
.kst-hero-text{display:grid;gap:26px;margin-top:34px}

.kst-schirm{position:relative;margin:0}
.kst-schirm-rahmen{position:relative;background:var(--anthrazit);border-radius:18px;padding:12px 12px 30px;box-shadow:0 40px 70px -40px rgba(53,53,53,.55),0 12px 30px -18px rgba(53,53,53,.35)}
.kst-schirm-rahmen::after{content:"";position:absolute;left:50%;bottom:11px;width:9px;height:9px;border-radius:50%;background:#5a5a5a;transform:translateX(-50%)}
.kst-schirm-bild{position:relative;border-radius:7px;overflow:hidden;background:var(--creme);aspect-ratio:16/9}
.kst-schirm-bild video{display:block;width:100%;height:100%;object-fit:cover}
.kst-schirm-fuss{width:34%;height:16px;margin:0 auto;background:linear-gradient(#4a4a4a,#2c2c2c);clip-path:polygon(12% 0,88% 0,100% 100%,0 100%)}
.kst-hero-biene{position:absolute;right:-4%;top:-26%;width:clamp(96px,11vw,150px);z-index:3;transform:rotate(12deg);transition:opacity .6s var(--ease),transform .9s var(--raus)}
.kst-hero-biene img{display:block;width:100%;height:auto;animation:kst-schweben 3.6s ease-in-out infinite}
.kst-hero-biene.kst-weg{opacity:0;transform:rotate(18deg) translate(220px,-160px) scale(.7)}
.kst-schirm-zeile{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:22px;font-size:14px;color:rgba(53,53,53,.7)}
.kst-pause{border:0;background:none;padding:0;font:500 14px var(--exo);color:var(--anthrazit);cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.kst-pause::before{content:"";width:10px;height:10px;background:linear-gradient(90deg,currentColor 35%,transparent 35% 65%,currentColor 65%)}
.kst-pause[aria-pressed="true"]::before{background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
@keyframes kst-schweben{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(3deg)}}

/* Flug der Biene: fester Layer über dem Fenster. Sie quert den Bildschirm ganz und wendet nur außerhalb. */
.kst-flug{position:fixed;inset:0;pointer-events:none;z-index:30;overflow:hidden}
.kst-flug svg{position:absolute;inset:0;width:100%;height:100%}
.kst-flug-spur{fill:none;stroke:var(--koralle);stroke-width:1.6;stroke-dasharray:1 9;stroke-linecap:round;opacity:.55}
.kst-flieger{position:absolute;left:0;top:0;width:62px;margin:-44px 0 0 -31px;opacity:0;transition:opacity .35s var(--ease);will-change:transform}
.kst-flieger.kst-an{opacity:1}
.kst-flieger img{display:block;width:100%;height:auto;position:relative;z-index:1}
.kst-flieger-schatten{position:absolute;left:18%;right:18%;top:118%;height:12px;border-radius:50%;background:radial-gradient(closest-side,rgba(53,53,53,.28),rgba(53,53,53,0));filter:blur(2px)}
.kst-anker{position:absolute;width:1px;height:1px}

/* Warum: Vergleich als Balken */
.kst-beleg{margin-top:clamp(48px,6vw,80px);display:grid;grid-template-columns:4fr 8fr;gap:24px clamp(36px,6vw,96px);align-items:end;border-top:2px solid var(--anthrazit);padding-top:28px}
.kst-beleg > *{min-width:0}
.kst-balken{display:grid;gap:18px}
.kst-balken-zeile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:baseline}
.kst-balken-name{font-size:15px;font-weight:500}
.kst-balken-zahl{font-size:52px;font-weight:200;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.kst-balken-spur{grid-column:1/-1;height:10px;background:rgba(53,53,53,.08);border-radius:5px;overflow:hidden}
.kst-balken-spur i{display:block;height:100%;border-radius:5px;background:var(--koralle)}
.kst-balken-zeile.kst-grau .kst-balken-spur i{background:rgba(53,53,53,.45)}
.kst-balken-zeile.kst-grau .kst-balken-zahl{color:var(--leise)}

/* Wo es wirkt: drei Felder auf Mint-Linie */
.kst-felder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,40px)}
.kst-feld{border-top:2px solid var(--anthrazit);padding-top:22px;display:grid;gap:12px;align-content:start}
.kst-feld-wort{font-family:var(--gara);font-style:italic;font-size:clamp(30px,3vw,40px);line-height:1;color:var(--koralle)}
.kst-feld ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:9px}
.kst-feld li{display:flex;gap:11px;font-size:16px;line-height:1.45}
.kst-feld li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--koralle);margin-top:8px}

/* Leitbeispiel Biene */
.kst-fall{display:grid;grid-template-columns:8fr 4fr;gap:32px clamp(32px,5vw,72px);align-items:start}
.kst-fall > *{min-width:0}
.kst-blatt{background:var(--blatt);box-shadow:var(--schatten);overflow:hidden}
.kst-blatt video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--creme)}
.kst-fakten{display:grid;grid-template-columns:1fr 1fr;margin-top:8px}
.kst-fakt{border-top:1px solid var(--linie);padding:16px 14px 18px 0;min-width:0}
.kst-fakt b{display:block;font-size:44px;font-weight:200;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.kst-fakt span{display:block;margin-top:6px;font-size:14px;color:var(--leise)}
.kst-akte-kopf{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-top:clamp(56px,7vw,96px);border-top:1px solid var(--linie);padding-top:28px}
.kst-akte{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.4vw,18px);margin-top:clamp(40px,5vw,64px);counter-reset:akt}
.kst-akt{min-width:0;display:grid;gap:12px;align-content:start}
.kst-akt:nth-child(2){margin-top:24px}.kst-akt:nth-child(3){margin-top:48px}.kst-akt:nth-child(4){margin-top:24px}
.kst-akt-bild{aspect-ratio:16/10;background:var(--blatt);box-shadow:var(--schatten);overflow:hidden;transition:transform .55s var(--feder)}
.kst-akt-bild img{display:block;width:100%;height:100%;object-fit:cover}
.kst-akt:hover .kst-akt-bild{transform:translateY(-6px) rotate(-.6deg)}
.kst-akt-name{font-size:16px;font-weight:500;line-height:1.3}
.kst-akt-sub{display:block;font-size:14px;color:var(--leise);line-height:1.45;font-weight:300;margin-top:2px}

/* Re:Cycle: Werktisch mit freigestellten Teilen */
.kst-werktisch{position:relative;margin-top:clamp(40px,5vw,64px);padding:clamp(56px,8vw,120px) clamp(0px,9vw,140px)}
.kst-werktisch-film{position:relative;z-index:2;max-width:760px;margin:0 auto}
.kst-teil{position:absolute;z-index:1;height:auto;filter:drop-shadow(0 16px 14px rgba(53,53,53,.16));transition:transform .7s var(--feder);will-change:transform}
.kst-teil:hover{z-index:3}
.kst-t-windrad{width:clamp(70px,8vw,120px);left:2%;top:0}
.kst-t-baum{width:clamp(70px,8vw,118px);left:4%;bottom:2%}
.kst-t-kanne{width:clamp(80px,9vw,140px);right:0;bottom:6%}
.kst-t-wolke{width:clamp(110px,14vw,210px);right:6%;top:4%}
.kst-t-sonne{width:clamp(56px,6vw,90px);right:18%;top:-3%}
.kst-t-container{width:clamp(80px,9vw,130px);left:-1%;top:40%}
.kst-t-baum2{width:clamp(56px,6vw,90px);right:-1%;top:38%}
.kst-werktisch-zeile{text-align:center;margin-top:22px}
.kst-nachhaltig{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px 28px;align-items:center;max-width:820px;margin:clamp(40px,5vw,64px) auto 0;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);padding-block:24px}
.kst-nachhaltig img{width:72px;height:auto}
.kst-nachhaltig p{margin:0;font-family:var(--gara);font-size:21px;line-height:1.4}

/* Spannungsbogen statt dunklem Band */
.kst-bogen-feld{position:relative}
.kst-bogen{display:block;width:100%;height:auto;overflow:visible}
.kst-bogen-linie{fill:none;stroke:var(--anthrazit);stroke-width:2}
.kst-bogen-flaeche{fill:var(--koralle);opacity:.06}
.kst-bogen-punkt{fill:var(--creme);stroke:var(--koralle);stroke-width:2.5;transition:r .4s var(--feder)}
.kst-bogen-punkt.kst-aktiv{fill:var(--koralle)}
.kst-kaefer{position:absolute;width:clamp(62px,6vw,88px);height:auto;filter:drop-shadow(0 5px 4px rgba(53,53,53,.28));transform:translate(-50%,-82%);transition:left 1.1s var(--ease),top 1.1s var(--ease)}
.kst-kaefer.kst-rechts{transform:translate(-50%,-82%) scaleX(-1)}
.kst-stationen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:18px}
.kst-station{min-width:0;border-top:1px solid var(--linie);padding-top:18px;cursor:default}
.kst-station .kst-nr{display:block;font-size:56px;font-weight:200;letter-spacing:-.04em;line-height:.9;color:var(--koralle);margin-bottom:16px}
.kst-station p{margin:0;font-size:16px;color:rgba(53,53,53,.78)}

/* CTA mit Landeplatz */
.kst-cta{position:relative;border-top:2px solid var(--anthrazit);padding:clamp(40px,5vw,64px) 0 clamp(72px,8vw,110px)}
#anfragen{overflow:hidden}
.kst-cta .kat-h2{max-width:18ch}
.kst-cta-weg{position:absolute;left:calc(50% - 50vw);width:100vw;bottom:8px;height:80px;pointer-events:none;animation:kst-krabbeln 30s linear infinite;will-change:transform}
.kst-kaefer-schatten{position:absolute;left:6px;bottom:-3px;width:78px;height:10px;border-radius:50%;background:radial-gradient(closest-side,rgba(53,53,53,.3),rgba(53,53,53,0));filter:blur(1.5px)}
.kst-cta-kaefer{position:absolute;left:0;bottom:0;width:86px;height:auto;z-index:1;transform:rotate(17deg);transform-origin:50% 100%}
@keyframes kst-krabbeln{from{transform:translateX(100%)}to{transform:translateX(-110px)}}

.kst-cta .kat-vorspann{margin-top:22px}


/* Hero-Foto im Bildschirm */
.kst-schirm-bild img{display:block;width:100%;height:100%;object-fit:cover;object-position:62% 60%}
/* Drei Punkte: freigestellter Fernseher */
.kst-tv{display:grid;grid-template-columns:5fr 7fr;gap:32px clamp(36px,6vw,96px);align-items:center}
.kst-tv > *{min-width:0}
.kst-tv-buehne{position:relative;max-width:440px;margin:0 auto;width:100%}
.kst-tv-buehne video{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.kst-tv-buehne canvas{display:block;width:100%;height:auto;position:relative;z-index:1}
.kst-tv-buehne::after{content:"";position:absolute;left:14%;right:14%;bottom:2.5%;height:16px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.35),rgba(0,0,0,0));z-index:0}
.kst-kurz{display:grid;gap:14px;max-width:44ch}
/* Dunkles Band: Re:Cycle und Drei Punkte */
.kst-dunkel{background:var(--anthrazit);color:var(--creme);position:relative}
.kst-dunkel .kat-p{color:rgba(255,254,248,.78)}
.kst-dunkel .kst-blatt{box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.kst-dunkel .kst-teil{filter:drop-shadow(0 14px 14px rgba(0,0,0,.35))}
.kst-dunkel .kat-section:last-child{padding-bottom:clamp(72px,9vw,128px)}

/* Studie: Regler zum Ziehen */
.kst-studie{display:grid;grid-template-columns:5fr 7fr;gap:32px clamp(36px,6vw,96px);margin-top:clamp(48px,6vw,80px);border-top:2px solid var(--anthrazit);padding-top:32px}
.kst-studie > *{min-width:0}
.kst-studie ol{margin:0;padding:0;list-style:none;display:grid;gap:14px;counter-reset:s}
.kst-studie li{display:grid;grid-template-columns:28px 1fr;gap:10px;font-size:16px;line-height:1.5}
.kst-studie li::before{counter-increment:s;content:counter(s);color:var(--koralle);font-family:var(--gara);font-style:italic;font-size:22px;line-height:1.1}
.kst-regler{display:grid;gap:18px}
.kst-regler-kopf{display:flex;align-items:center;gap:clamp(16px,2.4vw,32px)}
.kst-regler-texte{display:grid;gap:4px;min-width:0}
.kst-regler-zahl{font-size:clamp(64px,7vw,96px);font-weight:200;letter-spacing:-.05em;line-height:.9;color:var(--koralle);font-variant-numeric:tabular-nums}
.kst-regler-wort{font-family:var(--gara);font-style:italic;font-size:22px}
.kst-schiene{position:relative;height:44px}
.kst-schiene-spur{position:absolute;left:0;right:0;top:17px;height:10px;border-radius:5px;background:rgba(53,53,53,.08);overflow:hidden}
.kst-schiene-spur i{display:block;height:100%;background:var(--koralle);border-radius:5px;width:0;transition:width .6s var(--raus)}
.kst-schiene input{position:absolute;inset:0;width:100%;margin:0;opacity:0;cursor:grab}
.kst-schiene input:active{cursor:grabbing}
.kst-griff{position:absolute;top:8px;width:28px;height:28px;border-radius:50%;background:var(--creme);border:2.5px solid var(--koralle);transform:translateX(-50%);left:calc(14px + (100% - 28px) * .5);pointer-events:none;box-shadow:0 4px 10px rgba(53,53,53,.18)}
.kst-schiene input:focus-visible + .kst-griff{outline:2px solid var(--koralle);outline-offset:3px}
.kst-schiene-text{display:flex;justify-content:space-between;font-size:14px;color:var(--leise)}
.kst-regler-zahl{transition:color .3s var(--ease)}
.kst-regler.kst-ohne .kst-regler-zahl{color:var(--leise)}
.kst-regler-hinweis{margin:0;min-height:3.1em}
/* Preise */
.kst-preise{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.kst-preis{border-top:2px solid var(--anthrazit);padding-top:20px;display:grid;gap:14px;align-content:start;min-width:0}
.kst-extra{display:flex;align-items:center;gap:16px;margin-top:10px;border-top:1px solid var(--linie);padding-top:16px}
.kst-extra .kat-p{font-size:15px}
.kst-extra img{width:46px;height:auto;flex:none}
.kst-extra p{margin:0}
.kst-preis ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.kst-preis li{display:flex;gap:11px;font-size:16px;line-height:1.45}
.kst-preis li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--koralle);margin-top:8px}
.kst-preis-name{margin:0;font-size:22px;font-weight:300;letter-spacing:-.02em;line-height:1.2}
.kst-preis-zeile{margin:4px 0 0;font-size:15px;color:var(--leise);font-variant-numeric:tabular-nums}
/* Dezentes Aufklappmodul */
.kst-klapp{margin-top:clamp(56px,6.5vw,96px);border-top:1px solid var(--linie);border-bottom:1px solid var(--linie)}
.kst-klapp-kopf{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;padding:20px 48px 20px 0;position:relative}
.kst-klapp-kopf::-webkit-details-marker{display:none}
.kst-klapp-titel{font-size:20px;font-weight:500;letter-spacing:-.015em;transition:color .3s var(--ease)}
.kst-klapp-auf{font-family:var(--gara);font-style:italic;font-size:18px;color:var(--leise)}
.kst-klapp-kopf::after{content:"";position:absolute;right:6px;top:50%;width:16px;height:16px;transform:translateY(-50%);background:linear-gradient(var(--koralle),var(--koralle)) center/16px 1.5px no-repeat,linear-gradient(var(--koralle),var(--koralle)) center/1.5px 16px no-repeat;transition:transform .5s var(--feder)}
.kst-klapp-kopf:hover .kst-klapp-titel{color:var(--koralle)}
.kst-klapp[open] .kst-klapp-kopf::after{transform:translateY(-50%) rotate(45deg)}
.kst-klapp-inhalt{display:grid;grid-template-rows:1fr}
.kst-klapp-innen{min-height:0;overflow:hidden}
.kst-klapp .kst-preise{margin:8px 0 28px}
.kst-kultur{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 24px;align-items:baseline;border-top:1px solid var(--linie);padding:18px 0 28px}
.kst-kultur .kat-p{margin:0;max-width:70ch}
@media (max-width:767px){.kst-kultur{grid-template-columns:1fr}}
.kst-anim.kst-klapp .kst-klapp-inhalt{grid-template-rows:0fr;transition:grid-template-rows .65s var(--raus)}
.kst-anim.kst-klapp.kst-offen .kst-klapp-inhalt{grid-template-rows:1fr}
.kst-anim.kst-klapp .kst-st{opacity:0;transform:translateY(12px);transition:opacity .45s var(--ease),transform .6s var(--raus)}
.kst-anim.kst-klapp.kst-offen .kst-st{opacity:1;transform:none;transition-delay:calc(.15s + var(--d,0)*.1s)}

/* Blumen im Kontaktbereich */
.kst-blumen{position:absolute;right:clamp(0px,3vw,48px);bottom:0;width:clamp(200px,24vw,350px);height:auto;pointer-events:none}
@media (max-width:767px){.kst-blumen{position:relative;display:block;right:auto;width:230px;margin:28px -8px -40px auto}.kst-blumen img{width:100%;height:auto;display:block}}

/* Studie aufklappbar: Bewegung */
.kst-studie-inhalt{display:grid;grid-template-rows:1fr}
.kst-studie-innen{min-height:0;overflow:hidden}
.kst-anim .kst-studie-inhalt{grid-template-rows:0fr;transition:grid-template-rows .75s var(--raus)}
.kst-anim.kst-offen .kst-studie-inhalt{grid-template-rows:1fr}
.kst-anim .kst-st{opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .7s var(--raus)}
.kst-anim.kst-offen .kst-st{opacity:1;transform:none;transition-delay:calc(.18s + var(--d,0)*.09s)}
.sb-maskenpfad{fill:none;stroke:#fff;stroke-width:10}
.sb-knoten{transform-box:fill-box;transform-origin:center}
.kst-anim .sb-knoten.sb-neu{animation:sb-plopp .45s var(--feder) both;animation-delay:calc(var(--i)*.22s + .25s)}
@keyframes sb-plopp{from{transform:scale(0)}to{transform:scale(1)}}
.sb-lose{transform-box:fill-box;transform-origin:center}
@keyframes sb-zappeln{0%,100%{transform:none}30%{transform:translate(2px,-3px) rotate(2deg)}65%{transform:translate(-2px,2px) rotate(-2deg)}}
.sb-reihe{transform-box:fill-box;transform-origin:center;transition:transform .5s var(--feder)}
.kst-studie-kopf:hover .sb-reihe{transform:translateY(-3px)}
.kst-studie-kopf:hover .sb-lose{animation:sb-zappeln .6s ease-in-out both;animation-delay:calc(var(--i)*.03s)}
@keyframes sb-treiben{from{transform:translate(0,0) rotate(0)}to{transform:translate(calc(var(--dx)*.06),calc(var(--dy)*.06 - 3px)) rotate(calc(var(--r)*.25))}}
.sb-bleibt{animation:sb-treiben 4s ease-in-out infinite alternate}
.kst-anim .sb-lose:not(.sb-bleibt){opacity:0;transform:translate(calc(var(--dx)*.4),calc(var(--dy)*.4 + 18px)) rotate(calc(var(--r)*-.6))}
.kst-anim.kst-offen .sb-lose:not(.sb-bleibt){animation:sb-einfliegen 1.3s var(--raus) both calc(.35s + var(--i)*.12s),sb-treiben calc(3.6s + var(--i)*.4s) ease-in-out calc(1.9s + var(--i)*.12s) infinite alternate}
.kst-anim.kst-offen .sb-bleibt{animation:sb-bleiben .8s var(--feder) both .1s,sb-treiben 4s ease-in-out 1s infinite alternate}
.kst-anim.kst-offen.sb-wackel .sb-lose:not(.sb-bleibt){animation:sb-nochmal 1.2s var(--raus) both calc(var(--i)*.05s)}
@keyframes sb-einfliegen{0%{opacity:0;transform:translate(calc(var(--dx)*.4),calc(var(--dy)*.4 + 18px)) rotate(calc(var(--r)*-.6))}55%{opacity:1;transform:translate(calc(var(--dx)*1.1),calc(var(--dy)*1.1)) rotate(var(--r))}100%{opacity:1;transform:none}}
@keyframes sb-nochmal{0%,100%{opacity:1;transform:none}35%{transform:translate(var(--dx),var(--dy)) rotate(var(--r))}}
@keyframes sb-bleiben{0%{transform:none}40%{transform:translateY(-6px) scale(1.06)}100%{transform:none}}
.kst-griff.kst-stups{animation:kst-stups 1.1s var(--ease) .1s 1}
@keyframes kst-stups{0%,100%{transform:translateX(-50%)}25%{transform:translateX(calc(-50% + 18px))}50%{transform:translateX(calc(-50% - 12px))}75%{transform:translateX(calc(-50% + 6px))}}
.kst-regler-zahl{display:inline-block}
.kst-regler-zahl.kst-frage{animation:kst-frage 3.2s ease-in-out infinite;transform-origin:50% 90%}
@keyframes kst-frage{0%,100%{transform:rotate(0)}50%{transform:rotate(-6deg)}}
@media (prefers-reduced-motion:reduce){.kst-anim .kst-studie-inhalt{transition:none}.kst-anim .kst-st{opacity:1;transform:none}}

/* Studie aufklappbar */
.kst-studie-klapp{margin-top:clamp(48px,6vw,80px);border-top:2px solid var(--anthrazit)}
.kst-studie-kopf{list-style:none;cursor:pointer;display:grid;gap:14px;padding-top:28px}
.kst-studie-kopf::-webkit-details-marker{display:none}
.kst-studie-svg{display:block;width:100%;height:auto;max-height:300px}
.sb-karte{fill:var(--blatt);stroke:rgba(53,53,53,.16);stroke-width:1.5}
.sb-zeile{fill:rgba(53,53,53,.16)}
.sb-faden{fill:none;stroke:var(--koralle);stroke-width:2.2;stroke-dasharray:1 8;stroke-linecap:round}
.sb-knoten{fill:var(--koralle)}
.sb-oder{font-family:var(--gara);font-style:italic;font-size:46px;fill:var(--koralle)}
.sb-label{font-family:var(--exo);font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;fill:rgba(53,53,53,.55)}
.kst-studie-zeile{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;border-top:1px solid var(--linie);padding-top:20px}
.kst-studie-auf{display:inline-flex;align-items:center;gap:12px;font-weight:500;font-size:16px;transition:color .3s var(--ease)}
.kst-studie-auf::after{content:"";width:16px;height:16px;background:linear-gradient(var(--koralle),var(--koralle)) center/16px 1.5px no-repeat,linear-gradient(var(--koralle),var(--koralle)) center/1.5px 16px no-repeat;transition:transform .5s var(--feder)}
.kst-studie-kopf:hover .kst-studie-auf{color:var(--koralle)}
.kst-studie-klapp[open] .kst-studie-auf::after{transform:rotate(45deg)}
.kst-studie-klapp .kst-studie{margin-top:28px;border-top:1px solid var(--linie)}

/* Tablet */
@media (max-width:991px){
  .kst-hero-grid{grid-template-columns:1fr}
  .kst-schirm{max-width:640px}
  .kat-zwei-kopf,.kst-beleg,.kst-fall,.kat-faq-grid,.kst-tv,.kst-studie,.kst-preise{grid-template-columns:1fr}
  .kst-akte{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kst-akt:nth-child(n){margin-top:0}
  .kst-stationen{grid-template-columns:1fr 1fr}
}
/* Handy */
@media (max-width:767px){
  .kst-felder{grid-template-columns:1fr}
  .kst-akte{grid-template-columns:repeat(5,72%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;margin-right:calc(-1 * max(24px,env(safe-area-inset-right,0px)))}
  .kst-akt{scroll-snap-align:start}
  .kst-werktisch{padding:90px 0 110px}
  .kst-t-container,.kst-t-baum2{display:none}
  .kst-t-windrad{left:0;top:0}.kst-t-wolke{right:0;top:10px}.kst-t-sonne{right:30%;top:0}
  .kst-t-baum{left:0;bottom:0}.kst-t-kanne{right:0;bottom:6px}
  .kst-stationen{grid-template-columns:1fr}
  .kst-hero-biene{right:-2%;top:-20%}
  .kst-flug{display:none}
  .kst-nachhaltig{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .kst-flug{display:none}
}

/* v3 (Landeplatz tiefer). v2: Kein eigener CTA mehr, die FAQ (#fragen) ist der letzte Abschnitt. Landeplatz der Biene (kst-a6) und Blumen sitzen dort links unter der Überschrift. */
#fragen{position:relative}
#fragen .kst-blumen{right:auto;left:max(24px,calc(50% - 576px));bottom:0;width:clamp(180px,19vw,280px)}
#fragen .kst-a6{right:auto;top:auto;left:calc(max(24px,calc(50% - 576px)) + clamp(110px,11vw,160px));bottom:clamp(200px,19.5vw,280px)}
@media screen and (max-width:991px){
  #fragen .kst-blumen{position:relative;display:block;left:auto;right:auto;width:230px;margin:28px -8px -40px auto}
  #fragen .kst-a6{left:auto;right:18%;bottom:200px}
}

.kst-studie-svg.kst-studie-svg-hoch{max-height:none;max-width:440px;margin:0 auto}
