/* A static wordmark, scaled to the same footprint as the navigation art. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.shop-mark {
  width: 168px;
  aspect-ratio: 4 / 3;
  display: flex;
  align-items: center;
  justify-content: center;
}
.shop-mark-image {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 2px 9px #b7a3d480);
}
@media (max-width: 1000px) {
  .shop-mark { width: 144px; }
}
@media (min-width: 701px) and (max-height: 790px) {
  .shop-mark { width: 156px; }
}
@media (min-width: 701px) and (max-height: 650px) {
  .shop-mark { width: 126px; }
}
@media (max-width: 700px) {
  .site-header { --header-item: min(96px, calc((100vw - 2 * var(--side) - 15px) / 4)); align-items: center; gap: 5px; padding-top: 14px; }
  .site-header .shop-mark { position: static; width: var(--header-item); height: auto; }
  .site-header .main-nav { gap: 5px; margin-left: auto; }
  .site-header .art-button { width: var(--header-item); }
}