/* ==========================================================================
   🟢 MAXIQUEEN OS - LINK HUB & GRID BUTTONS (MUTACIÓN NEÓN GREEN)
   ========================================================================== */

.mq-link-hub {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px;
  max-width: 980px;
  margin: 32px auto;
  padding: 18px;
}

.mq-link-hub a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 56px;
  padding: 12px 18px; /* Aire interno de seguridad para textos largos */
  
  /* Eliminado Cyan. Borde base Neón Green sutil con golpe de luz superior */
  border: 1px solid var(--border-soft, rgba(0, 255, 102, 0.2));
  border-top: 1px solid rgba(0, 255, 102, 0.4);
  border-radius: 16px;
  
  /* Mutación de fondo: De azul/oro a vacío absoluto con destello verde superior */
  background:
    linear-gradient(135deg, rgba(10, 15, 12, 0.96), rgba(5, 5, 5, 0.92)),
    radial-gradient(circle at top, rgba(0, 255, 102, 0.12), transparent 40%);
    
  /* Texto: Blanco zinc puro para máxima legibilidad inicial */
  color: #ffffff;
  font: 800 14px/1.2 Inter, system-ui, sans-serif;
  letter-spacing: .04em;
  text-decoration: none;
  
  /* Sombras oscuras de profundidad */
  box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
  
  /* Optimización para GPU: Animaciones ultra fluidas en móviles */
  will-change: transform, border-color, box-shadow;
  transition: transform .25s cubic-bezier(0.25, 0.8, 0.25, 1), 
              border-color .25s ease, 
              box-shadow .25s ease, 
              color .25s ease;
}

/* Sobrecarga Cyberpunk Dimensional al pasar el mouse (Hover) */
.mq-link-hub a:hover {
  transform: translateY(-3px) scale(1.02); /* Micro-elevación 3D */
  border-color: var(--accent, #00ff66); /* Borde Neón Puro */
  color: var(--accent, #00ff66); /* El texto muta a tu verde neón */
  
  /* Eliminado Oro. Reemplazado por Brillo Radiactivo Verde Neón con reflejo interno */
  box-shadow: 0 0 25px rgba(0, 255, 102, 0.35),
              inset 0 0 10px rgba(0, 255, 102, 0.1);
  
  /* Resplandor en las letras para imitar una pantalla holográfica */
  text-shadow: 0 0 8px rgba(0, 255, 102, 0.4);
}