/* ============================================================
   responsive.css — 响应式断点（平板 / 手机）
   ============================================================ */

/* ---------- 平板及以下：栅格收敛 ---------- */
@media (max-width: 1100px) {
  /* 头部实色化（移动端无透明需求） */
  .site-header { background: #fff; color: var(--text); box-shadow: 0 2px 18px rgba(0,0,0,.08); }
  .site-header .logo .logo-white { display: none; }
  .site-header .logo .logo-dark { display: block; }
  .site-header .tool-btn img { filter: brightness(0); }

  .product-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .sustain-grid { grid-template-columns: repeat(2, 1fr); }

  .about-inner { flex-direction: column; gap: 32px; text-align: left; }
  .about-left { max-width: 100%; }
  .about-right { grid-template-columns: repeat(2, 150px); justify-content: center; }

  .footer-top { flex-direction: column; gap: 40px; }
  .footer-right { justify-content: flex-start; gap: 40px; }

  /* 右侧浮窗在窄屏上收起为更小尺寸 */
  .side-float { right: 8px; }
  .side-item { width: 52px; padding: 10px 0; font-size: 11px; }
  .side-item img { width: 18px; height: auto; }
  .home-pagination { right: 70px; }
}

/* ---------- 手机端 ---------- */
@media (max-width: 767px) {
  /* 首屏改用移动端图片，隐藏 PC 图 */
  .hero-pc { display: none; }
  .hero-mobile { display: block; }
  .scroll-hint { bottom: 24px; }

  /* 首屏标题：移动端 banner 图自带文案，隐藏新增文字避免重叠 */
  .hero-copy { display: none; }

  .products-inner { padding: 60px 0; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .pc-img img { height: 150px; }
  /* 「高性能服务器」双图卡：手机端只留正面图，高度跟随单图节奏 */
  .pc-img--wide img { height: 150px; max-width: 100%; }
  .pc-txt { padding: 16px 16px 18px; }
  .pc-txt h3 { font-size: 16px; }
  .pc-txt p { min-height: 0; margin: 6px 0 12px; }

  .section-head h2,
  .sustain-inner > h2,
  .career-head h2,
  .news-head h2,
  .about-left h2 { font-size: 26px; }

  /* 关于华煜：移动端收紧字号与间距，保证整屏可读、不被截断 */
  .about-left h2 { margin-bottom: 16px; }
  .about-left p { font-size: 14px; line-height: 1.75; }
  .about-lead { padding-bottom: 16px; }
  .about-item { margin-top: 18px; }
  .about-item h3 { font-size: 15px; margin-bottom: 6px; }
  .about-left .about-tail { margin-top: 20px; }

  .sustain-inner > h2 { margin-bottom: 28px; }

  .sustain-grid { grid-template-columns: repeat(2, 1fr); }
  .sustain-card { padding: 22px 18px; }

  .career-grid { grid-template-columns: 1fr; gap: 26px; }
  .career-head { margin-bottom: 32px; }

  .about-right { grid-template-columns: repeat(2, 1fr); gap: 26px; width: 100%; }
  .stat-num, .stat-num .counter-text { font-size: 38px; }

  .news-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .news-card { height: 180px; padding: 22px 20px; }

  .footer-right { gap: 28px 36px; }
  .footer-ewm { gap: 16px; }
  .footer-bottom-inner { flex-direction: column; align-items: center; text-align: center; }

  /* 手机端隐藏右侧浮窗与整屏分页器，避免遮挡 */
  .side-float { display: none; }
  .home-pagination { display: none; }

  /* 公司资质：手机端三列证书缩略图，点击可放大查看 */
  .qual-inner .section-head { margin-bottom: 14px; }
  .qual-inner .section-head h2 { font-size: 24px; }
  .qual-inner .section-head p { margin-top: 8px; font-size: 12.5px; line-height: 1.6; }
  .qual-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
  .qual-img { padding: 3px; border-radius: 3px; }
  .qual-lang { top: 5px; right: 5px; padding: 0 4px; font-size: 9px; line-height: 14px; }
  .qual-card figcaption { margin-top: 7px; }
  .qual-card figcaption strong { font-size: 11.5px; }
  .qual-card figcaption span { display: none; }
  .qual-lightbox { padding: 3vh 3vw; }
  .qual-lightbox-close { top: 12px; right: 12px; width: 38px; height: 38px; font-size: 20px; }
}

/* 平板：公司资质改 3 列（与手机端互斥，避免后者被覆盖） */
@media (min-width: 768px) and (max-width: 1100px) {
  .qual-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .qual-card figcaption strong { font-size: 13px; }
  .qual-card figcaption span { font-size: 11px; }
}
