/*
 * Bloque de cierre: contacto directo por WhatsApp.
 *
 * Estructura en dos partes: a la izquierda el argumento, a la derecha un
 * panel de contacto destacado. Separar la propuesta del punto de acción hace
 * que el botón no compita con el texto y quede visualmente inequívoco.
 */

.proamsa-cta {
	position: relative;
	isolation: isolate;
	overflow: clip;
	/*
	 * flow-root contiene los márgenes de los hijos.
	 *
	 * `overflow: clip` recorta, pero —a diferencia de `hidden` o `auto`— NO
	 * crea contexto de formato de bloque, así que el margen inferior del
	 * último elemento de la columna de texto se colaba fuera y dejaba 18 px
	 * de franja entre este bloque y el pie.
	 */
	display: flow-root;
	/* Reducido a la mitad: antes 3–6rem. */
	padding-block: clamp(1.5rem, 3.5vw, 3rem);
	background:
		radial-gradient(105% 85% at 82% 8%, #4C8A00 0%, transparent 58%),
		linear-gradient(150deg, #1F4D06 0%, #2C6A04 48%, #3F8300 100%);
	color: #FFFFFF;
}

/* --- Decoración --- */

.proamsa-cta__fondo {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
}

.proamsa-cta__halo {
	position: absolute;
	border-radius: 50%;
	filter: blur(90px);
}

.proamsa-cta__halo--a {
	inset-block-start: -20%;
	inset-inline-start: -8%;
	width: min(42vw, 460px);
	aspect-ratio: 1;
	background: #A8D24A;
	opacity: 0.2;
}

.proamsa-cta__halo--b {
	inset-block-end: -26%;
	inset-inline-end: -4%;
	width: min(38vw, 420px);
	aspect-ratio: 1;
	background: #00122A;
	opacity: 0.3;
}

.proamsa-cta__trazo {
	position: absolute;
	inset-block-start: 12%;
	inset-inline: 0;
	width: 100%;
	height: auto;
}

/* --- Rejilla --- */

.proamsa-cta__rejilla {
	display: grid;
	gap: clamp(1.75rem, 4vw, 3.25rem);
	align-items: center;
}

@media (min-width: 860px) {
	.proamsa-cta__rejilla {
		grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
	}
}

/* --- Columna de texto --- */

.proamsa-cta__ante {
	margin: 0 0 0.85rem;
	color: #D6F09A;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.proamsa-cta__titulo {
	margin: 0;
	color: #FFFFFF;
	font-size: clamp(1.75rem, 3.6vw, 2.85rem);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.025em;
	text-wrap: balance;
}

.proamsa-cta__entrada {
	max-width: 46ch;
	margin: 1.15rem 0 0;
	color: #DCEBC6;
	font-size: clamp(0.98rem, 1.4vw, 1.09rem);
	line-height: 1.6;
	text-wrap: pretty;
}

.proamsa-cta__ventajas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem 1.5rem;
	margin: 1.6rem 0 0;
	padding: 0;
	list-style: none;
}

.proamsa-cta__ventajas li {
	position: relative;
	padding-left: 1.6rem;
	color: #EDF7DC;
	font-size: 0.9125rem;
	font-weight: 600;
}

/* Marca de verificación dibujada con máscara: hereda el color y escala sin
   perder nitidez, a diferencia de un emoji o una imagen. */
.proamsa-cta__ventajas li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 0.22em;
	width: 1.05rem;
	height: 1.05rem;
	background-color: #C6E85A;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --- Panel de contacto --- */

.proamsa-cta__panel {
	/* Relleno reducido a la mitad: antes clamp(1.6rem, 3vw, 2.25rem). */
	padding: clamp(0.8rem, 1.5vw, 1.15rem);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 20px;
	background: rgba(0, 18, 42, 0.4);
	box-shadow: 0 24px 50px -20px rgba(0, 12, 4, 0.72);
	backdrop-filter: blur(16px);
	text-align: center;
}

.proamsa-cta__icono {
	display: inline-grid;
	place-items: center;
	width: 62px;
	height: 62px;
	margin-bottom: 1rem;
	border-radius: 18px;
	background: rgba(198, 232, 90, 0.16);
	color: #C6E85A;
}

.proamsa-cta__panel-titulo {
	margin: 0;
	color: #FFFFFF;
	font-size: 1.19rem;
	font-weight: 700;
}

.proamsa-cta__panel-nota {
	margin: 0.4rem 0 1.35rem;
	color: #C3D8A6;
	font-size: 0.875rem;
	line-height: 1.5;
}

/*
 * El botón se ajusta al ancho del panel sin desbordarlo. El shortcode se
 * imprime dentro de un <p>, así que se centra ese contenedor para que el
 * botón quede alineado con el resto del panel.
 */
.proamsa-cta__panel p:has(> .proamsa-wa-cta),
.proamsa-cta__panel > p:last-of-type:has(.proamsa-wa-cta) {
	margin: 0;
	text-align: center;
}

/*
 * El botón se ajusta a su contenido en lugar de estirarse a todo el panel:
 * un botón de 560 px de ancho para dos palabras se lee como un error de
 * maquetación, no como una llamada a la acción.
 */
.proamsa-cta__panel .proamsa-wa-cta {
	display: inline-flex;
	width: auto;
	min-height: 54px;
	margin-block: 0;
	padding-inline: 2.25rem;
	font-size: 1rem;
	box-shadow: 0 10px 26px -10px rgba(0, 0, 0, 0.6);
}

.proamsa-cta__sep {
	margin: 1.4rem 0 1.1rem;
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.proamsa-cta__tel {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	margin: 0;
}

.proamsa-cta__tel span {
	color: #B9CFA0;
	font-size: 0.8125rem;
}

.proamsa-cta__tel a {
	color: #FFFFFF;
	font-size: 1.3rem;
	font-weight: 800;
	letter-spacing: 0.01em;
	text-decoration: none;
}

.proamsa-cta__tel a:hover,
.proamsa-cta__tel a:focus-visible {
	color: #C6E85A;
	text-decoration: underline;
	text-underline-offset: 0.22em;
}

