/* 轮播图 — Bootstrap 5 适配版 */
.bs-slider {
    opacity: 1 !important;overflow:hidden;max-height:500px;position:relative;background:#000;margin-top:98px}
.bs-slider:hover{cursor:-moz-grab;cursor:-webkit-grab}
.bs-slider:active{cursor:-moz-grabbing;cursor:-webkit-grabbing}
.bs-slider .bs-slider-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.4)}
.bs-slider>.carousel-inner>.carousel-item>a>img,.bs-slider>.carousel-inner>.carousel-item>img{margin:auto;width:100%!important}
.carousel-fade .carousel-item{top:0;z-index:1;opacity:0;width:100%;position:absolute;left:0!important;display:block!important;-webkit-transition:opacity ease-in-out 1s;-moz-transition:opacity ease-in-out 1s;-ms-transition:opacity ease-in-out 1s;-o-transition:opacity ease-in-out 1s;transition:opacity ease-in-out 1s}
.carousel-fade .carousel-item:first-child{top:auto;position:relative}
.carousel-fade .carousel-item.active{opacity:1;z-index:2;-webkit-transition:opacity ease-in-out 1s;-moz-transition:opacity ease-in-out 1s;-ms-transition:opacity ease-in-out 1s;-o-transition:opacity ease-in-out 1s;transition:opacity ease-in-out 1s}
.control-round .carousel-control-prev,.control-round .carousel-control-next{top:47%;opacity:0;width:45px;height:45px;z-index:100;color:#fff;display:flex !important;font-size:24px;cursor:pointer;overflow:hidden;line-height:43px;text-shadow:none;position:absolute;font-weight:400;background:0 0;-webkit-border-radius:100px;border-radius:100px;transition:opacity .3s ease}
.control-round:hover .carousel-control-prev,.control-round:hover .carousel-control-next{opacity:1}
.control-round .carousel-control-prev{left:1%}
.control-round .carousel-control-next{right:1%}
.control-round .carousel-control-prev:hover,.control-round .carousel-control-next:hover{color:#fdfdfd;background:rgba(0,0,0,.5);border:0}
.control-round .carousel-control-prev>span:nth-child(1){left:auto}
.control-round .carousel-control-next>span:nth-child(1){right:auto}
.indicators-line>.carousel-indicators{right:1%;bottom:1%;left:auto;width:90%;height:20px;font-size:0;overflow-x:auto;text-align:right;overflow-y:hidden;padding-left:10px;padding-right:10px;padding-top:1px;white-space:nowrap}
.indicators-line>.carousel-indicators li{padding:0;width:15px;height:15px;border:1px solid #9e9e9e;text-indent:0;overflow:hidden;text-align:left;position:relative;letter-spacing:1px;background:#9e9e9e;-webkit-font-smoothing:antialiased;-webkit-border-radius:50%;border-radius:50%;margin-right:5px;-webkit-transition:all .5s cubic-bezier(.22,.81,.01,.99);transition:all .5s cubic-bezier(.22,.81,.01,.99);z-index:10;cursor:pointer}
.indicators-line>.carousel-indicators li:last-child{margin-right:0}
.indicators-line>.carousel-indicators .active{margin:1px 5px 1px 1px;box-shadow:0 0 0 2px #fff;background-color:transparent;position:relative;-webkit-transition:box-shadow .3s ease;-moz-transition:box-shadow .3s ease;-o-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-transition:background-color .3s ease;-moz-transition:background-color .3s ease;-o-transition:background-color .3s ease;transition:background-color .3s ease}
.indicators-line>.carousel-indicators .active:before{transform:scale(.5);background-color:#fff;content:"";position:absolute;left:-1px;top:-1px;width:15px;height:15px;border-radius:50%;-webkit-transition:background-color .3s ease;-moz-transition:background-color .3s ease;-o-transition:background-color .3s ease;transition:background-color .3s ease}
.slide-video{position:relative;width:100%;height:100%}
.slide-video video,.slide-video .d-block{width:100%;height:100%;object-fit:cover;object-position:center}
.slide_style_left{text-align:left!important}
.slide_style_right{text-align:right!important}
.slide_style_center{text-align:left!important}
.carousel-caption{left:0;top:12%;right:0;margin:auto;padding:10px 85px;position:absolute;text-align:center}
.carousel-caption h2{padding:0;color:#fff;font-size:3.5rem;font-style:normal;line-height:3rem;margin:.67em 0;letter-spacing:1px;display:inline-block;-webkit-animation-delay:.7s;animation-delay:.7s}
.carousel-caption>p{padding:0;color:#fff;font-size:20px;text-align:center;line-height:24px;font-weight:300;margin-bottom:40px;letter-spacing:1px;-webkit-animation-delay:1.1s;animation-delay:1.1s}
.carousel-caption>a.btn-secondary{color:#000;font-weight:400;font-size:13px;line-height:15px;margin-right:10px;text-align:left;padding:17px 30px;white-space:nowrap;letter-spacing:1px;display:inline-block;border:0;text-transform:uppercase;-webkit-animation-delay:2s;animation-delay:2s;-webkit-transition:background .3s ease-in-out,color .3s ease-in-out;transition:background .3s ease-in-out,color .3s ease-in-out}
.carousel-caption>a.btn-primary{color:#fff;cursor:pointer;font-weight:400;font-size:13px;line-height:15px;margin-left:10px;text-align:left;padding:17px 30px;white-space:nowrap;letter-spacing:1px;background:#00bfff;display:inline-block;text-decoration:none;text-transform:uppercase;border:0;-webkit-animation-delay:2s;animation-delay:2s;-webkit-transition:background .3s ease-in-out,color .3s ease-in-out;transition:background .3s ease-in-out,color .3s ease-in-out}
.carousel-caption>a:active,.carousel-caption>a:hover{color:#fff;background:#222;-webkit-transition:background .5s ease-in-out,color .5s ease-in-out;transition:background .5s ease-in-out,color .5s ease-in-out}
/* 产品卡片 */
.purchase{padding:30px 0 20px;background:url(//img.changhaihuanbao.com/img/breadcrumbs.png) repeat;box-shadow:inset 0 0 4px #eee}
.newtd{margin:0 5px;min-height:80px}
.newtd dt{float:left;clear:left;width:125px}
.newtd dd{margin-left:140px}
.newtd h4{line-height:17px;height:17px;overflow:hidden;position:relative;margin:0 0 10px 0;font-size:105%}
.newtd p{margin:0;line-height:16px;height:32px;overflow:hidden;position:relative;font-size:85%}
.solve-head{height:200px;color:#fff;overflow:hidden;background-size:cover}
.solve-head h3{margin:30px}
.solve-head span{padding: 0 30px;display:block;}
.sh-img1{background-image:url(//img.changhaihuanbao.com/img/solve-head-1.jpg);margin-bottom: 1px;}
.sh-img2{background-image:url(//img.changhaihuanbao.com/img/solve-head-2.jpg);margin-bottom: 1px}
.solve-body-card{border:1px solid #ededed;float:left;color:#181818;height:160px;padding:1px}
.sovle-body-card-title{margin:21px;color:#181818;font-size:17.5px}
.solve-body-card span{margin:0 18px;display:block;height:40px}
.sbc-btn{width:100%;margin-top:20px}
.solve-body-card:hover{border:1px solid #0087d7;box-shadow:0 2px 2px rgba(0, 0, 0, 0.3);transition:all 0.3s linear}
.solve-body-card:hover .sovle-body-card-title,.solve-body-card:hover .sovle-body-card-title a{color:#0087d7}
.solve-body-card:hover .sbc-btn{background-color:#0087d7;color:#fff}

/* 设备和技术 */
.what-we-do-best{display:flex!important;flex-wrap:wrap}  /* BS5 Flex 布局修复 */
.what-we-do-left{flex:0 0 34%;max-width:34%}
.what-we-do-right{flex:1}  /* 自动填充剩余空间 */
.what-we-do-best{text-align:left;background-image:url("//img.changhaihuanbao.com/img/webp/what-we-do-best-bg.webp"),url("//img.changhaihuanbao.com/img/what-we-do-best-bg.jpg");background-size: cover;}
.what-we-do-left{position:relative}
.what-we-do-left>img{max-width: 100%}
.what-we-do-best-left::before{position:absolute;content:"";left:0;right:0;top:0;bottom:0;background-color:#181818;opacity:.15}
.what-we-do-right {display:flex;flex-wrap:wrap;background-color:#fff;max-width: 100%}
.what-we-do-right>.what-we-do-card {overflow:hidden;display:flex;flex-direction:column;flex:0 0 33.333%!important;min-width:0}
.what-we-do-card{position:relative;overflow:hidden;display:block;text-decoration:none;color:inherit}
.what-we-do-block{background-color:#f9fcff;border-right:1px solid #eff3f7;border-bottom:1px solid #eff3f7;position:relative;display:inline-block;width:100%}
.what-we-do-block p,.what-we-do-block-content h5,.what-we-do-block-content i img,.what-we-do-block::after,.what-we-do-block>img{-webkit-transition:all 1s ease 0s;-moz-transition:all 1s ease 0s;-o-transition:all 1s ease 0s;transition:all 1s ease 0s}
.what-we-do-block::after{position:absolute;content:"";left:0;right:0;top:0;bottom:0;background-color:#282828;opacity:0;border-color:transparent}
.what-we-do-block>img{opacity:0;position:relative}
.what-we-do-block:hover::after{opacity:.8}
.what-we-do-block:hover img{opacity:1}
.what-we-do-block-content{position:absolute;left:0;right:0;top:50%;-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);z-index:1;padding:0 10px;text-align: center}
.what-we-do-block-content i{display:block;margin:0 auto 10px;z-index:1;font-size:3rem;color:#0087d7;overflow:hidden;position:relative}
.what-we-do-block-content h5{display:inline-block;width:100%;font-size:18px;color:#000;font-weight:600;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;margin-top:0;z-index:1;position:relative}
.what-we-do-block p,.what-we-do-title .what-we-do-block p,.what-we-do-title .what-we-do-block:hover p{color:#333;position:relative}
.what-we-do-block:hover h5,.what-we-do-block:hover p{color:#fff;z-index:1}
.what-we-do-title .what-we-do-block:hover::after{display:none}
.what-we-do-title .what-we-do-block{background-color:#fff}
.what-we-do-title .what-we-do-block h3{color:#222;font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:2px}
/* 移动端：每行 2 个产品 */
@media (max-width:575.98px){.what-we-do-right>.what-we-do-card{flex:0 0 50%!important;max-width:50%!important}}

/* 新闻动态 */
.index-news-trends{text-align:left;background-image:url(//img.changhaihuanbao.com/img/webp/index-news-trends.webp),url(//img.changhaihuanbao.com/img/index-news-trends.jpg);background-size:cover}
.index-news-trends-right{position:relative}
.index-news-trends-right>img{max-width:100%}
.index-news-trends-left{text-align:left;background-color:#fff}
/* =============================================
   区块3：行业解决方案 - Swiper 样式
   ============================================= */
.solution-box {background: #373d41}
/* 容器 */
#solution-swiper {
    max-width: 1560px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

/* 左右箭头按钮 */
#solution-swiper .swiper-button-next,
#solution-swiper .swiper-button-prev {
    width: 50px;
    height: 100%;
    top: 0;
    bottom: 0;
    margin: 0;
    background: rgba(0,0,0,0.1);
    color: rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    transition: background 0.3s, color 0.3s;
}
#solution-swiper .swiper-button-next::after,
#solution-swiper .swiper-button-prev::after { display: none; }
#solution-swiper .swiper-button-prev::before { content: "\e607"; color: inherit; }
#solution-swiper .swiper-button-next::before { content: "\e604"; color: inherit; }
#solution-swiper .swiper-button-prev { left: 0; right: auto; }
#solution-swiper .swiper-button-next { right: 0; left: auto; }
#solution-swiper .swiper-button-next:hover,
#solution-swiper .swiper-button-prev:hover { background: rgba(0,102,206,0.8); color: #fff; }

/* 卡片 */
.solution-swiper-slide {
    height: 140px;
    overflow: hidden;
    position: relative;
}
.solution-swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 悬浮层 */
.solution-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.5);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    transition: background 0.3s;
    /* padding: 20px; */
}
.solution-swiper-slide:nth-child(2) .solution-overlay,
.solution-swiper-slide:nth-child(4) .solution-overlay { background: rgba(0,0,0,0.75); }
.solution-overlay i {font-size: 36px;opacity: 1;/* margin-bottom: 10px; */transition: transform 0.3s;}
.solution-overlay hr { width: 30px; height: 2px; background: #fff; border: none; margin: 8px auto; }
.solution-overlay h3 { font-size: 1.2rem; margin: 0; }
.solution-overlay p { width: 80%; font-size: 16px; margin: 8px 0; }
.solution-overlay a {
    position: absolute;
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 16px;
    line-height: 32px;
    width: 120px;
    text-align: center;
    color: #fff;
    border: 2px solid #fff;
    text-decoration: none;
}
.solution-overlay a:hover { background: #fff; color: #373d41; }

/* hover 效果（初始隐藏 p 和 a） */
.solution-overlay p,
.solution-overlay a { opacity: 0; transition: opacity 0.3s, background 0.3s, color 0.3s; }
#solution-swiper .solution-swiper-slide:hover .solution-overlay { background: rgba(52,137,219,0.8); }
#solution-swiper .solution-swiper-slide:hover .solution-overlay i { transform: translateY(-10px); }
#solution-swiper .solution-swiper-slide:hover .solution-overlay p,
#solution-swiper .solution-swiper-slide:hover .solution-overlay a { opacity: 1; }

/* 响应式 */
@media (min-width: 1025px) and (max-width: 1440px) {
    #solution-swiper { max-width: 1140px; }
    .solution-swiper-slide { height: 220px; }
}
@media (min-width: 768px) and (max-width: 1024px) {
    #solution-swiper { max-width: 760px; }
    .solution-swiper-slide { height: 260px; }
    #solution-swiper .swiper-button-next,
    #solution-swiper .swiper-button-prev { display: none; }
    .solution-overlay i { font-size: 40px; }
    .solution-overlay h3 { font-size: 18px; }
    .solution-overlay p { font-size: 12px; }
}
@media (max-width: 767px) {
    #solution-swiper { max-width: 100%; }
    .solution-swiper-slide { height: 200px; }
    #solution-swiper .swiper-button-next,
    #solution-swiper .swiper-button-prev { display: none; }
    .solution-overlay p { font-size: 13px; }
}
@media (max-width: 480px) {
    .solution-swiper-slide { height: 200px; }
}

/* =============================================
   区块5：客户Logo墙 - 增强版
   ============================================= */

.home-logo-wall {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
    padding: 36px 12px;
    background-color: #0d6efd;
}
@media (max-width: 991px) {
    .home-logo-wall { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 575.98px) {
    .home-logo-wall { grid-template-columns: repeat(2, 1fr); }
}

.logo-list{height:72px;display:flex;justify-content:center;align-items:center;padding:0 12px;background:rgba(255,255,255,.15);transition:background .3s}
.logo-link{display:flex;align-items:center;justify-content:center;width:100%;height:100%;opacity:.75;filter:grayscale(100%) brightness(2);transition:opacity .3s,filter .3s,transform .3s}
.logo-list:hover .logo-link{opacity:1;filter:grayscale(0%) brightness(1);transform:scale(1.08)}
.logo-link img{max-height:48px;max-width:100%;object-fit:contain;display:block}

/* 响应式 */
@media (max-width:991px){.home-logo-wall{padding:10px}
.logo-list{height:60px;padding:0 8px}
.logo-link img{max-height:40px}
}
@media (max-width:575.98px){.logo-list{height:52px}
.logo-link img{max-height:36px}
}

/* =============================================
   区块6：企业实力 - BS5 适配版
   ============================================= */
.section-teal{background-color:#fff}
.feature-head{padding:15px;text-align:center}
.feature-head h2{font-size:28px;font-weight:600;color:#181818;margin-top:40px;margin-bottom:20px}
.hgcz_r{/* max-width:1200px; */margin:0 auto;padding:0 15px}
ul.zr{list-style:none;padding:40px 0 0 0;margin:0}
.hgcz_r_l{padding:0 20px;border-right:1px solid #dadee4}
.hgcz_r_l p{font-size:24px;line-height:36px;color:#181818;margin-bottom:0}
.hgcz_r_l_line{background:#0087d7;width:40px;height:3px;margin:10px 0}
.hgcz_r_l span{font-size:14px;color:#666;line-height:1.7}
@media (min-width:992px){ul.zr li:nth-child(-1n+3) .hgcz_r_l{border-right:1px solid #dadee4}
ul.zr li:last-child .hgcz_r_l{border-right:none}
}
@media (max-width:991px){.feature-head h2{font-size:24px;margin-top:20px}
.hgcz_r_l{padding:0 12px;border-right:none;margin-bottom:24px}
ul.zr li .hgcz_r_l{border-right:none}
}
@media (max-width:767px){.feature-head h2{font-size:20px;margin-top:16px;margin-bottom:12px}
.hgcz_r_l p{font-size:20px;line-height:28px}
}


/* bottomsvg 响应式（保留） */
@media (max-width: 767px) {
    .bottomsvg .row .col-lg-9,
    .bottomsvg .row .col-lg-3 {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 12px;
    }
}

/* =============================================
   幻灯片视频手机适配
   ============================================= */
@media (max-width: 767px) {
    .bs-slider {
        max-height: 260px;
    }
    .bs-slider > .carousel-inner > .carousel-item > .slide-video {
        height: 260px;
    }
    .bs-slider > .carousel-inner > .carousel-item > .slide-video video,
    .bs-slider > .carousel-inner > .carousel-item > .slide-video .d-block {
        height: 260px;
        object-fit: cover;
        object-position: center;
    }
}

/* =============================================
   首页轮播图 - 移动端适配
   ============================================= */
@media (max-width: 767px) {
    /* 轮播容器高度 */
    .bs-slider {
        max-height: 240px;
        margin-top: 70px;
    }
    /* caption 响应式 */
    .carousel-caption {
        left: 0;
        right: 0;
        top: 8%;
        padding: 5px 20px;
        text-align: left;
    }
    .carousel-caption h2 {
        font-size: 1.3rem !important;
        line-height: 1.4rem !important;
        margin: 0.3em 0 !important;
    }
    .carousel-caption p {
        font-size: 13px !important;
        line-height: 18px !important;
        margin-bottom: 16px !important;
    }
    .carousel-caption a.btn-primary,
    .carousel-caption a.btn-secondary {
        font-size: 11px !important;
        padding: 10px 16px !important;
        display: block !important;
        margin: 4px 0 !important;
        text-align: center !important;
    }
    /* 指示线 */
    .indicators-line > .carousel-indicators {
        display: none;
    }
}

/* =============================================
   解决方案Swiper - 移动端适配
   ============================================= */
@media (max-width: 767px) {
    .solution-swiper {
        padding: 0 0 20px 0;
    }
    .solution-swiper-slide {
        /* height: 180px !important;*/
    }
    /* 导航按钮在小屏隐藏 */
    .solution-btn-next,
    .solution-btn-prev {
        display: none !important;
    }
}

/* =============================================
   区块间距 - 移动端
   ============================================= */
@media (max-width: 767px) {
    .feature-head {
        padding: 10px !important;
    }
    .feature-head h2 {
        font-size: 20px !important;
        margin-top: 16px !important;
        margin-bottom: 12px !important;
    }
    ul.zr {
        padding: 16px 0 0 0 !important;
    }
    .hgcz_r_l {
        border-right: none !important;
        margin-bottom: 20px !important;
    }
}

/* =============================================
   修复：轮播区域移动端黑边和溢出
   ============================================= */
@media (max-width: 767px) {
    /* 强制轮播高度，消除黑边 */
    .bs-slider {
        max-height: 220px !important;
        height: 220px !important;
        overflow: hidden;
        margin-top: 70px;
    }
    /* carousel-inner 和 item 强制高度 */
    .bs-slider > .carousel-inner {
        height: 220px !important;
    }
    .bs-slider > .carousel-inner > .carousel-item {
        height: 220px !important;
    }
    /* slide-video 强制填满 */
    .bs-slider > .carousel-inner > .carousel-item > .slide-video {
        height: 220px !important;
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
    }
    .bs-slider > .carousel-inner > .carousel-item > .slide-video video,
    .bs-slider > .carousel-inner > .carousel-item > .slide-video .d-block {
        height: 220px !important;
        object-fit: cover;
        object-position: center;
        width: 100% !important;
    }
    /* 图片也强制填满 */
    .bs-slider > .carousel-inner > .carousel-item > img.d-block {
        height: 220px !important;
        object-fit: cover;
        object-position: center;
        width: 100% !important;
    }
    /* 隐藏 carousel-indicators 消除黑边 */
    .bs-slider > .carousel-indicators {
        display: none !important;
    }
    /* 隐藏 caption 按钮行 */
    .bs-slider .carousel-caption {
        display: none !important;
    }
}



/* =============================================
   修复：navbar-brand 移动端宽度约束防溢出
   ============================================= */
@media (max-width: 767px) {
    .navbar-brand {
        max-width: calc(100% - 80px) !important;
        width: auto !important;
        float: left !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .navbar-toggle {
        margin-right: 0 !important;
    }
}

/* =============================================
   技术资料列表 - BS5 适配
   ============================================= */
.tech-article-list {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.tech-article-card {
    flex: 0 0 calc(50% - 0.75rem);
    background: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.tech-article-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.tech-article-link {
    display: flex;
    text-decoration: none;
    color: inherit;
    height: 100%;
}

.tech-article-img {
    flex: 0 0 120px;
    overflow: hidden;
}

.tech-article-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.tech-article-card:hover .tech-article-img img {
    transform: scale(1.05);
}

.tech-article-content {
    flex: 1;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.tech-article-title {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 0.5rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tech-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.tech-article-tags {
    font-size: 0.8rem;
    color: #888;
}

.tech-article-time {
    font-size: 0.8rem;
    color: #aaa;
}

/* 移动端：小屏单列 */
@media (max-width: 575.98px) {
    .tech-article-list {
        gap: 1rem;
    }
    .tech-article-card {
        flex: 0 0 100%;
    }
    .tech-article-link {
        flex-direction: column;
    }
    .tech-article-img {
        flex: 0 0 160px;
        height: 160px;
    }
    .tech-article-img img {
        height: 100%;
    }
    .tech-article-content {
        padding: 0.75rem;
    }
    .tech-article-title {
        font-size: 0.9rem;
    }
}