/* Barra in cima a ogni sito GLM Interactive: si passa con un tocco tra la
   home dello studio, Quintessenza Biblica e APOKAL. Il sito in cui ci si
   trova è evidenziato (aria-current="page"). Stesso aspetto ovunque. */
.glm-family {
  position: relative;
  z-index: 20;
  background: #05070f;
  border-bottom: 1px solid #ffffff14;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Arial, sans-serif;
}

.glm-family-in {
  max-width: 1200px;
  margin: 0 auto;
  padding: 6px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.glm-family-in::-webkit-scrollbar { display: none; }

.glm-family a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px 5px 6px;
  border-radius: 999px;
  color: #aeb6c6;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: background .25s ease, color .25s ease;
}

.glm-family a:hover { background: #ffffff12; color: #fff; }

.glm-family a[aria-current="page"] {
  background: #ffffff1c;
  color: #fff;
  box-shadow: inset 0 0 0 1px #ffffff2a;
}

.glm-family img {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
}

.glm-family .sep {
  width: 1px;
  height: 16px;
  background: #ffffff1f;
}

@media (max-width: 600px) {
  .glm-family-in { justify-content: flex-start; padding: 6px 10px; gap: 2px; }
  .glm-family a { font-size: 12px; padding: 4px 10px 4px 4px; gap: 6px; }
  .glm-family img { width: 20px; height: 20px; }
  .glm-family .long { display: none; }
}