/* ==========================================================================
   劳动用工站 · 主航共用样式（2026-11-02）
   与 employ/index.html 的导航完全一致：白底 54px、双行 logo、灰色胶囊选中态、
   黑色胶囊按钮、免费工具悬停下拉、640px 以下收成全屏抽屉。
   变量就地定义在 .nav 上，避免与各页自己的 :root 主题变量相互覆盖。
   ========================================================================== */
.nav{
  --nv-blue:#0a1c36; --nv-blue-soft:#f3f5f9;
  --nv-ink:#1d1d1f; --nv-body:#333; --nv-muted:#71767e;
  --nv-line:#e8e8ed; --nv-line2:#d2d2d7;
  --nv-container:1200px; --nv-gutter:24px;
  --nv-pill:999px;
  height:54px;background:#fff;display:flex;align-items:center;justify-content:flex-start;
  padding-inline:max(var(--nv-gutter), calc((100% - var(--nv-container))/2 + var(--nv-gutter)));
  position:sticky;top:0;z-index:100;border-bottom:1px solid var(--nv-line);
  font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",-apple-system,
              BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.nav,.nav *{box-sizing:border-box}
.nav a{text-decoration:none;border-bottom:0}
.nav__brand{display:flex;flex-direction:column;gap:3px;line-height:1}
.nav__mark{color:var(--nv-ink);font-size:21px;font-weight:700;letter-spacing:.5px}
.nav__mark sup{font-size:9px;font-weight:400;color:var(--nv-muted);margin-left:1px}
.nav__sub{color:var(--nv-muted);font-size:11px;letter-spacing:.5px}
.nav__links{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav__link{color:var(--nv-body);font-size:13.5px;line-height:1;white-space:nowrap;padding:16px 12px;border-radius:10px}
.nav__link:hover{color:var(--nv-blue);background:transparent}
.nav__right{display:flex;align-items:center;gap:24px}
.nav__link--active{background:var(--nv-blue-soft);color:var(--nv-blue);font-weight:600}
.nav__link--active:hover{color:var(--nv-blue)}
.nav__btn{
  display:inline-flex;align-items:center;padding:7px 16px;line-height:1;
  border-radius:var(--nv-pill);background:var(--nv-ink);color:#fff;
  font-size:13px;font-weight:500;white-space:nowrap;margin-left:8px;
  transition:background .18s ease,color .18s ease;
}
.nav__btn:hover{background:#000;color:#fff}
.nav__item{position:relative}
.nav__link--drop{display:inline-flex;align-items:center;gap:5px}
.nav__link--drop .caret{width:12px;height:12px;transition:transform .2s ease;opacity:.55}
.nav__item:hover .nav__link--drop .caret{transform:rotate(180deg)}
.nav__dd{
  position:absolute;top:calc(100% + 12px);left:50%;
  transform:translateX(-50%) translateY(6px);
  z-index:120;min-width:300px;padding:8px;
  background:#fff;border:1px solid var(--nv-line);border-radius:14px;
  box-shadow:0 18px 44px rgba(10,28,54,.16);
  opacity:0;visibility:hidden;
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
}
.nav__dd::before{content:'';position:absolute;top:-12px;left:0;right:0;height:12px}
.nav__item:hover .nav__dd,
.nav__item:focus-within .nav__dd{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav__dd-item{display:block;padding:10px 12px;border-radius:10px}
.nav__dd-item:hover{background:var(--nv-blue-soft)}
.nav__dd-item b{display:block;font-size:14px;font-weight:600;color:var(--nv-ink);line-height:1.4}
.nav__dd-item small{display:block;font-size:12px;font-weight:400;color:var(--nv-muted);margin-top:2px;line-height:1.5}
.nav__toggle{
  display:none;width:40px;height:40px;padding:0;border:1px solid var(--nv-line2);
  border-radius:10px;background:#fff;cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;
}
.nav__toggle i{display:block;width:16px;height:2px;border-radius:2px;background:var(--nv-ink);transition:transform .2s ease,opacity .2s ease}
.nav__toggle.is-open i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__toggle.is-open i:nth-child(2){opacity:0}
.nav__toggle.is-open i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:640px){
  .nav{padding-inline:20px}
  .nav__toggle{display:inline-flex}
  .nav__links{
    display:none;position:absolute;top:54px;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:#fff;border-bottom:1px solid var(--nv-line);
    padding:16px 20px 24px;
    box-shadow:0 18px 44px rgba(10,28,54,.12);
    max-height:calc(100vh - 54px);overflow-y:auto;
  }
  .nav__links.is-open{display:flex}
  .nav__link{padding:13px 12px;font-size:15px;line-height:1.4}
  .nav__link--active{padding:13px 16px;text-align:left}
  .nav__item{position:static}
  .nav__link--drop{justify-content:space-between;width:100%}
  .nav__dd{
    position:static;transform:none;opacity:1;visibility:visible;
    min-width:0;border:0;box-shadow:none;padding:0 0 8px 16px;
    display:none;
  }
  .nav__item.is-open .nav__dd{display:block}
  .nav__dd-item{padding:10px 12px}
}

/* 2026-11-02 移动端右组贴右（同上，供 calc 两页使用） */
@media (max-width:640px){
  .nav .nav__right{margin-left:auto}
}
