/* Vidas – Motion (ver vidas-motion.js)
 * Con JS, los elementos marcados esperan ocultos a que arranque su animación.
 * Si algo fallara, aparecen solos a los 2,5 s (igual que en los widgets Vidas). */
html.vpm-js .vp-anim-eyebrow:not(.vpm-ready),
html.vpm-js .vp-anim-titular:not(.vpm-ready),
html.vpm-js .vp-anim-texto:not(.vpm-ready),
html.vpm-js .vp-anim-boton:not(.vpm-ready),
html.vpm-js .vp-anim-aparecer:not(.vpm-ready),
html.vpm-js .vp-anim-grupo > :not(.vpm-ready) {
	visibility: hidden;
	animation: vpm-show 0s linear 2.5s forwards;
}

@keyframes vpm-show {
	to { visibility: visible; }
}

/* Renglones y palabras (los crea el JS): máscara con holgura para acentos y descendentes. */
.vpm-split vpm-line {
	display: block;
	overflow: hidden;
	padding: 0.18em 0 0.24em;
	margin: -0.18em 0 -0.24em;
}

.vpm-split vpm-in {
	display: inline-block;
}

.vpm-split vpm-w {
	display: inline-block;
}

@media (prefers-reduced-motion: reduce) {
	html.vpm-js .vp-anim-eyebrow,
	html.vpm-js .vp-anim-titular,
	html.vpm-js .vp-anim-texto,
	html.vpm-js .vp-anim-boton,
	html.vpm-js .vp-anim-aparecer,
	html.vpm-js .vp-anim-grupo > * {
		visibility: visible !important;
		animation: none !important;
	}
}
