/* Load after the existing styles. Only JS-prepared principal titles opt in;
 * without JS the original heading markup stays clear and unchanged. */
.text-reveal-ready .text-reveal-word {
  display: inline-block;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  opacity: 0;
  filter: blur(8px);
  transform: translate3d(0, 10px, 0);
  transition: none;
}

.text-reveal-ready.text-reveal-visible .text-reveal-word {
  opacity: 1;
  filter: none;
  transform: none;
  transition:
    opacity 650ms cubic-bezier(.22, 1, .36, 1) var(--word-delay, 0ms),
    filter 650ms cubic-bezier(.22, 1, .36, 1) var(--word-delay, 0ms),
    transform 650ms cubic-bezier(.22, 1, .36, 1) var(--word-delay, 0ms);
}

/* The word spans own the entrance. Keep scroll-driven panel transforms and
 * opacity intact; suppress only the previous reveal on those same titles. */
.js .text-reveal-ready.reveal,
.js .text-reveal-ready.motion-item,
.js .text-reveal-ready .reveal,
.js .text-reveal-shell.reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .text-reveal-ready .text-reveal-word,
  .text-reveal-ready.text-reveal-visible .text-reveal-word {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
}

@media print {
  .text-reveal-ready .text-reveal-word {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }
}