@keyframes ece-fade-up {
  from { opacity: 0; transform: translateY(1.25rem); }
  to { opacity: 1; transform: translateY(0); }
}

.ece-brand,
.ece-landing__copy,
.ece-landing__footer { animation: ece-fade-up 650ms both; }

.ece-landing__copy { animation-delay: 100ms; }
.ece-landing__footer { animation-delay: 200ms; }

.ece-view-leave-left { animation: ece-leave-left var(--ece-transition) both; }
.ece-view-enter-right { animation: ece-enter-right var(--ece-transition) both; }
.ece-view-leave-right { animation: ece-leave-right var(--ece-transition) both; }
.ece-view-enter-left { animation: ece-enter-left var(--ece-transition) both; }

@keyframes ece-leave-left {
  to { opacity: 0; transform: translateX(-2rem); }
}

@keyframes ece-enter-right {
  from { opacity: 0; transform: translateX(2rem); }
}

@keyframes ece-leave-right {
  to { opacity: 0; transform: translateX(2rem); }
}

@keyframes ece-enter-left {
  from { opacity: 0; transform: translateX(-2rem); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 1ms !important;
    transition-duration: 1ms !important;
  }
}