@font-face {
  font-family: "Inter Tight";
  src: url("./fonts/inter-tight-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Isnt Apostrophe";
  src: url("./fonts/archivo-apostrophe.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  unicode-range: U+2019;
}
:root {
  --brand-navy: #1c2a42;
  --brand-coral: #fa6856;
  --brand-canvas: #e9ecf2;
  --brand-surface: #fff;
  --brand-muted: #526079;
  --brand-line: #c8d0dd;
  --brand-hover: #ff7b6b;
  --brand-white: #f8f9fc;
  --brand-type-scale: .82;
  --brand-primary-weight: 650;
  --brand-suffix-weight: 300;
  --brand-primary-tracking: .015em;
  --brand-suffix-tracking: .02em;
}
.brand {
  display: inline-flex;
  align-items: flex-end;
  flex-shrink: 0;
  gap: .24em;
  width: max-content;
  color: var(--brand-navy);
  font-family: "Inter Tight", sans-serif;
  font-size: var(--logo-size, 36px);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
.brand:hover { text-decoration: none; }
.brand::before { display: none; }
.brand--dark { color: var(--brand-white); }
.brand .brand-icon {
  display: block;
  flex: none;
  width: 1.05em;
  height: 1.05em;
  border-radius: 0;
  transform: translateY(-.065em);
}
.brand .brand-wordmark {
  display: inline-block;
  width: 3.4em;
  height: .84em;
  line-height: .84;
  overflow: visible;
}
.brand .brand-type {
  display: inline-flex;
  align-items: baseline;
  width: max-content;
  font-family: "Inter Tight", sans-serif;
  font-size: 1em;
  line-height: .84;
  font-style: normal;
  font-synthesis: none;
  font-kerning: normal;
  transform: scaleX(var(--brand-type-scale));
  transform-origin: left bottom;
}
.brand .brand-primary {
  font-family: inherit;
  font-weight: var(--brand-primary-weight);
  letter-spacing: var(--brand-primary-tracking);
}
.brand .brand-apostrophe {
  font-family: "Isnt Apostrophe", "Inter Tight", sans-serif;
  font-weight: 900;
  color: var(--brand-coral);
  margin-inline: -.015em;
}
.brand .brand-suffix {
  margin-left: .23em;
  font-family: inherit;
  font-size: 1em;
  font-weight: var(--brand-suffix-weight);
  letter-spacing: var(--brand-suffix-tracking);
  line-height: .84;
}
.site-footer .brand { font-size: var(--logo-size, 42px); }
@media (max-width: 380px) { .brand { --logo-size: 33px; } }