.brand-orb-logo {
  position: fixed;
  z-index: 48;
  display: none;
  pointer-events: none;
  contain: layout style paint;
}

.brand-orb-logo,
.brand-orb-logo * {
  box-sizing: border-box;
}

.brand-orb-logo__shield {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(139, 239, 222, 0.26);
  background:
    radial-gradient(circle at 50% 45%, rgba(13, 33, 37, 0.98), rgba(2, 9, 13, 0.96) 62%),
    rgba(0, 0, 0, 0.86);
  box-shadow:
    0 0 18px rgba(78, 230, 210, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -14px 24px rgba(0, 0, 0, 0.38);
}

.brand-orb-logo__orb {
  position: relative;
  width: var(--brand-orb-size);
  height: var(--brand-orb-size);
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 22%, rgba(232, 255, 250, 0.95) 0 5%, transparent 13%),
    radial-gradient(circle at 32% 28%, rgba(105, 255, 226, 0.72), transparent 26%),
    radial-gradient(circle at 66% 72%, rgba(89, 66, 214, 0.56), transparent 35%),
    radial-gradient(circle at 48% 46%, rgba(20, 160, 154, 0.68), rgba(5, 26, 35, 0.96) 58%, rgba(1, 6, 11, 1) 100%);
  box-shadow:
    0 0 18px rgba(78, 255, 224, 0.24),
    0 0 42px rgba(44, 113, 255, 0.14),
    inset 6px 9px 15px rgba(185, 255, 244, 0.22),
    inset -10px -14px 24px rgba(2, 5, 20, 0.86),
    inset 0 0 0 1px rgba(184, 255, 244, 0.16);
}

.brand-orb-logo__orb::before,
.brand-orb-logo__orb::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.brand-orb-logo__orb::before {
  inset: 9%;
  border: 1px solid rgba(178, 255, 240, 0.18);
  border-left-color: rgba(126, 255, 232, 0.46);
  border-top-color: rgba(235, 255, 252, 0.5);
  filter: blur(0.15px);
}

.brand-orb-logo__orb::after {
  left: 26%;
  top: 16%;
  width: 36%;
  height: 18%;
  background: linear-gradient(95deg, rgba(255, 255, 255, 0.9), rgba(130, 255, 238, 0.1));
  filter: blur(1px);
  transform: rotate(-16deg);
}

.brand-orb-logo--top {
  --brand-orb-size: 38px;
  top: 43px;
  right: clamp(104px, 8.8vw, 136px);
  width: 78px;
  height: 42px;
}

.brand-orb-logo--top .brand-orb-logo__shield {
  width: 100%;
  height: 100%;
  border-radius: 999px;
}

.brand-orb-logo--bottom {
  --brand-orb-size: 64px;
  left: 50%;
  bottom: 32px;
  width: 92px;
  height: 92px;
  transform: translateX(-50%);
}

.brand-orb-logo--bottom .brand-orb-logo__shield {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

@media (max-width: 760px) {
  .brand-orb-logo--top {
    --brand-orb-size: 32px;
    top: 24px;
    right: clamp(82px, 22vw, 112px);
    width: 64px;
    height: 36px;
  }

  .brand-orb-logo--bottom {
    --brand-orb-size: 52px;
    width: 76px;
    height: 76px;
    bottom: 24px;
  }
}