.rankings-hero {
  background:
    linear-gradient(90deg, rgba(5, 13, 9, .96) 0%, rgba(5, 13, 9, .8) 48%, rgba(5, 13, 9, .7) 72%, rgba(5, 13, 9, .9) 100%),
    linear-gradient(180deg, rgba(7, 16, 12, .12), rgba(7, 16, 12, .78)),
    url("assets/nexo-zambia-apex-hero.png") center / cover no-repeat;
}

.rank-emblem {
  --badge-left: -522px;
  --badge-top: -78px;
  background-position: var(--badge-left) var(--badge-top);
}

.rank-emblem--gold {
  --badge-left: -522px;
  --badge-top: -78px;
}

.rank-emblem--platinum {
  --badge-left: -615px;
  --badge-top: -203px;
}

.rank-emblem--diamond {
  --badge-left: -724px;
  --badge-top: -123px;
}

.rank-emblem--master {
  --badge-left: -831px;
  --badge-top: -258px;
}

.rank-emblem--predator {
  --badge-left: -935px;
  --badge-top: -338px;
}

.rank-emblem--large {
  background-position: calc(var(--badge-left) + 13px) calc(var(--badge-top) + 14px);
}

.rank-emblem--profile {
  background-position: calc(var(--badge-left) + 19px) calc(var(--badge-top) + 20px);
}

@media (max-width: 640px) {
  .rank-emblem--large {
    background-position: calc(var(--badge-left) + 4px) calc(var(--badge-top) + 5px);
  }
}