/* ── Base global para pagina_inicial_academias ── */

/* Reset que antes venía de configuracion_inicial/configuracion.css. Esta página
   ya no carga el CSS global del panel, así que la sección lo trae ella misma.
   Sin `a { text-decoration: none }` todos los enlaces salen subrayados. */
* { margin: 0; padding: 0; box-sizing: border-box; }

a { text-decoration: none; color: #333; }

body {
  /* La familia real la fija --font-brand en el <style> del encabezado, que se
     inyecta después de esta hoja. Esto es solo el fallback. */
  font-family: system-ui, -apple-system, sans-serif;
  background: #fff;
  color: #1a1a2e;
  line-height: 1.3;
}

.pia-seccion        { padding: 72px 0; }
.pia-seccion-gris   { background: #f9fafb; }

/* Section header */
.pia-section-header        { text-align: center; margin-bottom: 40px; }
.pia-section-header h2     { font-size: 1.85rem; font-weight: 700; margin-bottom: 6px; }
.pia-section-header p      { color: #6b7280; font-size: 1rem; margin-bottom: 14px; }

.pia-section-divider {
  width: 48px;
  height: 4px;
  background: var(--color-brand-grad);
  border-radius: 999px;
  margin: 0 auto;
}

/* Badge EN VIVO */
.pia-badge-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fee2e2;
  color: #dc2626;
  border-radius: 999px;
  padding: 3px 14px;
  font-size: 0.75rem;
  font-weight: 700;
  margin-bottom: 12px;
  letter-spacing: .5px;
}
.pia-badge-live .dot {
  width: 7px; height: 7px;
  background: #dc2626;
  border-radius: 50%;
  animation: piaPulse 1.4s infinite;
}
@keyframes piaPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: .5; transform: scale(1.5); }
}

/* Botón outline brand (ver comentarios, contactar) */
.btn-pia-outline {
  background: transparent;
  border: 1.5px solid var(--color-brand);
  color: var(--color-brand);
  border-radius: 10px;
  padding: 10px 24px;
  font-weight: 600;
  font-size: 0.875rem;
  transition: background .2s, color .2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.btn-pia-outline:hover {
  background: color-mix(in srgb, var(--color-brand) 10%, transparent);
  color: var(--color-brand);
}

/* ── Barra fija de móvil (A8) ──
   Las dos acciones siempre a mano mientras se recorre el catálogo. Reemplaza
   al botón flotante de WhatsApp, que repetía el del hero y metía un verde fijo
   que no era el de la academia. */
.barra-movil { display: none; }

@media (max-width: 720px) {
  .barra-movil {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;          /* por debajo del panel de detalle y su fondo */
    display: flex;
    gap: var(--esp-2);
    padding: 14px var(--margen-lateral);
    /* Con el área segura del iPhone, que si no come el borde inferior */
    padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--linea);
  }

  .barra-movil__principal,
  .barra-movil__whatsapp {
    font-size: 15px;
    padding: 13px 16px;
    text-align: center;
    min-height: 44px;      /* objetivo táctil mínimo */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .barra-movil__principal { flex: 1; }
  .barra-movil__whatsapp  { flex: none; }

  /* Que la barra no tape el final de la página */
  body { padding-bottom: 76px; }
}

/* ── Aviso de errata en el correo ──
   Sugiere, no bloquea: por eso va en el gris de meta y no en el rojo de error. */
.aviso-correo {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--meta);
}
.aviso-correo[hidden] { display: none; }

.aviso-correo__corregir {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  font-weight: 600;
  color: var(--marca-fuerte);
  cursor: pointer;
  text-decoration: underline;
}