.logo {
  width: 222px;
  align-items: center;
}

/* Display the original hat artwork without its surrounding white margin. */
.brand-mark {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1948 / 516;
  overflow: hidden;
  border-radius: 13px;
}

.brand-mark img {
  position: absolute;
  width: 105.134%;
  max-width: none;
  height: auto;
  left: -2.567%;
  top: -22.868%;
}

.logo small {
  font-size: 10px;
  font-style: italic;
  font-weight: 800;
  letter-spacing: 2.2px;
  line-height: 1.4;
  margin-top: 8px;
  white-space: nowrap;
}

footer .logo small {
  color: white;
}

@media (max-width: 760px) {
  .header { gap: 14px; }
  .header .logo { width: 164px; }
  .header .brand-mark { border-radius: 10px; }
  .header .logo small { font-size: 8px; letter-spacing: 1.35px; }
}

@media (max-width: 360px) {
  .header { gap: 10px; }
  .header .logo { width: 145px; }
  .header .button.small { padding: 11px 9px; gap: 6px; font-size: 12px; }
}