/*
  Passives Direct: shared header and navigation, visual redesign
  ------------------------------------------------------------------
  Visual changes only. Markup, links, destinations, the search form
  (action, method, name, required, label), the menu toggle, the Company
  dropdown and navigation.js behaviour are all unchanged.

  Every selector starts with `.site-header.two-row-header`, so nothing
  outside the header can be affected: inventory, product, RFQ and account
  page content and layout are untouched. The selector is deliberately more
  specific than the legacy inline <style> blocks and site.css header rules,
  so it wins regardless of load order. Once this file is in the shared
  template, those legacy header blocks can be deleted.

  Load site-wide, after site.css.
*/

.site-header.two-row-header {
  --hd-navy: #0a2d39;
  --hd-navy-2: #0e4052;
  --hd-teal: #00a0b6;
  --hd-teal-dark: #007f94;
  --hd-teal-deep: #006c80;
  --hd-aqua: #7fe3ee;
  --hd-ink: #12333f;
  --hd-line: #dce7ea;
  --hd-ease: cubic-bezier(.2, .7, .25, 1);
  position: relative;
  z-index: 30;
  background: #fff;
  border-bottom: 0;
  box-shadow: 0 1px 0 var(--hd-line), 0 16px 30px -24px #0a2d39a6;
  overflow-x: clip;
}

/* Header and nav rows share the page container's edges */
.site-header.two-row-header .header-inner,
.site-header.two-row-header .navigation-row .container {
  width: calc(100% - 80px);
  max-width: 1280px;
  margin-inline: auto;
}

@media (max-width: 1050px) {
  .site-header.two-row-header .header-inner,
  .site-header.two-row-header .navigation-row .container { width: calc(100% - 48px); }
}

@media (max-width: 760px) {
  .site-header.two-row-header .header-inner,
  .site-header.two-row-header .navigation-row .container { width: calc(100% - 36px); }
}

/* ---------------------------------------------------------------
   Logo
   --------------------------------------------------------------- */
.site-header.two-row-header .brand { overflow: visible; }

.site-header.two-row-header .brand-lockup {
  display: block;
  width: 310px;
  max-width: 100%;
  height: auto;
  transform: none;
}

/* The one-time "glint" that swept across the logo on page load (site.css:
   `.site-header .brand:after`, brand-glint) is switched off here. Left in place
   it also spilled over the search bar once the link became overflow: visible. */
.site-header.two-row-header .brand::after {
  content: none;
  display: none;
  animation: none;
}

.site-header.two-row-header .brand strong span { animation: none; }

.site-header.two-row-header .brand:focus-visible {
  outline: 3px solid var(--hd-teal-dark);
  outline-offset: 4px;
  border-radius: 4px;
}

/* ---------------------------------------------------------------
   Search: wide, outlined in brand teal, large type
   --------------------------------------------------------------- */
.site-header.two-row-header .header-search {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 780px;
  height: 58px;
  margin: 0;
  border: 2px solid var(--hd-teal);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 28px -16px #007f94a6;
  overflow: hidden;
  transition: box-shadow .25s ease, border-color .25s ease;
}

.site-header.two-row-header .header-search:focus-within {
  outline: 3px solid #00a0b64d;
  outline-offset: 3px;
  border-color: var(--hd-teal-dark);
  box-shadow: 0 14px 30px -14px #007f94d9;
}

.site-header.two-row-header .header-search svg {
  flex: none;
  align-self: center;
  width: 22px;
  height: 22px;
  margin: 0 4px 0 18px;
  stroke: var(--hd-teal-dark);
  stroke-width: 2;
}

.site-header.two-row-header .header-search input {
  flex: 1;
  min-width: 0;
  width: 100%;
  padding: 0 16px 0 10px;
  border: 0;
  background: transparent;
  color: var(--hd-ink);
  font-size: 16px;
  outline: none;
}

.site-header.two-row-header .header-search input::placeholder { color: #6b858d; opacity: 1; }

.site-header.two-row-header .header-search button {
  flex: none;
  align-self: stretch;
  padding: 0 34px;
  border: 0;
  background: var(--hd-teal);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.1px;
  cursor: pointer;
  transition: background-color .2s ease;
}

.site-header.two-row-header .header-search button:hover { background: var(--hd-teal-dark); }

.site-header.two-row-header .header-search button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -6px;
}

/* ---------------------------------------------------------------
   Quick links (Advanced Search, Upload BOM, My Account, RFQ Cart)
   --------------------------------------------------------------- */
.site-header.two-row-header .header-link-divider { display: none; }

.site-header.two-row-header .header-quick-links .advanced-search-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: auto;
  margin: 0;
  color: #d3ecf1;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .5px;
  text-decoration: none;
  transition: color .2s ease, background-color .2s ease;
}

.site-header.two-row-header .header-quick-links .advanced-search-link::before {
  content: "";
  flex: none;
  width: 16px;
  height: 16px;
  background: currentColor;
  -webkit-mask: var(--hd-icon) center / contain no-repeat;
  mask: var(--hd-icon) center / contain no-repeat;
}

.site-header.two-row-header .header-quick-links .advanced-search-link[href*="advanced=1"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 6h9m4 0h5M3 12h3m4 0h11M3 18h11m4 0h3%22/%3E%3Ccircle cx=%2214%22 cy=%226%22 r=%222%22/%3E%3Ccircle cx=%228%22 cy=%2212%22 r=%222%22/%3E%3Ccircle cx=%2216%22 cy=%2218%22 r=%222%22/%3E%3C/svg%3E"); }
.site-header.two-row-header .header-quick-links .advanced-search-link[href*="bom-upload"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 16V4M7 9l5-5 5 5M4 15v4a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-4%22/%3E%3C/svg%3E"); }
.site-header.two-row-header .header-quick-links .advanced-search-link[href*="account.php"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%228%22 r=%224%22/%3E%3Cpath d=%22M4 21c0-4 3.6-7 8-7s8 3 8 7%22/%3E%3C/svg%3E"); }
.site-header.two-row-header .header-quick-links .advanced-search-link[href*="rfq.php"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.9%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%229%22 cy=%2220%22 r=%221.4%22/%3E%3Ccircle cx=%2217%22 cy=%2220%22 r=%221.4%22/%3E%3Cpath d=%22M2.5 3.5h3l2.2 11h10.6l2-8H6.2%22/%3E%3C/svg%3E"); }

.site-header.two-row-header .header-quick-links .advanced-search-link:hover { text-decoration: none; }

/* ---------------------------------------------------------------
   Navigation row
   --------------------------------------------------------------- */
.site-header.two-row-header .navigation-row {
  position: relative;
  background: #fff;
  border-top: 1px solid #e2ecee;
  border-bottom: 0;
}

/* Thin brand rail along the bottom edge of the navigation row */
.site-header.two-row-header .navigation-row::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #00a0b6 0%, #7fe3ee 38%, #cfe6ea 72%, #cfe6ea00 100%);
  opacity: .55;
  pointer-events: none;
}

.site-header.two-row-header #main-nav a,
.site-header.two-row-header #main-nav .inventory-dropdown > summary {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 18px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--hd-ink);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  transition: color .2s ease;
}

/* Marker: a wire that draws in from the left, ending in a circuit node.
   Echoes the logo's component mark and the divider on the page. */
.site-header.two-row-header #main-nav > a::after,
.site-header.two-row-header #main-nav .inventory-dropdown > summary::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 0;
  height: 3px;
  background: var(--hd-teal);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .35s var(--hd-ease);
}

.site-header.two-row-header #main-nav > a::before,
.site-header.two-row-header #main-nav .inventory-dropdown > summary::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 14px;
  bottom: -4px;
  width: 11px;
  height: 11px;
  box-sizing: border-box;
  margin-left: -5px;
  border: 2.5px solid var(--hd-teal);
  border-radius: 50%;
  background: #fff;
  transform: scale(0);
  transition: transform .3s var(--hd-ease) .05s;
}

.site-header.two-row-header #main-nav > a:hover,
.site-header.two-row-header #main-nav > a:focus-visible,
.site-header.two-row-header #main-nav > a[aria-current="page"],
.site-header.two-row-header #main-nav .inventory-dropdown > summary:hover,
.site-header.two-row-header #main-nav .inventory-dropdown[open] > summary {
  color: var(--hd-teal-dark);
  background: transparent;
}

.site-header.two-row-header #main-nav > a:hover::after,
.site-header.two-row-header #main-nav > a:focus-visible::after,
.site-header.two-row-header #main-nav > a[aria-current="page"]::after,
.site-header.two-row-header #main-nav .inventory-dropdown > summary:hover::after,
.site-header.two-row-header #main-nav .inventory-dropdown[open] > summary::after { transform: scaleX(1); }

.site-header.two-row-header #main-nav > a:hover::before,
.site-header.two-row-header #main-nav > a:focus-visible::before,
.site-header.two-row-header #main-nav > a[aria-current="page"]::before,
.site-header.two-row-header #main-nav .inventory-dropdown > summary:hover::before,
.site-header.two-row-header #main-nav .inventory-dropdown[open] > summary::before { transform: scale(1); }

.site-header.two-row-header #main-nav > a:focus-visible,
.site-header.two-row-header #main-nav .inventory-dropdown > summary:focus-visible {
  outline: 3px solid var(--hd-teal-dark);
  outline-offset: -4px;
}

.site-header.two-row-header #main-nav .inventory-dropdown > summary svg {
  width: 12px;
  height: 12px;
  stroke-width: 2;
}

/* Company dropdown panel: rounded, with a notch pointing at the trigger and
   an icon tile on each item (same tile language as the cards on the page). */
.site-header.two-row-header .inventory-submenu {
  width: 344px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #1f6074;
  border-radius: 12px;
  background: linear-gradient(160deg, var(--hd-navy) 0%, var(--hd-navy-2) 100%);
  box-shadow: 0 28px 50px -18px #04161de6, 0 0 0 1px #00000014;
}

/* Notch under the trigger */
.site-header.two-row-header .inventory-submenu::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 30px;
  width: 12px;
  height: 12px;
  border-top: 1px solid #1f6074;
  border-left: 1px solid #1f6074;
  background: var(--hd-navy);
  transform: rotate(45deg);
}

/* Invisible bridge so the pointer can cross the gap without closing the menu */
.site-header.two-row-header .inventory-submenu::after {
  content: "";
  position: absolute;
  top: -14px;
  left: 0;
  right: 0;
  height: 14px;
}

.site-header.two-row-header #main-nav .inventory-submenu a {
  --hd-tile: linear-gradient(145deg, #14566a, #0d3a4b);
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  color: #f1fafc;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .1px;
  line-height: 1.3;
  text-transform: none;
  white-space: normal;
  transform: none;
  transition: background-color .2s ease, color .2s ease;
}

.site-header.two-row-header #main-nav .inventory-submenu a + a { border-top: 0; }

/* Icon tile */
.site-header.two-row-header #main-nav .inventory-submenu a::before {
  content: "";
  position: static;
  flex: none;
  width: 38px;
  height: 38px;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: var(--hd-icon) center / 20px 20px no-repeat, var(--hd-tile);
  box-shadow: inset 0 0 0 1px #7fe3ee33;
  transform: none;
}

.site-header.two-row-header #main-nav .inventory-submenu a[href*="about."] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%237fe3ee%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 21V5l8-3 8 3v16M3 21h18M9 9h2M13 9h2M9 13h2M13 13h2M10.5 21v-4h3v4%22/%3E%3C/svg%3E"); }
.site-header.two-row-header #main-nav .inventory-submenu a[href*="corporate-responsibility"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%237fe3ee%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 4C9 4 5 10 5 15a5 5 0 0 0 5 5c6 0 10-6 10-16z%22/%3E%3Cpath d=%22M5 20c2-5 5-8 9-10%22/%3E%3C/svg%3E"); }
.site-header.two-row-header #main-nav .inventory-submenu a[href*="employment"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%237fe3ee%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%227%22 width=%2218%22 height=%2213%22 rx=%222%22/%3E%3Cpath d=%22M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2M3 13h18%22/%3E%3C/svg%3E"); }
.site-header.two-row-header #main-nav .inventory-submenu a[href*="privacy"] { --hd-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%237fe3ee%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z%22/%3E%3Cpath d=%22M9 12l2 2 4-4%22/%3E%3C/svg%3E"); }

/* Arrow that slides in on hover */
.site-header.two-row-header #main-nav .inventory-submenu a::after {
  content: "";
  display: block;
  position: static;
  flex: none;
  width: 16px;
  height: 16px;
  margin-left: auto;
  background: var(--hd-aqua);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .2s ease, transform .25s var(--hd-ease);
}

.site-header.two-row-header #main-nav .inventory-submenu a:hover,
.site-header.two-row-header #main-nav .inventory-submenu a:focus-visible {
  --hd-tile: linear-gradient(145deg, #00a0b6, #007f94);
  background: #ffffff1a;
  color: #fff;
}

.site-header.two-row-header #main-nav .inventory-submenu a:hover::after,
.site-header.two-row-header #main-nav .inventory-submenu a:focus-visible::after {
  opacity: 1;
  transform: translateX(0);
}

.site-header.two-row-header #main-nav .inventory-submenu a:focus-visible {
  outline: 3px solid var(--hd-aqua);
  outline-offset: -3px;
}

@media (prefers-reduced-motion: no-preference) {
  .site-header.two-row-header .inventory-dropdown[open] > .inventory-submenu {
    animation: hd-menu-in .24s var(--hd-ease) both;
  }

  @keyframes hd-menu-in {
    from { opacity: 0; translate: 0 -8px; }
    to { opacity: 1; translate: 0 0; }
  }
}

/* Current page inside the Company dropdown: highlight the item and the trigger */
.site-header.two-row-header #main-nav .inventory-submenu a[aria-current="page"] {
  --hd-tile: linear-gradient(145deg, #00a0b6, #007f94);
  background: #ffffff14;
  color: #fff;
}

.site-header.two-row-header #main-nav .inventory-dropdown:has(.inventory-submenu a[aria-current="page"]) > summary { color: var(--hd-teal-dark); }

.site-header.two-row-header #main-nav .inventory-dropdown:has(.inventory-submenu a[aria-current="page"]) > summary::after { transform: scaleX(1); }

.site-header.two-row-header #main-nav .inventory-dropdown:has(.inventory-submenu a[aria-current="page"]) > summary::before { transform: scale(1); }

/* Desktop: logo beside search, with utility links directly underneath. */
@media (min-width: 1000px) {
  .site-header.two-row-header .header-inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 56px;
    row-gap: 6px;
    align-items: center;
    min-height: 0;
    padding: 18px 0 12px;
  }
  .site-header.two-row-header .header-search-group { display: contents; }
  .site-header.two-row-header .menu-toggle { display: none; }
  .site-header.two-row-header .header-quick-links {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin: 0;
  }
  .site-header.two-row-header .header-quick-links .advanced-search-link {
    padding: 4px 0;
    border: 0;
    color: #007d8d;
    font-size: 12px;
  }
  .site-header.two-row-header .header-quick-links .advanced-search-link::before { display: block; color: currentColor; }
  .site-header.two-row-header .header-link-divider { display: inline; color: #009eac; }
  .site-header.two-row-header .header-quick-links .advanced-search-link:hover { color: #124452; text-decoration: underline; }
  .site-header.two-row-header .header-quick-links .advanced-search-link:focus-visible {
    outline: 2px solid #008da2;
    outline-offset: 3px;
  }

  .site-header.two-row-header .brand {
    grid-column: 1;
    grid-row: 1 / 3;
    margin: 0;
  }

  .site-header.two-row-header .header-search {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    margin: 0;
  }

  .site-header.two-row-header #main-nav {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    gap: 6px;
    width: calc(100% + 28px);
    margin: 0 -14px;
    padding: 0;
    border: 0;
    background: transparent;
  }
}

/* Contact becomes the one action in the nav, pushed to the right edge */
@media (min-width: 1000px) {
  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]) {
    align-self: center;
    margin: 0 14px 0 auto;
    padding: 12px 22px 12px 24px;
    border-radius: 6px;
    background: var(--hd-teal-dark);
    color: #fff;
    letter-spacing: 1.2px;
    box-shadow: 0 10px 22px -12px #006c80cc;
    transition: background-color .2s ease, transform .25s var(--hd-ease), box-shadow .25s ease;
  }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"])::before { display: none; }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"])::after {
    position: static;
    flex: none;
    width: 15px;
    height: 15px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E") center / contain no-repeat;
    transform: none;
    transition: transform .25s var(--hd-ease);
  }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):hover,
  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):focus-visible,
  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"])[aria-current="page"] {
    background: var(--hd-navy);
    color: #fff;
    box-shadow: 0 14px 26px -12px #0a2d39d9;
  }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):hover::after,
  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):focus-visible::after { transform: translateX(3px); }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):focus-visible {
    outline: 3px solid var(--hd-teal-dark);
    outline-offset: 3px;
  }
}

/* ===============================================================
   COMPACT (under 1000px): logo + menu button, big search, link chips
   =============================================================== */
@media (max-width: 999px) {
  .site-header.two-row-header .header-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    min-height: 0;
    padding: 14px 0 0;
  }

  .site-header.two-row-header .brand { flex: 1 1 auto; min-width: 0; margin: 0; }
  .site-header.two-row-header .brand-lockup { width: 260px; }

  .site-header.two-row-header .menu-toggle {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: none;
    width: 48px;
    height: 48px;
    margin: 0;
    padding: 0;
    border: 1.5px solid #b9d9df;
    border-radius: 8px;
    background: #fff;
    color: var(--hd-teal-dark);
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  }

  .site-header.two-row-header .menu-toggle:hover,
  .site-header.two-row-header .menu-toggle[aria-expanded="true"] {
    background: var(--hd-teal-dark);
    border-color: var(--hd-teal-dark);
    color: #fff;
  }

  .site-header.two-row-header .menu-toggle:focus-visible {
    outline: 3px solid var(--hd-teal-dark);
    outline-offset: 3px;
  }

  .site-header.two-row-header .header-search-group {
    order: 3;
    flex: 1 1 100%;
    max-width: none;
    margin: 0;
  }

  .site-header.two-row-header .header-search { height: 54px; max-width: none; }
  .site-header.two-row-header .header-search svg { margin-left: 14px; width: 20px; height: 20px; }
  .site-header.two-row-header .header-search input { font-size: 16px; padding-left: 8px; }
  .site-header.two-row-header .header-search button { padding: 0 22px; }

  .site-header.two-row-header .header-quick-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 4px 0 0;
    border-bottom: 1px solid #dce7ea;
    background: #f0f6f8;
    /* Extend only the bar's paint to the viewport edges, retaining icon alignment. */
    box-shadow: 0 0 0 100vmax #f0f6f8;
    clip-path: inset(0 -100vmax);

  }

  .site-header.two-row-header .header-quick-links .advanced-search-link {
    justify-content: center;
    min-height: 44px;
    padding: 0 8px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #0b5566;
    font-size: 13px;
    letter-spacing: .2px;
  }

  .site-header.two-row-header .header-quick-links .advanced-search-link:hover,
  .site-header.two-row-header .header-quick-links .advanced-search-link:focus-visible {
    background: var(--hd-teal-dark);
    border-color: var(--hd-teal-dark);
    color: #fff;
  }

  .site-header.two-row-header .header-quick-links .advanced-search-link:focus-visible {
    outline: 3px solid var(--hd-teal-dark);
    outline-offset: 2px;
  }

  .site-header.two-row-header .navigation-row { border-top: 0; }

  .site-header.two-row-header #main-nav.is-open {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 4px 0 12px;
    margin: 0;
    border: 0;
    border-top: 1px solid #e2ecee;
    background: transparent;
  }

  .site-header.two-row-header #main-nav > a,
  .site-header.two-row-header #main-nav .inventory-dropdown > summary {
    justify-content: space-between;
    padding: 16px 2px;
    border-bottom: 1px solid #e7eff1;
    font-size: 14px;
  }

  .site-header.two-row-header #main-nav > a::before,
  .site-header.two-row-header #main-nav .inventory-dropdown > summary::before { display: none; }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]) {
    justify-content: center;
    margin-top: 16px;
    padding: 16px;
    border: 0;
    border-radius: 8px;
    background: var(--hd-teal-dark);
    color: #fff;
  }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"])::after { display: none; }

  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):hover,
  .site-header.two-row-header #main-nav > a:is([href$="contact.html"], [href$="contact.php"]):focus-visible { background: var(--hd-navy); color: #fff; }

  .site-header.two-row-header #main-nav > a::after,
  .site-header.two-row-header #main-nav .inventory-dropdown > summary::after { left: 0; right: auto; width: 4px; height: 100%; top: 0; bottom: auto; border-radius: 0 3px 3px 0; transform: scaleY(0); }

  .site-header.two-row-header #main-nav > a:hover::after,
  .site-header.two-row-header #main-nav > a:focus-visible::after,
  .site-header.two-row-header #main-nav > a[aria-current="page"]::after,
  .site-header.two-row-header #main-nav .inventory-dropdown[open] > summary::after { transform: scaleY(1); }

  .site-header.two-row-header #main-nav > a[aria-current="page"],
  .site-header.two-row-header #main-nav .inventory-dropdown[open] > summary { padding-left: 14px; }

  .site-header.two-row-header .inventory-submenu {
    width: auto;
    margin: 6px 0 12px;
    padding: 6px;
    border-radius: 10px;
    box-shadow: none;
  }

  .site-header.two-row-header .inventory-submenu::before,
  .site-header.two-row-header .inventory-submenu::after { display: none; }

  .site-header.two-row-header #main-nav .inventory-submenu a { padding: 9px 10px; }
  .site-header.two-row-header #main-nav .inventory-submenu a::after { display: none; }
}

@media (max-width: 400px) {
  .site-header.two-row-header .brand-lockup { width: 220px; }
  .site-header.two-row-header .header-search button { padding: 0 16px; letter-spacing: .6px; }
}

@media (prefers-reduced-motion: reduce) {
  .site-header.two-row-header *,
  .site-header.two-row-header *::before,
  .site-header.two-row-header *::after { transition: none !important; }
}

/* Mobile utility bar: keep names available to assistive technology. */
@media (max-width: 999px) {
  .site-header.two-row-header .header-quick-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
  .site-header.two-row-header .header-quick-links .advanced-search-link::before {
    width: 22px;
    height: 22px;
  }
  .site-header.two-row-header .header-quick-links [data-header-rfq-count] {
    font-size: 12px;
    font-weight: 700;
  }
}

/* Mobile search meets the utility bar without a decorative shadow. */
@media (max-width: 999px) {
  .site-header.two-row-header .header-search,
  .site-header.two-row-header .header-search:focus-within {
    box-shadow: none;
  }
}

/* Contact dropdown and mobile call/email shortcuts. */
.site-header.two-row-header .header-quick-links .mobile-contact-link{display:none}
@media(min-width:1000px){.site-header.two-row-header .contact-dropdown .inventory-submenu{left:auto;right:0}.site-header.two-row-header .contact-dropdown .inventory-submenu::before{left:auto;right:30px}}
@media(max-width:999px){.site-header.two-row-header .header-quick-links{grid-template-columns:repeat(4,minmax(0,1fr))}.site-header.two-row-header .header-quick-links .mobile-contact-link{display:flex}}
.site-header.two-row-header .contact-dropdown .inventory-submenu a[href^="tel:"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%237fe3ee%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M22%2016.9v3a2%202%200%200%201-2.2%202%2019.8%2019.8%200%200%201-8.6-3.1%2019.5%2019.5%200%200%201-6-6%2019.8%2019.8%200%200%201-3.1-8.7A2%202%200%200%201%204.1%202h3a2%202%200%200%201%202%201.7c.1%201%20.4%202%20.7%202.9a2%202%200%200%201-.5%202.1L8%2010a16%2016%200%200%200%206%206l1.3-1.3a2%202%200%200%201%202.1-.5c.9.3%201.9.6%202.9.7a2%202%200%200%201%201.7%202z%22%2F%3E%3C%2Fsvg%3E")}
.site-header.two-row-header .header-quick-links .mobile-contact-link[href^="tel:"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M22%2016.9v3a2%202%200%200%201-2.2%202%2019.8%2019.8%200%200%201-8.6-3.1%2019.5%2019.5%200%200%201-6-6%2019.8%2019.8%200%200%201-3.1-8.7A2%202%200%200%201%204.1%202h3a2%202%200%200%201%202%201.7c.1%201%20.4%202%20.7%202.9a2%202%200%200%201-.5%202.1L8%2010a16%2016%200%200%200%206%206l1.3-1.3a2%202%200%200%201%202.1-.5c.9.3%201.9.6%202.9.7a2%202%200%200%201%201.7%202z%22%2F%3E%3C%2Fsvg%3E")}
.site-header.two-row-header .contact-dropdown .inventory-submenu a[href^="mailto:"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%237fe3ee%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22m3%206%209%207%209-7%22%2F%3E%3C%2Fsvg%3E")}
.site-header.two-row-header .header-quick-links .mobile-contact-link[href^="mailto:"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22m3%206%209%207%209-7%22%2F%3E%3C%2Fsvg%3E")}
.site-header.two-row-header .contact-dropdown .inventory-submenu a[href^="contact.php"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%237fe3ee%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2011.5a8.4%208.4%200%200%201-.9%203.8A8.5%208.5%200%200%201%2012.5%2020a8.4%208.4%200%200%201-3.8-.9L3%2021l1.9-5.7a8.4%208.4%200%200%201-.9-3.8A8.5%208.5%200%200%201%208.7%203.9a8.4%208.4%200%200%201%203.8-.9H13a8.5%208.5%200%200%201%208%208v.5z%22%2F%3E%3C%2Fsvg%3E")}
.site-header.two-row-header .header-quick-links .mobile-contact-link[href^="contact.php"]{--hd-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2011.5a8.4%208.4%200%200%201-.9%203.8A8.5%208.5%200%200%201%2012.5%2020a8.4%208.4%200%200%201-3.8-.9L3%2021l1.9-5.7a8.4%208.4%200%200%201-.9-3.8A8.5%208.5%200%200%201%208.7%203.9a8.4%208.4%200%200%201%203.8-.9H13a8.5%208.5%200%200%201%208%208v.5z%22%2F%3E%3C%2Fsvg%3E")}

/* Keep RFQ cart last in the mobile utility bar. */
@media(max-width:999px){.site-header.two-row-header .header-quick-links a[href="rfq.php"]{order:1}}