:root {
  --motion-instant: 80ms;
  --motion-hover: 160ms;
  --motion-ui: 300ms;
  --motion-ui-slow: 480ms;
  --motion-reveal: 700ms;
  --motion-image: 900ms;
  --motion-stage: 1100ms;
  --motion-opening: 2120ms;
  --motion-transition: 480ms;
}

.opening {
  transition-duration: 620ms;
}

.opening.is-returning {
  transition-duration: 280ms;
}

.page-transition {
  transition-duration: var(--motion-transition);
}

.page-transition > span {
  position: absolute;
  left: 8vw;
  bottom: 8vh;
  color: rgba(255, 255, 255, 0.62);
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: var(--weight-label);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 240ms var(--ease-standard) 120ms, transform 360ms var(--ease-out) 120ms;
}

.page-transition.is-active > span {
  opacity: 1;
  transform: translateY(0);
}

.news-viewport:focus-within .news-track {
  animation-play-state: paused;
}

.is-page-hidden .hero-motion span,
.is-page-hidden .hero-photo,
.is-page-hidden .page-hero-bg,
.is-page-hidden .mvv-ghost,
.is-page-hidden .news-track {
  animation-play-state: paused !important;
}

@media (hover: hover) and (pointer: fine) {
  .hero-motion {
    translate: var(--ambient-x, 0) var(--ambient-y, 0);
    transition: translate 900ms var(--ease-out);
  }

  .hero-photo {
    translate: calc(var(--ambient-x, 0) * -0.42) calc(var(--ambient-y, 0) * -0.42);
    transition: translate 1100ms var(--ease-out);
  }

  .text-link,
  .header-nav a,
  .footer-links a,
  .news-list-link {
    transition: color var(--motion-hover) var(--ease-standard), opacity var(--motion-hover) var(--ease-standard);
  }
}

@media (prefers-reduced-motion: reduce) {
  .section-sticky,
  .business-intro,
  .mvv-side {
    position: static !important;
  }

  .opening,
  .page-transition {
    display: none;
  }

  body.is-leaving main,
  body.is-leaving .site-footer {
    opacity: 1;
    transform: none;
  }

  .hero-motion,
  .hero-photo {
    translate: 0 0;
    transition: none;
  }
}