/* nav-unify.css — unify the top navigation across the whole site.

   Every page now renders the homepage header (SrcHeader, components/src-header.jsx).
   That nav reuses generic class names (.contact-us-link, .nav-link-black, …) which
   the legacy "shell" page CSS (styles/sogody.css, styles/site.css) also styles for
   the old lighter navbar. A few of those legacy rules set properties the homepage
   nav CSS doesn't, so they leak through and break parity (e.g. the green
   "Contact Us" pill wraps to two lines because sogody.css gives it wide padding).

   These overrides are scoped under .header-wrapper (the SrcHeader root) so they
   only affect the nav — never the in-body CTAs that share the same class names —
   and use higher specificity than the flat legacy rules so the homepage's values
   win regardless of stylesheet load order. Load this file LAST on every page. */

.header-wrapper .contact-us-link {
  width: 120px;
  min-width: 120px;
  height: 45px;
  min-height: 45px;
  padding: 4px 6px 1px;                 /* homepage pill padding (not the legacy 24px) */
  font-size: 18px;
  font-family: "HelveticaNeueLT Pro 55 Roman", Arial, sans-serif;
  border-radius: 50px;
}

/* The homepage logo image is display:inline; sogody.css forces `img{display:block}`
   globally on shell pages, which nudges the logo a few px higher than the homepage.
   Restore inline display for the nav logo only so the header sits identically. */
.header-wrapper .navbar-brand img { display: inline; }

/* The homepage nav links have no flex gap — the space between "What we do" and its
   caret comes solely from .mini-arrow-container's 10px left margin. sogody.css adds
   `.nav-link-black { gap: 7px }`, widening that distance to 17px. Match the homepage. */
.header-wrapper .nav-link-black { gap: normal; }

/* sogody.css styles .navbar-inner-div as the DESKTOP pill (grey background, 50px
   radius, align-items:center, inner padding + gap). On shell pages that rule
   leaks into the mobile drill-in menu, collapsing the nav column to content
   width (items look centered and narrow) and greying its panel. The homepage
   (which never loads sogody.css) renders a plain, full-width column. Restore that
   below 1024px; the desktop pill (>=1024px) is left untouched. */
@media (max-width: 1023px) {
  .header-wrapper .navbar-inner-div {
    align-items: normal;
    background-color: transparent;
    padding: 0;
    border-radius: 0;
    gap: normal;
  }
}
