@media(prefers-reduced-motion:no-preference){
  [aria-labelledby="hero-title"]>img{animation:cinema-zoom 1.65s cubic-bezier(.16,1,.3,1) both}
  [aria-labelledby="hero-title"]::after{
    content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
    background:linear-gradient(111deg,transparent 41%,rgb(24 120 255 / .27) 48%,rgb(90 198 255 / .84) 50%,rgb(24 120 255 / .24) 52%,transparent 59%);
    animation:blue-sweep 1.35s .2s ease-in-out both
  }
  [aria-labelledby="hero-title"]{--hero-text-tilt:18deg;--hero-text-depth:-65px;--hero-text-lift:20px}
  [aria-labelledby="hero-title"] p:has(+ #hero-title){animation:hero-copy-enter .65s .05s cubic-bezier(.16,1,.3,1) backwards}
  #hero-title{transform-origin:50% 85%;animation:hero-copy-enter .98s .16s cubic-bezier(.16,1,.3,1) backwards}
  #hero-title>span{animation:hero-accent-light .88s .42s ease-out}
  #hero-title+p{animation:hero-copy-enter .8s .38s cubic-bezier(.16,1,.3,1) backwards}
  .photo-turn{
    --entry-angle:-38deg;--entry-depth:58px;--entry-lift:24px;
    animation:photo-turn .85s cubic-bezier(.18,.82,.25,1)
  }
  .contact-turn{transform-box:fill-box;transform-origin:center;animation:contact-turn .72s cubic-bezier(.24,.72,.23,1) both}
  .strength-turn{
    --strength-angle:-34deg;
    transform-origin:50% 85%;
    animation:strength-turn .78s calc(var(--strength-order,0) * 85ms) cubic-bezier(.18,.82,.25,1) backwards
  }
  .review-reveal{
    transform-origin:center bottom;
    animation:review-reveal .72s calc(var(--review-order,0) * 65ms) cubic-bezier(.18,.82,.25,1) backwards
  }
  #ablauf .process-step{
    --step-tilt:32deg;--step-delay:calc(var(--step-order,0) * 140ms);
    transform-origin:50% 85%;
    animation:process-rise .86s var(--step-delay) cubic-bezier(.16,1,.3,1) backwards
  }
  #ablauf .process-step svg{
    transform-box:fill-box;transform-origin:center;
    animation:contact-turn .78s calc(var(--step-delay) + 100ms) cubic-bezier(.24,.72,.23,1) backwards
  }
  #ablauf .process-step span:nth-child(2){animation:hero-accent-light .85s calc(var(--step-delay) + 180ms) ease-out}
  #ablauf div[aria-hidden="true"]:has(+ ol > .process-step)::after{
    content:"";position:absolute;inset:0;background:var(--brand-bright);box-shadow:0 0 10px var(--brand-bright);
    transform-origin:left;animation:process-line 1.15s .12s cubic-bezier(.2,.8,.2,1) both
  }
  #ablauf .process-cta{
    position:relative;overflow:hidden;
    animation:process-rise .78s .16s cubic-bezier(.16,1,.3,1) backwards
  }
  #ablauf .process-cta::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(110deg,transparent 32%,rgb(255 255 255 / .4) 49%,transparent 66%);
    animation:blue-sweep .76s .46s ease-out both
  }
  @media(max-width:1023px){
    #mobile-nav:not([hidden]){transform-origin:top;animation:menu-panel .43s cubic-bezier(.2,.8,.2,1) both}
    #mobile-nav:not([hidden]) a{animation:menu-link .36s calc(70ms + var(--menu-order,0)*54ms) cubic-bezier(.2,.8,.2,1) both}
  }
  @media(max-width:767px){
    [aria-labelledby="hero-title"]{--hero-text-tilt:28deg;--hero-text-depth:-105px;--hero-text-lift:26px}
    [aria-labelledby="hero-title"]>img{animation-name:cinema-zoom-mobile;animation-duration:1.9s}
    .photo-turn{--entry-angle:-65deg;--entry-depth:115px;--entry-lift:44px;animation-duration:1s}
    .contact-turn{animation-duration:.93s}
    .strength-turn{--strength-angle:-48deg}
    #ablauf .process-step{--step-tilt:47deg;--step-delay:calc(var(--step-order,0) * 65ms)}
  }
  @keyframes cinema-zoom{from{transform:scale(1.14)}to{transform:scale(1)}}
  @keyframes hero-copy-enter{
    from{opacity:0;transform:perspective(760px) translate3d(0,var(--hero-text-lift),var(--hero-text-depth)) rotateX(var(--hero-text-tilt)) rotateY(-7deg)}
    to{opacity:1;transform:perspective(760px) translate3d(0,0,0) rotateX(0deg) rotateY(0deg)}
  }
  @keyframes hero-accent-light{
    0%,100%{text-shadow:none}
    42%{text-shadow:0 0 19px rgb(71 165 255 / .63)}
  }
  @keyframes cinema-zoom-mobile{from{transform:scale(1.3) translateY(-2%)}to{transform:scale(1)}}
  @keyframes blue-sweep{0%{transform:translateX(-100%);opacity:0}24%,62%{opacity:1}100%{transform:translateX(100%);opacity:0}}
  @keyframes photo-turn{
    from{opacity:.25;transform:perspective(720px) translate3d(0,var(--entry-lift),calc(-1 * var(--entry-depth))) rotateY(var(--entry-angle)) scale(.87)}
    to{opacity:1;transform:perspective(720px) translate3d(0,0,0) rotateY(0deg) scale(1)}
  }
  @keyframes contact-turn{
    from{transform:perspective(100px) rotateY(0deg)}
    to{transform:perspective(100px) rotateY(360deg)}
  }
  @keyframes strength-turn{
    from{opacity:.2;transform:perspective(580px) translate3d(0,18px,-60px) rotateX(var(--strength-angle))}
    to{opacity:1;transform:perspective(580px) translate3d(0,0,0) rotateX(0deg)}
  }
  @keyframes review-reveal{
    from{opacity:.2;transform:perspective(760px) translate3d(0,18px,-32px) rotateX(-14deg) rotateY(-12deg)}
    to{opacity:1;transform:perspective(760px) translate3d(0,0,0) rotateX(0deg) rotateY(0deg)}
  }
  @keyframes process-rise{
    from{opacity:.2;transform:perspective(720px) translate3d(0,30px,-90px) rotateX(var(--step-tilt,25deg))}
    to{opacity:1;transform:perspective(720px) translate3d(0,0,0) rotateX(0deg)}
  }
  @keyframes process-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  @keyframes menu-panel{from{clip-path:inset(0 0 100% 0 round 0 0 16px 16px)}to{clip-path:inset(0 0 0 0)}}
  @keyframes menu-link{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}