.hb-tags-cloud{
  --hb-red:#d6111e;
  --hb-gold:#ddc76d;
  --hb-black:#000000;
  --hb-white:#ffffff;

  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:flex-start;
  padding:14px;
  background:var(--hb-black);
  border:2px solid var(--hb-red);
  border-radius:14px;
}

.hb-tags-cloud a{
  display:inline-block;
  padding:8px 12px;
  border-radius:999px;
  background:var(--hb-red);
  color:var(--hb-white) !important;
  text-decoration:none;
  line-height:1.1;
  border:1px solid rgba(255,255,255,0.18);
  box-shadow:0 2px 0 rgba(0,0,0,0.35);
  transition:transform .08s ease, background-color .12s ease, outline-color .12s ease;
  outline:2px solid transparent;
  outline-offset:2px;
}

.hb-tags-cloud a:hover,
.hb-tags-cloud a:focus{
  background:var(--hb-black);
  outline-color:var(--hb-gold);
  transform:translateY(-1px);
}

.hb-tags-cloud a:active{
  transform:translateY(0);
}

.hb-tags-cloud a:focus-visible{
  outline-color:var(--hb-gold);
}

@media (prefers-reduced-motion: reduce){
  .hb-tags-cloud a{ transition:none; }
}