/* =========================================================
   LANDINGS DE SERVICIOS — Full Remote, Capacitación y Producción.
   ========================================================= */
.servicio-pagina { padding-bottom: clamp(56px, 8vw, 104px); }
.servicio-pagina .page-head { padding-bottom: 36px; justify-items: start; }
.servicio-volver { color: var(--text-dim); font-size: 0.9rem; }
.servicio-volver:hover { color: var(--text); }
.servicio { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(24px, 4vw, 44px); display: grid; gap: 18px; }
.servicio h3 { font-size: clamp(1.35rem, 2.4vw, 1.9rem); }
.landing-servicio { font-family: var(--font-body); font-size: 1rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--text); }
.terminos-enlace { margin-top: 18px; font-size: 0.75rem; }
.terminos-enlace a { color: var(--text-faint); }
.terminos-enlace a:hover { color: var(--text); text-decoration: underline; }
.paquetes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.paquetes .servicio { grid-template-rows: auto auto auto 1fr; align-content: start; }
.paquetes .servicio-acciones { align-self: end; }
@media (max-width: 860px) { .paquetes { grid-template-columns: minmax(0, 1fr); } .paquetes .servicio { grid-template-rows: none; } }
.servicio .bajada { font-size: 1.05rem; max-width: 70ch; }
.servicio p { color: var(--text-dim); max-width: 70ch; }
.servicio p strong { color: var(--text); }
.servicio h4 { font-weight: 700; font-family: var(--font-body); font-size: 0.95rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-text); margin: 0; }
.servicio-grupo { display: grid; gap: 10px; }
.servicio-columnas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 760px) { .servicio-columnas { grid-template-columns: minmax(0, 1fr); } }
.servicio-precio { font-family: var(--font-display); font-size: 1.35rem; color: var(--text); }
.servicio-precio s { color: var(--text-faint); font-size: 1rem; margin-right: 6px; }
.servicio-acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; }


.tabla-modulos { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.tabla-modulos th { font-family: var(--font-accent); font-weight: 400; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-dim); text-align: left; padding: 0 12px 10px 0; }
.tabla-modulos td { padding: 12px 12px 12px 0; border-top: 1px solid var(--line); color: var(--text-dim); vertical-align: top; }
.tabla-modulos td:first-child { color: var(--text); }
.tabla-modulos th:not(:first-child), .tabla-modulos td:not(:first-child) { white-space: nowrap; }
.tabla-modulos th:last-child, .tabla-modulos td:last-child { padding-right: 0; text-align: right; }

/* ---------- ¿Podemos ayudarte? ---------- */
.ayuda { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ayuda .card { display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 860px) { .ayuda { grid-template-columns: minmax(0, 1fr); } }
.comparativa { margin-top: clamp(56px, 8vw, 96px); }
.comparativa .section-head { margin-bottom: 32px; }

/* ---------- Landings largas: Asesoría 1:1 y Capacitación ---------- */
.servicio-pagina .page-head strong { color: var(--text); }
.landing-nota { color: var(--accent-text); }
.titulo-rojo { color: var(--rojo-titulo); }
.titulo-linea { display: block; }
.landing-intro { display: grid; gap: 14px; width: 100%; margin-top: 6px; }
.landing-intro p, .landing-intro .lista { color: var(--text-dim); font-size: 1.1rem; line-height: 1.6; max-width: 62ch; }
.landing-intro p.landing-nota { color: var(--accent-text); }
.landing-intro h2 { margin: 14px 0 0; font-family: var(--font-body); font-size: clamp(1.25rem, 2vw, 1.5rem); font-weight: 700; line-height: 1.3; letter-spacing: 0; text-transform: none; color: var(--text); }
.landing-intro-pie { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 8px; }
.landing-intro-pie .btn { flex: none; }
@media (max-width: 760px) { .landing-intro-pie { flex-direction: column; align-items: flex-end; } .landing-intro-pie p { align-self: flex-start; } }
.landing-seccion { margin-top: clamp(56px, 8vw, 96px); display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.landing-seccion .section-head { margin-bottom: 0; }
.landing-casos { display: grid; gap: 20px; }
/* Imágenes alternadas: derecha, izquierda, derecha… */
@media (min-width: 861px) { .landing-casos .caso:nth-child(even) .caso-videos { order: -1; } }
.landing-caso { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(20px, 3vw, 36px); display: grid; gap: 22px; }
.antes-despues { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: clamp(20px, 3vw, 36px); align-items: center; }
/* El después va más grande */
.antes-despues > div { display: grid; gap: 10px; align-content: start; }
.antes-despues > div > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.antes-despues span { font-weight: 700; font-family: var(--font-body); font-size: 0.95rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-text); }
.antes-despues img { width: 100%; height: auto; aspect-ratio: 7 / 10; object-fit: cover; border-radius: var(--radius-sm); }
.historia { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.historia > div { padding: 14px 16px; border-left: 2px solid var(--line); display: grid; gap: 6px; align-content: start; }
.historia .h-reco { border-left-color: var(--accent); }
.historia .h-res { border-left-color: var(--brand-bright); }
.historia dt { font-weight: 700; font-family: var(--font-body); font-size: 0.95rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-text); }
.historia dd { margin: 0; color: var(--text-dim); }
.historia dd strong { color: var(--text); }
.landing-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.landing-pasos .card { display: flex; flex-direction: column; gap: 12px; }
.landing-pasos .card p { color: var(--text-dim); }
.landing-pasos .num { font-family: var(--font-display); font-size: 2.2rem; letter-spacing: 0; }
.landing-numero strong { font-family: var(--font-display); font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 400; line-height: 1; text-transform: uppercase; }
.landing-bloque { display: grid; gap: 18px; }
.landing-cta { display: flex; justify-content: flex-end; }
.servicio-pagina > .landing-cta { margin-top: clamp(48px, 7vw, 80px); }
.landing-final h2 { flex: 1 1 0; min-width: 0; margin: 0; }
.landing-final .btn { flex: none; }
.landing-final { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: clamp(32px, 5vw, 56px); background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); }
@media (max-width: 760px) { .landing-final { flex-direction: column; align-items: flex-end; } .landing-final h2 { flex: none; align-self: flex-start; } }
.servicio-pagina .page-head .btn { justify-self: start; }
@media (max-width: 860px) {
  .historia, .landing-pasos { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .antes-despues { grid-template-columns: minmax(0, 1fr); }
  .antes-despues > div:first-child { padding-inline: 8%; }
  .landing-final { padding: 20px; }
}
/* En pantallas muy angostas, la duración y el precio también pueden partirse */
@media (max-width: 360px) {
  .tabla-modulos th:not(:first-child), .tabla-modulos td:not(:first-child) { white-space: normal; }
  .tabla-modulos { font-size: 0.86rem; }
}