/* BHJ — shared navigation. These scoped rules keep the homepage navigation
   consistent on inner pages, even when a page stylesheet loads afterwards. */

body .hdr.hdr,body .mmenu.mmenu{
  --hdr:84px;--wrap:100rem;--gut:clamp(1.375rem,4vw,4rem);
  --font:"Microsoft YaHei","微软雅黑","PingFang SC",Arial,sans-serif;
  --ink:#10243b;--grad:linear-gradient(100deg,#0F3193 0%,#2C6ABF 48%,#35B2D2 100%);
  font-family:var(--font);font-size:16px;font-weight:400;line-height:1.72;color:var(--ink);
}
body .hdr.hdr{
  position:fixed;inset:0 0 auto;background:transparent;border:0;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
body .hdr.hdr.is-stuck{
  background:rgba(33,49,62,.42);border:0;box-shadow:none;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
body .hdr .hdr__in{max-width:var(--wrap);height:var(--hdr);padding:0;gap:1.25rem}
body .hdr .hdr__logo img{content:url('../img/logo-white.png');height:2.625rem;width:auto}
body .hdr .hdr__nav{display:flex;gap:4rem}
body .hdr .hdr__nav a.hdr__top{
  font-size:1rem;font-weight:400;letter-spacing:normal;line-height:1.72;
  color:#fff;text-shadow:0 1px 5px #16344955;
}
body .hdr .hdr__nav a.hdr__top::after{height:2px;border-radius:2px;background:var(--grad)}
body .hdr .burger{display:none}
body .hdr .burger span,body .hdr .burger span::before,body .hdr .burger span::after{background:#fff}
body.is-menu .hdr .burger span{background:transparent}
body .mmenu.mmenu{
  top:var(--hdr);padding:34px var(--gut) 60px;display:none;visibility:hidden;
  transition:transform .45s var(--ease-o),visibility .45s;
}
body.is-menu .mmenu.mmenu{visibility:visible}

/* Text-only detail pages keep a readable backdrop behind the white navigation. */
body:not(.home-premium):not(:has(.hero__bg,.phero__media)) .hdr.hdr:not(.is-stuck){background:#183348}

@media(min-width:1121px) and (max-width:1700px){
  body .hdr .hdr__nav a.hdr__top{font-size:.9rem}
  body .hdr .hdr__nav{gap:3rem}
  body .hdr .hdr__logo img{height:2.25rem}
  body .hdr .hdr__in{gap:.75rem;padding:0 2%}
}
@media(min-width:1121px) and (max-width:1300px){
  body .hdr .hdr__nav a.hdr__top{font-size:.75rem}
  body .hdr .hdr__nav{gap:2.5rem}
}
@media(max-width:1180px){body .hdr .hdr__in{padding:0 2%}}
@media(max-width:1120px){
  body .hdr.hdr,body .mmenu.mmenu{--hdr:76px}
  body .hdr .hdr__nav,body .hdr .hdr__cta{display:none}
  body .hdr .burger{display:flex}
  body .mmenu.mmenu{display:block}
}
@media(max-width:740px){body .hdr.hdr,body .mmenu.mmenu{--hdr:70px;--gut:1.375rem;font-size:15px}}

/* 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}

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