/* ============================================
   响应式断点
   ============================================ */

/* 平板端 (768px - 1023px) */
@media (max-width: 1023px) {
  .home-layout {
    grid-template-columns: 1fr;
  }

  .sidebar {
    order: 2;
  }

  .article__layout {
    grid-template-columns: 1fr;
  }

  .toc {
    display: none;
  }

  .toc.active {
    display: block;
    position: fixed;
    top: var(--height-nav);
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    max-height: none;
    border-radius: 0;
    overflow-y: auto;
    background: var(--color-bg);
    padding: var(--space-6);
  }

  .toc-toggle {
    display: block;
  }

  .nav__links {
    display: none;
  }

  .nav__hamburger {
    display: flex;
  }

  .nav__mobile-menu {
    display: flex;
  }
}

/* 移动端 (< 768px) */
@media (max-width: 767px) {
  :root {
    --padding-page: var(--space-4);
  }

  .hero {
    padding: var(--space-12) var(--padding-page);
  }

  .hero__slogan,
  .hero__text {
    font-size: var(--text-3xl);
  }

  .post-card__title {
    font-size: var(--text-xl);
  }

  .article__title {
    font-size: var(--text-2xl);
  }

  .article__nav {
    grid-template-columns: 1fr;
  }

  .article__nav-item--next {
    text-align: left;
  }

  .back-to-top {
    bottom: var(--space-4);
    right: var(--space-4);
  }

  .terms-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .search-box {
    width: 95%;
  }

  /* 移动端点击区域最小 44px */
  .nav__btn,
  .nav__hamburger,
  .back-to-top,
  .toc-toggle {
    min-width: 44px;
    min-height: 44px;
  }
}