/*fp-seed:pmeijz9hnexm v9.11 d5vrsf7cr*/
/* ==========================================================================
   _seo_mobile.css v2 - 企业站完整移动端 CSS
   auto-generated by SEO-克隆建站系统/克隆引擎/内容/移动端适配器.py
   生效条件: 屏幕 ≤768px (平板 + 手机), PC 端 (>768px) 完全失效
   ========================================================================== */

/* ===== 0. 关键性能优化 (全屏生效, 不限媒体查询) ===== */
img[loading] { background: #f5f5f5; }
img.lazyload { opacity: 0; transition: opacity .35s; }
img.lazyloaded { opacity: 1; }

/* v17.48(2026-06-01) 默认隐藏移动端 tabbar (PC 端不该看到这玩意).
   下面 @media (max-width: 768px) 里再设 display:flex 把手机端打开.
   bug 历史: 之前没这条全局隐藏, PC 浏览器对 <div class="seo-mobile-tabbar">
   按默认 display:block 渲染, 用户看到一行裸 emoji "🏠首页📦产品💬联系🏢关于⬇底部" */
.seo-mobile-tabbar { display: none !important; }

/* ============================================================
   ★ 主响应式块: 屏幕 ≤768px
   ============================================================ */
@media screen and (max-width: 768px) {

  /* ---- 1. 全局 reset ---- */
  html, body {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100% !important;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0,0,0,0.08);
    scroll-behavior: smooth;
  }
  body {
    font-size: 16px !important;
    line-height: 1.6 !important;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
                 "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial,
                 sans-serif !important;
    color: #333 !important;
    background: #fff !important;
    /* 给底部 tabbar 让出 60px 空间 */
    padding-bottom: 60px !important;
  }

  /* ---- 2. 容器 (全名单) ---- */
  .container, .wrap, .wrapper, .main, .content, .page, .pagebody,
  .layout, .l-wrap, .layout-main, .site-wrap, .site-content,
  .body-wrap, .body-content, .main-wrap, .main-content,
  #container, #wrap, #wrapper, #main, #content, #page, #pagebody {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  /* ---- 2.5 固定像素宽度容器 (OKA-158) ----
     上面是类名白名单, 灰产 CMS 常用的 .w1200 / .w1000 / .w960 这种
     "宽度写进类名" 的容器不在名单里, 于是 width:1200px 原样渲染,
     撑破 375px 视口 —— html,body 的 overflow-x:hidden 只是把溢出裁掉
     不显示滚动条, 内部元素照样按 PC 宽度排, 视觉上就是右边被切.

     病例 tiemajiaoguan (run #174): <div class="w1200"> 实测 right=1212,
     它的子元素 .f2/.f2_3/img.cfr 跟着一起被推出视口.

     只 reset 宽度, 不加 padding —— 这类容器可能嵌在已有 padding 的
     外层里, 再加会双重缩进. */
  [class*="w960"], [class*="w1000"], [class*="w1100"], [class*="w1152"],
  [class*="w1180"], [class*="w1200"], [class*="w1220"], [class*="w1230"],
  [class*="w1240"], [class*="w1280"], [class*="w1300"], [class*="w1400"],
  [class*="width1000"], [class*="width1200"], [class*="wrap1200"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* ---- 3. 排版 ---- */
  h1, .h1 { font-size: 22px !important; line-height: 1.4 !important; margin: 14px 0 10px !important; font-weight: 600 !important; }
  h2, .h2 { font-size: 19px !important; line-height: 1.4 !important; margin: 12px 0 8px !important; font-weight: 600 !important; }
  h3, .h3 { font-size: 17px !important; line-height: 1.4 !important; margin: 10px 0 6px !important; font-weight: 600 !important; }
  h4, h5, h6, .h4, .h5, .h6 { font-size: 16px !important; line-height: 1.4 !important; }
  p { font-size: 15px !important; line-height: 1.7 !important; word-wrap: break-word !important; margin: 0 0 10px !important; }
  ul, ol { padding-left: 20px !important; margin: 0 0 10px !important; }
  li { line-height: 1.6 !important; }
  blockquote { padding: 10px 14px !important; border-left: 3px solid #1e88e5 !important; background: #f5f9ff !important; margin: 10px 0 !important; }

  /* ---- 4. 图片自适应 ---- */
  img, picture, .img-fluid, .img-responsive {
    max-width: 100% !important;
    height: auto !important;
    display: inline-block;
  }
  figure { margin: 10px 0 !important; max-width: 100% !important; }

  /* ---- 5. 表格 (横向滚动) ---- */
  .table-wrap, .table-responsive {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    margin: 10px 0 !important;
  }
  table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    border-collapse: collapse !important;
    white-space: nowrap !important;
  }
  td, th {
    padding: 8px 10px !important;
    font-size: 14px !important;
    border: 1px solid #eee !important;
  }
  th { background: #f5f5f5 !important; font-weight: 600 !important; }

  /* ---- 6. 表单 (iOS 字号 ≥16px 防放大) ---- */
  input, textarea, select {
    font-size: 16px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
    border: 1px solid #ddd !important;
    background: #fff !important;
    color: #333 !important;
    -webkit-appearance: none !important;
  }
  input[type="text"], input[type="tel"], input[type="email"],
  input[type="search"], input[type="password"], input[type="number"],
  input[type="url"], input[type="date"], input[type="time"], textarea {
    width: 100% !important;
    padding: 12px 14px !important;
    margin: 6px 0 !important;
  }
  textarea { min-height: 100px !important; resize: vertical !important; }
  select {
    padding: 12px 14px !important;
    background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><polygon points='0,0 10,0 5,6' fill='%23999'/></svg>") no-repeat right 12px center !important;
    padding-right: 32px !important;
  }
  label { display: block !important; margin: 6px 0 4px !important; font-size: 14px !important; color: #555 !important; }
  .form, form { width: 100% !important; }

  /* ---- 7. 按钮 (Apple HIG 44x44px) ---- */
  button, .btn, .button, input[type="button"],
  input[type="submit"], input[type="reset"] {
    min-height: 44px !important;
    min-width: 44px !important;
    font-size: 16px !important;
    padding: 12px 20px !important;
    border-radius: 6px !important;
    border: none !important;
    cursor: pointer;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all .2s ease;
  }
  .btn-primary, .btn.primary, button.primary,
  input[type="submit"], .btn-blue {
    background: linear-gradient(135deg, #1e88e5, #1565c0) !important;
    color: #fff !important;
  }
  .btn-success, .btn-green { background: linear-gradient(135deg, #43a047, #2e7d32) !important; color: #fff !important; }
  .btn-danger, .btn-red { background: linear-gradient(135deg, #e53935, #c62828) !important; color: #fff !important; }
  .btn-block, .btn.block { width: 100% !important; }

  /* ---- 8. 顶部导航 + 汉堡菜单 ---- */
  /* 默认 PC 站的 nav 全部上下堆叠 */
  nav, .nav, .navbar, .navigation, .header-nav, .top-nav,
  #nav, #navbar, .menu, .main-menu, .h-nav, .header-menu {
    width: 100% !important;
    float: none !important;
    display: block !important;
    text-align: left !important;
    position: relative !important;
  }
  /* 配合 _seo_mobile.js 的汉堡按钮 */
  .seo-mobile-burger {
    display: inline-block !important;
    position: fixed !important;
    top: 8px;
    right: 8px;
    z-index: 9998;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: rgba(255,255,255,0.95);
    border: 1px solid #eee;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    cursor: pointer;
    user-select: none;
  }
  .seo-mobile-burger::before {
    content: "≡";
    font-size: 28px;
    color: #1e88e5;
    font-weight: bold;
  }
  /* v31: 旧 body.seo-mobile-menu-open nav 会把 ALL nav (含 .navbox/.page_navs) 全屏挡住 · 已废
   * 展开只认 .navbox.seo-nav-open / body.seo-nav-open · 见下方 v30.8/v31 段
   */
  nav ul, .nav ul, .navbar ul, .menu ul,
  .header-nav ul, .top-nav ul {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }
  nav li, .nav li, .navbar li, .menu li,
  .header-nav li, .top-nav li {
    display: block !important;
    width: 100% !important;
    float: none !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
  }
  nav a, .nav a, .navbar a, .menu a,
  .header-nav a, .top-nav a {
    display: block !important;
    padding: 14px 18px !important;
    line-height: 1.5 !important;
    color: #333 !important;
    text-decoration: none !important;
    font-size: 15px !important;
  }
  nav a:active, .nav a:active, .menu a:active {
    background: #f5f9ff !important;
  }

  /* ---- 9. Logo ---- */
  header, .header, #header, .top, .topbar, .h-top {
    width: 100% !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    background: #fff !important;
    border-bottom: 1px solid #f0f0f0 !important;
  }
  .logo, .h-logo, .brand, .brand-logo, #logo, .site-logo {
    display: block !important;
    max-height: 50px !important;
    text-align: center !important;
    padding: 4px 0 !important;
  }
  .logo img, .h-logo img, .brand img, #logo img, .site-logo img {
    max-height: 44px !important;
    width: auto !important;
    display: inline-block !important;
  }

  /* ---- 10. Banner / Swiper / Carousel ---- */
  .banner, .swiper, .swiper-container, .carousel, .slider, .slide,
  .index-banner, .home-banner, .top-banner, .head-banner {
    width: 100% !important;
    height: auto !important;
    max-height: 60vw !important;
    overflow: hidden !important;
    position: relative !important;
  }
  .banner img, .swiper img, .carousel img, .slider img,
  .index-banner img, .top-banner img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .swiper-slide, .carousel-item, .slick-slide {
    width: 100% !important;
    flex-shrink: 0 !important;
  }

  /* ---- 11. 多列栅格降级 ---- */
  .col, .column,
  [class*="col-md-"], [class*="col-lg-"], [class*="col-xs-"], [class*="col-sm-"],
  .grid-item, .row > div,
  .left, .right, .sidebar, .aside, .side-bar,
  .main-left, .main-right, .content-left, .content-right {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    clear: both !important;
  }
  .row { display: block !important; margin: 0 !important; }

  /* ---- 12. 卡片 / 列表 / 产品网格 ---- */
  .card, .product, .product-card, .case, .case-card, .news-item,
  .news-card, .article-card, .item, .list-item, .grid-item,
  .product-list > li, .news-list > li, .case-list > li {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 12px !important;
    padding: 12px !important;
    background: #fff !important;
    border: 1px solid #eee !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
    overflow: hidden !important;
  }
  .card img, .product img, .news-item img, .case img,
  .product-card img, .case-card img, .news-card img {
    width: 100% !important;
    max-height: 56vw !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    margin-bottom: 8px !important;
  }
  .card .title, .card h3, .product .title, .product h3,
  .news-item .title, .news-item h3 {
    font-size: 15px !important;
    line-height: 1.4 !important;
    color: #222 !important;
    margin: 4px 0 !important;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .card .desc, .news-item .desc, .product .desc {
    font-size: 13px !important;
    color: #777 !important;
    line-height: 1.6 !important;
    margin: 4px 0 0 !important;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  /* ---- 13. PC-only 元素隐藏 ---- */
  .pc-only, .desktop-only, .hidden-xs, .hidden-sm,
  .visible-md, .visible-lg, .sidebar-pc,
  .header-pc, .footer-pc, .nav-pc {
    display: none !important;
  }
  .mobile-only, .visible-xs, .visible-sm {
    display: block !important;
  }

  /* ---- 14. footer ---- */
  footer, .footer, #footer {
    text-align: center !important;
    padding: 20px 12px !important;
    background: #2c2c2c !important;
    color: #b0b0b0 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
  }
  footer a, .footer a { color: #b0b0b0 !important; }
  footer .col, .footer .col, footer ul, .footer ul {
    width: 100% !important;
    text-align: center !important;
    display: block !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    list-style: none !important;
  }
  footer h3, .footer h3, footer h4, .footer h4 {
    font-size: 14px !important;
    color: #fff !important;
    margin: 12px 0 6px !important;
  }
  footer img, .footer img { max-width: 120px !important; }

  /* ---- 15. 弹窗 / modal 全屏 ---- */
  .modal, .popup, .dialog, .overlay-content, .layer, .layui-layer {
    width: 94% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-radius: 10px !important;
    left: 3% !important;
    transform: none !important;
  }
  .modal-content, .popup-content { padding: 16px !important; }

  /* ---- 16. 文本断行 ---- */
  .text, article, p, li, dd, td, span {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  /* ---- 17. 视频自适应 ---- */
  video, iframe {
    max-width: 100% !important;
    height: auto !important;
  }
  .video-wrap, .video-container {
    position: relative !important;
    padding-bottom: 56.25% !important;
    height: 0 !important;
    overflow: hidden !important;
  }/*block:k322488*/
  .video-wrap iframe, .video-wrap video,
  .video-container iframe, .video-container video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  /* ---- 18. 浮动联系按钮区 (右下角) ---- */
  .right-tools, .float-tools, .side-bar-fixed, .right-fixed,
  .pop-tools, .float-bar, .quick-link, .floating, .fixed-tools {
    right: 4px !important;
    bottom: 70px !important;
    transform: scale(0.8);
    transform-origin: right bottom;
  }
  .scroll-top, .back-to-top, .gotop {
    right: 8px !important;
    bottom: 70px !important;
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    font-size: 18px !important;
    border-radius: 50% !important;
  }

  /* ---- 19. 底部固定 tabbar (本模块 JS 注入的 5 按钮) ---- */
  .seo-mobile-tabbar {
    display: flex !important;
    position: fixed !important;
    bottom: 0;
    left: 0;
    right: 0;
    height: 56px;
    background: #fff;
    border-top: 1px solid #e0e0e0;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.08);
    z-index: 9999;
    padding: 4px 0;
  }
  .seo-mobile-tabbar a {
    flex: 1;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #666 !important;
    font-size: 11px !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
  }
  .seo-mobile-tabbar a:active { background: #f5f9ff !important; }
  .seo-mobile-tabbar .seo-mobile-icon {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 2px;
  }
  .seo-mobile-tabbar .seo-mobile-call {
    color: #fff !important;
    background: linear-gradient(135deg, #43a047, #2e7d32) !important;
    border-radius: 50% !important;
    width: 48px !important;
    height: 48px !important;
    margin-top: -16px !important;
    margin-bottom: -4px !important;
    box-shadow: 0 2px 8px rgba(67,160,71,0.4) !important;
    flex: 0 0 48px !important;
  }
  .seo-mobile-tabbar .seo-mobile-call .seo-mobile-icon { margin: 0 !important; }
  .seo-mobile-tabbar .seo-mobile-call-label {
    color: #43a047 !important;
    margin-top: 2px;
  }

  /* ---- 20. 滚动条美化 (移动端通常隐藏) ---- */
  ::-webkit-scrollbar { width: 0; height: 0; background: transparent; }

  /* ---- 21. 面包屑导航 · v30.9(2026-07-25) 强制隐藏 ---- */
  /* 用户诉求: 顶部蓝底 "首页" 面包屑不该显示 · JSON-LD 已在 head · SEO 保留
   * inline style="display:none" 被源 CSS 覆盖 · 用 html body 前缀提高优先级
   */
  html body .breadcrumb,
  html body nav.breadcrumb,
  html body .crumb,
  html body .position,
  html body .nav-position,
  html body .location {
    display: none !important;
  }
  .breadcrumb a, .crumb a, .position a, .location a {
    color: #1e88e5 !important;
    text-decoration: none !important;
  }
  .breadcrumb li, .crumb li {
    display: inline-block !important;
    margin-right: 4px !important;
  }
  .breadcrumb li::after, .crumb li::after {
    content: "›";
    margin-left: 4px;
    color: #ccc;
  }
  .breadcrumb li:last-child::after, .crumb li:last-child::after { content: ""; }

  /* ---- 22. 分页器 ---- */
  .pagination, .pages, .page-list, .pager {
    text-align: center !important;
    padding: 14px 8px !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .pagination a, .pagination span, .pages a, .pages span,
  .page-list a, .pager a, .pager span {
    display: inline-block !important;
    min-width: 36px !important;
    height: 36px !important;
    line-height: 34px !important;
    padding: 0 10px !important;
    margin: 0 2px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    color: #555 !important;
    background: #fff !important;
    text-decoration: none !important;
    font-size: 14px !important;
  }
  .pagination .current, .pagination .active, .pages .current,
  .pages .active, .pager .current, .pager .active {
    background: #1e88e5 !important;
    color: #fff !important;
    border-color: #1e88e5 !important;
  }

  /* ---- 23. 文章/新闻详情页 ---- */
  .article, .news-detail, .article-content, .post-content,
  .content-detail, .detail-content, .news-content {
    padding: 12px !important;
    background: #fff !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    color: #333 !important;
  }
  .article-title, .news-title, .post-title, .detail-title {
    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 12px 0 8px !important;
    color: #222 !important;
  }
  .article-meta, .news-meta, .post-meta, .detail-meta {
    font-size: 12px !important;
    color: #999 !important;
    margin-bottom: 16px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #eee !important;
  }
  .article p, .news-detail p, .article-content p, .post-content p {
    margin: 0 0 14px !important;
    text-indent: 2em !important;
  }
  .article img, .news-detail img, .article-content img, .post-content img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 10px auto !important;
    border-radius: 4px !important;
  }

  /* ---- 24. 产品详情页 (大图 + 缩略图列表) ---- */
  .product-detail, .product-info, .goods-detail {
    padding: 12px !important;
    background: #fff !important;
  }
  .product-gallery, .product-images, .goods-gallery {
    width: 100% !important;
    margin-bottom: 12px !important;
  }
  .product-gallery .main-img, .product-images .big-img {
    width: 100% !important;
    max-height: 80vw !important;
    object-fit: contain !important;
    background: #f5f5f5 !important;
    border-radius: 6px !important;
  }
  .product-gallery .thumbs, .product-images .small-imgs {
    display: flex !important;
    gap: 6px !important;
    margin-top: 8px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 4px !important;
  }
  .product-gallery .thumbs img, .product-images .small-imgs img {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border-radius: 4px !important;
    border: 2px solid transparent !important;
    flex-shrink: 0 !important;
  }
  .product-gallery .thumbs img.active, .product-images .small-imgs img.active {
    border-color: #1e88e5 !important;
  }
  .product-title, .goods-title { font-size: 18px !important; font-weight: 600 !important; margin: 8px 0 !important; }
  .product-price, .goods-price {
    font-size: 22px !important;
    color: #e53935 !important;
    font-weight: 600 !important;
    margin: 8px 0 !important;
  }

  /* ---- 25. 在线客服浮窗 (右下圆形) ---- */
  .online-service, .kefu, .customer-service, .qqlive, .live-chat {
    position: fixed !important;
    right: 8px !important;
    bottom: 130px !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #ff7043, #f4511e) !important;
    box-shadow: 0 4px 12px rgba(244,81,30,0.35) !important;
    text-align: center !important;
    line-height: 48px !important;
    color: #fff !important;
    font-size: 22px !important;
    z-index: 9990 !important;
    cursor: pointer !important;
  }
  .online-service::before { content: "💬"; }

  /* ---- 26. 二维码图片 (公众号/微信) ---- */
  .qrcode, .qr-code, .ewm, .erweima, .gzh-qrcode {
    max-width: 140px !important;
    height: auto !important;
    margin: 12px auto !important;
    display: block !important;
    padding: 8px !important;
    background: #fff !important;
    border: 1px solid #eee !important;
    border-radius: 6px !important;
  }

  /* ---- 27. 地图容器 ---- */
  #map, .map, .map-container, .baidu-map, .amap, #BMap_*,
  .map-wrap, .iw-content {
    width: 100% !important;
    height: 240px !important;
    margin: 10px 0 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
  }

  /* ---- 28. 联系我们页 ---- */
  .contact-us, .contact-info, .contact-list {
    padding: 12px !important;
  }
  .contact-item {
    display: flex !important;
    align-items: center !important;
    padding: 12px !important;
    background: #fff !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    border: 1px solid #f0f0f0 !important;
  }
  .contact-item .icon, .contact-item i {
    font-size: 22px !important;
    color: #1e88e5 !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
  }
  .contact-item .text, .contact-item .info {
    flex: 1 !important;
    font-size: 14px !important;
    color: #444 !important;
    word-break: break-all !important;
  }
  .contact-item .text strong { display: block; color: #888; font-size: 12px; margin-bottom: 2px; font-weight: normal; }

  /* ---- 29. 资讯列表/搜索分类 tab ---- */
  .tab, .tabs, .tab-list, .news-tab, .filter-tab, .nav-tab {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: #fff !important;
    border-bottom: 1px solid #eee !important;
    margin-bottom: 12px !important;
  }
  .tab a, .tabs a, .tab-list a, .news-tab a {
    flex-shrink: 0 !important;
    padding: 12px 16px !important;
    color: #555 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-bottom: 2px solid transparent !important;
  }
  .tab .active, .tabs .active, .tab-list .active, .news-tab .active {
    color: #1e88e5 !important;
    border-bottom-color: #1e88e5 !important;
  }

  /* ---- 30. 标签 tag ---- */
  .tag, .label, .keyword {
    display: inline-block !important;
    padding: 3px 10px !important;
    margin: 2px 4px 2px 0 !important;
    background: #f0f7ff !important;
    color: #1e88e5 !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    text-decoration: none !important;
  }
  .tag.hot, .label.hot { background: #ffebee !important; color: #e53935 !important; }
  .tag.new, .label.new { background: #e8f5e9 !important; color: #43a047 !important; }

  /* ---- 31. 公司介绍 / about 页 ---- */
  .about-section, .company-intro, .about-content {
    padding: 16px 12px !important;
    background: #fff !important;
  }
  .about-section .title, .company-intro .title {
    font-size: 18px !important;
    font-weight: 600 !important;
    text-align: center !important;
    margin-bottom: 14px !important;
    position: relative !important;
    padding-bottom: 10px !important;
  }
  .about-section .title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;
    background: #1e88e5;
  }

  /* ---- 32. 数据展示卡 (年限/客户/案例数等数字) ---- */
  .stats, .data-card, .number-card, .achievement {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    padding: 12px !important;
  }
  .stats-item, .stat-item, .data-item, .achievement-item {
    text-align: center !important;
    padding: 14px 10px !important;
    background: linear-gradient(135deg, #f5f9ff, #e8f1ff) !important;
    border-radius: 8px !important;
  }
  .stats-item .num, .stat-item .num, .data-item .num,
  .stats-item strong, .achievement-item strong {
    font-size: 24px !important;
    color: #1e88e5 !important;
    font-weight: 600 !important;
    display: block !important;
    line-height: 1.2 !important;
  }
  .stats-item .label, .stat-item .label, .data-item .label {
    font-size: 12px !important;
    color: #888 !important;
    margin-top: 4px !important;
  }

  /* ---- 33. 友情链接 ---- */
  .links, .friend-link, .blogroll {
    padding: 10px 12px !important;
    background: #fafafa !important;
    font-size: 12px !important;
    color: #888 !important;
    line-height: 2 !important;
  }
  .links a, .friend-link a {
    color: #888 !important;
    margin-right: 12px !important;
    text-decoration: none !important;
  }

  /* ---- 34. 备案信息 ---- */
  .icp, .beian, .copyright, .bottom-info {
    text-align: center !important;
    padding: 10px !important;
    font-size: 11px !important;
    color: #888 !important;
    line-height: 1.8 !important;
    background: #2c2c2c !important;
  }

  /* ---- 35. 动画/过渡降级 (低端机省电) ---- */
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: 0.01ms !important;
      transition-duration: 0.01ms !important;
    }
  }

}  /* end @media max-width: 768px */


/* ============================================================
   ★ 小屏幕加强 (≤480px 真手机)
   ============================================================ */
@media screen and (max-width: 480px) {
  body { font-size: 15px !important; }
  h1, .h1 { font-size: 20px !important; }
  h2, .h2 { font-size: 17px !important; }/*layout:gzku2b*/
  h3, .h3 { font-size: 15px !important; }
  .container, .wrap, .wrapper, .main, .content {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  /* 卡片间距压缩 */
  .card, .product, .news-item, .case { margin-bottom: 10px !important; padding: 10px !important; }
  /* 表单按钮拉满 */
  .form button, form .submit, .form-submit, .form-submit-btn { width: 100% !important; }
}


/* ============================================================
   ★ 横屏 (landscape)
   ============================================================ */
@media screen and (max-width: 900px) and (orientation: landscape) {
  body { padding-bottom: 0 !important; }
  .seo-mobile-tabbar { display: none !important; }
  .banner, .swiper, .carousel { max-height: 50vh !important; }
}


/* ============================================================
   ★ 微信浏览器特殊修正 (User-Agent 含 MicroMessenger)
   ★ 用 :root[data-ua-wechat] 通过 JS 标记后命中
   ============================================================ */
:root[data-ua-wechat] body {
  /* 微信顶部隐藏不到, 保留 padding-top 给微信导航条 */
  padding-top: 0 !important;
}
:root[data-ua-wechat] a[href^="tel:"]::before {
  content: "📞 ";
}

/* QQ 浏览器修正 */
:root[data-ua-qq] .seo-mobile-tabbar {
  bottom: env(safe-area-inset-bottom, 0);
}

/* iOS 安全区域 (iPhone X 及以后) */
.seo-mobile-tabbar {
  padding-bottom: env(safe-area-inset-bottom, 0) !important;
  height: calc(56px + env(safe-area-inset-bottom, 0)) !important;
}

/* ============================================================
   ★ v30.5(2026-07-25) 移动端标准商业站优化 (5 项)
   修 guangdongzuyi.com 病例: header 676px 撑爆首屏, nav 7 项全展开, 相关推荐重复 5 段
   用户诉求: header 60-80px, 汉堡菜单收起, hero 首屏可见, 悬浮 CTA
   ============================================================ */
@media screen and (max-width: 768px) {
  /* 1. header 紧凑 · 从 676px 缩到 ~80px */
  header.header, .header, #header,
  header.head, .head, .top-header, .site-header {
    min-height: auto !important;
    max-height: 80px !important;
    padding: 8px 15px !important;
    position: relative !important;
    z-index: 100 !important;
    overflow: visible !important;
  }
  header.header .logo, .header .logo, .head .logo,
  .logo.fl, .site-logo, .brand {
    max-height: 60px !important;
    line-height: 60px !important;
    display: inline-block !important;
    float: left !important;
    padding: 0 !important;
  }
  header.header .logo img, .header .logo img, .logo.fl img {
    max-height: 44px !important;
    width: auto !important;
    vertical-align: middle !important;
  }

  /* 2. 汉堡菜单 · v31(2026-07-25) JS class 侧滑 · 用户报全屏白底挡住
   * 策略:
   *   · 默认 display:none !important (盖过源 .navbox {width:100%;height:100%})
   *   · 展开只认 .seo-nav-open (_seo_mobile.js v31 加 class + setProperty)
   *   · 废掉 [style*="block"] · 源 jQuery .show() 不再单独触发满屏
   *   · 无遮罩 · 侧栏 max 260px · 左侧内容始终可见
   */
  html body .navbox,
  html body nav.navbox.fl,
  html body .nav-collapse,
  html body .navbar-collapse,
  html body .nav-menu,
  html body .site-nav {
    display: none !important;
    visibility: hidden !important;
  }
  html body .navbox.seo-nav-open,
  html body nav.navbox.fl.seo-nav-open,
  html body.seo-nav-open .navbox,
  html body.seo-nav-open nav.navbox.fl {
    display: block !important;
    visibility: visible !important;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;
    width: 70% !important;
    max-width: 260px !important;
    height: 100% !important;
    background: #fff !important;
    z-index: 9990 !important;
    overflow-y: auto !important;
    box-shadow: -4px 0 16px rgba(0,0,0,0.18) !important;
    padding: 48px 0 80px !important;
    float: none !important;
    margin: 0 !important;
    animation: slideInRight 0.28s ease-out !important;
  }
  html body .navbox.seo-nav-open .nav,
  html body .navbox.seo-nav-open ul.nav,
  html body.seo-nav-open .navbox .nav {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    height: auto !important;
    right: 0 !important;
    background: #fff !important;
    position: relative !important;
  }
  @keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0.5; }
    to { transform: translateX(0); opacity: 1; }
  }
  /* 产品页侧栏 .page_navs · 默认文档流挡 banner 下 · 移动端隐藏 */
  html body .page_navs,
  html body nav.page_navs {
    display: none !important;
  }
  /* 顶部 page_top 面包屑条 · 移动端隐藏 */
  html body .page_top,
  html body .page_lj {
    display: none !important;
  }
  /* nav 里的 li 竖排 · 每行紧凑 */
  .navbox .nav li, .navbox ul li, .nav-menu li {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border-bottom: 1px solid #eee !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .navbox .nav li a, .navbox ul li a, .nav-menu li a {
    display: block !important;
    padding: 12px 20px !important;
    line-height: 1.4 !important;
    font-size: 15px !important;
    color: #333 !important;
    text-decoration: none !important;
  }
  /* 汉堡按钮 · 突出 · 右上 */
  .navs, .menu-toggle, .hamburger, .nav-toggle, .nav_button {
    display: flex !important;
    position: absolute !important;
    top: 20px !important;
    right: 15px !important;
    width: 36px !important;
    height: 36px !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 999 !important;
    cursor: pointer !important;
  }

  /* 3. 相关推荐去重 · 5 段 → 1 段 (SEO 保留 1 段 · 用户体验) */
  section.related-posts:nth-of-type(n+2),
  .related-posts:nth-of-type(n+2),
  section[aria-label="相关推荐"]:nth-of-type(n+2),
  section[class*="related"]:nth-of-type(n+2) {
    display: none !important;
  }

  /* 4. 悬浮 CTA 电话按钮 · v30.8 移除 (用户诉求 · tabbar 已含拨号按钮 · 悬浮多余)
   * 保留兼容: 若 HTML 已生成 .seo-mobile-cta-float · 强制隐藏
   */
  .seo-mobile-cta-float {
    display: none !important;
  }
}

/* ============================================================
   ★ 暗色模式 (用户系统级偏好, 不强制)
   ============================================================ */
@media (prefers-color-scheme: dark) and (max-width: 768px) {
  /* 不动业务主题色, 只调中性色 */
  .seo-mobile-tabbar { background: #1e1e1e; border-top-color: #333; }
  .seo-mobile-tabbar a { color: #999 !important; }
  .seo-mobile-burger { background: rgba(30,30,30,0.95); border-color: #444; }
  .seo-mobile-burger::before { color: #4fc3f7; }
}


/* ==========================================================================
   ★ 源站固定宽度自适应覆盖 (读源站 CSS 自动生成, 命中 5 个选择器)
   原理: 源站这些选择器写死了 ≥720px 的 PC 宽度, 手机会横向溢出.
         这里统一压成流式 100%, 补通用名单覆盖不到的非常规 class.
   ========================================================================== */
@media screen and (max-width: 768px) {
  .xinwen-hd .tab-5-tit,
  .fzlc-slick .year span:before,
  .fzlc-slick .year span:after,
  .yysp-nav,
  .box-gn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}
