html.arwm-intro-pending,
html.arwm-intro-pending body {
  overflow: hidden;
  background: #000;
}

html.arwm-intro-pending body > :not(.arwm-intro-overlay) {
  visibility: hidden;
}

/* Keep the hero copy at its final coordinates while the dedicated title
   intro runs. The site's general reveal animation would otherwise move the
   destination underneath the overlay during the handoff. */
html.arwm-intro-pending body.arwm-motion-enhanced .hero-copy.reveal,
body.arwm-intro-complete.arwm-motion-enhanced .hero-copy.reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.arwm-intro-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  overflow: hidden;
  opacity: 0;
  color: #f5f6f8;
  background: #000;
  pointer-events: none;
  visibility: visible;
  transition: opacity 180ms ease;
}

.arwm-intro-overlay.is-visible {
  opacity: 1;
}

.arwm-intro-title {
  position: fixed;
  width: max-content;
  white-space: nowrap;
  transform-origin: center center;
  will-change: transform, filter, opacity;
}

body.arwm-intro-complete .hero-copy > :not(h1),
body.arwm-intro-complete .hero-visual,
body.arwm-intro-complete .site-header {
  animation: arwm-hero-supporting-in 900ms cubic-bezier(.2, .75, .25, 1) both;
}

body.arwm-intro-complete .hero-copy > :nth-child(3) { animation-delay: 70ms; }
body.arwm-intro-complete .hero-copy > :nth-child(4) { animation-delay: 120ms; }
body.arwm-intro-complete .hero-copy > :nth-child(5) { animation-delay: 170ms; }
body.arwm-intro-complete .hero-copy > :nth-child(6) { animation-delay: 220ms; }
body.arwm-intro-complete .hero-visual { animation-delay: 100ms; }

@keyframes arwm-hero-supporting-in {
  from {
    opacity: 0;
    filter: blur(5px);
    transform: translate3d(0, 14px, 0);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .arwm-intro-overlay { display: none; }
  body.arwm-intro-complete .hero-copy > :not(h1),
  body.arwm-intro-complete .hero-visual,
  body.arwm-intro-complete .site-header { animation: none; }
}