.has-js .site-header:not(.is-scrolled) {
  animation: immersive-header-arrive 1400ms var(--ease) 520ms backwards;
}

.has-js .hero-copy > .eyebrow {
  animation: immersive-eyebrow-arrive 1450ms var(--ease) 680ms backwards;
}

.has-js .hero-copy > h1 {
  animation: immersive-heading-arrive 1900ms var(--ease) 820ms backwards;
}

.has-js .hero-definition {
  animation: immersive-copy-arrive 1550ms var(--ease) 1420ms backwards;
}

.has-js .hero-actions {
  animation: immersive-copy-arrive 1450ms var(--ease) 1760ms backwards;
}

.has-js .hero-room > img {
  animation: immersive-room-arrive 5200ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.has-js .hero-room-shade {
  animation: immersive-shade-arrive 3900ms ease-out both;
}

@keyframes immersive-header-arrive {
  from {
    opacity: 0;
    filter: blur(5px);
    transform: translateY(-8px);
  }
}

@keyframes immersive-eyebrow-arrive {
  from {
    opacity: 0;
    filter: blur(4px);
    letter-spacing: 0.15em;
    transform: translateY(8px);
  }
}

@keyframes immersive-heading-arrive {
  from {
    opacity: 0;
    filter: blur(12px);
    transform: translateY(18px);
  }
}

@keyframes immersive-copy-arrive {
  from {
    opacity: 0;
    filter: blur(7px);
    transform: translateY(13px);
  }
}

@keyframes immersive-room-arrive {
  from {
    filter: saturate(0.28) contrast(1.01) brightness(0.36);
    transform: scale(1.065);
  }

  to {
    filter: saturate(0.68) contrast(1.08) brightness(0.78);
    transform: scale(1.012);
  }
}

@keyframes immersive-shade-arrive {
  from {
    opacity: 0.42;
  }
}