/* Shared page, navigation, and disclosure motion */

html {
  scroll-behavior: auto;
  scroll-padding-top: 24px;
}

html.is-smooth-scrolling {
  scroll-behavior: smooth;
}

:target {
  scroll-margin-top: 24px;
}

.motion-reveal-group--1,
.motion-reveal-group--2,
.motion-reveal-group--3,
.motion-target-entry:target {
  animation: motion-fade-up 0.6s ease both;
}

.motion-reveal-group--1 {
  animation-delay: 0.05s;
}

.motion-reveal-group--2 {
  animation-delay: 0.15s;
}

.motion-reveal-group--3 {
  animation-delay: 0.25s;
}

html.is-smooth-scrolling .motion-target-entry:target {
  animation: none;
}

html:has(.motion-target-entry:target) .services-intro .motion-reveal-group--1,
html:has(.motion-target-entry:target) .services-intro .motion-reveal-group--2,
html:has(.motion-target-entry:target) .services-intro .motion-reveal-group--3 {
  animation: none;
}

.motion-disclosure {
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px);
  pointer-events: none;
  transition:
    opacity 0.6s ease,
    transform 0.6s ease,
    visibility 0s linear 0.6s;
}

.motion-disclosure.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0s;
}

@keyframes motion-fade-up {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.is-smooth-scrolling {
    scroll-behavior: auto;
  }

  .motion-reveal-group--1,
  .motion-reveal-group--2,
  .motion-reveal-group--3,
  .motion-target-entry:target {
    animation: none;
  }
  .motion-disclosure {
    transition: none;
  }
}
