/* Load before styles.css: prevents logo FOUC (wide intrinsic image) and runs fade-in first paint. */
.logo-block {
  display: inline-block;
  max-width: min(400px, 90vw);
  vertical-align: middle;
}

.logo-block .logo-img {
  max-width: min(400px, 90vw);
  height: clamp(68px, 16vw, 104px);
  width: auto;
  object-fit: contain;
  display: block;
  opacity: 0;
  animation: logoFadeIn 0.45s ease 0.08s forwards;
}

@keyframes logoFadeIn {
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .logo-block .logo-img {
    animation: none !important;
    opacity: 1 !important;
  }
}