.desktop-brand-mark,
.login-brand-mark {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(50, 215, 199, 0.72) !important;
  border-radius: 50% !important;
  color: #8be7df !important;
  background: linear-gradient(145deg, rgba(50, 215, 199, 0.13), rgba(255, 255, 255, 0.02)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  font-family: "Arial Narrow", "Bahnschrift SemiCondensed", sans-serif;
  font-weight: 900;
  letter-spacing: -0.08em;
}

.desktop-brand-mark::after,
.login-brand-mark::after {
  position: absolute;
  width: 78%;
  height: 1px;
  background: #32d7c7;
  content: "";
  transform: rotate(-35deg);
  opacity: 0.72;
}

.desktop-brand-mark > span,
.login-brand-mark > span { position: relative; z-index: 1; }

.brand:has(.brand-logo-image) {
  display: inline-flex;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.brand-logo-image {
  display: block;
  width: clamp(148px, 12vw, 184px);
  height: auto;
  aspect-ratio: 2400 / 848;
  object-fit: contain;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.92)) drop-shadow(0 2px 5px rgba(2, 14, 25, 0.28));
}

.site-footer .brand:has(.brand-logo-image) {
  box-shadow: none;
}

.desktop-brand-mark {
  width: 45px !important;
  height: 45px !important;
  flex: 0 0 45px;
  font-size: 13px !important;
}

.login-brand-mark {
  width: 64px;
  height: 64px;
  font-size: 18px;
}

.login-brand-mark:has(img) {
  width: 184px;
  height: 65px;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none;
  overflow: visible;
}

.login-brand-mark:has(img)::after { display: none; }

.login-brand-mark img,
.desktop-brand-logo {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, 0.88)) drop-shadow(0 3px 7px rgba(2, 14, 25, 0.28));
}

.desktop-brand:has(.desktop-brand-logo) {
  justify-content: flex-start;
  min-height: 64px;
}

.desktop-brand-logo {
  width: 138px;
  height: 49px;
}

.hero-index span { color: rgba(139, 231, 223, 0.72); font-size: 11px; }

@media (max-width: 720px) {
  .login-brand-mark:has(img) { width: 138px; height: 49px; }
  .brand-logo-image { width: 138px; }
}