@charset "UTF-8";

.home-page .hero-photo-layer { position: absolute; inset: 0; }
.home-page .hero-lettering { display: block; }

@media (prefers-reduced-motion: no-preference) {
  .home-motion .hero-photo-layer {
    transform: translate3d(var(--photo-x, 0px), var(--photo-y, 0px), 0) scale(1.045);
  }
  .home-motion .hero-word.first {
    transform: translate3d(var(--first-x, 0px), var(--first-y, 0px), 0);
  }
  .home-motion .hero-word.last {
    transform: translate3d(var(--last-x, 0px), var(--last-y, 0px), 0);
  }
  .home-motion.home-entering .hero-photo-layer img {
    animation: home-photo-enter 1200ms cubic-bezier(.2, .7, .2, 1) both;
  }
  .home-motion.home-entering .hero-lettering {
    animation: home-name-enter 1050ms cubic-bezier(.16, 1, .3, 1) both;
  }
  .home-motion.home-entering .first .hero-lettering { animation-delay: 100ms; }
  .home-motion.home-entering .last .hero-lettering { animation-delay: 260ms; }
  .home-motion.home-entering .hero-caption {
    animation: home-caption-enter 750ms ease-out 450ms both;
  }
  .home-motion [data-motion-reveal].motion-revealed {
    animation: home-section-enter 800ms cubic-bezier(.16, 1, .3, 1);
  }
  .home-motion .text-link .arrow, .home-motion .back-to-top span {
    transition: transform 250ms ease-out;
  }
  .home-motion .text-link:is(:hover, :focus-visible) .arrow { transform: translateX(5px); }
  .home-motion .back-to-top:is(:hover, :focus-visible) span { transform: translateY(-4px); }
}

@keyframes home-photo-enter {
  from { opacity: .7; transform: scale(1.04); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes home-name-enter {
  from { opacity: 0; transform: translate3d(0, 26px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes home-caption-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes home-section-enter {
  from { opacity: .6; transform: translate3d(0, 16px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}