:root {
  --site-logo-base-height-desktop: 52px;
  --site-logo-base-width-desktop: 220px;
  --site-logo-base-height-mobile: 38px;
  --site-logo-base-width-mobile: 160px;
  --site-logo-scale-desktop: 100;
  --site-logo-scale-mobile: 100;
}

a.logo.site-logo.has-brand-image,
.site-logo-link.site-logo.has-brand-image,
a.logo.site-brand-logo.has-brand-image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  text-decoration: none;
  font-size: 0 !important;
  color: transparent !important;
}

a.logo.has-brand-image .site-logo__text,
a.logo.has-brand-image::before,
a.logo.has-brand-image::after {
  display: none !important;
  content: none !important;
}

.site-logo__img {
  display: block;
  width: auto;
  height: auto;
  max-height: calc(var(--site-logo-base-height-desktop) * var(--site-logo-scale-desktop) / 100);
  max-width: calc(var(--site-logo-base-width-desktop) * var(--site-logo-scale-desktop) / 100);
  object-fit: contain;
}

.site-logo__img--mobile {
  display: none;
}

@media (max-width: 899px) {
  .site-logo__img--desktop {
    display: none;
  }

  .site-logo__img--mobile {
    display: block;
    max-height: calc(var(--site-logo-base-height-mobile) * var(--site-logo-scale-mobile) / 100);
    max-width: min(calc(var(--site-logo-base-width-mobile) * var(--site-logo-scale-mobile) / 100), 72vw);
  }

  header.topbar.site-topbar a.logo.has-brand-image {
    max-width: 100% !important;
    overflow: visible;
    text-overflow: unset;
    white-space: nowrap;
  }

  .site-logo__img:not(.site-logo__img--desktop):not(.site-logo__img--mobile) {
    max-height: calc(var(--site-logo-base-height-mobile) * var(--site-logo-scale-mobile) / 100);
    max-width: min(calc(var(--site-logo-base-width-mobile) * var(--site-logo-scale-mobile) / 100), 72vw);
  }
}

@media (min-width: 900px) {
  .site-logo__img--desktop {
    max-height: calc(var(--site-logo-base-height-desktop) * var(--site-logo-scale-desktop) / 100);
    max-width: calc(var(--site-logo-base-width-desktop) * var(--site-logo-scale-desktop) / 100);
  }

  body.has-header-nav a.logo.site-brand-logo.has-brand-image {
    max-width: calc(var(--site-logo-base-width-desktop) * var(--site-logo-scale-desktop) / 100);
    overflow: visible;
    text-overflow: unset;
  }
}

.site-logo__img:not(.site-logo__img--desktop):not(.site-logo__img--mobile) {
  display: block;
  max-height: calc(var(--site-logo-base-height-desktop) * var(--site-logo-scale-desktop) / 100);
}

a.logo.has-text-logo:not(.has-brand-image) b {
  color: var(--accent);
}