/* Elements remain visible when JavaScript is unavailable. */
.js-enabled .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 720ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 720ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.js-enabled .reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.js-enabled .theme-card.reveal,
.js-enabled .process-step.reveal,
.js-enabled .package-item.reveal {
  transition-delay: var(--reveal-delay, 0ms);
}

.cover-portrait {
  animation: cover-portrait-arrive 1100ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cover-copy {
  animation: cover-copy-arrive 960ms 160ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cover-logo,
.cover-meta,
.cover-index,
.cover-scroll {
  animation: cover-detail-arrive 720ms 360ms ease both;
}

.cover-shadow--one {
  animation: botanical-drift-one 13s ease-in-out infinite alternate;
}

.cover-shadow--two {
  animation: botanical-drift-two 16s ease-in-out infinite alternate;
}

.preview-figure__image {
  animation: editorial-image-breathe 12s ease-in-out infinite alternate;
}

.booking-background img {
  animation: booking-image-breathe 16s ease-in-out infinite alternate;
}

@keyframes cover-portrait-arrive {
  from {
    opacity: 0;
    transform: translateX(28px) scale(1.035);
  }

  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes cover-copy-arrive {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes cover-detail-arrive {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes botanical-drift-one {
  from {
    transform: translate3d(-4px, -2px, 0) rotate(-24deg) scale(1);
  }

  to {
    transform: translate3d(14px, 10px, 0) rotate(-18deg) scale(1.06);
  }
}

@keyframes botanical-drift-two {
  from {
    transform: translate3d(4px, 5px, 0) rotate(32deg) scale(1.02);
  }

  to {
    transform: translate3d(-12px, -8px, 0) rotate(26deg) scale(1.08);
  }
}

@keyframes editorial-image-breathe {
  from {
    transform: scale(1.02);
  }

  to {
    transform: scale(1.055);
  }
}

@keyframes booking-image-breathe {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(1.045);
  }
}

@media (prefers-reduced-motion: reduce) {
  .js-enabled .reveal,
  .js-enabled .reveal.is-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .cover-portrait,
  .cover-copy,
  .cover-logo,
  .cover-meta,
  .cover-index,
  .cover-scroll,
  .cover-shadow--one,
  .cover-shadow--two,
  .preview-figure__image,
  .booking-background img {
    animation: none !important;
  }
}
