/*
 * Enfoque Animated Text - estilos encapsulados.
 * Todo queda bajo .ei-animated-text; no se usan selectores globales
 * de etiqueta (p, span, h1, body, section, *) fuera de este scope.
 */

.ei-animated-text {
	position: relative;
	max-width: 100%;
}

.ei-animated-text .ei-visual {
	display: inline;
	/* Preserva espacios multiples y saltos de linea en todo momento,
	 * incluso durante la animacion (scramble, escritura, etc.). El modo
	 * "Texto plano" ya colapsa el whitespace sobrante en el servidor, asi
	 * que esta regla no afecta a su resultado visual. */
	white-space: pre-wrap;
}

/* Fragmentos generados por JS: palabras, caracteres y lineas */
.ei-animated-text .ei-fragment {
	display: inline-block;
	will-change: transform, opacity, filter;
}

.ei-animated-text .ei-fragment.is-line {
	display: block;
}

.ei-animated-text .ei-fragment.is-space {
	display: inline;
	will-change: auto;
}

.ei-animated-text .ei-fragment.is-hidden {
	opacity: 0;
}

.ei-animated-text .ei-fragment.is-visible {
	opacity: 1;
	transform: none;
	filter: none;
}

/* Enlaces dentro del texto (modo HTML basico) */
.ei-animated-text a {
	color: inherit;
	text-decoration: inherit;
}

/* Parrafos internos (modo HTML basico con varios <p>) */
.ei-animated-text .ei-visual p {
	margin: 0 0 1em 0;
}

.ei-animated-text .ei-visual p:last-child {
	margin-bottom: 0;
}

/* Caracteres scramble */
.ei-animated-text .ei-scramble-char {
	display: inline-block;
}

.ei-animated-text .ei-scramble-char.is-revealed {
	/* sin estilo propio: hereda el color normal del texto (Estilo > Texto) */
}

/* Cursor de escritura */
.ei-animated-text .ei-cursor {
	display: inline-block;
	vertical-align: -0.1em;
	margin-left: 2px;
	line-height: 1;
}

.ei-animated-text .ei-cursor.ei-cursor--bar {
	border-right: 2px solid currentColor;
	height: 1em;
	vertical-align: -0.15em;
}

.ei-animated-text .ei-cursor.ei-cursor--char {
	font-weight: inherit;
}

.ei-animated-text .ei-cursor.is-blinking {
	animation: ei-cursor-blink 1s steps(1) infinite;
}

.ei-animated-text .ei-cursor.is-hidden {
	display: none;
}

@keyframes ei-cursor-blink {
	0%,
	49% {
		opacity: 1;
	}
	50%,
	100% {
		opacity: 0;
	}
}

/* Estados generales de la instancia */
.ei-animated-text.is-ready .ei-visual {
	visibility: visible;
}

.ei-animated-text.is-animating {
	/* gancho para estilos personalizados durante la animacion */
}

.ei-animated-text.is-complete {
	/* gancho para estilos de estado final */
}

/* Reduced motion: mostrar el texto final sin animacion o con transicion minima */
@media (prefers-reduced-motion: reduce) {
	.ei-animated-text .ei-fragment,
	.ei-animated-text .ei-scramble-char {
		transition: none !important;
		animation: none !important;
		transform: none !important;
		filter: none !important;
		opacity: 1 !important;
	}

	.ei-animated-text .ei-cursor {
		animation: none !important;
	}
}

/* Responsive basico: evitar desbordes en pantallas pequenas */
@media (max-width: 767px) {
	.ei-animated-text {
		word-break: break-word;
	}
}