/*
 * One canonical Marten & Graner mark.
 * Never redraw the wordmark in page markup. Use this class and change only
 * the variant class; the geometry always comes from marten-graner-logo.svg.
 * The logo is a real image instead of a CSS mask so it also works in direct
 * file previews, CMS embeds, print/PDF renderers and older browsers.
 */
.mg-brand-logo {
  display: block;
  width: var(--mg-logo-width, 310px);
  max-width: 100%;
  height: auto;
  aspect-ratio: 348.6 / 61.740984;
  object-fit: contain;
  flex: 0 0 auto;
}

.mg-brand-logo--navy,
.mg-brand-logo--light,
.mg-brand-logo--gold { filter: none; }

.nav-logo .mg-brand-logo { --mg-logo-width: 292px; }
.home-hero-brand .mg-brand-logo { --mg-logo-width: 420px; }
footer .mg-brand-logo { --mg-logo-width: 300px; }

@media (max-width: 680px) {
  .mg-brand-logo { --mg-logo-width: min(72vw, 292px); }
}