/* Supplied white lockup and shared Peterson palette. No image filters or edits. */
:root {
  --portal-primary: #aa3907;
  --portal-primary-strong: #7c2905;
  --portal-ink: #302722;
  --portal-muted: #6b5b51;
  --portal-paper: #faf6f1;
  --portal-soft: #f7eee7;
  --portal-line: #dfcfc3;
  --portal-control: #8a6d5d;
  --portal-on-primary: #fff1e3;
  --portal-highlight: #ffe1b8;
  --portal-focus: #5a2108;
}
a.brand-lockup {
  display: block;
  flex: 0 0 auto;
  width: 216px;
  max-width: 100%;
  padding: 12px;
  border-radius: 7px;
  background: var(--portal-primary);
  text-decoration: none;
}
.brand-lockup .brand-artwork {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 1428 / 747;
  overflow: hidden;
  margin: 0;
}
/* Alpha bounds are x=227..1640/y=501..1233 in the original 1875-square PNG.
   The CSS window leaves seven transparent pixels around every artwork edge. */
.brand-lockup .brand-artwork img {
  display: block;
  position: absolute;
  width: 131.302521%;
  height: auto;
  max-width: none;
  left: -15.406163%;
  top: -66.131191%;
}
.brand-lockup:focus-visible {
  outline: 3px solid var(--portal-focus);
  outline-offset: 3px;
  box-shadow: 0 0 0 3px #fff;
}
@media (max-width: 960px) {
  header > a.brand-lockup { width: 208px; margin-right: auto; }
}
@media (max-width: 380px) {
  header > a.brand-lockup { width: 176px; padding: 10px; }
  body > header { gap: 10px; padding-inline: 16px; }
}