/* Motion layer — transforms/opacity only (no layout shift); disabled for reduced motion */
.sprog{position:fixed;inset:0 0 auto 0;height:3px;z-index:1000;background:linear-gradient(90deg,#c8102e,#ff4d5e);transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
@media (prefers-reduced-motion:no-preference){
 html.js .mw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
 html.js .mw>i{display:inline-block;font-style:inherit;transform:translate3d(0,105%,0) rotate(4deg);transform-origin:0 100%;transition:transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--w,0)*55ms)}
 html.js .hsplit.in .mw>i,html.js .hsplit-in .mw>i{transform:none}
 html.js .stg>*{opacity:0;transform:translate3d(0,28px,0) scale(.98);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0)*90ms)}
 html.js .stg.in>*{opacity:1;transform:none}
 html.js .clip{clip-path:inset(12% 8% 12% 8% round 14px);transition:clip-path 1.2s cubic-bezier(.7,0,.2,1)}
 html.js .clip.in{clip-path:inset(0 0 0 0 round 0)}
 html.js .clip img{transform:scale(1.15);transition:transform 1.6s cubic-bezier(.2,.8,.2,1)}
 html.js .clip.in img{transform:scale(1)}
 html.js main>section{transition:opacity .6s}
 .btn{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background-color .3s}
 .btn.mag{will-change:transform}
 .card,.fact{position:relative}
 .spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.14),transparent 60%);opacity:0;transition:opacity .3s}
 .spot:hover::after{opacity:1}
 @supports (animation-timeline:scroll()){
  .sprog{animation:sprog linear both;animation-timeline:scroll(root)}
  @keyframes sprog{to{transform:scaleX(1)}}
 }
}
@media (prefers-reduced-motion:reduce){.sprog{display:none}*{scroll-behavior:auto!important}}
