/* ============================================================
   越洋通达官网 - 移动端/多端响应式补丁
   说明：本文件最后加载，专门修复旧版固定像素布局在
   手机（≤768px）与平板（≤992px）下的展示问题。
   断点策略：992px（平板竖屏及以下）、576px（小屏手机微调）
   ============================================================ */

/* ---------- 桌面端：移动端专属元素默认隐藏 ---------- */
.lc-mobile { display: none; }

/* ---------- 平板竖屏及以下（≤992px） ---------- */
@media (max-width: 992px) {

    /* Banner 图片：裁切偏移向左侧文字区，避免横幅文字被切 */
    .fullSlide .bd li a img { object-position: 28% center !important; }

    /* 下单流程：隐藏横向流程图，显示文字版步骤 */
    .dzlc .lc { display: none !important; }
    .lc-mobile { display: block !important; margin-top: 24px; }
    .lc-steps { list-style: none; padding: 0; margin: 0; }
    .lc-steps li {
        background: #fff;
        border-left: 4px solid #004d9f;
        border-radius: 8px;
        padding: 14px 18px;
        margin-bottom: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }
    .lc-steps li strong { display: block; color: #1a202c; font-size: 16px; margin-bottom: 4px; }
    .lc-steps li span { color: #4a5568; font-size: 13.5px; line-height: 1.7; }

    /* 1. 全局容器：固定 1200px → 流式 */
    .w1200,
    #content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    #content {
        margin: 20px auto !important;
        padding: 0 12px !important;
        overflow: hidden;
    }

    /* 2. 顶部欢迎条 */
    .hed { padding: 6px 12px !important; }
    .hed .hyy { font-size: 12px !important; float: none !important; text-align: center; }

    /* 3. 首页 Banner 轮播：1920px 居中裁切 → 100% 流式 */
    .fullSlide { height: 240px !important; }
    .fullSlide .bd {
        width: 100% !important;
        left: 0 !important;
        margin-left: 0 !important;
    }
    .fullSlide .bd li,
    .fullSlide .bd li a { height: 240px !important; }
    .fullSlide .hd { height: 30px !important; }

    /* 4. 服务优势区（首页 con2）：三列/两列浮动 → 纵向堆叠 */
    .con2 { padding: 40px 0 !important; }
    .con2 .ys1,
    .con2 .ys2 {
        width: 100% !important;
        height: auto !important;
        margin-top: 20px !important;
    }
    .con2 .ys1 dl {
        width: 100% !important;
        height: auto !important;
        float: none !important;
        margin: 0 0 16px 0 !important;
        padding-bottom: 24px;
    }
    .con2 .ys1 dl img {
        width: 100% !important;
        height: auto !important;
        max-height: 220px;
        object-fit: cover;
    }
    .con2 .ys1 dl .dd1 { font-size: 22px !important; margin-top: 20px !important; }
    .con2 .ys1 dl .dd3 { padding: 0 16px; }
    .con2 .ys2 dl {
        width: 100% !important;
        height: auto !important;
        float: none !important;
        margin: 0 0 16px 0 !important;
        overflow: hidden;
    }
    .con2 .ys2 dl dt {
        width: 100% !important;
        height: auto !important;
        float: none !important;
    }
    .con2 .ys2 dl dt img {
        width: 100% !important;
        height: auto !important;
        max-height: 220px;
        object-fit: cover;
    }
    .con2 .ys2 dl dd {
        width: auto !important;
        float: none !important;
        margin-left: 0 !important;
        padding: 0 20px;
    }
    .con2 .ys2 dl .dd1 { font-size: 22px !important; margin-top: 18px !important; }
    .con2 .ys2 dl .dd3 { width: auto !important; margin-bottom: 20px; }

    /* 5. 下单流程：移动端隐藏横向图片，由 .lc-mobile 文字版替代 */
    .dzlc { padding: 40px 0 !important; }
    .dzlc .bt { font-size: 26px !important; background-size: contain !important; }

    /* 6. 关于我们区（首页 con4）：左右 960px 绝对定位 → 上下堆叠 */
    .con4 .ab { height: auto !important; }
    .con4 .img,
    .con4 .nr {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
    }
    .con4 .img img {
        width: 100% !important;
        height: auto !important;
        display: block;
    }
    .con4 .nr { padding-bottom: 10px; }
    .con4 .nr dl {
        width: auto !important;
        margin: 0 !important;
        padding: 26px 20px 30px !important;
    }
    .con4 .nr dl dt { font-size: 24px !important; margin-top: 0 !important; }
    .con4 .nr dl .dd1 {
        width: auto !important;
        height: auto !important;
        line-height: 26px !important;
        font-size: 14px;
    }
    .con4 .nr dl .dd2 a { margin: 24px auto 0 !important; }

    /* 7. 页脚：三栏浮动 → 纵向堆叠居中 */
    .bot { padding-top: 40px !important; }
    .bot .nr { padding: 0 20px; box-sizing: border-box; }
    .bot1, .bot2, .bot3 {
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
        margin-bottom: 28px !important;
        text-align: center;
    }
    .bot1 .menu { width: 100% !important; }
    .bot1 .menu a {
        width: 33.33% !important;
        float: left !important;
        line-height: 36px !important;
        font-size: 14px !important;
    }
    .bot2 .tact p { text-align: center; }
    .bot3 img { max-width: 140px; height: auto; }
    .bot3 p { margin-top: 6px; }
    .bot4 {
        font-size: 12px !important;
        line-height: 22px !important;
        text-align: center !important;
        padding: 12px 10px !important;
    }

    /* 8. 内页框架：左栏 235px + 内容区 → 上下布局 */
    .box_left {
        width: 100% !important;
        float: none !important;
        margin-bottom: 20px;
    }
    .mode1 { width: 100% !important; }
    .mode1 .box_tt1,
    .mode1 .box_tt1 .box_li { width: 100% !important; }
    .sidebar, .column {
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
    }

    /* 9. 内页 Banner */
    .nyBanner { height: 160px !important; }
    .nyBanner img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* 10. 通用防溢出 */
    img { max-width: 100%; height: auto; }
    table { max-width: 100% !important; }
    body { overflow-x: hidden; }
}

/* ---------- 小屏手机微调（≤576px） ---------- */
@media (max-width: 576px) {

    /* Banner 进一步压低，保证首屏可见内容 */
    .fullSlide { height: 200px !important; }
    .fullSlide .bd li,
    .fullSlide .bd li a { height: 200px !important; }

    /* 标题字号收敛 */
    .dzlc .bt { font-size: 22px !important; }
    .con2 .bt { background-size: contain !important; }

    /* 页脚导航两列 */
    .bot1 .menu a { width: 50% !important; }

    /* 内页 banner */
    .nyBanner { height: 120px !important; }

    /* 联系条网格已用 auto-fit，无需干预；仅收紧间距 */
    .core-business-section { padding: 40px 12px !important; }
}

/* ---------- 触屏体验优化（所有移动端） ---------- */
@media (hover: none) and (pointer: coarse) {
    /* 触屏可点目标最小 44px（百度移动体验要求） */
    .bot1 .menu a { min-height: 44px; line-height: 44px !important; }
    .mode1 .box_t_con ul li a { min-height: 48px; }
}