.brand {
  --brand-h: 1.75rem;
  display: inline-block;
  flex-shrink: 0;
  height: var(--brand-h);
  aspect-ratio: 1516 / 383;
  background-color: currentColor;
  -webkit-mask: url(/static/assets/logo.svg) center / contain no-repeat;
          mask: url(/static/assets/logo.svg) center / contain no-repeat;
  box-sizing: content-box;
  text-decoration: none;
  font-size: 0;
}
.brand--mark {
  aspect-ratio: 1223 / 1404;
  -webkit-mask-image: url(/static/assets/mark.svg);
          mask-image: url(/static/assets/mark.svg);
}
.brand--sm { --brand-h: 1.25rem; }
.brand--md { --brand-h: 1.75rem; }
.brand--lg { --brand-h: 2.5rem; }
.brand--clear { margin: calc(var(--brand-h) / 2); }
.brand--light { color: #fff; }