/* ============================================================
   移动端样式（≤768px）
   所有移动端适配统一放在此文件，与 PC 端完全隔离
   最后修改：2026-04-09
   ============================================================ */

/* --- 汉堡菜单按钮（默认隐藏，移动端显示） --- */
.nav-hamburger {
  display: none;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background: none;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  transition: background var(--t-fast);
}
.nav-hamburger:hover {
  background: var(--c-bg-alt);
}
.nav-hamburger svg {
  display: block;
}

/* --- 移动端遮罩 --- */
.nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1040;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.nav-overlay.active {
  opacity: 1;
}

/* ============================================================
   响应式 — 移动端（≤768px）
   ============================================================ */
@media (max-width: 768px) {

  /* --- 导航栏：取消 z-index 创建的堆叠上下文 ---
     关键修复：让 header 变成 static 定位，z-index auto，
     这样内部 nav 的 fixed + z-index:1050 才能超越正文层 */
  .site-header,
  .navbar-sticky,
  header {
    position: static;
    z-index: auto;
    background: #fff;
    border-bottom: 1px solid var(--c-border);
    box-shadow: var(--shadow-xs);
  }

  /* --- 汉堡菜单按钮显示 --- */
  .nav-hamburger {
    display: flex;
  }

  /* --- 导航面板：fixed 覆盖，z-index 1050 确保在正文之上 --- */
  .nav-inner nav {
    position: fixed;
    top: 0;
    right: 0;
    width: 72vw;
    max-width: 300px;
    height: 100vh;
    background: #fff;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.1);
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1050;
    flex-direction: column;
    justify-content: flex-start;
    padding: 64px 24px 24px;
  }
  .nav-inner nav.open {
    transform: translateX(0);
  }
  .nav-inner nav .nav-links {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 4px;
  }
  .nav-inner nav .nav-links li {
    justify-content: flex-start;
  }
  .nav-inner nav .nav-links a {
    display: block;
    width: 100%;
    text-align: left;
    padding: 14px 16px;
    font-size: 0.95rem;
    border-radius: 10px;
    min-width: 0;
  }
  .nav-inner nav .nav-links .nav-cta {
    text-align: center;
    margin-top: 8px;
  }

  /* --- 遮罩显示 --- */
  .nav-overlay.active {
    display: block;
  }

  /* --- 文章正文 --- */
  .article-body h1 { font-size: 22px; }
  .article-body h2 { font-size: 19px; }
  .article-body h3 { font-size: 17px; }
  .article-body { padding: 0 4px; }
  .article-body table { font-size: 0.85rem; }
  .article-body th,
  .article-body td { padding: 8px 10px; }

  /* --- Hero --- */
  .hero h1,
  .hero-title { font-size: 1.75rem; letter-spacing: -0.5px; }
  .hero p,
  .hero-sub,
  .hero-subtitle { font-size: 0.88rem; }

  /* --- 页脚 --- */
  .footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
}