.hero::before,
.hero::after {
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  content: '';
  pointer-events: none;
}

.hero::before {
  top: -10rem;
  right: -12rem;
  width: 34rem;
  height: 34rem;
  border: 1px solid var(--sage-200);
}

.hero::after {
  bottom: -8rem;
  left: -10rem;
  width: 24rem;
  height: 24rem;
  background: radial-gradient(circle, rgb(200 115 85 / 0.1), transparent 67%);
}

.hero__visual::before {
  position: absolute;
  top: 5%;
  left: -9%;
  width: 4.8rem;
  height: 8.5rem;
  border-radius: 100% 0 100% 0;
  content: '';
  background: var(--sage-200);
  transform: rotate(-18deg);
}

.hero__visual::after {
  position: absolute;
  top: 1.2rem;
  right: -1.5rem;
  z-index: -1;
  width: 78%;
  height: 92%;
  border: 1px solid var(--sage-400);
  border-radius: 48% 48% var(--radius-xl) var(--radius-xl);
  content: '';
}

.service-card {
  transition: background var(--base) var(--ease), transform var(--base) var(--ease);
}

@media (hover: hover) {
  .service-card:not(.service-card--featured):hover {
    background: rgb(255 255 255 / 0.055);
  }

  .service-card:hover {
    transform: translateY(-0.35rem);
  }
}

.has-motion-js [data-reveal] {
  opacity: 0;
  transform: translateY(1.4rem);
}

.has-motion-js [data-reveal].is-visible {
  opacity: 1;
  transform: none;
  transition: opacity var(--slow) var(--ease), transform var(--slow) var(--ease);
}

.has-motion-js .reveal-group > [data-reveal]:nth-child(2).is-visible {
  transition-delay: 60ms;
}

.has-motion-js .reveal-group > [data-reveal]:nth-child(3).is-visible {
  transition-delay: 120ms;
}

.has-motion-js .reveal-group > [data-reveal]:nth-child(4).is-visible {
  transition-delay: 180ms;
}

.has-motion-js .reveal-group > [data-reveal]:nth-child(5).is-visible {
  transition-delay: 240ms;
}

.has-motion-js .reveal-group > [data-reveal]:nth-child(6).is-visible {
  transition-delay: 300ms;
}

.site-header.is-scrolled {
  box-shadow: 0 10px 26px -22px rgb(16 39 31 / 0.8);
}

@media (prefers-reduced-motion: reduce) {
  .has-motion-js [data-reveal] {
    opacity: 1;
    transform: none;
  }
}
