[data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 800ms var(--face-ease-out), transform 800ms var(--face-ease-out);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

[data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0);
}

[data-reveal="fade"] {
  transform: none;
}

[data-reveal="left"] {
  transform: translateX(-28px);
}

[data-reveal="left"].is-revealed {
  transform: translateX(0);
}

[data-reveal="right"] {
  transform: translateX(28px);
}

[data-reveal="right"].is-revealed {
  transform: translateX(0);
}

[data-reveal="clip"] {
  opacity: 1;
  transform: none;
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1100ms var(--face-ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}

[data-reveal="clip"].is-revealed {
  clip-path: inset(0 0 0 0);
}

[data-reveal="scale"] {
  opacity: 0;
  transform: scale(1.06);
}

[data-reveal="scale"].is-revealed {
  opacity: 1;
  transform: scale(1);
}

[data-reveal-lines] > * {
  display: block;
  opacity: 0;
  transform: translateY(0.6em);
  transition: opacity 760ms var(--face-ease-out), transform 760ms var(--face-ease-out);
}

[data-reveal-lines].is-revealed > * {
  opacity: 1;
  transform: translateY(0);
}

[data-reveal-lines].is-revealed > *:nth-child(1) { transition-delay: 60ms; }
[data-reveal-lines].is-revealed > *:nth-child(2) { transition-delay: 160ms; }
[data-reveal-lines].is-revealed > *:nth-child(3) { transition-delay: 260ms; }
[data-reveal-lines].is-revealed > *:nth-child(4) { transition-delay: 360ms; }
[data-reveal-lines].is-revealed > *:nth-child(5) { transition-delay: 460ms; }

.face-underline-sweep {
  position: relative;
  display: inline-block;
}

.face-underline-sweep::after {
  content: "";
  position: absolute;
  inset-block-end: -3px;
  inset-inline-start: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: 100% 50%;
  transition: transform var(--face-transition) var(--face-ease-out);
}

.face-underline-sweep:hover::after {
  transform: scaleX(1);
  transform-origin: 0 50%;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  [data-reveal],
  [data-reveal-lines] > * {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
  }

  .face-hero__media img,
  .face-hero__media video {
    animation: none;
    transform: scale(1.02);
  }

  .face-marquee__track {
    animation: none;
  }
}

[data-parallax] {
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .face-hero__scene,
  .face-hero__line,
  .face-hero__eyebrow {
    transition-duration: 0.001ms !important;
  }

  .face-hero__scene.is-active img,
  .face-hero__scene.is-active video {
    animation: none;
    transform: scale(1.04);
  }

  .face-hero__dot[aria-current="true"] span::after {
    animation: none;
    transform: scaleX(1);
  }

  [data-parallax] {
    transform: none !important;
  }
}
