@keyframes float {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-30px); }
  100% { transform: translateY(0); }
}

.float {
  display: flex;       
  animation: float 3s ease-in-out infinite;
  transform-origin: center;
}

.float--small  { animation-duration: 2s; }
.float--medium { animation-duration: 3s; }
.float--large  { animation-duration: 4s; transform: translateZ(0); }

@media (prefers-reduced-motion: reduce) {
  .float,
  .float--small,
  .float--medium,
  .float--large {
    animation: none !important;
    transform: none !important;
  }
}

/* Pulse animation */
@keyframes pulse {
  0%   { transform: scale(1)}
  50%  { transform: scale(1.1)}
  100% { transform: scale(1)}
}

/* Base pulse class */
.pulse {
  display: flex;
  animation: pulse 2s ease-in-out infinite;
  transform-origin: center;
}

/* Variants for speed */
.pulse--fast  { animation-duration: 1s; }
.pulse--slow  { animation-duration: 3s; }

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .pulse,
  .pulse--fast,
  .pulse--slow {
    animation: none !important;
    transform: none !important;
  }
}

.spinner {
    animation: spin 4s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}


@keyframes scrollBottom {
    0% {
        transform: scale(.5);
        opacity: 0;
    }

    6% {
         opacity: 1; 
    }

    8% {
       transform: scale(1);
    }
  100% {
    top: clamp(140rem, 86.9231rem + 230.7692vw, 350rem);
  }
}

@keyframes swayTree {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(10deg);
    }

    100% {
        transform: rotate(0deg);
    }
} 

@keyframes swayTree2 {
  0% {
    transform: scaleX(-1) rotate(0deg);
  }

  50% {
    transform: scaleX(-1) rotate(10deg);
  }

  100% {
    transform: scaleX(-1) rotate(0deg);
  }
}


@keyframes scroll-title {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}