/* ==========================================================================
   SCOLA — /quinceaneras/ · lo propio de esta página
   Va encima de segment-page.css, que trae la anatomía compartida.
   ========================================================================== */

/* === WhatsApp ===
   En este mercado no es soporte, es el canal donde se cierra la venta. Va con
   el verde de la marca porque se reconoce antes que cualquier texto, y con el
   mismo peso que el CTA principal, no menos. */
.scola-quince__wa {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #25D366;
	color: #0B1F14;
	padding: 16px 28px;
	border-radius: 999px;
	font-family: var(--mono);
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.scola-quince__wa:hover { transform: translateY(-2px); }

.scola-quince__wa-icon { display: inline-flex; }

.scola-quince__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: center;
}

/* === Hero: foto en vez de film, porque el caso del portafolio es fotográfico === */
.scola-quince__hero-foto {
	margin: 0;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: 4px;
	background: var(--cream);
}

.scola-quince__hero-foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scola-quince__caso {
	display: inline-block;
	margin-top: 16px;
	font-size: 14px;
}

/* === El plan de pago ===
   Sección propia y con fondo distinto: es la objeción que decide la compra en
   este mercado, no una nota al pie de la tabla de precios. */
.scola-quince__plan {
	background: var(--cream);
	border-radius: 4px;
	padding: clamp(40px, 6vw, 80px) clamp(24px, 4vw, 64px);
	margin: clamp(48px, 6vw, 88px) 0;
}

.scola-quince__plan-inner { max-width: 760px; }

.scola-quince__plan-pasos {
	list-style: none;
	margin: clamp(24px, 3vw, 40px) 0 clamp(28px, 3vw, 40px);
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(16px, 2vw, 32px);
}

@media (max-width: 640px) {
	.scola-quince__plan-pasos { grid-template-columns: 1fr; gap: 20px; }
}

.scola-quince__plan-pasos li {
	border-top: 2px solid var(--orange);
	padding-top: 14px;
}

.scola-quince__plan-pasos b {
	display: block;
	font-family: var(--sans);
	font-size: clamp(26px, 3vw, 38px);
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--ink);
	line-height: 1;
	margin-bottom: 8px;
}

.scola-quince__plan-pasos span {
	font-size: 13px;
	line-height: 1.45;
	color: var(--ink-2);
}

/* La secuencia del día son seis pasos, no cuatro. */
.scola-quince__dia { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 968px) { .scola-quince__dia { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .scola-quince__dia { grid-template-columns: 1fr; } }