/* ==========================================================================
   Página Inteligencia (06_INTELIGENCIA_ESP del Figma "MiriadLanding")
   Lienzo 1512 px a escala 1/3: los valores van ×3.
   ========================================================================== */

/* --- Bloque LYNKS ---------------------------------------------------------
   Fondo marrón con la foto sangrando por la izquierda (Figma x=-132, 792 px)
   y el texto a partir de x=723.
   -------------------------------------------------------------------------- */

.lynks {
	display: grid;
	grid-template-columns: minmax(0, 44%) minmax(0, 56%);
	align-items: start;
	background: var(--c-marron);
}

.lynks__foto {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* La imagen ocupa toda la columna, del borde superior al inferior. */
	align-self: stretch;
}

.lynks__texto {
	padding: clamp(2rem, 3.4vw, 3.19rem) clamp(1.25rem, 3.7vw, 3.5rem)
	         clamp(2.5rem, 4.5vw, 4.25rem) clamp(1.25rem, 2.6vw, 2.44rem);
}

.lynks__titulo {
	font-family: var(--f-titulo);
	font-size: clamp(2rem, 4.37vw, 4.125rem);   /* 66 px */
	font-weight: 400;
	line-height: 1.26;
}

.lynks__cuerpo {
	max-width: 732px;
	margin-top: clamp(1rem, 2.2vw, 2.06rem);
	font-size: clamp(0.9rem, 1.44vw, 1.375rem);   /* 22 px */
	font-weight: 400;
	line-height: 1.36;
}
.lynks__cuerpo > p + p { margin-top: 1.1em; }

/* Capas de la suite: rótulo y línea, como el índice de pilares de la portada. */
.capas { max-width: 575px; margin-top: clamp(1.25rem, 2.2vw, 2rem); }

.capa {
	padding-block: 0.45em 0.5em;
	border-bottom: 1.5px solid var(--c-topo);
	font-size: clamp(1.05rem, 1.88vw, 1.78rem);   /* 28.5 px */
	font-weight: 400;
	line-height: 1.33;
}

/* --- Bloque claro: capas de IA y doctrina --------------------------------- */

.doctrina {
	padding-block: clamp(2rem, 3.75vw, 3.5rem);
	background: var(--c-topo);
	color: var(--c-negro);
}

.capas-ia {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 1.75vw, 1.63rem);   /* 26 px */
}

.capa-ia {
	padding: clamp(1.25rem, 2.3vw, 2.19rem);
	background: var(--c-marron);
	border-radius: 7px;
	color: var(--c-blanco);
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.35s ease;
}
.capa-ia:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgb(0 0 0 / 0.35); }

.capa-ia__titulo {
	margin-bottom: 0.75em;
	font-size: clamp(1rem, 1.72vw, 1.625rem);   /* 26 px */
	font-weight: 600;
	line-height: 1.15;
}

.capa-ia__texto {
	font-size: clamp(0.8rem, 0.99vw, 0.94rem);   /* 15 px */
	font-weight: 400;
	line-height: 1.27;
	color: var(--c-arena);
}

.doctrina__titulo {
	position: relative;
	max-width: 915px;
	margin-top: clamp(2rem, 3.9vw, 3.6rem);
	padding-bottom: 0.5em;
	font-size: clamp(1.05rem, 1.79vw, 1.6875rem);   /* 27 px */
	font-weight: 600;
	line-height: 1.15;
}
.doctrina__titulo::after {
	content: '';
	position: absolute;
	left: 0; bottom: 0;
	width: min(800px, 100%);
	height: 1.5px;
	background: var(--c-negro);
	opacity: 0.35;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.2s;
}
.doctrina__titulo.es-visible::after { transform: scaleX(1); }
.no-js .doctrina__titulo::after { transform: scaleX(1); }

.doctrina__texto {
	max-width: 1422px;
	margin-top: clamp(0.75rem, 1.1vw, 1rem);
	font-size: clamp(0.9rem, 1.39vw, 1.313rem);   /* 21 px */
	line-height: 1.33;
}
.doctrina__texto > p + p { margin-top: 1.1em; }

/* --- Cierre blanco -------------------------------------------------------- */

.cierre-ia {
	padding-block: clamp(1.75rem, 2.98vw, 2.8rem);
	background: var(--c-blanco);
	color: var(--c-negro);
}

.cierre-ia__texto {
	max-width: 1440px;
	font-size: clamp(1.1rem, 2.25vw, 2.125rem);   /* 34 px */
	font-weight: 600;
	line-height: 1.15;
}

.cierre-ia__cta { margin-top: clamp(1.25rem, 2.2vw, 2.06rem); }

/* --- Adaptación a pantallas menores --------------------------------------- */

@media (max-width: 1100px) {
	.lynks { grid-template-columns: 1fr; }

	.lynks__foto { max-height: 420px; }

	.lynks__texto {
		padding-inline: var(--margen);
		max-width: var(--lienzo);
		margin-inline: auto;
	}

	.capas-ia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
	.capas-ia { grid-template-columns: 1fr; }
}