/* ===== 移动端响应式适配 (≤768px) ===== */
@media (max-width: 768px) {

    /* --- 全局防溢出 --- */
    html, body { overflow-x: hidden; }
    *, *::before, *::after { box-sizing: border-box; }
    img, video, canvas, svg { max-width: 100%; height: auto; }

    /* ========== 顶部浮动栏 ========== */
    .header-bar {
        height: 50px;
        padding: 0 6px;
        justify-content: space-between;
    }
    .header-bar .logo { height: 28px; }
    .header-bar .header-left { gap: 2px; flex: 1; min-width: 0; }
    .header-bar .header-right { gap: 4px; flex-shrink: 0; }

    /* 搜索栏更小 */
    .search-bar {
        width: 90px;
        height: 26px;
        border-radius: 13px;
        padding: 0 5px;
    }
    .search-bar input { font-size: 10px; padding-left: 2px; }
    .search-bar .search-icon { width: 14px; height: 14px; }

    /* 电话图标 + 号码精简显示 */
    .phone-block { gap: 2px; flex-shrink: 0; }
    .phone-block .phone-icon { width: 18px; height: 18px; }
    .phone-block .phone-number {
        display: inline;
        font-size: 10px;
        white-space: nowrap;
    }

    .btn-inquiry {
        width: 60px !important;
        height: 24px !important;
        font-size: 11px !important;
        padding: 0;
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* ========== 导航栏 ========== */
    .nav-bar {
        top: 50px;
        left: 0;
        width: 100vw;
        height: 34px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        justify-content: flex-start;
    }
    .nav-bar ul {
        flex-wrap: nowrap;
        padding: 0 4px;
    }
    .nav-bar ul li {
        font-size: 10px;
        padding: 0 8px;
    }
    .nav-bar ul li:not(:last-child)::after {
        right: 0;
        font-size: 9px;
    }

    /* ========== 面包屑导航 ========== */
    .breadcrumb {
        margin-top: 0;
        padding: 8px 12px;
        font-size: 12px;
    }
    .breadcrumb .sep { margin: 0 6px; }

    /* ========== 下拉面板 ========== */
    .nav-dropdown-panel {
        top: 84px;                    /* 50 + 34 */
        left: 2vw;
        transform: none;
        width: 96vw;
        max-width: none;
        padding: 14px 8px;
        gap: 8px;
        flex-wrap: wrap;
        justify-content: center;
        border-radius: 6px;
    }
    .nav-dropdown-item { width: 90px; flex: none; }
    .nav-dropdown-item img { width: 80px; height: 60px; margin: 4px 0; }
    .nav-dropdown-cat,
    .nav-dropdown-name { font-size: 11px; }

    /* ========== 轮播图 ========== */
    .hero-carousel { margin-top: 84px; }
    .carousel-slide { height: 180px; }
    .carousel-arrow { width: 28px; height: 28px; font-size: 16px; }
    .carousel-arrow.left  { left: 8px; }
    .carousel-arrow.right { right: 8px; }

    /* ========== 内容区域 ========== */
    .content-area { padding: 0 10px; }

    /* ========== 产品中心板块 ========== */
    .product-section {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 24px 0 0;
    }
    .product-title { font-size: 28px; }
    .product-en { font-size: 14px; }
    .product-underline { width: 40px; height: 3px; }
    .product-left,
    .product-right { width: 100%; }

    .learn-more-link {
        padding: 6px 16px;
        font-size: 14px;
        margin-bottom: 16px;
    }
    .learn-more-link .learn-text { font-size: 14px; }
    .learn-more-link .learn-icon { width: 28px; height: 28px; }

    /* 产品卡片 */
    .product-cards { gap: 16px; margin: 16px 0 40px; grid-template-columns: 1fr; }
    .product-card {
        flex-direction: column;
        padding: 24px 14px;
        min-height: auto;
        gap: 12px;
        border-radius: 10px;
    }
    .product-card::before { display: none; }
    .card-left {
        justify-content: center;
        padding-right: 0;
        flex: none;
    }
    .card-left img {
        max-width: 200px;
        max-height: 150px;
    }
    .card-right {
        padding-left: 0;
        align-items: center;
        text-align: center;
        flex: none;
    }
    .card-title { font-size: 28px; margin-bottom: 10px; }
    .card-desc { font-size: 14px; min-height: auto; margin-bottom: 14px; line-height: 1.5; }
    .card-btn { font-size: 15px; padding: 8px 24px; }

    /* ========== 应用案例饼图区 ========== */
    .case-section {
        flex-direction: column;
        padding: 24px 0;
        gap: 16px;
    }
    .case-left { width: 100%; display: flex; justify-content: center; }
    .pie-wrapper {
        width: 280px !important;
        height: 280px !important;
        transform: none !important;
    }
    .pie-center > img { width: 45% !important; height: 45% !important; top: 27.5% !important; left: 27.5% !important; }
    .pie-title { font-size: 22px !important; }
    .pie-en { font-size: 22px !important; }
    .pie-line { margin: 4px 0; }

    /* 6个case-item 用百分比定位覆盖 px 值 */
    .case-item {
        transform: translate(-50%, -50%) !important;
        gap: 2px;
        width: 60px;
    }
    .case-item img { width: 32px !important; height: 32px !important; }
    .case-item span { font-size: 9px !important; }

    /* 按比例换算 (原700px → 280px) 用属性选择器精确定位 */
    .case-item[style*="left:489px"] { left: 69.9% !important; top: 21.9% !important; }
    .case-item[style*="left:602px"] { left: 86% !important; top: 50% !important; }
    .case-item[style*="left:489px"][style*="top:547px"] { left: 69.9% !important; top: 78.1% !important; }
    .case-item[style*="left:211px"][style*="top:547px"] { left: 30.1% !important; top: 78.1% !important; }
    .case-item[style*="left:98px"] { left: 14% !important; top: 50% !important; }
    .case-item[style*="left:211px"][style*="top:153px"] { left: 30.1% !important; top: 21.9% !important; }

    .case-right { margin-top: 0; align-items: center; text-align: center; }
    .case-desc { font-size: 14px; line-height: 1.6; }
    .case-btn { font-size: 14px; padding: 8px 20px; align-self: center; }
    .case-btn-icon { width: 28px; height: 28px; }

    /* ========== 服务优势 ========== */
    .service-advantage { padding: 0 10px; }
    .service-content { padding: 20px 0; }
    .service-title { font-size: 28px; }
    .service-en { font-size: 18px; }
    .service-list { margin-top: 30px; gap: 12px; }
    .service-item { gap: 14px; font-size: 14px; line-height: 1.8; align-items: center; }
    .service-item .item-dot { align-self: center; }
    .item-text { width: 140px; flex-shrink: 0; }
    .item-dot { width: 6px; height: 6px; }
    .service-section { padding: 24px 0; }
    .service-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .service-card { padding: 16px 10px; }
    .service-card h3 { font-size: 15px; }
    .service-card p { font-size: 12px; }

    /* ========== 关于我们 ========== */
    .about-section { padding: 24px 0; }
    .about-content {
        flex-direction: column;
        gap: 20px;
        padding: 16px 0;
    }
    .about-left { max-width: 100%; }
    .about-desc { font-size: 14px; line-height: 1.6; }
    .about-right { text-align: center; }
    .about-right img { max-width: 160px; }

    /* ========== 新闻卡片 ========== */
    .news-section { padding: 24px 0; }
    .news-cards {
        flex-direction: column;
        gap: 12px;
        padding: 0 10px;
    }
    .news-card {
        flex-direction: column;
        min-width: auto;
        border-radius: 8px;
        overflow: visible;
    }
    .news-card .news-img {
        width: 100%;
        height: auto;
        object-fit: contain;
        border-radius: 8px 8px 0 0;
    }
    .news-body { padding: 12px; }
    .news-title { font-size: 15px; padding: 0 0 8px; }
    .news-desc { font-size: 12px; padding: 0; }
    .news-more { font-size: 16px; padding: 10px 0 0; }

    /* ========== 搜索下拉 ========== */
    .search-dropdown {
        min-width: 280px;
        left: -80px;
        max-height: 320px;
    }

    /* ========== 底部导航 ========== */
    .site-footer { position: relative; }
    .footer-top {
        height: auto;
        flex-direction: column;
        align-items: center;
        gap: 0;
        padding: 39px 10px;
    }
    .hotline-block {
        position: static;
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .hotline-row { flex-wrap: wrap; gap: 8px; justify-content: center; }
    .social-row { padding-left: 0 !important; gap: 12px !important; justify-content: center; }
    .social-item img { width: 50px !important; height: 50px !important; }
    .social-item span { font-size: 11px !important; }
    .phone-row { justify-content: center; }
    .contact-row { padding-left: 0 !important; }
    .contact-text { font-size: 12px; }
    .phone-img { height: 48px !important; }
    .sep-img { width: 40px; }
    .v-divider { display: none; }

    .right-nav {
        position: static !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        gap: 0;
        padding: 20px 4px 30px;
        width: 100%;
        border-top: 1px solid #333;
        margin-top: 12px;
    }
    .nav-group {
        flex: 1;
        text-align: center;
        min-width: 0;
    }
    .right-nav .nav-group .nav-label {
        display: block;
        color: #fff;
        font-size: 12px;
        font-weight: 700;
        text-decoration: none;
        cursor: pointer;
        margin-bottom: 4px;
    }
    .sub-menu {
        position: static !important;
        display: block !important;
        text-align: center;
        margin-left: 18px;
    }
    .right-nav .nav-group .sub-menu span,
    .right-nav .nav-group .sub-menu a {
        display: block;
        width: fit-content;
        margin: 0 auto;
        color: #777;
        font-size: 11px;
        line-height: 1.4;
        text-decoration: none;
    }
    .nav-group:nth-of-type(2) .sub-menu,
    .nav-group:nth-of-type(4) .sub-menu {
        margin-left: 41px;
    }

    .nav-sep {
        width: 8px !important;
        height: 1px !important;
        object-fit: cover;
        display: block;
        flex-shrink: 0;
        margin-top: 8px;
    }
    .footer-bottom { height: auto; flex-direction: column; text-align: center; gap: 8px; padding: 24px 10px; }
    .footer-copy { font-size: 12px; }

    /* ========== 返回顶部 + 客服 ========== */
    .back-top {
        width: 36px;
        height: 36px;
        bottom: 16px;
        right: 10px;
        font-size: 18px;
        border-radius: 50%;
    }
    .kefu-btn {
        width: 44px;
        height: 44px;
        bottom: 70px;
        right: 10px;
        font-size: 22px;
    }

    /* 客服聊天窗口缩小30% + 宽加15% + 居中 */
    .cs-chat {
        width: 306px !important;
        height: 403px !important;
        left: 50% !important;
        right: auto !important;
        top: 50% !important;
        bottom: auto !important;
        transform: translate(-50%, -50%) !important;
    }

    /* ========== 新闻中心页面 ========== */
    .page-banner { height: 120px !important; margin-top: 84px; }
    .news-layout { flex-direction: column; }
    .news-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e8e8e8;
    }
    .news-nav-item { padding: 14px 16px; font-size: 15px; }
    .news-content { padding: 16px 10px; }
    .news-content #newsList { grid-template-columns: 1fr; }

    /* ========== 成功案例页面 ========== */
    .case-layout { flex-direction: column; }
    .case-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e8e8e8;
    }
    .case-nav-item { padding: 12px 16px; font-size: 14px; }
    .case-content { padding: 16px 10px; }
    .case-content-placeholder,
    .news-content-placeholder { min-height: 200px; }
    .case-content-placeholder .placeholder-icon,
    .news-content-placeholder .placeholder-icon { font-size: 36px; }
    .case-grid { grid-template-columns: 1fr; }
    .case-card { height: auto; }

    /* ========== 留言表单 ========== */
    .form-row { flex-direction: column; gap: 12px; }
    .form-group { width: 100%; }
    .form-group input,
    .form-group textarea { font-size: 14px; padding: 10px; }
    .captcha-row { flex-direction: column; gap: 10px; align-items: flex-start; }
    .captcha-row .form-group { width: 100%; }
    .captcha-box canvas { width: 120px; height: 42px; }

    /* ========== 联系我们卡片 ========== */
    .contact-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px;
        padding: 0 10px;
    }
    .contact-card { padding: 20px 12px !important; }
    .contact-card .card-icon { width: 40px !important; height: 40px !important; margin-bottom: 10px !important; }
    .contact-card .card-name { font-size: 14px !important; margin-bottom: 6px !important; }
    .contact-card .card-desc { font-size: 11px !important; }

    /* ========== 页面顶部标题区 ========== */
    .page-hero { height: 160px; margin-top: 84px; }
    .page-hero h1 { font-size: 24px; }

    /* ========== 产品中心页导航 ========== */
    .prod-nav { flex-direction: column; gap: 12px; }
    .prod-nav-left { flex-direction: row; flex-wrap: wrap; gap: 6px; }
    .nav-list-item { font-size: 13px; padding: 6px 14px; }
    .prod-nav-right { padding-left: 0; }
    .nav-right-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .nav-sub-tab { font-size: 12px; padding: 6px 12px; }
    .nav-prod-card { flex-direction: column; align-items: center; padding: 14px; gap: 8px; }
    .nav-prod-card img { width: 60px; height: 60px; }
    .nav-prod-card .card-info { text-align: center; }
    .nav-prod-card .card-title { font-size: 13px; font-weight: 600; color: #222; }
    .nav-prod-card .card-sub { font-size: 11px; }
    .nav-prod-card .card-arrow { display: none; }

    /* ========== 企业文化卡片 ========== */
    .culture-cards {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        padding: 0 10px;
        margin-bottom: 40px;
    }
    .culture-card {
        flex: none !important;
        padding: 16px 8px !important;
        aspect-ratio: 1;
        justify-content: center;
    }
    .culture-card:last-child {
        grid-column: 1 / -1;
        justify-self: center;
        width: 50%;
        aspect-ratio: auto;
        min-height: 120px;
    }
    .culture-icon { width: 32px !important; height: 32px !important; margin-bottom: 8px !important; }
    .culture-title { font-size: 14px !important; margin-bottom: 4px !important; }
    .culture-desc { font-size: 11px !important; }
    .culture-section { padding: 0 10px; }
    .subsection-title { font-size: 20px !important; }
    .gallery-section { padding: 0 10px 40px !important; }
    .gallery-grid {
        grid-template-columns: 1fr !important;
        gap: 14px;
    }

    /* ========== 最终兜底：所有文本不撑破 ========== */
    input, textarea, select, button { max-width: 100%; }
    pre, code, .card-desc, .about-desc, .news-desc, p {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    /* 产品中心 — 子分类标签换行 */
    .nav-sub-tabs { flex-wrap: wrap; }

    /* ========== 通用状态组件 ========== */
    .loading-spinner { width: 36px; height: 36px; }
    .loading-text { font-size: 12px; }
    .empty-icon { font-size: 48px; }
    .empty-text { font-size: 14px; }

    /* ========== 产品详情页标题图 ========== */
    .product-header { flex-direction: column; align-items: center !important; gap: 16px !important; }
    .product-header > img { max-width: 150px !important; max-height: 150px !important; }

    /* 弹窗/预览框不超出 */
    .modal, .preview-overlay, #imgPreview {
        max-width: 100vw;
        max-height: 100vh;
    }
    #imgPreview img, .preview-overlay img {
        max-width: 90vw;
        max-height: 80vh;
        object-fit: contain;
    }
}