@keyframes reveal-up {
  from {
    opacity: 0;
    transform: translate3d(0, 1.25rem, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes hero-title-in {
  from {
    opacity: 0;
    transform: translate3d(0, 0.75rem, 0) scale(0.98);
  }

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

@keyframes cta-pulse {
  0%,
  100% {
    box-shadow: 0 10px 24px rgba(215, 177, 93, 0.22);
    transform: translateY(0) scale(1);
  }

  45% {
    box-shadow: 0 14px 34px rgba(215, 177, 93, 0.42);
    transform: translateY(-1px) scale(1.015);
  }
}

.animations-ready [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 1.25rem, 0);
  transition:
    opacity 520ms cubic-bezier(0.2, 0.8, 0.2, 1),
    transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}

.animations-ready [data-reveal].is-revealed {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.animations-ready .hero__content.is-revealed h1 {
  animation: hero-title-in 620ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.animations-ready .hero__content.is-revealed .hero__lead {
  animation: reveal-up 620ms cubic-bezier(0.2, 0.8, 0.2, 1) 90ms both;
}

.animations-ready .button--pulse {
  animation: cta-pulse 2400ms ease-in-out 700ms 3;
}

@media (hover: hover) and (pointer: fine) {
  .animations-ready .service-card,
  .animations-ready .process-step,
  .animations-ready .gallery-card,
  .animations-ready .video-card,
  .animations-ready .contact-card {
    transition:
      transform var(--transition-base),
      border-color var(--transition-fast),
      box-shadow var(--transition-fast);
  }

  .animations-ready .service-card:hover,
  .animations-ready .process-step:hover,
  .animations-ready .gallery-card:hover,
  .animations-ready .video-card:hover,
  .animations-ready .contact-card:hover {
    transform: translateY(-3px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  .animations-ready [data-reveal],
  .animations-ready [data-reveal].is-revealed {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    transition-delay: 0ms !important;
  }

  .animations-ready .button--pulse,
  .animations-ready .hero__content.is-revealed h1,
  .animations-ready .hero__content.is-revealed .hero__lead {
    animation: none !important;
  }
}