/* ============================================================
   统一导航栏标准版 - 最终修正方案
   ============================================================ */

/* 1. 全局字体强制设置 - 确保所有页面文字默认继承 Inter */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  margin: 0;
  padding-top: 80px; /* 补偿 fixed 导航栏占据的空间 */
}

/* 2. 导航栏主容器 */
.navbar {
  width: 100%;
  height: 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 33px;
  background-color: rgba(0, 0, 0, 0.15); /* 稍微深一点的透明黑，防止文字重叠干扰 */
  position: fixed; /* 强制置顶，不随滚动消失 */
  top: 0;
  left: 0;
  z-index: 999999 !important;
  box-sizing: border-box;
}

/* 3. 核心修正：强制左侧姓名和右侧链接在所有状态下为白色 */
/* 增加 .nav-left-link 确保左侧姓名不会变蓝 */
.nav-left-link, 
.nav-link,
.nav-left-link:visited, 
.nav-link:visited,
.nav-left-link:link,
.nav-link:link {
  color: #ffffff !important; 
  text-decoration: none !important;
  transition: color 0.3s ease;
}

/* 4. 左侧姓名组排版 */
.nav-left-link {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
  font-family: 'Inter', sans-serif; /* 强制再次指定字体 */
}

/* 5. 右侧链接组布局 */
.nav-right {
  display: flex;
  gap: 33px;
}

/* 6. 统一字体规格 */
.name-line, .nav-link {
  font-family: 'Inter', sans-serif; /* 确保 Inter 字体生效 */
  font-size: 22px; 
  font-weight: 600; 
  text-transform: uppercase;
  letter-spacing: 0.09em;
  white-space: nowrap;
}

/* 7. 唯一悬停效果：变红 */
.nav-link:hover,
.nav-left-link:hover .name-line {
  color: rgb(255, 6, 0) !important; 
}

/* 8. 移动端强制适配 */
@media (max-width: 768px) {
  body {
    padding-top: 60px; /* 手机端导航栏变窄，补偿也要变小 */
  }
  .navbar {
    height: 60px;
    padding: 0 11px;
  }
  .nav-right {
    gap: 13px; /* 4个选项时，间距不能太大，防止重叠 */
  }
  .name-line, .nav-link {
    font-size: 16px; /* 字体稍微调小一点，确保4个词放得下 */
    letter-spacing: 0.01em;
  }
}


/* ===== Mobile menu button (default hidden on desktop) ===== */
.nav-burger{
  display: none;
  width: 42px;
  height: 42px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 8px;
  z-index: 1000001; /* 比 navbar 还高一点点也行 */
}

.nav-burger span{
  display: block;
  height: 2px;
  width: 100%;
  background: #fff;
  margin: 6px 0;
  border-radius: 2px;
}

/* ===== Fullscreen overlay (hidden by default) ===== */
.nav-overlay{
  position: fixed;
  inset: 0;
  z-index: 1000000; /* 覆盖所有内容，包括左侧logo */
  display: none;     /* 默认不显示 */
}

/* 背景：右黑(100%) → 左透明(0%) */
.nav-overlay::before{
  content:"";
  position: absolute;
  inset: 0;
  background: linear-gradient(to left,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,0) 100%
  );
}

/* 右侧菜单容器：从右往左滑入 */
.nav-overlay-panel{
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: min(78vw, 420px);
  padding: 110px 28px 40px 28px; /* 顶部留出空间，避免挡导航 */
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-end; /* 右对齐 */
  transform: translateX(100%);
  transition: transform .35s ease;
}

/* 链接样式 */
.nav-overlay-link{
  color: #fff;
  text-decoration: none;
  font-family: 'Inter', sans-serif;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  text-align: right;
  white-space: nowrap;
}

/* hover 仍然变红（可选） */
.nav-overlay-link:hover{
  color: rgb(255, 6, 0);
}

/* 打开状态 */
.nav-open .nav-overlay{
  display: block;
}

.nav-overlay-panel{
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: min(78vw, 420px);
  padding: 110px 28px 40px 28px;

  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 22px;

  transform: translateX(100%);
}
.nav-open .nav-overlay-panel{
  transform: translateX(0);
  transition: transform 0.36s cubic-bezier(.22,.61,.36,1);
}

.nav-overlay{
  opacity: 0;
}

.nav-open .nav-overlay{
  opacity: 1;
  transition: opacity 0.25s ease;
}

/* 打开菜单时禁止页面滚动 */
.nav-open body{
  overflow: hidden;
}

/* ===== Mobile: hide right links, show burger ===== */
@media (max-width: 768px){
  .nav-right{
    display: none;
  }
  .nav-burger{
    display: block;
  }
}