/**
 * Partners (programa de partners) — piezas propias de la página.
 *
 * Standalone (NO gulp), igual que corporative-cards.css: se encola desde
 * functions/enqueue-styles.php DESPUÉS de corporative-page.min.css y de
 * corporative-cards.css, con cache-busting por filemtime.
 *
 * La página REUTILIZA de corporative-cards.css el hero (.gp-corp-hero), la franja
 * de números (.gp-corp-stats), la tabla comparativa (.gp-corp-cmp), los 3 pasos
 * (.gp-corp-steps), la FAQ (.gp-corp-faq), el bloque de contacto (.gp-corp-contact)
 * y la banda amarilla de cierre (.gp-corp-partners). Aquí solo viven los botones del
 * hero y las tarjetas de módulo, que no existen en corporativo.
 *
 * El tema NO hereda tipografía en body → cada elemento declara su GP Sans.
 * Paleta: amarillo #f9ca24, tinta #1e1e1e, grises #3f3f3f / #6a6862 / #d8d8d8.
 */

/* ============================================================
   BOTONES (hero y tarjetas)
   ============================================================ */

.gp-part-hero__ctas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 6px;
}

.gp-part-btn {
	display: inline-block;
	padding: 15px 30px;
	border: 2px solid #1e1e1e;
	border-radius: 999px;
	background: #1e1e1e;
	font-family: "GP-Black", sans-serif;
	font-size: 15px;
	line-height: 1;
	color: #f9ca24;
	text-align: center;
	text-decoration: none;
	transition: transform 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

@media (hover: hover) {
	.gp-part-btn:hover {
		transform: translateY(-2px);
		color: #f9ca24;
	}
}

/* Secundario: mismo peso visual, sin relleno, para no competir con el CTA principal. */
.gp-part-btn--ghost {
	background: transparent;
	color: #1e1e1e;
}

@media (hover: hover) {
	.gp-part-btn--ghost:hover {
		background: #1e1e1e;
		color: #f9ca24;
	}
}

/* Dentro de la tarjeta amarilla el botón va al ancho de la columna y algo más bajo. */
.gp-part-btn--sm {
	width: 100%;
	margin-top: auto;
	padding: 13px 20px;
	font-size: 14px;
}

/* ============================================================
   TARJETAS DE MÓDULO (Socio · Reseller API · Afiliado)
   ============================================================ */

.gp-part-mods {
	margin: 56px auto 0;
	width: 100%;
	max-width: 1240px;
}

.gp-part-mods h2 {
	margin: 0 0 10px;
	font-family: "GP-Black", sans-serif;
	font-weight: 400;
	font-size: 26px;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #1e1e1e;
	text-align: center;
	text-wrap: balance;
}

@media (min-width: 768px) {
	.gp-part-mods h2 {
		font-size: 32px;
	}
}

.gp-part-mods__sub {
	margin: 0 auto 26px;
	max-width: 62ch;
	font-family: "GP-Book", sans-serif;
	font-size: 15.5px;
	line-height: 1.55;
	color: #6a6862;
	text-align: center;
}

.gp-part-mods__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

@media (min-width: 640px) {
	.gp-part-mods__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 18px;
	}
}

@media (min-width: 1024px) {
	.gp-part-mods__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 20px;
	}
}

.gp-part-mod {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 26px 24px 28px;
	border: 1px solid #ececec;
	border-radius: 24px;
	background: #ffffff;
	box-shadow: 0 12px 30px rgba(30, 30, 30, 0.06);
}

/*
 * El módulo destacado (Socio, el objetivo comercial de agencias) va en amarillo:
 * mismo recurso que las tarjetas de corporativo, para que la jerarquía se lea de
 * un vistazo sin añadir badges ni texto extra.
 */
.gp-part-mod--hi {
	border-color: transparent;
	background: #f9ca24;
	box-shadow: 0 12px 26px rgba(201, 158, 12, 0.22);
}

.gp-part-mod__chip {
	display: inline-block;
	padding: 6px 13px;
	border-radius: 999px;
	background: #1e1e1e;
	font-family: "GP-Black", sans-serif;
	font-size: 11px;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #f9ca24;
}

.gp-part-mod--hi .gp-part-mod__chip {
	background: #1e1e1e;
	color: #f9ca24;
}

.gp-part-mod__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #1e1e1e;
	color: #f9ca24;
}

.gp-part-mod__ico svg {
	display: block;
	width: 23px;
	height: 23px;
}

.gp-part-mod h3 {
	margin: 0;
	font-family: "GP-Black", sans-serif;
	font-weight: 400;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #1e1e1e;
	text-align: left;
}

/* Doble clase: el tema centra los <p> del contenido con más especificidad que
   una clase suelta (mismo motivo por el que corporative-cards.css usa .gp-corp-card p). */
.gp-part-mod .gp-part-mod__who {
	margin: -6px 0 0;
	font-family: "GP-Bold", sans-serif;
	font-size: 13.5px;
	line-height: 1.35;
	color: #6a6862;
	text-align: left;
}

.gp-part-mod--hi .gp-part-mod__who {
	color: #6b5507;
}

.gp-part-mod ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.gp-part-mod li {
	position: relative;
	padding-left: 24px;
	font-family: "GP-Book", sans-serif;
	font-size: 14.5px;
	line-height: 1.5;
	color: #3f3f3f;
	text-align: left;
}

/* Check dibujado en CSS: sin iconos externos ni peticiones extra. */
.gp-part-mod li::before {
	content: "";
	position: absolute;
	left: 3px;
	top: 5px;
	width: 6px;
	height: 11px;
	border: solid #1e1e1e;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

/* Empuja el CTA al pie aunque las tarjetas tengan distinto número de bullets. */
.gp-part-mod ul {
	margin-bottom: 6px;
}

/* ============================================================
   AJUSTES DE PÁGINA
   ============================================================ */

/*
 * page-content-pages aplica margin-bottom:-32px a su último hijo; en corporativo
 * eso se anula sobre el contacto y aquí sobre la banda de cierre, que es el
 * último bloque de esta plantilla.
 */
.page-template-page-partners .page-content-pages > .gp-corp-partners {
	margin-bottom: 0;
}

/* El ancla del formulario no puede quedar debajo de la cabecera fija. */
.gp-part-contact {
	scroll-margin-top: 110px;
}
