/* Text is readable before, during and after enhancement. Visibility and layout
   are never controlled here; finite Web Animations provide the reveal itself. */
.text-reveal-active {
  --text-reveal-rise: 12px;
  will-change: opacity, transform;
}

#cover-title > .text-reveal-active,
.section > h2.text-reveal-active,
.place-copy > h2.text-reveal-active {
  --text-reveal-rise: 16px;
}

.gate-top .text-reveal-active,
.gate-bottom > .text-reveal-active {
  --text-reveal-rise: 8px;
}

@media (prefers-reduced-motion: reduce) {
  .text-reveal-active { will-change: auto; }
}