@import url('/assets/base.css');

/* Keep the complete broker-package logo visible and proportional. */
.brand {
  display: flex;
  align-items: center;
  flex: 0 0 325px;
  width: 325px;
  height: 92px;
  min-width: 0;
  overflow: visible;
}

.site-header { height: 112px; }

.brand img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
  object-position: left center;
}

.footer-brand {
  display: block;
  width: 290px;
  height: auto;
  max-width: 100%;
  max-height: none;
  object-fit: contain;
  object-position: left center;
}

@media (max-width: 1100px) {
  .nav-wrap { gap: 18px; }
  .site-header { height: 96px; }
  .brand { flex-basis: 270px; width: 270px; height: 76px; }
  .nav-links { gap: 14px; font-size: .74rem; }
  .nav-links a { padding-top: 35px; padding-bottom: 31px; }
}

@media (max-width: 950px) {
  .site-header { height: 96px; }
  .brand { flex-basis: 275px; width: 275px; height: 78px; }
  .nav-wrap { position: relative; }
  .nav-links { top: 96px; max-height: calc(100vh - 96px); overflow-y: auto; }
}

@media (max-width: 620px) {
  .site-header { height: 88px; }
  .brand { flex-basis: 235px; width: 235px; height: 70px; }
  .nav-links { top: 88px; max-height: calc(100vh - 88px); }
  .footer-brand { width: min(270px, 100%); }
}

@media (max-width: 380px) {
  .container { width: min(100% - 20px, 1180px); }
  .site-header { height: 82px; }
  .brand { flex-basis: 205px; width: 205px; height: 64px; }
  .nav-links { top: 82px; max-height: calc(100vh - 82px); }
  .mobile-toggle { padding: 6px; }
}