/* Unified PSG emblem treatment. The shadow is intentionally very subtle. */
:root {
  --psg-emblem-shadow: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.14));
}

.public-brand img,
.login-logo,
.brand-logo img,
.topbar-logo img,
.logo-mark img {
  object-fit: contain;
  filter: var(--psg-emblem-shadow);
}

.public-brand img {
  width: 78px;
  height: 78px;
}

.login-entry-page .login-logo {
  width: 116px;
  max-width: 32%;
  height: 116px;
  max-height: 116px;
}

.logo-mark,
.brand-logo.logo-mark,
.topbar-logo.logo-mark {
  display: grid;
  place-items: center;
  overflow: visible;
  background: transparent;
}

.logo-mark img,
.brand-logo.logo-mark img,
.topbar-logo.logo-mark img {
  position: static;
  width: 88%;
  height: 88%;
  max-width: 100%;
  transform: none;
}

.brand-logo.logo-mark img {
  width: 92%;
  height: 92%;
}

.topbar-logo.logo-mark img {
  width: 86%;
  height: 86%;
}

.showcase-copy::before {
  background-image: url("../assets/psg-emblem.png");
  filter: var(--psg-emblem-shadow);
}

@media (max-width: 640px) {
  .public-brand img {
    width: 64px;
    height: 64px;
  }

  .login-entry-page .login-logo {
    width: 100px;
    height: 100px;
  }
}