/* ============================================================
   HUB — pantalla de login y tarjetas de herramientas.
   Va con hub.js (index.html)
============================================================ */
#vista-login{
  max-width:380px; margin:8vh auto 0; background:var(--panel);
  border:1px solid var(--linea); border-radius:var(--radio);
  padding:32px 28px; box-shadow:0 8px 30px rgba(27,46,158,.08);
  text-align:center;
}
#vista-login img{height:80px; margin-bottom:14px}
#vista-login h2{font-size:20px; font-weight:700; color:var(--azul); margin-bottom:18px}

.hub-grupo{margin-bottom:30px}
.hub-titulo{
  font-size:15px; font-weight:800; text-transform:uppercase; letter-spacing:1px;
  color:var(--azul); border-bottom:2px solid var(--amarillo);
  padding-bottom:8px; margin-bottom:16px;
}
.hub-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px}
.card-tool{
  display:flex; flex-direction:column; gap:8px; min-height:120px;
  background:var(--panel); border:1px solid var(--linea); border-radius:var(--radio);
  padding:18px; text-decoration:none; color:var(--tinta);
  border-top:4px solid var(--rojo);
  transition:box-shadow .15s, transform .15s;
}
.card-tool:hover{box-shadow:0 8px 24px rgba(27,46,158,.12); transform:translateY(-2px)}
.card-nombre{
  font-family:'Barlow Semi Condensed'; font-weight:800; font-size:17px;
  color:var(--azul); letter-spacing:.2px;
}
.card-desc{font-size:13.5px; color:var(--gris); line-height:1.4}