.echo-text {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  line-height: 0.9;
  letter-spacing: -0.04em;
  user-select: none;
  contain: layout style;
  font-kerning: normal;
  text-rendering: geometricPrecision;
}

.echo-text__echo {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  transform: translate3d(0, 0, 0);
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  backface-visibility: hidden;
}

.echo-text__echo--front {
  position: relative;
  z-index: 2;
  opacity: 1;
  filter: none;
  text-shadow: 0 0.035em 0 rgba(255, 255, 255, 0.04);
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .echo-text__echo:not(.echo-text__echo--front) {
    display: none;
  }

  .echo-text__echo--front {
    transform: none !important;
  }
}

/* adapted for this site's block-level, multi-line headings — the upstream
   component assumes a short single-line phrase (nowrap); here every echo
   layer reflows the same way as the front copy since they share the same
   text, font and box width. */
.echo-text--wrap {
  display: block;
  white-space: normal;
  line-height: inherit;
  letter-spacing: inherit;
}
.echo-text--wrap .echo-text__echo { white-space: inherit; }