/* Bewegung „Gegenläufige Bahnen“ (Styleguide 1.7, Abschnitt 4.4 · TECHNIK v1.9, §15.4–6). Nur Startseite und Bereichsvorlage.
   Stationen laufen auf Kreisbahnen um den wandernden Ringmittelpunkt; die zweite Drehung im selben Transform hält die Badges
   aufrecht. Startfigur ab 1100 px: oberer Rand 358 px unter dem Seitenanfang, mittig; Ecken unter der 87-px-Kopfzeile.
   Winkel am Bildschirm = minus mathematischer Winkel. --hh-sb (Breite der Bildlaufleiste) setzt uebergang.js. */
@view-transition{navigation:auto}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
:root{--hh-sb:0px;--hh-z:1;--hh-fw:1240px;--hh-bz:1}
@media (max-width:1339px){:root{--hh-bz:.85}}
@media (max-width:1303px){:root{--hh-z:.85;--hh-fw:1054px}}
.hh-kopf{view-transition-name:hh-kopf}
.hh-vt-bahn-l{view-transition-name:hh-bahn-l}
.hh-vt-bahn-r{view-transition-name:hh-bahn-r}
.hh-vt-st-consulting{view-transition-name:hh-st-consulting}
.hh-vt-st-audit{view-transition-name:hh-st-audit}
.hh-vt-st-webservices{view-transition-name:hh-st-webservices}
.hh-vt-st-iot{view-transition-name:hh-st-iot}
.hh-vt-st-office{view-transition-name:hh-st-office}
.hh-vt-st-fireworks{view-transition-name:hh-st-fireworks}
::view-transition-group(*){animation-timing-function:cubic-bezier(.65,0,.35,1)}
::view-transition-group(hh-kopf){z-index:5}
@media (max-width:1099px){::view-transition-group(*){animation-duration:300ms}}
@media (min-width:1100px){
:root{--hh-x0l:calc(max(32px,(100vw - var(--hh-sb) - var(--hh-fw)) / 2) + 494px * var(--hh-z));--hh-x0r:calc(max(32px,(100vw - var(--hh-sb) - var(--hh-fw)) / 2) + 746px * var(--hh-z));--hh-y0:calc(358.07px + var(--hh-ab) + 320px * var(--hh-z));--hh-xel:0px;--hh-xer:calc(100vw - var(--hh-sb));--hh-ye:calc(87px + var(--hh-ab))}
html:active-view-transition-type(gleicher-ring)::view-transition-group(*){animation-duration:300ms}
html:active-view-transition-type(start-bereich,bereich-start)::view-transition-group(*){animation-duration:900ms}
html:active-view-transition-type(start-bereich,bereich-start)::view-transition-old(root){animation:hh-aus 900ms linear both}
html:active-view-transition-type(start-bereich,bereich-start)::view-transition-new(root){animation:hh-ein-sb 900ms linear both}
html:active-view-transition-type(start-bereich,bereich-start)::view-transition-group(hh-bahn-l),html:active-view-transition-type(start-bereich,bereich-start)::view-transition-group(hh-bahn-r){animation-duration:600ms;animation-delay:150ms}
html:active-view-transition-type(ringwechsel)::view-transition-group(*){animation-duration:700ms}
html:active-view-transition-type(ringwechsel)::view-transition-old(root){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(root){animation:hh-ein-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-bahn-l),html:active-view-transition-type(ringwechsel)::view-transition-group(hh-bahn-r){animation-duration:550ms;animation-delay:150ms}
::view-transition-group(hh-st-consulting){--hh-x0:var(--hh-x0l);--hh-xe:var(--hh-xel);--hh-a0:-130deg;--hh-a1:-292deg;--hh-as:-202deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-consulting){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-consulting){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-consulting){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-consulting){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-consulting){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-consulting){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-consulting){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
::view-transition-group(hh-st-audit){--hh-x0:var(--hh-x0l);--hh-xe:var(--hh-xel);--hh-a0:-180deg;--hh-a1:-318deg;--hh-as:-228deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-audit){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-audit){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-audit){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-audit){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-audit){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-audit){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-audit){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
::view-transition-group(hh-st-webservices){--hh-x0:var(--hh-x0l);--hh-xe:var(--hh-xel);--hh-a0:-230deg;--hh-a1:-344deg;--hh-as:-254deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-webservices){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-webservices){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-webservices){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-webservices){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-webservices){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-webservices){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-webservices){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
::view-transition-group(hh-st-iot){--hh-x0:var(--hh-x0r);--hh-xe:var(--hh-xer);--hh-a0:-50deg;--hh-a1:112deg;--hh-as:22deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-iot){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-iot){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-iot){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-iot){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-iot){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-iot){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-iot){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
::view-transition-group(hh-st-office){--hh-x0:var(--hh-x0r);--hh-xe:var(--hh-xer);--hh-a0:0deg;--hh-a1:138deg;--hh-as:48deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-office){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-office){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-office){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-office){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-office){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-office){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-office){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
::view-transition-group(hh-st-fireworks){--hh-x0:var(--hh-x0r);--hh-xe:var(--hh-xer);--hh-a0:50deg;--hh-a1:164deg;--hh-as:74deg}
html:active-view-transition-type(start-bereich)::view-transition-group(hh-st-fireworks){animation:hh-sb 900ms linear both}
html:active-view-transition-type(bereich-start)::view-transition-group(hh-st-fireworks){animation:hh-sb 900ms linear both reverse}
html:active-view-transition-type(ringwechsel)::view-transition-group(hh-st-fireworks){animation:hh-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-old(hh-st-fireworks){animation:hh-aus-rw 700ms linear both}
html:active-view-transition-type(ringwechsel)::view-transition-new(hh-st-fireworks){animation:hh-ein-st 700ms linear both}
html:active-view-transition-type(gross-r)::view-transition-group(hh-st-fireworks){--hh-r1:calc(380px * var(--hh-bz));--hh-s1:calc(80px * var(--hh-bz));--hh-ra:calc(92px * var(--hh-bz));--hh-sa:calc(30px * var(--hh-bz))}
html:active-view-transition-type(gross-l)::view-transition-group(hh-st-fireworks){--hh-r1:calc(92px * var(--hh-bz));--hh-s1:calc(30px * var(--hh-bz));--hh-ra:calc(380px * var(--hh-bz));--hh-sa:calc(80px * var(--hh-bz))}
}
@keyframes hh-sb{0%{transform:translate(var(--hh-x0),var(--hh-y0)) rotate(var(--hh-a0)) translateX(calc(220px * var(--hh-z))) rotate(calc(-1 * var(--hh-a0))) translate(-50%,-50%);width:calc(88px * var(--hh-z));height:calc(88px * var(--hh-z))}16.667%{transform:translate(var(--hh-x0),var(--hh-y0)) rotate(var(--hh-a0)) translateX(calc(220px * var(--hh-z))) rotate(calc(-1 * var(--hh-a0))) translate(-50%,-50%);width:calc(88px * var(--hh-z));height:calc(88px * var(--hh-z));animation-timing-function:cubic-bezier(.65,0,.35,1)}83.333%,100%{transform:translate(var(--hh-xe),var(--hh-ye)) rotate(var(--hh-a1)) translateX(var(--hh-r1)) rotate(calc(-1 * var(--hh-a1))) translate(-50%,-50%);width:var(--hh-s1);height:var(--hh-s1)}}
@keyframes hh-rw{0%{transform:translate(var(--hh-xe),var(--hh-ye)) rotate(var(--hh-a1)) translateX(var(--hh-ra)) rotate(calc(-1 * var(--hh-a1))) translate(-50%,-50%);width:var(--hh-sa);height:var(--hh-sa);animation-timing-function:step-end}21.43%{transform:translate(var(--hh-xe),var(--hh-ye)) rotate(var(--hh-as)) translateX(var(--hh-ra)) rotate(calc(-1 * var(--hh-as))) translate(-50%,-50%);width:var(--hh-sa);height:var(--hh-sa);animation-timing-function:cubic-bezier(.65,0,.35,1)}100%{transform:translate(var(--hh-xe),var(--hh-ye)) rotate(var(--hh-a1)) translateX(var(--hh-r1)) rotate(calc(-1 * var(--hh-a1))) translate(-50%,-50%);width:var(--hh-s1);height:var(--hh-s1)}}
@keyframes hh-aus{0%{opacity:1}16.667%,100%{opacity:0}}
@keyframes hh-ein-sb{0%,83.333%{opacity:0}100%{opacity:1}}
@keyframes hh-aus-rw{0%{opacity:1}21.43%,100%{opacity:0}}
@keyframes hh-ein-rw{0%,78.57%{opacity:0}100%{opacity:1}}
@keyframes hh-ein-st{0%,21.43%{opacity:0}40%,100%{opacity:1}}
