.site-header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 253, 251, .92);
}

.site-header__bar {
  display: flex;
  min-height: 4.75rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.site-brand {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  font-family: inherit;
  font-size: 1.05rem;
  font-weight: 650;
  letter-spacing: -.02em;
  text-decoration: none;
}

.site-brand strong { color: var(--plum); }

.site-brand__mark {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  place-items: center;
  border: 1px solid rgba(116, 81, 200, .18);
  border-radius: .75rem;
  color: var(--plum);
  background: #fff;
  box-shadow: 0 8px 20px rgba(69, 48, 104, .08);
}

.site-brand__mark svg {
  width: 1.2rem;
  height: 1.2rem;
}

.site-back-link {
  color: var(--muted);
  font-family: inherit;
  font-size: .9rem;
  font-weight: 680;
  line-height: 1.3;
  text-decoration: none;
}

.site-back-link:hover { color: var(--plum-deep); }

@media (max-width: 38rem) {
  .site-header__bar { min-height: 4.25rem; }
  .site-brand { gap: .6rem; font-size: .95rem; }
  .site-brand__mark { width: 2rem; height: 2rem; flex-basis: 2rem; border-radius: .65rem; }
  .site-brand__mark svg { width: 1.08rem; height: 1.08rem; }
  .site-back-link { font-size: .84rem; }
}