/* Avanza identity refresh — responsive light/dark logo system. */
.brand-mark,
.footer-mark,
.desk-brand > span,
.expansion-mark {
  overflow: hidden;
}

.logo-variant {
  display: block;
  width: 31px;
  height: 31px;
  object-fit: contain;
  filter: none !important;
}

.logo-dark { display: none; }

/* Default brand tile is dark, so the silver/white mark is used. */
.brand-mark .logo-variant { width: 31px; height: 31px; }
.brand-mark .logo-light { display: block; }
.brand-mark .logo-dark { display: none; }

/* When the floating header crosses a dark section, its tile turns white. */
.site-header.on-dark .brand-mark .logo-light { display: none; }
.site-header.on-dark .brand-mark .logo-dark { display: block; }

/* White logo tiles inside dark interfaces use the graphite mark. */
.footer-mark .logo-light,
.desk-brand > span .logo-light { display: none; }
.footer-mark .logo-dark,
.desk-brand > span .logo-dark { display: block; }

/* Glass expansion card sits on a dark field and uses the light mark. */
.expansion-mark .logo-light { display: block; }
.expansion-mark .logo-dark { display: none; }

.footer-mark .logo-variant { width: 30px; height: 30px; }
.desk-brand .logo-variant { width: 27px; height: 27px; }
.expansion-mark .logo-variant { width: 52px; height: 52px; }
.site-header.scrolled .brand-mark .logo-variant { width: 27px; height: 27px; }

@media (max-width: 430px) {
  .brand-mark .logo-variant { width: 29px; height: 29px; }
  .desk-brand .logo-variant { width: 25px; height: 25px; }
  .expansion-mark .logo-variant { width: 47px; height: 47px; }
}