/* Shared navigation follows the adjacent signature's typography and soft glass edge. */
.site-header{--nav-highlight:#1B4CDA;--nav-text-color:var(--site-heading,#534A43);--nav-text-size:17px;--nav-text-weight:550;--nav-text-spacing:.035em;background:linear-gradient(120deg,rgba(255,255,255,.91),rgba(247,248,250,.86) 60%,rgba(253,254,255,.9));border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 #fff,inset 1px 0 0 #ffffff73,inset -1px 0 0 #ffffff73,inset 0 -1px 0 #dfe6ed59,0 5px 20px -12px #48576b24;backdrop-filter:blur(22px) saturate(110%);-webkit-backdrop-filter:blur(22px) saturate(110%)}
.site-header .nav-shell{max-width:1440px;min-height:76px;height:auto;padding:0 32px;display:flex;flex-wrap:nowrap;gap:24px;align-items:center;justify-content:space-between;position:relative}
.site-header .signature{color:var(--nav-text-color);flex-shrink:0;font-size:29px}
.site-header .signature span{color:var(--nav-text-color)}
.site-header .signature .signature-name{display:none!important}
.site-header .signature .signature-names{display:inline-block;flex-shrink:0;margin-left:12px;color:var(--nav-text-color);font-size:17px;font-weight:550;line-height:1.5;letter-spacing:.035em;white-space:nowrap}
.site-header #site-navigation{display:flex;align-items:center;justify-content:flex-end;gap:clamp(30px,3vw,52px);width:auto;font-size:15px;line-height:1.5}
.site-header #site-navigation>a,.site-header .nav-work-toggle{font:inherit;font-weight:650;letter-spacing:.16em;color:var(--nav-text-color);white-space:nowrap;text-decoration:none;padding:12px 0;transition:none}
.site-header #site-navigation>a:hover,.site-header .nav-work-toggle:hover{color:var(--nav-highlight)}
.site-header #site-navigation>.nav-contact{position:static;background:none;border:0;border-radius:0;padding:12px 0;color:var(--nav-text-color)}
.site-header #site-navigation>.nav-contact:hover{background:none;color:var(--nav-highlight)}
.site-header .nav-work-menu{background:rgba(250,250,251,.97);border-color:#e5e6e8;box-shadow:0 16px 42px #42485012}
.site-header .nav-work-menu a{color:var(--nav-text-color);font-weight:600;font-size:15px;letter-spacing:.16em}
.site-header .nav-work-menu a:hover{color:var(--nav-highlight);background:transparent}
.site-header .nav-work-menu a span{color:var(--nav-text-color)}
.site-header .nav-work[hidden]{display:none}
.site-header .site-menu-toggle{display:none;background:transparent;color:var(--nav-text-color);padding:10px 0;font-size:15px;font-weight:650;align-items:center;gap:10px}
.site-menu-icon{display:grid;gap:5px;width:20px}
.site-menu-icon:before,.site-menu-icon:after{content:"";display:block;height:1.5px;background:currentColor;width:20px}
@media(max-width:1100px) and (min-width:901px){.site-header .nav-shell{padding-inline:26px;gap:18px}.site-header #site-navigation{gap:28px;font-size:14px}}
@media(max-width:900px){
 .site-header .signature .signature-names{font-size:16px}
 .site-header .nav-shell{min-height:68px;padding:0 24px;flex-wrap:nowrap;gap:20px}
 .site-header .site-menu-toggle{display:inline-flex}
 .site-header #site-navigation{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;width:100%;padding:16px 24px 24px;max-height:calc(100dvh - 68px);overflow-y:auto;background:rgba(247,247,248,.98);border-bottom:1px solid #e5e6e8;box-shadow:0 18px 32px #42485012;gap:10px;flex-direction:column;justify-content:flex-start;align-items:stretch;font-size:16px}
 .site-header #site-navigation[data-open=true]{display:flex}
 .site-header #site-navigation>a,.site-header #site-navigation>.nav-contact,.site-header .nav-work-toggle{display:flex;flex-shrink:0;width:100%;padding:13px 8px;min-height:48px;text-align:left;border-bottom:1px solid #cbd5db70;justify-content:space-between}
 .site-header .nav-work{width:100%}
 .site-header .nav-work-menu{position:static;margin:4px 0 8px;min-width:0;box-shadow:none;border:0;background:#f0f1f2;border-radius:10px;padding:7px}
 .site-header .nav-work-menu a{font-size:15px;padding:12px}
}
@media(max-width:380px){
 .site-header .nav-shell{padding-inline:18px;gap:12px}
 .site-header .signature{font-size:25px}
 .site-header .signature .signature-names{margin-left:8px;font-size:14.5px;letter-spacing:.02em}
}
@media(prefers-reduced-motion:reduce){.site-header #site-navigation>a,.site-header .nav-work-toggle{transition:none}}

/* Keep the Chinese names, all navigation levels, and the phone toggle in one type system. */
.site-header .signature .signature-names,
.site-header #site-navigation,
.site-header #site-navigation > a,
.site-header #site-navigation .nav-work-toggle,
.site-header #site-navigation .nav-work-menu a,
.site-header .site-menu-toggle {
  font-family: var(--site-latin-family, "ML Site Montserrat", "HarmonyOS Sans SC", "HarmonyOS Sans", sans-serif);
  font-size: var(--nav-text-size);
  font-weight: var(--nav-text-weight);
  line-height: 1.5;
  letter-spacing: var(--nav-text-spacing);
  color: var(--nav-text-color);
}
.site-header #site-navigation > a[aria-current],
.site-header #site-navigation .nav-work-toggle[aria-current],
.site-header #site-navigation .nav-work-menu a[aria-current] {
  color: var(--nav-text-color);
}
.site-header #site-navigation > a:focus-visible,
.site-header #site-navigation .nav-work-toggle:focus-visible,
.site-header #site-navigation .nav-work-menu a:focus-visible,
.site-header .site-menu-toggle:focus-visible {
  outline: 2px solid var(--site-focus, #98928e);
  outline-offset: 4px;
}
@media(min-width:1101px) {
  .site-header #site-navigation { gap: clamp(22px, 2.4vw, 38px); }
}
@media(max-width:1100px) and (min-width:901px) {
  .site-header { --nav-text-size: 15px; }
  .site-header #site-navigation { gap: 20px; }
}
@media(max-width:900px) {
  .site-header { --nav-text-size: 16px; }
}
@media(max-width:380px) {
  .site-header { --nav-text-size: 14.5px; --nav-text-spacing: .02em; }
}

/* Only pointer hover uses electric blue; current and keyboard-focus text stay G31. */
.site-header #site-navigation > a,
.site-header #site-navigation .nav-work-toggle,
.site-header #site-navigation .nav-work-menu a,
.site-header #site-navigation > a:is(:hover,:focus-visible,:active),
.site-header #site-navigation .nav-work-toggle:is(:hover,:focus-visible,:active),
.site-header #site-navigation .nav-work-menu a:is(:hover,:focus-visible,:active) {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}
/* Resolve hover directly on every clickable item, including flattened phone links. */
body .site-header #site-navigation :is(a, .nav-work-toggle),
body .site-header .site-menu-toggle,
body .site-header .signature,
body .site-header .signature span {
  transition: none;
}
body .site-header #site-navigation :is(a, .nav-work-toggle) {
  color: var(--nav-text-color, #534A43);
}
body .site-header #site-navigation :is(a, .nav-work-toggle):hover,
body .site-header .site-menu-toggle:hover {
  color: #1B4CDA;
}
body .site-header #site-navigation :is(a, .nav-work-toggle):hover :is(span, small) {
  color: inherit;
}
body .site-header .signature:hover {
  --nav-text-color: #1B4CDA;
}