/**
 * capturado.css — Correcciones sobre el markup de Elementor que aún sirven los mirrors.
 *
 * (Antes se llamaba home.css; el nombre engañaba, porque esto aplica a TODA la web.)
 *
 * Aquí solo entra lo que no se puede arreglar en el origen porque el markup es una
 * captura congelada. Cada regla lleva su motivo. Cuando una página se migre a markup
 * propio, sus reglas de este fichero desaparecen.
 */

/* ============================================================ ancho único */

/**
 * El original mezclaba dos contenedores: 1140px en la mayoría de secciones y 1440px
 * (full-bleed) en el hero y en la sección del ADN. Eso rompía la alineación vertical de
 * la página. Aquí se igualan todos al ancho del sistema.
 */
.e-con-inner,
.elementor-container,
.elementor-widget-wrap > .elementor-element.elementor-column {
	max-width: var(--ev-ancho, 1360px) !important;
	margin-inline: auto;
}

/* El hero sí debe seguir a sangre: su fondo es la imagen. */
.elementor-element-472c29e > .e-con-inner {
	max-width: var(--ev-ancho, 1360px) !important;
}

/* ==================================================== sección ADN (eafb7bf) */

/**
 * Problemas del original: contenedor a 1440 mientras el resto iba a 1140, y los dos
 * motivos de puntos invadiendo la columna de texto.
 *
 * OJO con la tipografía: los tres trozos del titular ("El ADN" / "que nos" / "define")
 * son <p>, NO encabezados. Una regla de `p` en toda la sección los infla y los separa en
 * tres bloques sueltos. Por eso el ajuste de interlineado se limita a la COLUMNA DE TEXTO.
 */
.elementor-element-eafb7bf {
	max-width: var(--ev-ancho, 1360px) !important;
	margin-inline: auto !important;
	padding-inline: clamp(1.25rem, 4vw, 2.5rem) !important;
	padding-block: clamp(3rem, 6vw, 5rem) !important;
	height: auto !important;
	min-height: 0 !important;
	align-items: center !important;
	gap: clamp(2rem, 5vw, 5rem) !important;
}

/* Motivos de puntos: apartados del texto y a menor escala. */
.elementor-element-eafb7bf > *:first-child {
	background-position: center center !important;
	background-size: 72% auto !important;
}

.elementor-element-eafb7bf > *:last-child {
	background-position: right -14% center !important;
	background-size: 42% auto !important;
}

/**
 * Columna del titular. El original usa line-height 1.0, que con tres líneas queda
 * apelmazado; 1.15 es suficiente para que respire.
 * NO se toca el margin-bottom: ahí estuvo el error anterior, que los separó en tres
 * bloques sueltos.
 */
.elementor-element-eafb7bf > *:first-child p {
	line-height: 1.15 !important;
	position: relative;
	z-index: 1;
}

/* Solo la columna de texto. El titular queda intacto. */
.elementor-element-eafb7bf > *:last-child p {
	line-height: 1.7 !important;
	margin-bottom: .7em !important;
	max-width: 60ch;
	position: relative;
	z-index: 1;
}

@media (max-width: 1024px) {
	.elementor-element-eafb7bf { display: block !important; }

	.elementor-element-eafb7bf > *:first-child {
		background-size: 52% auto !important;
		margin-bottom: 1.5rem;
	}

	/* En pantalla pequeña el motivo compite con el texto: se retira casi del todo. */
	.elementor-element-eafb7bf > *:last-child {
		background-size: 65% auto !important;
		background-position: right -40% center !important;
	}
}