/*
 * cursos-certificados.css
 * Página pública /cursos-certificados/ — página de expectativa ("muy pronto").
 * Misma línea visual del resto (hero degradado, tarjetas redondeadas). El
 * formulario de newsletter (shortcode [saes_newsletter_form] del plugin) se
 * estiliza en plugin-saes-electronica-core/assets/css/saes-public.css
 * (.saes-newsletter), no aquí, para que se vea igual sin importar en qué
 * página se inserte el shortcode.
 */

.saes-cursos { overflow-x: hidden; }

/* ─── Hero ─── */
.saes-cursos-hero {
	background: linear-gradient(160deg, var(--color-secundario), var(--color-primario));
	color: #fff;
	padding-block: var(--espacio-2xl);
	text-align: center;
}
.saes-cursos-hero__inner { max-width: 680px; margin-inline: auto; }
.saes-cursos-hero__kicker {
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-dorado);
	margin-bottom: .6rem;
}
.saes-cursos-hero h1 { color: #fff; font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0 0 var(--espacio-sm); }
.saes-cursos-hero p { color: rgba(255,255,255,.8); font-size: 1.05rem; margin: 0; }

/* ─── Expectativa ─── */
.saes-cursos-expectativa { padding-block: var(--espacio-2xl); }
.saes-cursos-expectativa__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--espacio-lg);
}
.saes-cursos-expectativa__col {
	background: var(--color-fondo-alterno);
	border-radius: var(--radio-lg);
	padding: var(--espacio-lg);
	text-align: center;
}
.saes-cursos-expectativa__icono { font-size: 1.8rem; display: block; margin-bottom: .5rem; }
.saes-cursos-expectativa__col h3 { margin: 0 0 .4rem; font-size: 1.1rem; }
.saes-cursos-expectativa__col p { color: var(--color-texto-suave); font-size: .9rem; line-height: 1.6; margin: 0; }

/* ─── Bloque de newsletter ─── */
.saes-cursos-newsletter {
	margin-top: var(--espacio-xl);
	padding-top: var(--espacio-xl);
	border-top: 1px solid var(--color-borde);
	max-width: 560px;
	margin-inline: auto;
	text-align: center;
}
.saes-cursos-newsletter h2 { margin: 0 0 .5rem; font-size: 1.4rem; }
.saes-cursos-newsletter p { color: var(--color-texto-suave); margin: 0 0 var(--espacio-md); }

@media (min-width: 640px) {
	.saes-cursos-expectativa__grid { grid-template-columns: repeat(3, 1fr); }
}