/* =========================================
   Calendario (MÓVIL) - Separación entre tarjetas SIN romper línea/puntos
   Estrategia:
   - NO tocar .calendario-item (para no afectar dot/línea)
   - Aplicar separación al contenedor .calendario-timeline (gap)
   - Como fallback, añadir margen superior entre items vía selector de hermanos
   Solo espaciado.
   ========================================= */

@media (max-width: 768px){
  /* Asegura separación entre items sin alterar geometría del item */
  #calendario .calendario-timeline{
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important; /* separación visible y natural */
  }

  /* Fallback si el layout no respeta gap (algunos casos) */
  #calendario .calendario-item + .calendario-item{
    margin-top: 8px !important;
  }

  /* No forzar margin/padding en el item */
  #calendario .calendario-item{
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Elimina cualquier separador previo */
  #calendario .calendario-item::after{ content: none !important; display: none !important; }
}

@media (max-width: 480px){
  #calendario .calendario-timeline{ gap: 6px !important; }
  #calendario .calendario-item + .calendario-item{ margin-top: 6px !important; }
}