/* Frame the untouched artwork around its visible wordmark and sage baseline. */
.header .logo.draft-brand {
  display: block;
  flex: 0 0 auto;
  width: 252px;
  min-width: 0;
  max-width: none !important;
  line-height: 1;
}
.brand-logo-frame {
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.header .logo.draft-brand .brand-logo-image,
.site-footer .brand-footer-logo .brand-logo-image {
  display: block;
  position: absolute;
  width: var(--brand-image-width);
  max-width: none;
  height: auto;
  left: var(--brand-image-left);
  top: var(--brand-image-top);
  object-fit: contain;
  transform: none;
  transition: none;
}
.site-footer .brand-footer-logo {
  display: block;
  width: 300px;
  max-width: 100%;
  margin: 0 0 14px;
  line-height: 1;
}
@media (min-width: 801px) and (max-width: 1100px) {
  .header .logo.draft-brand { width: 215px; }
}
@media (max-width: 800px) {
  .header .logo.draft-brand { width: 220px; max-width: calc(100% - 65px) !important; }
}
@media (max-width: 380px) {
  .header .logo.draft-brand { width: 205px; }
}