/* ==============================================
   撑伞人 — 移动端全局响应式补丁
   断点: <480px 手机 / 480-768px 平板 / >768px 桌面
   ============================================== */

/* ─── 手机端 (<480px) ─── */
@media (max-width: 480px) {
  /* Hero */
  .hero-content { padding: 60px 16px 40px; text-align: center; }
  .hero-title { font-size: 26px !important; }
  .hero-subtitle { font-size: 14px !important; }
  .hero-tags { gap: 6px; flex-wrap: wrap; justify-content: center; }
  .hero-tag { font-size: 11px; padding: 4px 10px; }
  .hero-actions { flex-direction: column; gap: 10px; align-items: center; }
  .hero-actions .btn { width: 100%; max-width: 280px; text-align: center; }

  /* 三栏价值卡片 → 单列堆叠 */
  .values-grid { grid-template-columns: 1fr !important; gap: 16px; padding: 0 12px; }
  .value-card { padding: 20px 16px; }

  /* 8宫格 → 2列 */
  .feature-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px; padding: 0 8px; }
  .feature-card { padding: 16px 10px; }
  .feature-card h4 { font-size: 14px; }

  /* 信息流横向滑动 → 单列 */
  .feed-scroll { overflow-x: visible; }
  .feed-scroll > * { min-width: auto !important; width: 100%; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr !important; gap: 24px; text-align: center; padding: 0 16px; }
  .footer-links { flex-direction: column; gap: 8px; }

  /* 通用 */
  section { padding: 40px 12px !important; }
  h2 { font-size: 20px !important; }
  h3 { font-size: 16px !important; }

  /* 导航 */
  .nav { padding: 0 10px; }
  .nav-brand img { height: 36px; }

  /* 登录页 */
  .auth-card { padding: 24px 16px; margin: 0 12px; }

  /* 弹窗 */
  .post-modal, .hw-modal { width: 95vw !important; max-width: 95vw !important; padding: 16px; border-radius: 16px; }

  /* 表格 */
  table { font-size: 11px; }
  th, td { padding: 6px 4px; }

  /* 树洞三卡 → 单列 */
  .treehole-cards { flex-direction: column !important; gap: 12px; }
  .treehole-card { width: 100% !important; }
}

/* ─── 平板 (480-768px) ─── */
@media (min-width: 481px) and (max-width: 768px) {
  .hero-title { font-size: 32px !important; }
  .values-grid { grid-template-columns: 1fr !important; gap: 16px; }
  .feature-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .footer-grid { grid-template-columns: repeat(2, 1fr) !important; }
  section { padding: 50px 24px !important; }
  .treehole-cards { flex-direction: column; }
}

/* ─── 桌面 (>768px) 保持原有 ─── */

/* ─── 通用移动增强 ─── */
@media (max-width: 768px) {
  /* 图片不超出屏幕 */
  img { max-width: 100%; height: auto; }

  /* 侧边栏隐藏 */
  .sidebar, .side-nav, aside { display: none !important; }

  /* 双栏布局 → 单栏 */
  .two-col, .split-layout { grid-template-columns: 1fr !important; }

  /* 输入框全宽 */
  input[type="text"], input[type="password"], input[type="email"],
  textarea, select { max-width: 100% !important; box-sizing: border-box; }

  /* 按钮不溢出 */
  button, .btn { white-space: normal; }

  /* 隐藏大屏专属 */
  .desktop-only { display: none !important; }
}

/* ─── 桌面专属元素 ─── */
@media (min-width: 769px) {
  .mobile-only { display: none !important; }
}