/* ===== 移动端适配公共样式 (最后加载，覆盖各页内联样式) ===== */

/* 汉堡按钮：桌面端隐藏 */
.nav-toggle { display: none; border: none; background: transparent; cursor: pointer; padding: 8px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: #333; margin: 5px 0; transition: transform .3s, opacity .3s; border-radius: 2px; }

/* 防止装饰块 / 超宽元素造成横向滚动 */
html, body { overflow-x: hidden; }

/* ========== 平板及以下 ========== */
@media (max-width: 900px) {
  .wrap { width: 100%; max-width: 100%; padding: 0 16px; }

  /* 顶栏：隐藏欢迎语，只留语言切换 */
  .topbar { height: 36px; font-size: 12px; }
  .topbar .wrap { height: 36px; justify-content: flex-end; }
  .topbar .welcome { display: none; }

  /* 头部：显示汉堡，收起导航 */
  .header { position: relative; }
  .header .wrap { height: 60px; }
  .header .logo img { height: 40px; }
  .nav-toggle { display: block; }

  .nav ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    gap: 0;
    background: #fff;
    box-shadow: 0 8px 20px rgba(0,0,0,.12);
    border-top: 1px solid #eee;
    z-index: 100;
    padding: 6px 0;
  }
  .header.mnav-open .nav ul { display: flex; }
  .nav li { width: 100%; }
  .nav a { display: block; font-size: 16px; padding: 14px 20px; border-bottom: 1px solid #f2f2f2; }
  .nav a.active::after { display: none; }
  .nav a.active { background: #fff9ef; }

  /* 汉堡打开时变叉号 */
  .header.mnav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .header.mnav-open .nav-toggle span:nth-child(2) { opacity: 0; }
  .header.mnav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  /* 悬浮按钮缩小并下移到右下角 */
  .floatbar { right: 12px; bottom: 16px; top: auto; transform: none; gap: 10px; }
  .floatbar a { width: 42px; height: 42px; }
  .floatbar a svg { width: 20px; height: 20px; }

  /* 页脚堆叠居中 */
  .footer { padding: 32px 0 0; }
  .footer-top { flex-direction: column; align-items: flex-start; gap: 20px; padding-bottom: 28px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; text-align: left; font-size: 12px; }

  /* 首页 Banner 与装饰块 */
  .banner .slides { height: 220px; }
  .banner .dots { right: 16px; }
  .banner .scroll { display: none; }
  .deco { display: none; }

  /* 首页优势区 */
  .advantage { padding: 24px 0 30px; }
  .adv-top { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
  .adv-slogan h2 { font-size: 26px; }
  .adv-imgs { justify-content: center; width: 100%; }
  .adv-imgs img { max-height: 150px; }
  .adv-search { max-width: 100%; margin: 18px 0 24px; }
  .adv-bottom { flex-direction: column; align-items: flex-start; gap: 24px; }
  .adv-desc { max-width: 100%; font-size: 14px; }
  .certs { flex-wrap: wrap; gap: 12px; justify-content: flex-start; }
  .certs img { width: 64px; height: 64px; }

  /* 首页新闻区 */
  .news { padding: 24px 0 40px; }
  .news-item { flex-direction: column; align-items: flex-start; gap: 16px; padding: 22px 0; }
  .news-thumb { width: 100%; height: auto; }
  .news-title { font-size: 18px; }

  /* 内页 Banner / 标题 */
  .page-banner img { height: 160px; }
  .page-banner .caption { bottom: 24px; }
  .page-banner .caption h1 { font-size: 22px; }
  .page-title { margin: 30px 0 20px; }
  .page-title h2 { font-size: 24px; }

  /* 产品列表：两列 */
  .prod-main { flex-direction: column; gap: 20px; padding: 16px 0 40px; }
  .prod-side { width: 100%; }
  .prod-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .prod-card .pic { height: 150px; }
  .prod-card p { font-size: 14px; padding: 12px 8px; }

  /* 产品详情 / 留言 / 联系 / 新闻 通用堆叠 */
  .pd-top { flex-direction: column; gap: 24px; }
  .pd-pic, .pd-info { width: 100%; }
  .pd-form .pd-row, .msg-row { flex-direction: column; gap: 16px; }
  .contact-main { flex-direction: column; gap: 24px; }
  .news-card { flex-direction: column; gap: 18px; }
  .news-card .thumb { width: 100%; height: auto; }

  /* 简介正文 */
  .profile { padding: 28px 0 40px; }
  .profile p { font-size: 15px; line-height: 1.9; }
}

/* ========== 手机小屏 ========== */
@media (max-width: 480px) {
  .prod-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .adv-slogan h2 { font-size: 22px; }
  .banner .slides { height: 180px; }
  .page-banner img { height: 130px; }
  .certs img { width: 56px; height: 56px; }
}
