.slide {
  opacity: 0;
  transform: translateX(-100%);
  transition: transform 1s ease, opacity 1s ease;
}
.slide.slide-right {
  transform: translateX(100%);
}
.slide.visible {
  opacity: 1;
  transform: translateX(0);
}

.text-appear-from-blurred {
  color: transparent;
  text-shadow: 0 0 1rem rgba(241, 243, 245, 0.5);
  animation: blur-to-sharp 2s ease-out forwards;
}

@keyframes blur-to-sharp {
  0% {
    color: transparent;
    visibility: hidden;
    text-shadow: 0 0 2rem rgba(241, 243, 245, 0.5);
    filter: blur(1rem);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    color: #162028; /* Change this to your desired final color */
    text-shadow: none;
    filter: blur(0);
    visibility: visible;
  }
}
.element-appear-from-blurred {
  animation: blur-to-sharp 2.2s ease-out forwards;
}

.nav-appear-from-blurred {
  animation: blur-to-sharp 2.4s ease-out forwards;
}

/*# sourceMappingURL=animations.css.map */