/* ---------------------------------------------------------------------------- */
/* --- ANIMATIONS
/* ----------------------------------------------------------------------------- */
*[data-js-animation] {
    visibility: hidden;
    -webkit-animation-delay: 0.15s;
            animation-delay: 0.15s;
    -webkit-animation-duration: 0.75s;
            animation-duration: 0.75s;
    -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
            transition: visibility 0.75s ease-out;
  }
  *[data-js-animation].visible {
    visibility: visible;
  }
  
  .fade-in-right {
    -webkit-animation-name: fadeInRight;
            animation-name: fadeInRight;
  }
  @-webkit-keyframes fadeInRight {
    0% {
      transform: translate3d(30px, 0, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  @keyframes fadeInRight {
    0% {
      transform: translate3d(30px, 0, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  .fade-in-left {
    -webkit-animation-name: fadeInLeft;
            animation-name: fadeInLeft;
  }
  @-webkit-keyframes fadeInLeft {
    0% {
      transform: translate3d(-30px, 0, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  @keyframes fadeInLeft {
    0% {
      transform: translate3d(-30px, 0, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  .fade-in-down {
    -webkit-animation-name: fadeInDown;
            animation-name: fadeInDown;
  }
  @-webkit-keyframes fadeInDown {
    0% {
      transform: translate3d(0, -30px, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  @keyframes fadeInDown {
    0% {
      transform: translate3d(0, -30px, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  .fade-in-up {
    -webkit-animation-name: fadeInUp;
            animation-name: fadeInUp;
  }
  @-webkit-keyframes fadeInUp {
    0% {
      transform: translate3d(0, 30px, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  @keyframes fadeInUp {
    0% {
      transform: translate3d(0, 30px, 0);
      opacity: 0;
    }
    100% {
      transform: translate3d(0, 0, 0);
      opacity: 1;
    }
  }
  
  .fade-in {
    -webkit-animation-name: fadeIn;
            animation-name: fadeIn;
    opacity: 0;
  }
  @-webkit-keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  @keyframes fadeIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  
  .zoom-out {
    -webkit-animation-name: zoomOut;
            animation-name: zoomOut;
    opacity: 0;
  }
  @-webkit-keyframes zoomOut {
    0% {
      opacity: 0;
      transform: scale(1.1);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes zoomOut {
    0% {
      opacity: 0;
      transform: scale(1.1);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  
  .scale-x-in-left {
    -webkit-animation-name: scaleInXLeft;
            animation-name: scaleInXLeft;
    transform-origin: left center;
    transform: scaleX(0);
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
            animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  }
  @-webkit-keyframes scaleInXLeft {
    0% {
      transform: scaleX(0);
    }
    100% {
      transform: scaleX(1);
    }
  }
  @keyframes scaleInXLeft {
    0% {
      transform: scaleX(0);
    }
    100% {
      transform: scaleX(1);
    }
  }
  
  .scale-x-in-right {
    -webkit-animation-name: scaleInXRight;
            animation-name: scaleInXRight;
    transform-origin: right center;
    transform: scaleX(0);
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
            animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  }
  @-webkit-keyframes scaleInXRight {
    0% {
      transform: scaleX(0);
    }
    100% {
      transform: scaleX(1);
    }
  }
  @keyframes scaleInXRight {
    0% {
      transform: scaleX(0);
    }
    100% {
      transform: scaleX(1);
    }
  }
  
  .floating {
    -webkit-animation: floating 3s infinite;
            animation: floating 3s infinite;
  }
  @-webkit-keyframes floating {
    0% {
      transform: translateY(-6%);
    }
    50% {
      transform: translateY(6%);
    }
    100% {
      transform: translateY(-6%);
    }
  }
  @keyframes floating {
    0% {
      transform: translateY(-6%);
    }
    50% {
      transform: translateY(6%);
    }
    100% {
      transform: translateY(-6%);
    }
  }

                /* .banner-wave svg {
                clip-path: inset(0 0 0 0 round 0 0 0 0);
                transition: clip-path 0.5s ease-in-out;
              }

              .banner-wave.animate svg {
                clip-path: inset(0 5% 0 5%);
              } */