/* =========================================================
  Index Sponsor hotfix
  - v2026-01-24
  - Put sponsor logo(s) at the bottom of index.html
========================================================= */

.sponsorBar{
  margin-top:16px;
  padding:16px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  box-shadow:0 12px 30px rgba(0,0,0,.20);
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:center;
}

.sponsorBar__label{
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
  font-weight:800;
}

.sponsorBar__logos{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:100%;
}

.sponsorBar__logo{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  overflow:hidden;
  text-decoration:none;
  color:inherit;
  transition:transform 160ms ease, border-color 160ms ease;
}
.sponsorBar__logo:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.22);
}

.sponsorBar__logo img{
  display:block;
  width:min(420px, 100%);
  height:auto;
  border-radius:10px;
}

@media (max-width: 560px){
  .sponsorBar{padding:14px}
  .sponsorBar__logo{padding:8px 10px}
  .sponsorBar__logo img{width:min(340px, 100%)}
}

@media (prefers-reduced-motion: reduce){
  .sponsorBar__logo{transition:none !important}
  .sponsorBar__logo:hover{transform:none}
}