
:root {
	--cersa-primary: #1E3A8A;
	--cersa-primary-dark: #152a63;
	--cersa-accent: #F59E0B;
	--cersa-whatsapp: #25D366;
	--cersa-whatsapp-dark: #1ea952;
	--cersa-text: #1F2937;
	--cersa-muted: #6B7280;
	--cersa-bg-light: #F9FAFB;
	--cersa-radius: 14px;
	--cersa-shadow: 0 10px 30px rgba(0,0,0,0.08);
	font-family: 'Poppins', sans-serif;
}

.cersa-container { max-width: 1140px; margin: 0 auto; padding: 0 20px; }
.cersa-highlight { color: var(--cersa-accent); }
.cersa-section-title { text-align: center; font-size: 2rem; font-weight: 700; color: var(--cersa-text); margin-bottom: 40px; }

/* HERO */
.cersa-hero {
	position: relative;
	background: linear-gradient(135deg, var(--cersa-primary) 0%, var(--cersa-primary-dark) 100%);
	color: #fff;
	padding: 100px 0 80px;
	overflow: hidden;
}
.cersa-hero-overlay {
	position: absolute; inset: 0;
	background: radial-gradient(circle at 80% 20%, rgba(245,158,11,0.25), transparent 60%);
}
.cersa-hero-inner { position: relative; z-index: 1; text-align: center; }
.cersa-badge {
	display: inline-block; background: rgba(255,255,255,0.15);
	padding: 6px 16px; border-radius: 30px; font-size: 0.85rem; margin-bottom: 20px;
}
.cersa-hero h1 { font-size: 2.6rem; font-weight: 800; line-height: 1.2; margin: 0 0 16px; }
.cersa-hero p { font-size: 1.1rem; color: rgba(255,255,255,0.85); max-width: 640px; margin: 0 auto 30px; }
.cersa-hero-cta { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-bottom: 40px; }
.cersa-hero-stats { display: flex; justify-content: center; gap: 50px; flex-wrap: wrap; }
.cersa-hero-stats div { text-align: center; }
.cersa-hero-stats strong { display: block; font-size: 1.6rem; font-weight: 800; color: var(--cersa-accent); }
.cersa-hero-stats span { font-size: 0.85rem; color: rgba(255,255,255,0.7); }

/* BOTONES */
.cersa-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 14px 28px; border-radius: 50px; font-weight: 600; font-size: 0.95rem;
	text-decoration: none; cursor: pointer; border: none; transition: transform .2s, box-shadow .2s;
}
.cersa-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); }
.cersa-btn-primary { background: var(--cersa-accent); color: #fff; }
.cersa-btn-whatsapp { background: var(--cersa-whatsapp); color: #fff; }
.cersa-btn-whatsapp:hover { background: var(--cersa-whatsapp-dark); }
.cersa-btn-outline { background: transparent; border: 2px solid var(--cersa-primary); color: var(--cersa-primary); padding: 10px 22px; }
.cersa-btn-full { width: 100%; }

/* WHY US */
.cersa-why-us { background: var(--cersa-bg-light); padding: 80px 0; }
.cersa-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.cersa-card-feature {
	background: #fff; border-radius: var(--cersa-radius); padding: 30px 20px; text-align: center;
	box-shadow: var(--cersa-shadow); transition: transform .25s;
}
.cersa-card-feature:hover { transform: translateY(-6px); }
.cersa-card-feature .cersa-icon { font-size: 2.2rem; margin-bottom: 12px; }
.cersa-card-feature h3 { font-size: 1.05rem; margin: 0 0 8px; color: var(--cersa-text); }
.cersa-card-feature p { font-size: 0.9rem; color: var(--cersa-muted); }

/* PROGRAMAS */
.cersa-programas { padding: 80px 0; }
.cersa-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.cersa-card-programa {
	background: #fff; border-radius: var(--cersa-radius); overflow: hidden; box-shadow: var(--cersa-shadow);
	padding-bottom: 20px; transition: transform .25s;
}
.cersa-card-programa:hover { transform: translateY(-6px); }
.cersa-programa-img img { width: 100%; height: 180px; object-fit: cover; }
.cersa-card-programa h3, .cersa-card-programa p, .cersa-card-programa a { margin-left: 20px; margin-right: 20px; }
.cersa-card-programa h3 { margin-top: 16px; font-size: 1.1rem; }
.cersa-card-programa p { color: var(--cersa-muted); font-size: 0.9rem; }

/* PASOS */
.cersa-pasos { background: var(--cersa-bg-light); padding: 80px 0; }
.cersa-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.cersa-step { text-align: center; }
.cersa-step-num {
	display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
	background: var(--cersa-primary); color: #fff; border-radius: 50%; font-weight: 700; margin-bottom: 12px;
}
.cersa-step h3 { font-size: 1rem; margin: 0 0 6px; }
.cersa-step p { font-size: 0.85rem; color: var(--cersa-muted); }

/* FORMULARIO */
.cersa-form-section { padding: 80px 0; background: #fff; }
.cersa-form-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.cersa-form-info h2 { font-size: 1.8rem; font-weight: 700; margin-bottom: 16px; }
.cersa-form-benefits { list-style: none; padding: 0; margin: 20px 0 0; }
.cersa-form-benefits li { margin-bottom: 10px; color: var(--cersa-text); }
.cersa-form-card { background: var(--cersa-bg-light); border-radius: var(--cersa-radius); padding: 32px; box-shadow: var(--cersa-shadow); }
.cersa-form-group { margin-bottom: 16px; text-align: left; }
.cersa-form-group label { display: block; font-size: 0.9rem; font-weight: 600; margin-bottom: 6px; color: var(--cersa-text); }
.cersa-form-group input, .cersa-form-group textarea {
	width: 100%; padding: 12px 14px; border: 1px solid #D1D5DB; border-radius: 10px; font-family: inherit; font-size: 0.95rem;
	transition: border-color .2s;
}
.cersa-form-group input:focus, .cersa-form-group textarea:focus { outline: none; border-color: var(--cersa-primary); }
.cersa-form-msg { margin-top: 14px; font-size: 0.9rem; text-align: center; }
.cersa-form-msg.success { color: var(--cersa-whatsapp-dark); font-weight: 600; }
.cersa-form-msg.error { color: #DC2626; font-weight: 600; }
.cersa-spinner {
	display: inline-block; width: 16px; height: 16px; border: 2px solid #fff; border-top-color: transparent;
	border-radius: 50%; animation: cersa-spin .7s linear infinite; margin-left: 8px;
}
@keyframes cersa-spin { to { transform: rotate(360deg); } }

/* RESPONSIVE */
@media (max-width: 900px) {
	.cersa-grid-4, .cersa-grid-3, .cersa-steps { grid-template-columns: repeat(2, 1fr); }
	.cersa-form-wrapper { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
	.cersa-hero h1 { font-size: 1.9rem; }
	.cersa-grid-4, .cersa-grid-3, .cersa-steps { grid-template-columns: 1fr; }
	.cersa-hero-stats { gap: 24px; }
}
