:root {
      --io-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
      --io-ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
      --io-duration: 1900ms;
}

.io-ready [data-aos] {
      opacity: 0;
      transform: translate3d(0, 24px, 0);
      will-change: opacity, transform;
}

.io-ready [data-aos].io-visible {
      opacity: 1;
      transform: translate3d(0, 0, 0);
      will-change: auto;
}

.io-ready [data-aos="reveal-up"] {
      transform: translate3d(0, 64px, 0) scale(0.985);
      transform-origin: 50% 70%;
}

.io-ready [data-aos="reveal-up"].io-visible {
      animation: io-rise var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="reveal-in"] {
      transform: translate3d(64px, 0, 0) scale(0.99);
}

.io-ready [data-aos="reveal-in"].io-visible {
      animation: io-slide-right var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="reveal-in-right"] {
      transform: translate3d(-64px, 0, 0) scale(0.99);
}

.io-ready [data-aos="reveal-in-right"].io-visible {
      animation: io-slide-left var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="scale-in"] {
      transform: scale(0.96);
}

.io-ready [data-aos="scale-in"].io-visible {
      animation: io-scale var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="blur-up"] {
      transform: translate3d(0, 52px, 0) scale(0.99);
}

.io-ready [data-aos="blur-up"].io-visible {
      animation: io-rise var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="fade-up"] {
      transform: translate3d(0, 46px, 0) scale(0.99);
}

.io-ready [data-aos="fade-up"].io-visible {
      animation: io-rise var(--io-duration) var(--io-ease-out) both;
}

.io-ready [data-aos="fade-down"] {
      transform: translate3d(0, -46px, 0) scale(0.99);
}

.io-ready [data-aos="fade-down"].io-visible {
      animation: io-drop var(--io-duration) var(--io-ease-out) both;
}

.io-ready [data-aos="fade-left"] {
      transform: translate3d(54px, 0, 0) scale(0.99);
}

.io-ready [data-aos="fade-right"] {
      transform: translate3d(-54px, 0, 0) scale(0.99);
}

.io-ready [data-aos="fade-left"].io-visible,
.io-ready [data-aos="fade-right"].io-visible {
      animation: io-slide-right var(--io-duration) var(--io-ease-out) both;
}

.io-ready [data-aos="fade-in"] {
      transform: translate3d(0, 0, 0) scale(0.995);
}

.io-ready [data-aos="fade-in"].io-visible {
      animation: io-fade var(--io-duration) var(--io-ease-out) both;
}

.io-ready [data-aos="zoom-in"] {
      transform: scale(0.965) translate3d(0, 22px, 0);
}

.io-ready [data-aos="zoom-in"].io-visible {
      animation: io-zoom var(--io-duration) var(--io-ease-spring) both;
}

.io-ready [data-aos="tilt-in"] {
      transform: perspective(900px) rotateY(-10deg) translate3d(-10px, 0, 0) scale(0.995);
      transform-origin: 50% 50%;
}

.io-ready [data-aos="tilt-in"].io-visible {
      animation: io-tilt var(--io-duration) var(--io-ease-spring) both;
}

@keyframes io-rise {
      0% {
            opacity: 0;
            transform: translate3d(0, 46px, 0) scale(0.99);
      }
      75% {
            opacity: 1;
            transform: translate3d(0, -6px, 0) scale(1.005);
      }
      100% {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
      }
}

@keyframes io-drop {
      0% {
            opacity: 0;
            transform: translate3d(0, -46px, 0) scale(0.99);
      }
      75% {
            opacity: 1;
            transform: translate3d(0, 6px, 0) scale(1.005);
      }
      100% {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
      }
}

@keyframes io-slide-right {
      0% {
            opacity: 0;
            transform: translate3d(54px, 0, 0) scale(0.99);
      }
      78% {
            opacity: 1;
            transform: translate3d(-6px, 0, 0) scale(1.003);
      }
      100% {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
      }
}

@keyframes io-slide-left {
      0% {
            opacity: 0;
            transform: translate3d(-54px, 0, 0) scale(0.99);
      }
      78% {
            opacity: 1;
            transform: translate3d(6px, 0, 0) scale(1.003);
      }
      100% {
            opacity: 1;
            transform: translate3d(0, 0, 0) scale(1);
      }
}

@keyframes io-scale {
      0% {
            opacity: 0;
            transform: scale(0.96);
      }
      78% {
            opacity: 1;
            transform: scale(1.015);
      }
      100% {
            opacity: 1;
            transform: scale(1);
      }
}

@keyframes io-fade {
      0% { opacity: 0; }
      100% { opacity: 1; }
}

@keyframes io-zoom {
      0% {
            opacity: 0;
            transform: scale(0.965) translate3d(0, 22px, 0);
      }
      78% {
            opacity: 1;
            transform: scale(1.02) translate3d(0, -4px, 0);
      }
      100% {
            opacity: 1;
            transform: scale(1) translate3d(0, 0, 0);
      }
}

@keyframes io-tilt {
      0% {
            opacity: 0;
            transform: perspective(900px) rotateY(-10deg) translate3d(-10px, 0, 0) scale(0.995);
      }
      70% {
            opacity: 1;
            transform: perspective(900px) rotateY(1.4deg) translate3d(2px, 0, 0) scale(1.006);
      }
      100% {
            opacity: 1;
            transform: perspective(900px) rotateY(0) translate3d(0, 0, 0) scale(1);
      }
}

@media (prefers-reduced-motion: reduce) {
      .io-ready [data-aos] {
            opacity: 1;
            transform: none;
            transition: none;
      }

      .io-ready [data-aos].io-visible {
            transform: none;
            animation: none !important;
      }
}
