/* BHJ — second-level navigation (header dropdown + mobile menu groups).
   Loaded site-wide right after main.css. Page stylesheets restyle
   ".hdr__nav a" (white text on dark heroes, larger sizes), so the dropdown
   links are styled with higher-specificity selectors of their own. */

/* The in-page section bars were removed (the header dropdown replaces them), but the page
   stylesheets still reserve room for them in scroll-margin-top. Land sections just under the header. */
body:is(.page-dc,.page-wwd,.page-deliver,.page-about) .section{scroll-margin-top:calc(var(--hdr) + 1.5rem)}

/* ---- desktop dropdown ----
   Frosted dark glass so it reads over both the photo heroes and the light header.
   At least as wide as its top-level item and pinned to that item's left edge;
   longer labels grow the panel to the right. */
.hdr__nav{align-self:stretch}
.hdr__item{position:relative;display:flex;align-items:center}
.hdr__drop{position:absolute;left:0;top:100%;z-index:95;min-width:100%;
  opacity:0;visibility:hidden;transform:translateY(.375rem);
  transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}
.hdr__item:not(.has-drop) .hdr__drop{display:none}
.hdr__item.is-open .hdr__drop{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .22s ease}
.hdr__panel{padding:.375rem 0;background:rgba(14,34,54,.62);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  border-top:2px solid #35b2d2;border-radius:0 0 .375rem .375rem;box-shadow:0 1.25rem 2.5rem -1.25rem rgba(6,18,30,.55)}

.hdr .hdr__drop a.navsub__a{position:relative;display:block;padding:.625rem 1.25rem .625rem .875rem;
  font-size:.875rem;line-height:1.4;font-weight:400;letter-spacing:.01em;text-transform:none;white-space:nowrap;
  color:rgba(255,255,255,.82);text-shadow:none;transition:background .2s,color .2s}
.hdr .hdr__drop a.navsub__a::after{content:"";position:absolute;left:0;top:.5rem;bottom:.5rem;right:auto;width:2px;height:auto;
  border-radius:0;background:#35b2d2;transform:scaleY(0);transition:transform .25s ease}
.hdr .hdr__drop a.navsub__a:hover,.hdr .hdr__drop a.navsub__a:focus-visible{background:rgba(255,255,255,.08);color:#fff;outline:none}
.hdr .hdr__drop a.navsub__a:hover::after,.hdr .hdr__drop a.navsub__a:focus-visible::after{transform:scaleY(1)}

@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .hdr__panel{background:rgba(14,34,54,.92)}
}

/* ---- mobile menu groups ---- */
.mmenu{overflow-y:auto;overscroll-behavior:contain}
.mmenu__row{display:flex;align-items:center;border-bottom:1px solid var(--line-2)}
.mmenu .mmenu__row>a{flex:1;border-bottom:0}
.mmenu__toggle{position:relative;flex:none;width:2.75rem;height:2.75rem;margin-right:-.75rem;padding:0;border:0;background:none;color:inherit;cursor:pointer}
.mmenu__toggle::before,.mmenu__toggle::after{content:"";position:absolute;left:50%;top:50%;width:.75rem;height:1.5px;
  background:currentColor;transform:translate(-50%,-50%);transition:transform .25s}
.mmenu__toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
.mmenu__group.is-open .mmenu__toggle::after{transform:translate(-50%,-50%) rotate(0deg)}
.mmenu__group:not(.has-sub) .mmenu__toggle{display:none}
.mmenu__sub{display:none;padding:.375rem 0 .75rem 1rem;border-bottom:1px solid var(--line-2)}
.mmenu__group.is-open .mmenu__sub{display:block}
.mmenu .mmenu__sub a.navsub__a{padding:.625rem 0;border:0;font-size:.875rem;font-weight:400;letter-spacing:0;text-transform:none;color:#54748a}
.mmenu .mmenu__sub a.navsub__a:hover{color:#0f3193}

/* Inner-page stylesheets swap the desktop nav for the burger up to 80rem, but main.css only
   enables the menu panel up to 1120px, so the burger opened nothing between 1121px and 1280px. */
@media (min-width:1121px) and (max-width:80rem){
  body:not(.home-premium):not(.page-dc) .mmenu{display:block}
}

@media (prefers-reduced-motion:reduce){
  .hdr__drop,.hdr__item.is-open .hdr__drop,.mmenu__toggle::before,.mmenu__toggle::after{transition:none}
}
