.site-header .brand,
.footer .brand {
  gap: 10px;
  letter-spacing: -.025em;
}

.site-header .brand-mark,
.footer .brand-mark {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border: 0;
  border-radius: 0;
  display: block;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.brand-mark svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
  filter: drop-shadow(0 7px 13px rgba(57,119,255,.24));
}

.brand-mark .brand-gem,
.brand-mark .brand-arrow {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .28s ease;
}

.brand:hover .brand-gem { transform: rotate(12deg) scale(1.05); }
.brand:hover .brand-arrow { transform: translateX(2px); }

.site-header .brand-name,
.footer .brand-name {
  display: flex;
  align-items: baseline;
  line-height: 1;
  white-space: nowrap;
  font-size: .91rem;
  font-weight: 780;
  letter-spacing: -.04em;
  text-transform: none;
}

.site-header .brand-name strong,
.footer .brand-name strong {
  color: #fff;
  font: inherit;
}

.site-header .brand-name b,
.footer .brand-name b {
  margin-left: 3px;
  color: var(--agency-cyan);
  font: inherit;
}

.footer .brand-mark {
  width: 45px;
  height: 45px;
  flex-basis: 45px;
}

.footer .brand-name { font-size: 1rem; }

@media (max-width: 520px) {
  .site-header .brand-mark { width: 37px; height: 37px; flex-basis: 37px; }
  .site-header .brand-name { font-size: .82rem; }
}

@media (prefers-reduced-motion: reduce) {
  .brand-mark .brand-gem,
  .brand-mark .brand-arrow { transition: none; }
}