/* Words rise (CUSTOM-TEMPLATE.md D9): give any section the Custom Class ct-words-rise and its title splits into words
   that fade and rise one by one as it enters, once. js/cc-scenes.js splits the title and adds data-cc-wr, then .is-in
   when it scrolls into view. Without the script nothing is hidden; with reduced motion the script does nothing.
   Restyle from css/screen.css: --cc-wr-step (delay between words), --cc-wr-rise (distance), --cc-wr-time. */
.ct-words-rise { --cc-wr-step: 60ms; --cc-wr-rise: .55em; --cc-wr-time: .9s; }
.cc-wr-w { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
	[data-cc-wr]:not(.is-in) .cc-wr-w { opacity: 0; translate: 0 var(--cc-wr-rise); }
	[data-cc-wr] .cc-wr-w {
		transition: opacity calc(var(--cc-wr-time) * .8) cubic-bezier(.22, 1, .36, 1), translate var(--cc-wr-time) cubic-bezier(.22, 1, .36, 1);
		transition-delay: calc(var(--cc-wr-i, 0) * var(--cc-wr-step));
	}
}