/* =============================================
   91网 - 响应式样式文件
   移动端适配 | 视频教程移动端优化
   ============================================= */

/* 平板端 (max-width: 1024px) */
@media (max-width: 1024px) {
  .video-grid { grid-template-columns: repeat(2, 1fr); }
  .video-grid-full { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid { grid-template-columns: repeat(2, 1fr); }
  .headline-grid { grid-template-columns: 1fr; }
  .headline-main .headline-img-wrap img { height: 300px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
  .about-values { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
}

/* 中等屏幕 (max-width: 900px) */
@media (max-width: 900px) {
  .content-sidebar-wrap { grid-template-columns: 1fr; }
  .content-sidebar { display: none; }
  .industry-grid { grid-template-columns: 1fr; }
  .topic-grid { grid-template-columns: 1fr; }
  .topic-side { flex-direction: row; }
  .topic-card-small { flex: 1; }
  .contact-grid { grid-template-columns: 1fr; }
  .author-page-grid { grid-template-columns: 1fr; }
  .topic-page-grid { grid-template-columns: 1fr; }
}

/* 手机端 (max-width: 768px) */
@media (max-width: 768px) {
  /* 顶部通知栏 */
  .top-bar-right { display: none; }

  /* 头部 */
  .header-inner { flex-wrap: wrap; padding: 10px 0; gap: 10px; }
  .site-logo { order: 1; }
  .mobile-menu-btn { display: flex; order: 2; }
  .header-search { order: 3; width: 100%; max-width: 100%; }

  /* 导航 */
  .main-nav { display: none; }
  .main-nav.open { display: block; }
  .nav-list { flex-direction: column; gap: 0; }
  .nav-link { padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.1); }
  .nav-tags { display: none; }

  /* 视频网格 */
  .video-grid { grid-template-columns: 1fr; }
  .video-grid-full { grid-template-columns: 1fr; }

  /* 头条 */
  .headline-main .headline-img-wrap img { height: 200px; }
  .headline-main-title { font-size: 17px; }

  /* 新闻列表 */
  .news-item-link { flex-direction: column; }
  .news-item-img { width: 100%; }
  .news-item-img img { width: 100%; height: 180px; }

  /* 行业观察 */
  .industry-grid { grid-template-columns: 1fr; }

  /* 专题 */
  .topic-grid { grid-template-columns: 1fr; }
  .topic-side { flex-direction: column; }

  /* 评论 */
  .reviews-grid { grid-template-columns: 1fr; }

  /* 投稿Banner */
  .contribute-banner { flex-direction: column; text-align: center; }
  .contribute-actions { justify-content: center; }

  /* 关于我们 */
  .about-values { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  /* 文章列表 */
  .article-list-link { flex-direction: column; }
  .article-list-img { width: 100%; }
  .article-list-img img { height: 180px; }

  /* 作者页 */
  .author-page-card { flex-direction: column; align-items: center; text-align: center; }
  .author-page-avatar { width: 80px; height: 80px; }

  /* 页脚 */
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-bottom-right { justify-content: center; }

  /* 搜索页 */
  .search-page-form { flex-direction: column; }

  /* 视频弹窗 */
  .video-modal-box { width: 95%; }

  /* 页面标题 */
  .page-hero-title { font-size: 22px; }
  .section-title { font-size: 17px; }
}

/* 小屏手机 (max-width: 480px) */
@media (max-width: 480px) {
  .logo-num { font-size: 28px; }
  .logo-text { font-size: 22px; }
  .logo-tagline { display: none; }
  .about-values { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .contribute-actions { flex-direction: column; align-items: center; }
  .btn-contribute-primary,
  .btn-contribute-secondary { width: 100%; text-align: center; }
  .video-filter-bar { gap: 6px; }
  .filter-btn { padding: 5px 12px; font-size: 12px; }
}

/* 视频卡片移动端优化 */
@media (max-width: 768px) {
  .video-card { margin-bottom: 0; }
  .play-btn { width: 50px; height: 50px; }
  .play-btn svg { width: 36px; height: 36px; }
}

/* 打印样式 */
@media print {
  .site-header, .main-nav, .top-bar, .site-footer,
  .sidebar-widget, .video-modal { display: none !important; }
  .content-sidebar-wrap { grid-template-columns: 1fr; }
  body { background: #fff; }
}