/* Match Sailor's compact wordmark and Bootstrap container gutters. */
.header {
  padding: 15px 0;
}
.header > .container-fluid {
  padding-inline: 12px;
}
.header .logo {
  flex-shrink: 0;
  min-height: 33.6px;
}
.header .logo img {
  display: block;
  width: auto;
  height: 28px;
  max-height: none;
  margin: 0;
  /* Align the capital letters optically; the g extends below the baseline. */
  transform: translateY(3px);
}
.nav-dropdown-heading { display: flex; align-items: center; }
.navmenu button { border: 0; background: transparent; color: var(--nav-color); cursor: pointer; }
.navmenu .toggle-dropdown { padding: 8px; border-radius: 4px; }
.navmenu button:focus-visible, .navmenu a:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 2px; }
.navmenu .nav-dropdown-heading .active + button { color: var(--nav-hover-color); }
.navmenu .dropdown:focus-within > ul, .navmenu .dropdown > .dropdown-active { visibility: visible; opacity: 1; top: 100%; }
.software-panel, #intro, #advantages, #experience, #process, #faq { scroll-margin-top: 110px; }
@media (min-width: 1200px) {
  .navmenu > ul > li > a { padding: 18px 10px; font-size: var(--font-size-nav); }
  .navmenu .nav-dropdown-heading > a { padding: 18px 0 18px 10px; font-size: var(--font-size-nav); }
  .navmenu .dropdown ul { max-height: calc(100vh - 110px); overflow-y: auto; }
  .navmenu .dropdown ul li { min-width: 240px; }
  .navmenu > ul > li:nth-last-child(-n+3) > ul { left: auto; right: 0; }
}
@media (max-width: 1199px) {
  .header .navmenu { display: flex; align-items: center; }
  .navmenu .nav-dropdown-heading > a { flex: 1; }
  .navmenu .toggle-dropdown { margin-right: 20px; padding: 10px; background: color-mix(in srgb, var(--accent-color), transparent 90%); }
  .navmenu .dropdown > ul:not(.dropdown-active) { display: none; }
  .navmenu .dropdown > .dropdown-active { display: block; }
  .navmenu .mobile-nav-toggle { line-height: 1; padding: 0; width: 40px; height: 33.6px; }
}
