/* Hozak living-data brand mark — identical asset on every page. */
.brand {
  --hozak-brand-mark: url("/brand-motion-light.svg?v=20260819-1");
}

html[data-theme="dark"] .brand {
  --hozak-brand-mark: url("/brand-motion-dark.svg?v=20260819-1");
}

.brand::before {
  content: "";
  display: block;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  background: var(--hozak-brand-mark) center / contain no-repeat;
  opacity: 1;
  transform-origin: center;
  transition: transform 180ms ease;
}

/* The homepage still contains the original inline mark for compatibility.
   Hide it so all routes render the same shared asset above. */
.brand-motion {
  display: none !important;
}

.brand:hover::before,
.brand:focus-visible::before {
  transform: scale(1.035);
}

@media (max-width: 620px) {
  .brand::before {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .brand::before {
    transition: none;
    transform: none !important;
  }
}