/* ==========================================================================
   Indice de solucoes — entra no fim de toda pagina publica.

   Existe para ligar as paginas entre si: sem essa malha, varias delas so
   recebiam um link do rodape e o Google nao tinha caminho para chegar nelas
   nem motivo para tratar o conjunto como um site so.

   O bloco aparece em paginas claras (voraxus.css) e em paginas escuras
   (demo-seguranca, apresentacao, psicologos). Por isso nao fixa nenhuma cor
   de fundo nem de texto: deriva tudo de currentColor, que ja vem correto do
   tema da pagina. color-mix tem reserva em rgba para navegador antigo.
   ========================================================================== */

.vrs-hub{
  /* display explicito: varias landings legadas tem uma regra de elemento
     (nav{display:flex}) para o seu proprio menu, e ela venceria aqui, porque
     seletor de elemento nao e sobrescrito por ausencia de declaracao. */
  display:block;
  box-sizing:border-box;
  width:100%;
  margin:0;
  border-top:1px solid rgba(128,128,128,.28);
  border-top-color: color-mix(in srgb, currentColor 22%, transparent);
  padding:2.6rem 16px 2.2rem;
  font-family: inherit;
}
.vrs-hub__in{ display:block; max-width:1120px; margin-inline:auto; padding:0 }

.vrs-hub *{ box-sizing:border-box }
.vrs-hub h2, .vrs-hub h3, .vrs-hub p, .vrs-hub ul, .vrs-hub li{
  font-family:inherit; text-align:left;
}

.vrs-hub__titulo{
  margin:0 0 .35rem;
  font-size:1rem; font-weight:700; letter-spacing:-.01em;
  color: inherit;
}
.vrs-hub__lead{
  margin:0 0 1.4rem;
  font-size:.88rem; line-height:1.6;
  opacity:.72;
}

.vrs-hub__grupos{
  display:grid; gap:1.6rem 2rem;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.vrs-hub__grupo h3{
  margin:0 0 .7rem;
  font-size:.74rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em;
  opacity:.55;
}
.vrs-hub__lista{
  display:flex; flex-direction:column; align-items:flex-start; gap:.48rem;
  margin:0; padding:0; list-style:none;
}
.vrs-hub__lista li{
  margin:0; padding:0; list-style:none;
  /* ::before e ::after zerados porque alguma folha legada desenha marcador
     proprio em li, e ele apareceria solto ao lado do link. */
}
.vrs-hub__lista li::before, .vrs-hub__lista li::after{ content:none }
.vrs-hub__lista a{
  color: inherit; text-decoration:none;
  font-size:.9rem; line-height:1.45;
  border-bottom:1px solid transparent;
  transition: opacity .15s ease, border-color .15s ease;
  opacity:.86;
}
.vrs-hub__lista a:hover,
.vrs-hub__lista a:focus-visible{
  opacity:1;
  border-bottom-color: currentColor;
}
/* A pagina em que o visitante ja esta nao vira link: link que aponta para a
   propria URL nao ajuda ninguem e ainda dilui a malha interna. */
.vrs-hub__lista [aria-current="page"]{
  opacity:.5; border-bottom:0; cursor:default;
}

.vrs-hub__idiomas{
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-top:1.8rem; padding-top:1.2rem;
  border-top:1px solid rgba(128,128,128,.2);
  border-top-color: color-mix(in srgb, currentColor 14%, transparent);
  font-size:.82rem;
}
.vrs-hub__idiomas a{
  color:inherit; text-decoration:none; opacity:.7;
  padding:.2rem .6rem; border-radius:999px;
  border:1px solid rgba(128,128,128,.3);
  border-color: color-mix(in srgb, currentColor 20%, transparent);
}
.vrs-hub__idiomas a:hover{ opacity:1 }

@media (max-width:560px){
  .vrs-hub{ padding:2rem 14px 1.8rem }
  .vrs-hub__grupos{ gap:1.4rem }
}
