/* ==================== 移动端适配 ==================== */

/* 移动端响应式 */
@media (max-width: 1024px) {
    /* ==================== 轮播图适配 ==================== */
    section.top-banner .banner-inner .banner-content {
        /* 使用 padding 代替 vw 定位 */
        top: auto;
        left: 0;
        right: 0;
        bottom: 50px;
        padding: 0 30px;
        text-align: center;

        .banner-title {
            font-size: clamp(20px, 3vw, 32px);
            line-height: 1.2;
            height: auto;
        }

        .banner-subtitle {
            font-size: clamp(12px, 1.5vw, 16px);
            line-height: 1.4;
            height: auto;
            margin-top: 8px;
        }

        .banner-btn {
            margin-top: 16px;
            display: flex;
            gap: 10px;
            justify-content: center;
            flex-wrap: wrap;

            .ds-btn {
                padding: 8px 20px;
                font-size: 14px;
            }
        }
    }

    section.top-banner .banner-scroll {
        left: 50%;
        top: auto;
        bottom: 30px;
        transform: translateX(-50%) !important;

        .banner-scroll-block {
            width: 60px;
            height: 3px;
            margin-right: 6px;
        }
    }

    /* ==================== 公司介绍适配 ==================== */
    .introduction-row {
        flex-wrap: wrap;
        margin-top: 20px;
        padding: 0 15px;
        gap: 15px;

        .introduction-item {
            --img-size: 70px;
            min-width: auto;
            width: calc(50% - 8px);
            padding: 15px;

            .introduction-item-right {
                margin-left: 10px;
                margin-top: 0;
            }

            .introduction-value {
                font-size: 28px;
                line-height: 40px;
                height: 40px;

                .unit {
                    font-size: 14px;
                }
            }

            .introduction-title {
                font-size: 14px;
                line-height: 20px;
                height: auto;
                margin-top: 2px;
            }
        }
    }

    /* ==================== section-title 适配 ==================== */
    .section-item .section-title {
        padding: 0 20px;
        white-space: nowrap;

        .title {
            font-size: clamp(18px, 3vw, 24px);
            line-height: 1.3;
            height: auto;
        }

        .bg-title {
            font-size: clamp(22px, 4vw, 32px);
            height: auto;
            top: -8px;
        }

        .subtitle {
            font-size: clamp(12px, 1.8vw, 15px);
            line-height: 1.4;
            margin-top: 10px;
            white-space: normal;
        }

        .title-line {
            width: 50px;
            height: 3px;
            margin-top: 12px;
        }
    }

    /* ==================== 核心优势适配 ==================== */
    .advantage-wrap {
        padding: 50px 15px 60px;

        /* PC端布局：隐藏 */
        .advantage-pc {
            display: none;
        }

        /* 移动端布局：显示 */

        .advantage-mobile {
            display: block;
            margin-top: 15px;
            min-height: 200px;

            .swiper {
                padding: 0;
                max-width: 550px;
                margin: 0 auto;
            }

            .swiper-wrapper {
                padding: 0;
            }

            .advantage-item {
                position: relative;
                padding: 0;
                border-radius: 12px;
                overflow: hidden;
                aspect-ratio: 2 / 1;

                .advantage-item-bg {
                    position: absolute;
                    inset: 0;
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }

                .advantage-item-title,
                .summary,
                .subTitle {
                    position: relative;
                    z-index: 1;
                }

                .advantage-item-title {
                    margin-top: 0;
                    padding: 20px 20px 0;
                    display: flex;
                    align-items: center;

                    .title-icon {
                        width: 36px;
                        height: 36px;
                        object-fit: contain;
                    }

                    .title {
                        font-size: 18px;
                        line-height: 24px;
                        margin-top: 0;
                        margin-left: 12px;
                        white-space: nowrap;
                        font-weight: 600;
                        color: #ffffff;
                    }
                }

                .summary {
                    opacity: 1;
                    transform: translateY(0);
                    font-size: 15px;
                    line-height: 22px;
                    margin-top: 16px;
                    padding: 0 20px;
                    color: rgba(255, 255, 255, 0.95);
                }

                .subTitle {
                    opacity: 1;
                    transform: translateY(0);
                    font-size: 13px;
                    line-height: 20px;
                    margin-top: 12px;
                    padding: 0 20px 20px;
                    color: rgba(255, 255, 255, 0.8);
                }
            }

            /* swiper 分页器样式 */
            .swiper-pagination {
                display: flex;
                justify-content: center;
                gap: 8px;

                .swiper-pagination-bullet {
                    width: 8px;
                    height: 8px;
                    border-radius: 4px;
                    background: rgba(0, 119, 254, 0.2);
                    opacity: 1;
                    transition: all 0.3s;
                }

                .swiper-pagination-bullet-active {
                    width: 24px;
                    background: #0077fe;
                }
            }
        }
    }

    /* ==================== 精选案例适配 ==================== */
    .case-wrap {
        padding: 40px 0 60px;

        .case-tabs {
            flex-wrap: wrap;
            gap: 12px;
            margin-top: 20px;
            padding: 0 15px;

            .case-tab-item {
                --icon-size: 22px;
                padding: 10px 16px;
                min-width: 125px;

                .case-tab-title {
                    font-size: 13px;
                }
            }
        }

        .case-content-area {
            margin-top: 20px;
            padding: 0 15px;

            .case-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;

                .case-item {
                    border-radius: 8px;

                    .case-item-img {
                        aspect-ratio: 4 / 3;
                    }

                    .case-item-title {
                        padding: 10px;
                        font-size: 13px;
                        line-height: 18px;

                        .title-link {
                            font-size: 11px;
                        }
                    }
                }
            }
        }
    }

    /* ==================== 我们的服务适配 ==================== */
    .service-wrap {
        padding: 50px 0 60px;

        .service-container {
            margin-top: 20px;

            /* 服务菜单 */
            .service-sidebar {
                gap: 12px;
                padding: 0 15px;

                .service-sidebar-item {
                    min-width: auto;
                    width: calc(50% - 6px);
                    padding: 14px 12px;

                    .service-item-icon {
                        width: 24px;
                        height: 24px;
                    }

                    .service-item-title {
                        font-size: 14px;
                        line-height: 20px;
                        height: auto;
                        margin-left: 8px;
                    }
                }
            }

            /* 内容区域 */
            .content-area {
                width: 100%;
                height: auto;
                position: relative;
                margin: 30px 0 0;
                padding: 0 15px;

                .service-content-item {
                    position: relative;
                    height: auto;
                    width: 100%;
                    display: flex;
                    flex-direction: column;

                    &:not(.active) {
                        display: none;
                    }

                    .service-content-img {
                        width: 100%;
                        height: auto;
                        flex-shrink: 0;
                        margin-bottom: 20px;
                        .img {
                            height: auto;
                            object-fit: unset;
                            object-position: unset;
                        }
                    }

                    .service-content-right {
                        margin-left: 0;
                        flex: 1;
                        width: 100%;

                        .item-title {
                            font-weight: 600;
                            line-height: 32px;
                            height: auto;

                            .idx {
                                font-size: 20px;
                                vertical-align: middle;
                            }

                            .text {
                                font-size: 18px;
                                margin-left: 4px;
                            }
                        }

                        .item-subtitle {
                            font-size: 14px;
                            line-height: 22px;
                            margin-top: 8px;
                            padding-right: 0;
                        }

                        .item-line {
                            height: 2px;
                            background-color: #f6f6f6;
                            margin-top: 16px;

                            &::before {
                                width: 32px;
                                height: 4px;
                                top: -3px;
                            }
                        }

                        .item-list {
                            padding-right: 0;
                            margin-top: 20px;

                            .list-li-title {
                                margin-bottom: 8px;
                                padding-left: 28px;
                                font-size: 15px;
                                line-height: 22px;
                                background-size: 18px 16px;
                                background-position-y: 4px;
                            }

                            .list-li-text {
                                margin-bottom: 12px;
                                padding-left: 28px;
                                font-size: 14px;
                                line-height: 22px;
                            }
                        }

                        .item-more {
                            margin-top: 10px;
                            width: 140px;
                            height: 44px;
                        }
                    }
                }
            }
        }
    }

    /* ==================== 新闻资讯适配 ==================== */
    .news-wrap {
        padding: 50px 0 60px;

        .news-container {
            padding: 0 15px;

            /* 新闻侧边栏 */
            .news-sidebar {
                gap: 10px 13px;
                padding: 0 5px;
                margin-top: 18px;
                justify-content: center;

                .news-sidebar-item {
                    font-size: 15px;
                    font-weight: 500;
                    padding: 8px 16px;
                    background: #f5f7fb;
                    border-radius: 6px;
                    transition: all 0.3s;

                    &:first-of-type {
                        font-size: 15px;
                        background: var(--primary-color);
                        color: #ffffff;
                    }

                    /* JS加载后：由 .active 控制激活状态 */
                    body.js-loaded & {
                        &:first-of-type:not(.active) {
                            font-size: 15px;
                            color: var(--title-color);
                            background: #f5f7fb;
                        }
                    }

                    &.active {
                        font-size: 15px;
                        background: var(--primary-color);
                        color: #ffffff;
                    }

                    &:not(:first-child) {
                        &::before {
                            content: '';
                            margin: 0;
                            display: none;
                        }
                    }
                }
            }

            /* 新闻内容区域 */
            .content-area {
                height: auto;
                position: relative;
                margin: 25px 0 0;

                .news-content-item {
                    position: relative;
                    height: auto;
                    width: 100%;
                    display: flex;
                    flex-direction: column;

                    &:not(.active) {
                        display: none;
                    }

                    .news-info {
                        display: flex;
                        padding: 16px;
                        border-radius: 8px;
                        margin-bottom: 12px;

                        .news-date {
                            flex-shrink: 0;
                            text-align: center;
                            padding-right: 12px;

                            .date-day {
                                height: auto;
                                line-height: 1;
                                font-weight: 600;
                                font-size: 24px;
                                color: var(--text-color);
                            }

                            .date-year {
                                height: auto;
                                line-height: 1.2;
                                font-size: 12px;
                                margin-top: 8px;
                            }
                        }

                        .news-title-link {
                            margin-left: 12px;
                            flex: 1;
                            width: 0;

                            .title {
                                font-weight: 600;
                                font-size: 15px;
                                color: var(--text-color);
                                line-height: 1.4;
                                height: auto;
                                margin-top: 0;
                            }

                            .subtitle {
                                height: auto;
                                line-height: 1.4;
                                font-weight: 400;
                                font-size: 13px;
                                color: #666666;
                                margin-top: 6px;
                            }
                        }
                    }

                    .news-left {
                        width: 100%;
                        overflow: hidden;

                        .news-img {
                            width: 100%;
                            height: auto;
                            aspect-ratio: 16 / 9;
                            margin-bottom: 0;

                            .img {
                                width: 100%;
                                height: 100%;
                                display: block;
                                object-fit: cover;
                                border-radius: 8px;
                            }
                        }

                        .news-info {
                            margin-top: 12px;
                            background: transparent;
                            padding: 12px 0;
                        }
                    }

                    .news-right {
                        margin-left: 0;
                        flex: 1;

                        .news-info {
                            padding: 12px 0 !important;
                            padding-bottom: 0;

                            &:not(:last-child) {
                                .news-title-link {
                                    &::after {
                                        display: none;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    /* ==================== 合作流程适配 ==================== */
    .collaborative-wrap {
        padding: 50px 0 60px;

        .collaborative-container {
            --item-width: auto;
            --item-gap: 20px;
            max-width: 100%;
            grid-template-columns: repeat(2, 1fr);
            padding: 0 15px;
            gap: 20px;
            margin: 30px auto 0;

            .collaborative-item {
                display: flex;
                flex-direction: column;
                align-items: center;
                text-align: center;

                .item-img {
                    width: 60px;
                    height: 60px;

                    .img {
                        width: 100%;
                        height: 100%;
                        display: block;
                    }
                }

                .item-title {
                    margin-top: 12px;
                    font-size: 18px;
                    line-height: 1.4;
                    height: auto;
                }

                .item-subtitle {
                    margin-top: 8px;
                    font-size: 14px;
                    line-height: 1.5;
                }
            }
        }
    }

    /* ==================== 合作企业适配 ==================== */
    .cooperation-wrap {
        padding: 50px 0 60px;

        .cooperation-container {
            grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
            padding: 0 35px;
            gap: 30px 20px;
            margin-top: 30px;

            .cooperation-item {
                height: 46px;

                .img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    display: block;
                }
            }
        }
    }

    /* ==================== 使命愿景适配 ==================== */
    .vision-wrap {
        min-height: auto;
        padding: 40px 15px;
        justify-content: center;
        gap: 20px;

        .vision-item {
            width: calc(50% - 10px);
            flex-direction: column;
            align-items: center;
            text-align: center;

            .item-icon {
                width: 50px;
                height: 50px;

                .img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    display: block;
                }
            }

            .item-info {
                margin-left: 0;
                width: 100%;
                margin-top: 12px;

                .item-title {
                    font-weight: 600;
                    font-size: 16px;
                    color: var(--title-color);
                    height: auto;
                    line-height: 1.4;
                }

                .item-subtitle {
                    color: #666666;
                    margin-top: 6px;
                    line-height: 1.5;
                    font-size: 13px;
                }
            }
        }
    }
}

/* 小屏幕优化 */
@media (max-width: 768px) {
    /* ==================== 轮播图小屏幕适配 ==================== */
    section.top-banner {
        .banner-inner .banner-content {
            .banner-title {
                font-size: 20px;
            }

            .banner-subtitle {
                font-size: 13px;
            }

            .banner-btn {
                margin-top: 16px;

                .ds-btn {
                    font-size: 13px;
                    height: 40px;
                    padding-top: 0;
                    padding-bottom: 0;
                }
            }
        }

        .banner-scroll {
            bottom: 20px;

            .banner-scroll-block {
                width: 40px;
                height: 3px;
                margin-right: 4px;
            }
        }
    }

    /* ==================== 公司介绍小屏幕适配 ==================== */
    .introduction-row {
        .introduction-item {
            --img-size: 55px;
            padding: 13px;

            .introduction-item-right {
                margin-left: 8px;
            }

            .introduction-value {
                font-size: 24px;
                line-height: 34px;
                height: 34px;

                .unit {
                    font-size: 12px;
                }
            }

            .introduction-title {
                font-size: 13px;
                line-height: 18px;
            }
        }
    }

    /* ==================== 核心优势小屏幕适配 ==================== */
    .advantage-wrap {
        padding: 40px 10px 50px;

        .advantage-mobile {
            .swiper {
                padding: 0;
                max-width: 550px;
                margin: 0 auto;
            }

            .advantage-item {
                aspect-ratio: 2 / 1;

                .advantage-item-title {
                    padding: 16px 16px 0;

                    .title-icon {
                        width: 32px;
                        height: 32px;
                    }

                    .title {
                        font-size: 16px;
                        line-height: 22px;
                        margin-left: 10px;
                    }
                }

                .summary {
                    font-size: 14px;
                    line-height: 20px;
                    margin-top: 12px;
                    padding: 0 16px;
                }

                .subTitle {
                    font-size: 12px;
                    line-height: 18px;
                    margin-top: 10px;
                    padding: 0 16px 16px;
                }
            }

            .swiper-pagination {
                .swiper-pagination-bullet {
                    width: 7px;
                    height: 7px;
                }

                .swiper-pagination-bullet-active {
                    width: 20px;
                }
            }
        }
    }

    /* ==================== 我们的服务小屏幕适配 ==================== */
    .service-wrap {
        padding: 40px 0 50px;

        .service-container {
            /* 服务菜单 */
            .service-sidebar {
                gap: 10px;
                padding: 0 10px;

                .service-sidebar-item {
                    width: calc(50% - 5px);
                    padding: 12px 10px;

                    .service-item-icon {
                        width: 22px;
                        height: 22px;
                    }

                    .service-item-title {
                        font-size: 13px;
                        line-height: 18px;
                    }
                }
            }

            /* 内容区域 */
            .content-area {
                margin-top: 25px;
                padding: 0 10px;

                .service-content-item {
                    .service-content-img {
                        margin-bottom: 16px;
                    }

                    .service-content-right {
                        .item-title {
                            line-height: 28px;

                            .idx {
                                font-size: 18px;
                            }

                            .text {
                                font-size: 16px;
                            }
                        }

                        .item-subtitle {
                            font-size: 13px;
                            line-height: 20px;
                            margin-top: 6px;
                        }

                        .item-line {
                            margin-top: 12px;

                            &::before {
                                width: 28px;
                                height: 3px;
                            }
                        }

                        .item-list {
                            margin-top: 16px;

                            .list-li-title {
                                margin-bottom: 6px;
                                padding-left: 26px;
                                font-size: 14px;
                                line-height: 20px;
                                background-size: 16px 14px;
                            }

                            .list-li-text {
                                margin-bottom: 10px;
                                padding-left: 26px;
                                font-size: 13px;
                                line-height: 20px;
                            }
                        }

                        .item-more {
                            margin-top: 5px;
                            width: 120px;
                            height: 40px;
                        }
                    }
                }
            }
        }
    }

    /* ==================== 合作流程小屏幕适配 ==================== */
    .collaborative-wrap {
        padding: 40px 0 50px;

        .collaborative-container {
            padding: 0 5px;
            gap: 15px 20px;
            margin: 26px auto 0;

            .collaborative-item {
                .item-img {
                    width: 50px;
                    height: 50px;
                }

                .item-title {
                    font-size: 16px;
                }

                .item-subtitle {
                    font-size: 13px;
                    margin-top: 5px;
                }
            }
        }
    }

    /* ==================== 合作企业小屏幕适配 ==================== */
    .cooperation-wrap {
        padding: 40px 0 50px;

        .cooperation-container {
            grid-template-columns: repeat(auto-fill, minmax(93px, 1fr));
            padding: 0 13px;
            gap: 25px 15px;
            margin-top: 25px;

            .cooperation-item {
                height: 41px;
            }
        }
    }

    /* ==================== 使命愿景小屏幕适配 ==================== */
    .vision-wrap {
        padding: 30px 10px;
        gap: 15px;

        .vision-item {
            .item-icon {
                width: 45px;
                height: 45px;
            }

            .item-info {
                margin-top: 10px;

                .item-title {
                    font-size: 15px;
                }

                .item-subtitle {
                    margin-top: 4px;
                    font-size: 12px;
                }
            }
        }
    }
}