/**
 * SpaceX-style line unveil — clipped mask + translateY rise.
 * Must load before first paint on login pages (link in HTML head).
 */

.unveil {
  overflow: hidden;
  display: block;
}

.unveil__line {
  display: block;
  transform: translateY(110%);
  opacity: 1;
  will-change: transform;
}

.unveil-group:not(.is-in) .unveil__line,
.unveil:not(.is-in) .unveil__line {
  transform: translateY(110%);
}

.unveil-group.is-in .unveil__line,
.unveil.is-in .unveil__line {
  transform: translateY(0);
  transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.unveil-group.is-in .unveil:nth-child(1) .unveil__line,
.unveil.is-in .unveil__line:nth-child(1) { transition-delay: 0ms; }
.unveil-group.is-in .unveil:nth-child(2) .unveil__line,
.unveil.is-in .unveil__line:nth-child(2) { transition-delay: 80ms; }
.unveil-group.is-in .unveil:nth-child(3) .unveil__line,
.unveil.is-in .unveil__line:nth-child(3) { transition-delay: 160ms; }
.unveil-group.is-in .unveil:nth-child(4) .unveil__line,
.unveil.is-in .unveil__line:nth-child(4) { transition-delay: 240ms; }
.unveil-group.is-in .unveil:nth-child(5) .unveil__line,
.unveil.is-in .unveil__line:nth-child(5) { transition-delay: 320ms; }
.unveil-group.is-in .unveil:nth-child(6) .unveil__line,
.unveil.is-in .unveil__line:nth-child(6) { transition-delay: 400ms; }

@media (prefers-reduced-motion: reduce) {
  .unveil,
  .unveil__line,
  .unveil-group {
    overflow: visible;
    transform: none !important;
    transition: none !important;
  }

  .unveil-group.is-in .unveil__line,
  .unveil.is-in .unveil__line {
    transform: none !important;
  }
}
