.brand-photo {
  width: 48px;
  height: 48px;
  display: block;
  object-fit: cover;
  object-position: 50% 35%;
  border: 4px solid #fff;
  border-radius: 17px;
  box-shadow: 0 5px 14px rgba(48, 43, 73, .17);
  transform: rotate(-3deg);
}

.site-header .brand:hover .brand-photo {
  transform: rotate(2deg) scale(1.04);
}

@media (max-width: 720px) {
  .brand-photo {
    width: 42px;
    height: 42px;
    border-width: 3px;
    border-radius: 14px;
  }
}