/* The approved square artwork stays intact; only its outer black margin is clipped. */
.brand--image {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  width: fit-content;
  line-height: 1;
  letter-spacing: 0;
  mix-blend-mode: screen;
}

.brand--image .brand-logo-frame {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 174px;
  aspect-ratio: 2.05;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  letter-spacing: 0;
}

.brand--image .brand-logo-frame img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 49.5%;
  transform: scale(1.1);
}

.footer-wordmark.brand--image,
.ep-footer .ep-brand.brand--image {
  margin: 0;
  font-size: inherit;
}

.footer-wordmark.brand--image .brand-logo-frame,
.ep-footer .brand--image .brand-logo-frame {
  width: clamp(224px, 22vw, 294px);
}

@media (max-width: 760px) {
  .header .brand--image .brand-logo-frame,
  .ep-header .brand--image .brand-logo-frame {
    width: 140px;
  }

  .footer-wordmark.brand--image .brand-logo-frame,
  .ep-footer .brand--image .brand-logo-frame {
    width: 214px;
  }
}

@media (max-width: 360px) {
  .header .brand--image .brand-logo-frame,
  .ep-header .brand--image .brand-logo-frame {
    width: 128px;
  }
}