html.vsk-motion body{animation:vm-page-in .5s ease both}
html.vsk-leaving body{animation:vm-page-out .22s ease-in both;pointer-events:none}
@keyframes vm-page-in{from{opacity:0}to{opacity:1}}
@keyframes vm-page-out{to{opacity:0}}

html.vsk-motion .rv{
  opacity:0;transform:translateY(26px);
  transition:opacity .55s ease,transform .7s cubic-bezier(.2,.9,.3,1);
  transition-delay:calc(var(--rv-i,0) * 70ms);
}
html.vsk-motion .rv[data-rv="left"]{transform:translateX(-36px)}
html.vsk-motion .rv[data-rv="right"]{transform:translateX(36px)}
html.vsk-motion .rv[data-rv="zoom"]{transform:scale(.9)}
html.vsk-motion .rv[data-rv="pop"]{transform:scale(.7);transition-timing-function:ease,cubic-bezier(.2,1.5,.3,1)}
html.vsk-motion .rv.is-in{opacity:1;transform:none}
html.vsk-motion .rv.is-out{transition-duration:.3s,.3s;transition-delay:0s}

html.vsk-motion #nav{animation:vm-nav .6s cubic-bezier(.2,.9,.3,1) both}
html.vsk-motion .mk-h1 > span{animation:vm-rise .8s cubic-bezier(.2,.9,.3,1) both}
html.vsk-motion .mk-h1 > span:nth-child(2){animation-delay:.12s}
html.vsk-motion .mk-hero-copy .mk-lead{animation:vm-rise .7s cubic-bezier(.2,.9,.3,1) .22s both}
html.vsk-motion .mk-hero-search{animation:vm-rise .7s cubic-bezier(.2,.9,.3,1) .32s both}
html.vsk-motion .mk-quick > *{animation:vm-pop .5s cubic-bezier(.2,1.4,.3,1) both;animation-delay:calc(.45s + var(--i,0) * 60ms)}
html.vsk-motion .mk-quick > :nth-child(2){--i:1}
html.vsk-motion .mk-quick > :nth-child(3){--i:2}
html.vsk-motion .mk-quick > :nth-child(4){--i:3}
html.vsk-motion .mk-quick > :nth-child(5){--i:4}
html.vsk-motion .mk-hero-visual{animation:vm-fade 1.1s ease .1s both}
html.vsk-motion .kt-head > *{animation:vm-rise .6s cubic-bezier(.2,.9,.3,1) both}
html.vsk-motion .kt-head > :nth-child(2){animation-delay:.08s}
@keyframes vm-nav{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes vm-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes vm-pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes vm-fade{from{opacity:0}to{opacity:1}}

@keyframes vm-float{0%,100%{transform:none}50%{transform:translateY(-4px)}}
@keyframes vm-nudge{0%,100%{transform:none}50%{transform:translateX(4px)}}
@keyframes vm-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3);opacity:0}}
@keyframes vm-blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes vm-spin-once{from{transform:rotate(-180deg) scale(.4)}to{transform:none}}

@media (prefers-reduced-motion:no-preference){
  .mk-trust-ico{animation:vm-float 3.2s ease-in-out infinite}
  .mk-trust-list li:nth-child(2) .mk-trust-ico{animation-delay:.4s}
  .mk-trust-list li:nth-child(3) .mk-trust-ico{animation-delay:.8s}
  .mk-trust-list li:nth-child(4) .mk-trust-ico{animation-delay:1.2s}

  .mk-dot{position:relative}
  .mk-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--ok);animation:vm-pulse 1.8s ease-out infinite}

  .mk-all svg,.card-detail-btn svg{animation:vm-nudge 1.4s ease-in-out infinite}
  .mk-skel .mk-card-media,.mk-skel-line{animation:vm-blink 1.2s ease-in-out infinite}
  .mk-theme svg{animation:vm-spin-once .5s cubic-bezier(.2,1.4,.3,1)}

  .mk-card,.media-card,body.catalog-body .account-card,.mk-cat,.mk-promo-img,#sec-testi .testi-card{transition:transform .35s cubic-bezier(.2,.9,.3,1),border-color .15s,box-shadow .35s}
  .mk-card:hover,.media-card:hover,body.catalog-body .account-card:hover,#sec-testi .testi-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
  .mk-cat:hover{transform:translateY(-3px)}
  .mk-promo:hover .mk-promo-img{transform:translateY(-4px)}
  .mk-cat-chips a,.mk-quick a,.mk-tab,.ftab,.page-btn,.mk-btn,.mk-all,.mk-lang button,.mk-theme{transition:transform .2s cubic-bezier(.2,1.4,.3,1),background .15s,border-color .15s,color .15s}
  .mk-cat-chips a:hover,.mk-quick a:hover,.mk-all:hover,.mk-btn:hover{transform:translateY(-2px)}
  .mk-cat-chips a:active,.mk-quick a:active,.mk-btn:active,.mk-all:active,.page-btn:active,.mk-theme:active{transform:scale(.94)}
  .mk-svc a.tcb-btn{transition:transform .35s cubic-bezier(.2,1.2,.3,1),opacity .15s}
  .mk-svc a.tcb-btn:hover{transform:translateY(-4px) scale(1.02);opacity:1}
  .mk-how-n{transition:transform .3s cubic-bezier(.2,1.5,.3,1),color .2s}
  .mk-how-list li:hover .mk-how-n{transform:scale(1.5);color:var(--accent-text)}
}

@media (prefers-reduced-motion:reduce){
  html.vsk-motion body,html.vsk-leaving body{animation:none}
}
