/* Letter animation for Heading widgets (assets/heading-animation.js). Matches Qi Addons' Animated
   Text: pieces rise 50px into place, opacity over a little more than half the time, movement with a
   slight overshoot. Only once the script has split the title (.ndet-ha-ready) does anything hide. */

.ndet-ha-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ndet-ha-w {
	display: inline-block;
	white-space: nowrap;
}

.ndet-ha-ready .ndet-ha-p {
	display: inline-block;
	opacity: 0;
	transition: opacity calc(var(--ndet-ha-t, 450ms) * 0.55) linear, transform var(--ndet-ha-t, 450ms) cubic-bezier(0.26, -0.14, 0, 1.01);
}

.ndet-ha-ready:not(.ndet-ha-done) {
	overflow: hidden;
}

.ndet-ha--up .ndet-ha-p {
	transform: translateY(50px);
}

.ndet-ha--right .ndet-ha-p {
	transform: translateX(50px);
}

.ndet-ha--left .ndet-ha-p {
	transform: translateX(-50px);
}

.ndet-ha--fade .ndet-ha-p {
	transition: opacity var(--ndet-ha-t, 1000ms) ease-out;
}

.ndet-ha-in .ndet-ha-p {
	opacity: 1;
	transform: none;
}
