
.hero-zeichnung,.tuer-overlay{--amber:#d99a2b;--linie:#ccd4db;--blatt:#fff}

  .k1{fill:none;stroke:#242933;stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round}
  .k2{fill:none;stroke:#242933;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
  .k3{fill:none;stroke:#3d4553;stroke-width:1.1;stroke-linejoin:round;stroke-linecap:round}
  .h{fill:none;stroke:#5d6774;stroke-width:.8;stroke-linecap:round}
  .a1{fill:none;stroke:#d99a2b;stroke-width:5.6;stroke-linejoin:round;stroke-linecap:round}
  .a2{fill:none;stroke:#d99a2b;stroke-width:2.6;stroke-linecap:round}
  .fl{fill:#fff;stroke:none}
  .oeff{fill:#cfdae6;stroke:#536f97;stroke-width:1.1}
  .kf1{fill:#fcfcfd;stroke:#242933;stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round}
  .kf2{fill:#fcfcfd;stroke:#242933;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
  .kf3{fill:#fcfcfd;stroke:#3d4553;stroke-width:1.1;stroke-linejoin:round;stroke-linecap:round}
  .fb{fill:#fcfcfd;stroke:none}

  @keyframes zeichnen{to{stroke-dashoffset:0}}
  @keyframes einblenden{from{opacity:0}to{opacity:1}}
  @keyframes fuellen{from{fill-opacity:0}to{fill-opacity:1}}

  @media (min-width:1700px){
    .schild .titel{font-size:2rem}
    .schild .zeile{font-size:1.1rem;max-width:48ch}
    .schild .kicker{font-size:.9rem}
    .schild .cta2{font-size:1.1rem;padding:.75rem 1.4rem}
  }

  .blink{opacity:0}
  .blink path{fill:#d99a2b;stroke:none}

  .ladung{transform-box:fill-box}

  .seil{transform-box:fill-box;transform-origin:50% 0;transform:rotate(-36.81deg)}
  .rad-u{transform-box:fill-box;transform-origin:50% 50%}

  @media (prefers-reduced-motion:reduce){.blink{opacity:.75}}

  html{--pp:running}
  html.ruht{--pp:paused}
  html:not(.js){--pp:paused;--laufen:stillstand;--ankunft:stillstand}

  html.ruht-start{--laufen:stillstand;--ankunft:stillstand}
  .halt{position:fixed;right:.9rem;bottom:.9rem;z-index:40;
    font:500 .78rem/1 var(--text);color:var(--ink-dim);background:var(--blatt);
    border:1px solid var(--linie);border-radius:2rem;padding:.55rem .95rem;
    cursor:pointer;display:none;align-items:center;gap:.45rem;min-height:44px}
  .js .halt{display:inline-flex}
  @media (prefers-reduced-motion:reduce){.halt{display:none !important}}
  .halt:hover{color:var(--ink);border-color:var(--stahl)}
  .halt:focus-visible{color:var(--ink);border-color:var(--nacht);
    outline:3px solid var(--stahl);outline-offset:2px}

  .halt-zeichen{width:.6rem;height:.62rem;
    background:linear-gradient(90deg,currentColor 0 36%,transparent 36% 64%,currentColor 64% 100%)}
  .ruht .halt-zeichen{background:currentColor;
    clip-path:polygon(0 0,100% 50%,0 100%)}
  @media (max-width:760px){

    .halt{position:static;margin:0;font-size:.72rem;padding:.35rem .7rem;min-height:34px}
    .boden{flex-direction:column;gap:.35rem}
  }

  .steht-fest{transform:translateY(-4px)}
  .steht-fest .bein-h{transform:rotate(-19deg)}
  .steht-fest .fuss-h{transform:rotate(19deg)}
  .steht-fest .bein-v{transform:rotate(2deg)}
  .steht-fest .fuss-v{transform:rotate(-2deg)}

  .bein-h{transform-box:fill-box;transform-origin:86% 3%}
  .bein-v{transform-box:fill-box;transform-origin:23% 0%}
  .fuss-h{transform-box:fill-box;transform-origin:65% 22%}
  .fuss-v{transform-box:fill-box;transform-origin:30% 0%}
  .arm-v{transform-box:fill-box;transform-origin:10% 0%}
  .arm-h{transform-box:fill-box;transform-origin:95% 0%}
  .geher{transform-box:fill-box;transform-origin:50% 100%}
  .figur{transform-box:fill-box;transform-origin:50% 100%}
  .arm-tel{transform-box:fill-box;transform-origin:14% 60%}
  .arm-frei{transform-box:fill-box;transform-origin:100% 0%}
  .arm-a{transform-box:fill-box;transform-origin:100% 0%}
  .arm-m{transform-box:fill-box;transform-origin:0% 100%}
  .wandert{transform-box:fill-box;transform-origin:50% 100%}

  .kpf,.kpf-f{transform-box:fill-box;transform-origin:50% calc(100% + 6px)}
  .kpf--p{transform-origin:36% calc(100% + 6px)}
  .kpf--m{transform-origin:39% calc(100% + 6px)}
  .kpf--b{transform-origin:50% calc(100% + 5px)}

  .geher-huelle{transform-box:fill-box;transform-origin:50% 100%}
  .arm-fb{transform-box:fill-box;transform-origin:95% 0%}

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

  @keyframes s-bein{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}75%{transform:rotate(7deg)}}
  @keyframes s-fuss{0%,100%{transform:rotate(0)}25%{transform:rotate(4deg)}75%{transform:rotate(-4deg)}}
  @keyframes s-arm{0%,100%{transform:rotate(0)}25%{transform:rotate(6deg)}75%{transform:rotate(-6deg)}}
  @keyframes s-wippen{0%,50%,100%{transform:translateY(0)}25%,75%{transform:translateY(-1.2px)}}
  @keyframes hereinlaufen{from{transform:translateX(var(--von))}to{transform:translateX(0)}}

  @keyframes stillstand{from{transform:translateY(-4px)}to{transform:translateY(-4px)}}

  .wandert{animation:var(--laufen,hereinlaufen) var(--lauf,12.6s) linear 1.6s both,
    var(--ankunft,ankommen) 1.4s ease-in-out 14.2s forwards;animation-play-state:var(--pp,running)}

  .geher--bw{--n:7;--von:-370px;--lauf:12.6s}

  .wandert .geher{animation:atmen 12s ease-in-out infinite alternate,
    s-wippen 1.8s ease-in-out 1.6s var(--n,4);animation-play-state:var(--pp,running)}

  @keyframes schliessen-bh{from{transform:rotate(0)}to{transform:rotate(-19deg)}}
  @keyframes schliessen-fh{from{transform:rotate(0)}to{transform:rotate(19deg)}}
  @keyframes schliessen-bv{from{transform:rotate(0)}to{transform:rotate(2deg)}}
  @keyframes schliessen-fv{from{transform:rotate(0)}to{transform:rotate(-2deg)}}
  @keyframes ankommen{from{transform:translateX(0) translateY(0)}
    to{transform:translateX(0) translateY(-4px)}}
  .wandert .bein-h{animation:s-bein 1.8s ease-in-out 1.6s var(--n,4),
    schliessen-bh 1.4s ease-in-out 14.2s forwards;animation-play-state:var(--pp,running)}
  .wandert .bein-v{animation:s-bein 1.8s ease-in-out 0.7s var(--n,4),
    schliessen-bv 1.4s ease-in-out 13.3s forwards;animation-play-state:var(--pp,running)}
  .wandert .fuss-h{animation:s-fuss 1.8s ease-in-out 1.6s var(--n,4),
    schliessen-fh 1.4s ease-in-out 14.2s forwards;animation-play-state:var(--pp,running)}
  .wandert .fuss-v{animation:s-fuss 1.8s ease-in-out 0.7s var(--n,4),
    schliessen-fv 1.4s ease-in-out 13.3s forwards;animation-play-state:var(--pp,running)}

  .wandert .arm-v{animation:s-arm 1.8s ease-in-out 0.7s var(--n,4),
    umgreifen 26s ease-in-out 15.6s infinite;animation-play-state:var(--pp,running)}
  .wandert .kpf{animation:umsehen 13s ease-in-out 15.6s infinite;animation-play-state:var(--pp,running)}
  .wandert .arm-h{animation:s-arm 1.8s ease-in-out 1.6s var(--n,4);animation-play-state:var(--pp,running)}

  @keyframes atmen{0%,100%{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}
  @keyframes heben{0%,8%{transform:translateY(0)}30%,60%{transform:translateY(-14px)}82%,100%{transform:translateY(0)}}

  @keyframes blinken{0%,40%{opacity:.85}48%,88%{opacity:.28}96%,100%{opacity:.85}}
  @keyframes telefonieren{0%,22%,100%{transform:rotate(0)}34%{transform:rotate(-3.5deg)}
    52%{transform:rotate(1.8deg)}70%{transform:rotate(-2deg)}}
  @keyframes antworten{0%,66%,100%{transform:rotate(0)}76%{transform:rotate(15deg)}86%{transform:rotate(6deg)}}

  @keyframes p2-zeigt{0%,6%{transform:rotate(0)}
    14%{transform:rotate(-9deg)}22%{transform:rotate(-4deg)}30%{transform:rotate(-10deg)}
    40%,80%{transform:rotate(0)}
    86%{transform:rotate(-7deg)}92%{transform:rotate(-3deg)}98%,100%{transform:rotate(0)}}
  @keyframes p2-kopf{0%,42%{transform:rotate(0)}
    50%,64%{transform:rotate(-13deg)}68%{transform:rotate(-4deg)}72%{transform:rotate(-11deg)}
    82%,100%{transform:rotate(0)}}
  @keyframes p1-kopf{0%,8%{transform:rotate(0)}
    16%,30%{transform:rotate(12deg)}
    34%{transform:rotate(3deg)}38%{transform:rotate(10deg)}42%{transform:rotate(3deg)}
    50%,70%{transform:rotate(6deg)}
    80%,100%{transform:rotate(0)}}

  @keyframes p1-antwortet{0%,44%{transform:rotate(0)}
    52%{transform:rotate(26deg)}60%{transform:rotate(18deg)}68%{transform:rotate(24deg)}
    76%,100%{transform:rotate(0)}}
  .redet-p2 .arm-v{animation:p2-zeigt 24s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .redet-p2 .kpf{animation:p2-kopf 24s ease-in-out infinite;animation-play-state:var(--pp,running)}

  .redet-p2 .geher{animation-delay:-5s}
  .redet-p1 .arm-h{animation:p1-antwortet 24s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .redet-p1 .kpf{animation:p1-kopf 24s ease-in-out infinite;animation-play-state:var(--pp,running)}

  @keyframes sb-erklaert{0%,8%{transform:rotate(0)}
    16%{transform:rotate(-52deg)}24%{transform:rotate(-42deg)}32%{transform:rotate(-49deg)}
    42%,72%{transform:rotate(0)}
    80%{transform:rotate(-27deg)}88%{transform:rotate(-19deg)}
    96%,100%{transform:rotate(0)}}
  @keyframes sb-kopf{0%,4%{transform:rotate(0)}
    12%,36%{transform:rotate(12deg)}
    46%{transform:rotate(4deg)}52%{transform:rotate(13deg)}58%{transform:rotate(4deg)}
    64%,76%{transform:rotate(10deg)}
    88%,100%{transform:rotate(0)}}

  @keyframes m-arbeitet{0%,2%{transform:rotate(-4deg)}
    5%{transform:rotate(4deg)}8%{transform:rotate(-4deg)}11%{transform:rotate(4deg)}
    14%,44%{transform:rotate(-6.2deg)}
    50%{transform:rotate(11deg)}57%{transform:rotate(4deg)}63%{transform:rotate(10deg)}
    70%{transform:rotate(-4.6deg)}
    76%{transform:rotate(4deg)}79%{transform:rotate(-4deg)}82%{transform:rotate(4deg)}
    85%,100%{transform:rotate(-4deg)}}

  @keyframes m-kopf{0%,6%{transform:rotate(0)}
    14%,40%{transform:rotate(13deg)}
    46%,64%{transform:rotate(11deg)}70%{transform:rotate(4deg)}
    80%,100%{transform:rotate(0)}}

  @keyframes m-koerper{0%{transform:rotate(-1.1deg)}
    5%{transform:rotate(0.4deg)}10%{transform:rotate(1.3deg)}
    14%{transform:rotate(2.6deg)}20%{transform:rotate(1.6deg)}26%{transform:rotate(2.6deg)}
    32%{transform:rotate(1.7deg)}38%{transform:rotate(2.5deg)}
    44%{transform:rotate(1.4deg)}50%{transform:rotate(2.4deg)}56%{transform:rotate(1.5deg)}
    62%{transform:rotate(2.3deg)}
    68%{transform:rotate(0.8deg)}74%{transform:rotate(-0.2deg)}80%{transform:rotate(-1.1deg)}
    86%{transform:rotate(0deg)}92%{transform:rotate(-1.1deg)}96%{transform:rotate(-0.2deg)}
    100%{transform:rotate(-1.1deg)}}
  .bespricht .arm-v{animation:sb-erklaert 20s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .bespricht .kpf{animation:sb-kopf 20s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .arm-m{animation:m-arbeitet 20s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .kpf--m{animation:m-kopf 20s ease-in-out infinite;animation-play-state:var(--pp,running)}

  @keyframes a-erklaert{0%,8%{transform:rotate(0)}
    16%{transform:rotate(12deg)}24%{transform:rotate(5deg)}30%{transform:rotate(10deg)}
    38%,56%{transform:rotate(0)}
    62%{transform:rotate(9deg)}68%{transform:rotate(4deg)}
    76%,100%{transform:rotate(0)}}
  @keyframes b-antwortet{0%,36%{transform:rotate(0)}
    43%{transform:rotate(19deg)}49%{transform:rotate(10deg)}54%{transform:rotate(16deg)}
    60%,78%{transform:rotate(0)}
    84%{transform:rotate(13deg)}90%{transform:rotate(6deg)}
    96%,100%{transform:rotate(0)}}

  @keyframes umgreifen{0%,10%{transform:rotate(0)}
    18%{transform:rotate(-13deg)}26%{transform:rotate(-7deg)}34%{transform:rotate(-11deg)}
    44%,100%{transform:rotate(0)}}
  @keyframes umsehen{0%,12%{transform:rotate(0)}
    22%,36%{transform:rotate(-6deg)}46%{transform:rotate(0)}
    58%,72%{transform:rotate(5deg)}
    84%,100%{transform:rotate(0)}}
  @keyframes a-kopf{0%,4%{transform:rotate(0)}
    12%,34%{transform:rotate(11deg)}
    42%,58%{transform:rotate(12deg)}64%{transform:rotate(4deg)}68%{transform:rotate(10deg)}
    78%,100%{transform:rotate(0)}}

  @keyframes p1-neigen{0%,8%{transform:rotate(0)}
    18%,40%{transform:rotate(2.6deg)}
    50%,72%{transform:rotate(1.2deg)}
    84%,100%{transform:rotate(0)}}
  @keyframes p2-neigen{0%,42%{transform:rotate(0)}
    50%,72%{transform:rotate(-2.4deg)}
    82%,100%{transform:rotate(0)}}
  @keyframes sb-neigen{0%,4%{transform:rotate(0)}
    12%,40%{transform:rotate(2.4deg)}
    48%,72%{transform:rotate(1.4deg)}
    86%,100%{transform:rotate(0)}}
  .redet-p1 .geher-huelle{animation:p1-neigen 24s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .redet-p2 .geher-huelle{animation:p2-neigen 24s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .bespricht .geher-huelle{animation:sb-neigen 20s ease-in-out infinite;animation-play-state:var(--pp,running)}

  @keyframes a-koerper{0%{transform:rotate(-1.1deg)}
    6%{transform:rotate(0.2deg)}12%{transform:rotate(2.4deg)}18%{transform:rotate(1.5deg)}
    24%{transform:rotate(2.4deg)}30%{transform:rotate(1.4deg)}36%{transform:rotate(2.2deg)}
    42%{transform:rotate(1.1deg)}48%{transform:rotate(2deg)}54%{transform:rotate(1deg)}
    60%{transform:rotate(1.9deg)}
    66%{transform:rotate(0.6deg)}72%{transform:rotate(-0.3deg)}78%{transform:rotate(-1.1deg)}
    84%{transform:rotate(-0.1deg)}90%{transform:rotate(-1.1deg)}96%{transform:rotate(-0.2deg)}
    100%{transform:rotate(-1.1deg)}}
  @keyframes b-koerper{0%{transform:rotate(1.1deg)}
    6%{transform:rotate(0.2deg)}12%{transform:rotate(1deg)}18%{transform:rotate(0.1deg)}
    24%{transform:rotate(-0.8deg)}30%{transform:rotate(0.1deg)}36%{transform:rotate(-1.2deg)}
    42%{transform:rotate(-2.4deg)}48%{transform:rotate(-1.4deg)}54%{transform:rotate(-2.3deg)}
    60%{transform:rotate(-1.2deg)}
    66%{transform:rotate(-0.2deg)}72%{transform:rotate(0.8deg)}78%{transform:rotate(-0.1deg)}
    84%{transform:rotate(1.1deg)}90%{transform:rotate(0.2deg)}96%{transform:rotate(1deg)}
    100%{transform:rotate(1.1deg)}}
  .arm-a{animation:a-erklaert 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .kpf--a{animation:a-kopf 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
  @keyframes b-kopf{0%,32%{transform:rotate(0)}
    40%,56%{transform:rotate(-9deg)}62%{transform:rotate(-3deg)}66%{transform:rotate(-8deg)}
    76%,100%{transform:rotate(0)}}
  .kpf--b{animation:b-kopf 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .arm-fb{animation:b-antwortet 26s ease-in-out infinite;animation-play-state:var(--pp,running)}

  .figur{animation:atmen 11s ease-in-out infinite alternate;animation-play-state:var(--pp,running)}

  .figur-m{animation:m-koerper 20s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .figur-a{animation:a-koerper 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .figur-b{animation:b-koerper 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .geher{animation:atmen 12s ease-in-out infinite alternate;animation-play-state:var(--pp,running)}
  .hub{animation:heben 40s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .blink{animation:blinken 5.4s ease-in-out infinite;animation-play-state:var(--pp,running)}

  @keyframes winde{from{transform:translateX(52px)}to{transform:translateX(0)}}
  @keyframes seil-zieht{from{transform:rotate(-43.10deg) scaleY(1.1454)}
    to{transform:rotate(-36.81deg) scaleY(1)}}
  @keyframes rad-rollt{from{transform:rotate(119.9deg)}to{transform:rotate(0)}}

  @keyframes warte-wagen{from,to{transform:translateX(52px)}}
  @keyframes warte-seil{from,to{transform:rotate(-43.10deg) scaleY(1.1454)}}
  @keyframes warte-rad{from,to{transform:rotate(119.9deg)}}

  .ladung{animation:var(--b-wagen,winde) 5s cubic-bezier(.3,0,.3,1) 1.2s both;
    animation-play-state:var(--pp,running)}
  .seil{animation:var(--b-seil,seil-zieht) 5s cubic-bezier(.3,0,.3,1) 1.2s both;
    animation-play-state:var(--pp,running)}
  .rad-u{animation:var(--b-rad,rad-rollt) 5s cubic-bezier(.3,0,.3,1) 1.2s both;
    animation-play-state:var(--pp,running)}
  .arm-tel{animation:telefonieren 16s ease-in-out infinite;animation-play-state:var(--pp,running)}
  .arm-frei{animation:antworten 21s ease-in-out infinite;animation-play-state:var(--pp,running)}
  }

.fb.ak{fill:#d99a2b;stroke:none}
.ak-strich{fill:none;stroke:#d99a2b;stroke-width:2.6;stroke-linecap:round}
.kpf--va{animation:va-kopf 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
.kpf--vb{animation:vb-kopf 26s ease-in-out infinite;animation-play-state:var(--pp,running)}
@keyframes va-kopf{0%,8%{transform:rotate(0)}14%,30%{transform:rotate(3.5deg)}36%,58%{transform:rotate(0)}64%,78%{transform:rotate(2.5deg)}84%,100%{transform:rotate(0)}}
@keyframes vb-kopf{0%,20%{transform:rotate(0)}26%,42%{transform:rotate(-3deg)}48%,70%{transform:rotate(0)}76%,90%{transform:rotate(-3.5deg)}96%,100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.kpf--va,.kpf--vb{animation:none}}

path.ak-f{fill:#d99a2b}
path.ak-s{stroke:#d99a2b}
.fb.ak-aus{fill:#fcfcfd;stroke:none}
