.fadein {
  animation: unionFadeUp .48s cubic-bezier(.22, 1, .36, 1) both;
}

.button-entrance {
  animation: unionButtonReveal .72s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: calc(var(--delay, 1s) * 58ms);
  transform-origin: 50% 50%;
}

@keyframes unionFadeUp {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.985);
    filter: blur(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes unionButtonReveal {
  0% {
    opacity: 0;
    transform: translate3d(0, 22px, 0) scale(.94);
    filter: blur(10px);
  }
  58% {
    opacity: 1;
    transform: translate3d(0, -3px, 0) scale(1.018);
    filter: blur(0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fadein,
  .button-entrance {
    animation: none !important;
  }
}