.brand-emblem {
  overflow: hidden;
  padding: 0;
  clip-path: none;
  border-color: #3274d9;
  background: #000;
  border-radius: 50%;
}

.brand-emblem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 12%;
  transform: scale(1.48);
  transform-origin: center 23%;
}

.logo-stage {
  display: grid;
  place-items: center;
  isolation: isolate;
  background: #000;
  overflow: hidden;
}

.logo-halo {
  position: absolute;
  width: 80%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(42, 114, 224, .24), rgba(130, 71, 255, .08) 43%, transparent 70%);
  filter: blur(12px);
  z-index: -1;
}

.hero-logo {
  display: block;
  width: min(92%, 520px);
  height: auto;
  filter: drop-shadow(0 24px 44px rgba(0, 0, 0, .55));
}

.footer-logo {
  display: block;
  width: 150px;
}

.footer-logo img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 850px) {
  .logo-stage { height: min(82vw, 560px); }
}

@media (max-width: 520px) {
  .brand-emblem { width: 38px; height: 38px; }
  .hero-logo { width: 96%; }
  .footer-logo { width: 180px; }
}