/* Final segmented triangle with GD-Font Regular outlines. Keep proportional. */
.brand {
  flex-shrink: 0;
}

.brand .brand-logo {
  display: block;
  width: 260px;
  height: auto;
  max-width: 100%;
}

.site-footer .footer-brand .brand-logo {
  width: 320px;
}

@media (max-width: 820px) {
  .site-header .brand-logo {
    width: 204px;
  }
}

@media (max-width: 560px) {
  .site-header .brand-logo {
    width: 190px;
  }

  .site-footer .footer-brand .brand-logo {
    width: 290px;
  }
}

@media (max-width: 360px) {
  .site-header .brand-logo {
    width: 160px;
  }
}

/* Keep the logo, inquiry button and menu within narrow touch headers. */
@media (max-width: 820px) {
  .nav-shell { gap: 8px; }
  .site-header .brand { flex: 0 1 204px; min-width: 0; }
  .site-header .brand-logo { width: 100%; }
  .nav-action { flex-shrink: 0; margin: 0 0 0 auto; white-space: nowrap; }
  .menu-toggle { flex: 0 0 44px; }
  .mobile-menu-inner { overflow-y: auto; overscroll-behavior: contain; align-content: safe center; }
}
@media (max-width: 560px) {
  .site-header .brand { flex-basis: 190px; }
  .nav-action { padding-inline: 12px; font-size: 12px; }
}
@media (pointer: coarse) {
  .footer-links a, .footer-bottom a { display: inline-flex; align-items: center; min-height: 44px; }
}
