/* Official OC Gaming logo is the main hero artwork. */
.header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
}

.header nav {
  grid-column: 2;
  flex: none;
}

.header #account {
  grid-column: 3;
  justify-self: end;
}

.hero {
  background: transparent;
}

.hero::before {
  background: url(ocgaming-hero-logo.webp) no-repeat 77% 48%;
  background-size: min(43vw, 560px) auto;
  filter: drop-shadow(0 18px 44px rgba(0, 0, 0, 0.42));
}

.footer-brand {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  overflow: visible;
}

.footer-logo {
  display: block;
  width: 58px;
  height: 58px;
  object-fit: contain;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.28));
}

@media (max-width: 1100px) {
  .hero::before {
    background-position: 84% 48%;
    background-size: min(46vw, 500px) auto;
  }
}

@media (max-width: 760px) {
  .header {
    display: flex;
    justify-content: flex-end;
  }
  .hero::before {
    background-position: 88% 75%;
    background-size: 67vw auto;
    opacity: 0.62;
  }
  .footer-brand {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }
  .footer-logo {
    width: 50px;
    height: 50px;
  }
}