/* =====================================
   BASE STATE
===================================== */

[data-animate]{
  opacity:0;
  transform:translate3d(0,20px,0);
  transition:
    opacity .7s ease,
    transform .7s ease;
  will-change:transform,opacity;
}

/* =====================================
   VISIBLE
===================================== */

[data-animate].in-view{
  opacity:1;
  transform:translate3d(0,0,0);
}

/* =====================================
   DIRECTIONS
===================================== */

[data-animate="fade-up"]{
  transform:translate3d(0,40px,0);
}

[data-animate="fade-left"]{
  transform:translate3d(-40px,0,0);
}

[data-animate="fade-right"]{
  transform:translate3d(40px,0,0);
}

[data-animate="zoom-in"]{
  transform:scale(.6);
}

/* =====================================
   REDUCED MOTION
===================================== */

@media (prefers-reduced-motion:reduce){
  [data-animate]{
    transition:none;
    opacity:1;
    transform:none;
  }
}
html:not(.js-ready) [data-animate]{
  opacity:0;
}

@media screen and (max-width:768px) {
  .mob-off [data-animate], .mob-off[data-animate] { 
    opacity:1 !important; /* hned viditelné */ 
    transform:none !important; /* žádný posun/zoom */ 
    transition:none !important; /* žádná animace */ 
  } 
}