.brand {
  flex-wrap: wrap;
}
.kbsp-brand-lockup {
  display: inline-flex;
  align-items: flex-end;
  gap: 0;
  color: #1f2937;
  text-decoration: none;
}
.kbsp-brand-logo {
  width: auto;
  height: 26px;
  object-fit: contain;
}
.kbsp-brand-er {
  position: relative;
  top: 4px;
  display: inline-block;
  padding: 0 2px;
  transform: rotate(-30deg);
  color: #e11d48;
  font: 400 18px "Segoe Print", "Comic Sans MS", "Bradley Hand", "DejaVu Sans", sans-serif;
}
.kbsp-brand-title {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  font: 700 23px/1 "Comic Sans MS", "DejaVu Sans", "Trebuchet MS", sans-serif;
  letter-spacing: .6px;
}
.kbsp-brand-title span {
  color: var(--c, #1f2937);
  text-shadow: 0 1px 0 #fff, 0 -1px 0 #fff, 1px 0 0 #fff, -1px 0 0 #fff;
}
.kbsp-page-badge {
  align-self: center;
  margin-left: 10px;
  padding: 3px 7px;
  border: 1px solid #d6cbbf;
  border-radius: 999px;
  background: #fff;
  color: #475569;
  font: 700 9px "DejaVu Sans", sans-serif;
  letter-spacing: .3px;
  text-transform: uppercase;
}
@media (max-width: 620px) {
  .kbsp-brand-logo { height: 22px; }
  .kbsp-brand-er { font-size: 14px; }
  .kbsp-brand-title { font-size: 18px; }
  .kbsp-page-badge { margin-left: 6px; }
}