@font-face{font-family:AlibabaPuHuiTi;src:url("fonts/AlibabaPuHuiTi-2-55-Regular.ttf") format("truetype");font-weight:400}
@font-face{font-family:AlibabaPuHuiTi;src:url("fonts/AlibabaPuHuiTi-2-65-Medium.ttf") format("truetype");font-weight:500}
@font-face{font-family:AlibabaPuHuiTi;src:url("fonts/AlibabaPuHuiTi-2-75-SemiBold.ttf") format("truetype");font-weight:600}
@font-face{font-family:AlibabaPuHuiTi;src:url("fonts/AlibabaPuHuiTi-2-85-Bold.ttf") format("truetype");font-weight:700}
@font-face{font-family:AlibabaPuHuiTi;src:url("fonts/AlibabaPuHuiTi-2-95-ExtraBold.ttf") format("truetype");font-weight:800}
:root{--orange:#ff8530;--navy:#101a2b;--ink:#111827;--muted:#697586;--line:#e3e7ed;--soft:#f4f5f7}
*{box-sizing:border-box;margin:0;padding:0;word-break:break-word}html,body{width:100%;overflow-x:hidden}body{color:var(--ink);background:#fff;font-family:AlibabaPuHuiTi,"Microsoft YaHei",Arial,sans-serif}#app{width:100%;min-height:100vh;overflow:hidden}#app a{color:inherit;text-decoration:none}.wrap{width:80vw;margin:0 auto}
.overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title,.cases .section1 .title{display:flex;align-items:center;justify-content:center;gap:11px;color:var(--ink);font-size:30px;line-height:42px;font-weight:700}.overview .section1 .title svg,.customdraw .section1 .title svg,.scenario .section1 .title svg,.cases .section1 .title svg{width:28px;height:auto;flex:none}
.banner{position:relative;width:100%;overflow:hidden;background:#121b26}.banner>img{display:block;width:100%;height:auto;min-height:0;object-fit:cover;object-position:center top}.banner .content{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;text-align:center}.banner .top{position:relative;width:min(970px,calc(100% - 80px));display:flex;flex-direction:column;align-items:center;gap:34px}.banner .square1,.banner .square2{position:absolute;width:42px;height:42px;border-color:var(--orange);border-style:solid;pointer-events:none}.banner .square1{left:0;top:-30px;border-width:2px 0 0 2px}.banner .square2{right:0;bottom:-30px;border-width:0 2px 2px 0}.banner .title p{color:#fff;font-size:52px;line-height:1.3;font-weight:800;text-shadow:0 4px 20px rgba(0,0,0,.35)}.banner .title em{color:var(--orange);font-style:normal}.banner .desc{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 13px;width:100%}.banner .desc p,.banner .desc .item{color:rgba(255,255,255,.9);font-size:14px;line-height:22px}.banner .desc .item:hover{color:var(--orange)}
.overview{padding:72px 0 80px;overflow:hidden;background:#fff url("../img/oem2/overview-back.png") center top/cover no-repeat}.overview .section1{margin-bottom:32px;text-align:center}.overview .section1 .desc{margin-top:7px;color:#8a93a0;font-size:14px;line-height:22px}.overview .section2{overflow:hidden}.overview .section2 .swiper-wrapper{display:flex;gap:14px}.overview .section2 .swiper-slide{position:relative;flex:0 0 calc((100% - 56px)/5);height:255px;overflow:hidden;border:1px solid #e0e4e9;border-radius:8px;background:#e8ebee}.overview .section2 .swiper-slide img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}.overview .section2 .swiper-slide:hover img{transform:scale(1.04)}.overview .section2 .content{position:absolute;left:0;right:0;bottom:0;padding:38px 16px 16px;color:#fff;background:linear-gradient(180deg,transparent,rgba(10,18,28,.82))}.overview .section2 .line{width:27px;height:2px;margin-bottom:8px;background:var(--orange)}.overview .section2 .content p{font-size:16px;line-height:23px;font-weight:600}.overview .section3{margin-top:26px}.overview .section3 .swiper-wrapper{display:flex}.overview .section3 .swiper-slide{min-height:236px;padding:28px 34px;color:#fff;border-radius:7px;background:var(--navy);box-shadow:0 12px 28px rgba(16,26,43,.12)}.overview .section3 .top{display:flex;align-items:flex-start;justify-content:space-between;gap:42px}.overview .section3 .text1{flex:0 0 34%;font-size:21px;line-height:30px;font-weight:700}.overview .section3 .text2{flex:1;color:rgba(255,255,255,.7);font-size:13px;line-height:22px}.overview .section3 .line{height:1px;margin:20px 0 16px;background:rgba(255,255,255,.2)}.overview .section3 .bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:26px}.overview .section3 .text3{margin-bottom:10px;color:#fff;font-size:13px;line-height:21px}.overview .section3 .list{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:7px 15px}.overview .section3 .item{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.7);font-size:12px;line-height:19px}.overview .section3 .dot{width:4px;height:4px;flex:none;border-radius:50%;background:var(--orange)}.overview .section3 .bottom-right{display:inline-flex;align-items:center;justify-content:center;min-width:112px;padding:10px 15px;border:1px solid var(--orange);border-radius:4px;color:#fff;background:var(--orange);font-size:12px;line-height:18px;font-weight:600}
.customdraw{padding:76px 0 84px;background:#fff}.customdraw .section1{margin-bottom:28px;text-align:center}.customdraw .section2{min-height:300px;padding:30px 42px;display:flex;align-items:center;border:1px solid #e4e7eb;border-radius:8px;background:#f8f9fb url("../img/oem2/customdraw-back.png") left center/62% 100% no-repeat}.customdraw .section2-left{width:56%;flex:0 0 56%;display:flex;align-items:center;justify-content:center}.customdraw .section2-left img{display:block;width:100%;max-width:620px;height:auto}.customdraw .line1{width:1px;height:170px;flex:none;margin:0 44px 0 25px;background:#dce1e7}.customdraw .section2-right{min-width:0;flex:1}.customdraw .line2{width:32px;height:3px;margin-bottom:14px;background:var(--orange)}.customdraw .text1{color:var(--ink);font-size:22px;line-height:31px;font-weight:700}.customdraw .text2{max-width:400px;margin-top:12px;color:var(--muted);font-size:13px;line-height:22px}.customdraw .bottom{margin-top:22px;display:flex;align-items:center;gap:10px}.customdraw .btn1,.customdraw .btn2{min-width:112px;height:38px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--orange);border-radius:3px;color:#fff;background:var(--orange);font-size:12px;font-weight:600;cursor:pointer}.customdraw .btn2{color:var(--orange);background:#fff}.customdraw .btn1:hover,.customdraw .btn2:hover{border-color:var(--navy);color:#fff;background:var(--navy)}
.model3{padding:76px 0 84px;background:var(--soft)}.model3 .title{margin-bottom:30px;padding-bottom:17px;border-bottom:1px solid #dce1e7}.model3 .title .p{display:flex;align-items:center;gap:8px;color:var(--orange);font-size:13px;line-height:20px;font-weight:700;letter-spacing:1px;text-transform:uppercase}.model3 .title .p img{width:17px}.model3 .title .strong{width:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}.model3 .title strong{color:var(--ink);font-size:30px;line-height:42px}.model3 .title .desc{position:relative;width:390px;padding-left:20px;color:#7b8592;font-size:13px;line-height:21px;text-align:right}.model3 .title .desc:before{content:"";position:absolute;left:0;top:50%;width:2px;height:40px;background:var(--orange);transform:translateY(-50%)}.model3 .list{display:flex;align-items:stretch;gap:24px}.model3 .tabs{width:290px;flex:none;display:flex;flex-direction:column;justify-content:center;gap:7px}.model3 .tab_item{height:62px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d7dce2;color:#778291;background:transparent;cursor:pointer}.model3 .tab_item .label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}.model3 .tab_item .icon{width:24px;height:24px}.model3 .tab_item .icon path{stroke:currentColor}.model3 .tab_item:hover,.model3 .tab_item.item-active{color:#fff;border-bottom-color:var(--navy);background:var(--navy)}.model3 .tab_item.item-active .icon path{stroke:var(--orange)}.model3 .content{position:relative;flex:1;min-width:0;height:382px;overflow:hidden;border-radius:7px;background:#1b2532}.model3 .content .item{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;transform:translateX(20px);transition:.35s}.model3 .content .item.item-active{z-index:1;opacity:1;visibility:visible;transform:none}.model3 .content .item>img{display:block;width:100%;height:100%;object-fit:cover}.model3 .content .text{position:absolute;left:0;right:0;bottom:0;padding:15px 22px 17px;color:#fff;background:linear-gradient(180deg,transparent,rgba(7,13,22,.9))}.model3 .content .p{color:rgba(255,255,255,.9);font-size:12px;line-height:20px}.model3 .content .line{width:27px;height:2px;margin:4px 0 6px;background:var(--orange)}.model3 .content strong{color:var(--orange)}
.customservice{position:relative;overflow:hidden;padding:76px 0 84px;color:#fff;background:var(--navy);border-radius:22px}.customservice .back{position:absolute;left:50%;top:-3px;color:rgba(255,255,255,.05);font-size:150px;line-height:1;font-weight:800;white-space:nowrap;transform:translateX(-50%)}.customservice .wrap{position:relative;z-index:1}.customservice .section1{margin-bottom:30px;text-align:center}.customservice .section1 .title{color:var(--orange);font-size:30px;line-height:42px}.customservice .section1 .desc{margin-top:7px;color:rgba(255,255,255,.63);font-size:13px;line-height:21px}.customservice .section2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 18px}.customservice .item{position:relative;height:205px;overflow:hidden;border-radius:5px;background:#142635}.customservice .item:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,16,28,.88),rgba(5,16,28,.44) 65%,rgba(5,16,28,.08))}.customservice .item>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}.customservice .item:hover>img{transform:scale(1.04)}.customservice .item .content{position:absolute;left:24px;right:25px;top:23px;z-index:1}.customservice .num{color:var(--orange);font-size:15px}.customservice .text1{margin-top:12px;color:#fff;font-size:16px;line-height:24px;font-weight:700}.customservice .text1 span{color:var(--orange)}.customservice .text2{max-width:360px;margin-top:7px;color:rgba(255,255,255,.7);font-size:12px;line-height:19px}
.scenario{padding:76px 0 84px;overflow:hidden;background:#fff}.scenario .section1{position:relative;margin-bottom:28px;display:flex;align-items:center;justify-content:center}.scenario .prev,.scenario .next{position:absolute;top:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid #ffd0b3;border-radius:50%;background:#fff;cursor:pointer;transform:translateY(-50%)}.scenario .prev{left:0}.scenario .next{right:0}.scenario .next svg{transform:rotate(180deg)}.scenario .swiper{overflow:hidden}.scenario .swiper-wrapper{display:flex;gap:14px}.scenario .swiper-slide{position:relative;flex:none;width:calc((100% - 42px)/4);height:190px;overflow:hidden;border-radius:5px;background:#172333}.scenario .swiper-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(0,0,0,.72))}.scenario .swiper-slide img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}.scenario .swiper-slide:hover img{transform:scale(1.04)}.scenario .swiper-slide .content{position:absolute;left:18px;bottom:14px;z-index:1;color:#fff;font-size:15px;line-height:22px;font-weight:600}
.cases{min-height:680px;padding:76px 0 68px;overflow:hidden;color:#fff;background:#101923 url("../img/oem2/cases-back.png") center top/cover no-repeat}.cases .section1{margin-bottom:34px;text-align:center}.cases .section1 .title{color:#fff}.cases .section1 .desc{margin-top:7px;color:rgba(255,255,255,.64);font-size:14px}.cases .section2{position:relative;width:100%;height:350px}.cases .section2 .item{position:absolute;inset:0;display:none;grid-template-columns:390px minmax(0,1fr);gap:48px}.cases .section2 .item:first-child{display:grid}.cases .section2 .img{width:390px;height:350px;overflow:hidden;border-radius:5px}.cases .section2 .img img{display:block;width:100%;height:100%;object-fit:cover}.cases .right{min-width:0;padding:8px 0 4px;display:flex;flex-direction:column}.cases .text1{color:var(--orange);font-size:14px}.cases .text2{margin-top:5px;color:#fff;font-size:25px;line-height:35px;font-weight:700}.cases .station,.cases .rival{margin-top:17px;display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px}.cases .text3{color:rgba(255,255,255,.56);font-size:12px;line-height:20px}.cases .text4,.cases .text5{color:rgba(255,255,255,.84);font-size:12px;line-height:20px}.cases .rival-right{display:flex;flex-direction:column;gap:4px}.cases .text5{display:flex;gap:7px}.cases .dot{width:4px;height:4px;flex:none;margin-top:8px;border-radius:50%;background:var(--orange)}.cases .edge{min-height:72px;margin-top:auto;padding:12px 17px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-left:2px solid var(--orange);background:rgba(255,255,255,.08)}.cases .text6,.cases .text8{color:#fff;font-size:13px;line-height:20px;font-weight:600}.cases .text7{margin-top:2px;color:rgba(255,255,255,.65);font-size:11px}.cases .edge-right{color:var(--orange);font-size:15px;font-weight:600}.cases .edge-right span{font-size:41px;font-weight:800}.cases .section3{margin-top:30px;display:flex;justify-content:center}.cases .section3 svg{width:45px;height:auto}
.model7{padding:68px 0 72px;overflow:hidden;background:#fff}.model7>.title{width:80vw;margin:0 auto 25px;display:flex;align-items:flex-end;justify-content:space-between}.model7 .label{display:flex;align-items:center;gap:8px;color:var(--orange);font-size:13px;font-weight:700;letter-spacing:1px}.model7 .label img{width:18px}.model7 .value{position:relative;margin-top:5px;color:var(--ink);font-size:30px;line-height:42px;font-weight:700}.model7 .value:after{content:"";position:absolute;left:0;bottom:-10px;width:40px;height:3px;background:var(--orange)}.model7 .swiper{position:relative;overflow:visible}.model7 .swiper-wrapper{display:flex;align-items:stretch;gap:18px}.model7 .swiper-slide{position:relative;flex:none;width:215px;height:172px;overflow:hidden;border:1px solid #dfe4e9;border-radius:6px;background:#f5f7f9}.model7 .swiper-slide:hover,.model7 .swiper-slide-active{border-color:var(--orange)}.model7 .swiper-slide .bg{display:block;width:100%;height:100%;object-fit:cover;opacity:.12}.model7 .swiper-slide .cover{position:absolute;inset:13px 13px 40px;width:calc(100% - 26px);height:calc(100% - 53px);object-fit:cover;border-radius:4px}.model7 .name{position:absolute;left:13px;right:13px;bottom:12px;overflow:hidden;color:var(--ink);font-size:12px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.model7 .buttons{position:absolute;right:0;top:-55px;display:flex;gap:9px}.model7 .prev,.model7 .next{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid #ffd0b3;border-radius:50%;background:#fff;cursor:pointer}.model7 .next svg{transform:rotate(180deg)}
.model8{padding:76px 0 88px;background:#f7f8fa}.model8 .wrap{display:grid;grid-template-columns:320px minmax(0,1fr);gap:76px;align-items:start}.model8 .side .title{position:relative;padding-left:16px}.model8 .side .title:before{content:"";position:absolute;left:0;top:6px;width:3px;height:45px;background:var(--orange)}.model8 .side .strong{color:var(--ink);font-size:30px;line-height:42px;font-weight:700}.model8 .side .span{color:var(--orange);font-size:15px}.model8 .desc{margin-top:20px;color:#7c8794;font-size:13px;line-height:22px}.model8 .button{margin-top:24px;width:112px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--orange);border-radius:3px;color:var(--orange);background:#fff;font-size:12px}.model8 .list{border-top:1px solid var(--line)}.model8 .item{border-bottom:1px solid var(--line)}.model8 .title-text{min-height:55px;display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer}.model8 .label{color:#4d5968;font-size:13px;font-weight:600}.model8 .faq-icon{position:relative;width:15px;height:15px;flex:none;border:1px solid #c8d0da;border-radius:50%}.model8 .faq-icon:before,.model8 .faq-icon:after{content:"";position:absolute;left:50%;top:50%;width:6px;height:1px;background:#93a0af;transform:translate(-50%,-50%)}.model8 .faq-icon:after{transform:translate(-50%,-50%) rotate(90deg)}.model8 .item.item-active .label{color:var(--ink)}.model8 .item.item-active .faq-icon{border-color:var(--orange);background:var(--orange)}.model8 .item.item-active .faq-icon:before,.model8 .item.item-active .faq-icon:after{background:#fff}.model8 .item.item-active .faq-icon:after{transform:translate(-50%,-50%)}.model8 .text{max-height:0;overflow:hidden;color:#7b8592;font-size:12px;line-height:20px;opacity:0;transition:.3s}.model8 .item.item-active .text{max-height:150px;padding:0 26px 17px 0;opacity:1}
@media(max-width:1280px){.wrap,.model7>.title{width:80vw}.overview .section2 .swiper-slide{flex-basis:calc((100% - 48px)/5)}.customdraw .section2{padding-right:30px}.cases .section2 .item{grid-template-columns:34% minmax(0,1fr);gap:38px}.cases .section2 .img{width:100%}}
@media(max-width:900px){.wrap,.model7>.title{width:calc(100% - 40px)}.banner>img{height:420px;min-height:420px}.banner .top{width:calc(100% - 50px);gap:25px}.banner .title p{font-size:40px}.banner .desc{gap:3px 10px}.banner .desc p,.banner .desc .item{font-size:13px;line-height:20px}.overview,.customdraw,.model3,.customservice,.scenario,.cases,.model7,.model8{padding-top:58px;padding-bottom:64px}.overview .section2 .swiper-wrapper,.scenario .swiper-wrapper,.model7 .swiper-wrapper{overflow-x:auto;scrollbar-width:none}.overview .section2 .swiper-wrapper::-webkit-scrollbar,.scenario .swiper-wrapper::-webkit-scrollbar,.model7 .swiper-wrapper::-webkit-scrollbar{display:none}.overview .section2 .swiper-slide{flex-basis:220px}.overview .section3 .top,.overview .section3 .bottom{flex-direction:column;align-items:flex-start;gap:17px}.overview .section3 .list{grid-template-columns:repeat(2,minmax(130px,1fr))}.customdraw .section2{padding:28px;flex-direction:column;align-items:stretch}.customdraw .section2-left{width:100%;flex-basis:auto}.customdraw .line1{width:100%;height:1px;margin:25px 0}.customdraw .section2-right{text-align:center}.customdraw .line2{margin:0 auto 14px}.customdraw .text2{max-width:none}.customdraw .bottom{justify-content:center}.model3 .title .strong{align-items:flex-start;flex-direction:column;gap:13px}.model3 .title .desc{width:100%;padding-left:15px;text-align:left}.model3 .list{flex-direction:column}.model3 .tabs{width:100%;flex-direction:row;overflow-x:auto;scrollbar-width:none}.model3 .tabs::-webkit-scrollbar{display:none}.model3 .tab_item{min-width:185px;flex:0 0 185px}.model3 .content{height:350px}.customservice .section2{gap:15px}.scenario .swiper-wrapper{gap:10px}.scenario .swiper-slide{width:330px}.cases .section2{height:auto}.cases .section2 .item,.cases .section2 .item:first-child{position:relative;grid-template-columns:38% minmax(0,1fr);gap:26px}.cases .section2 .item:not(:first-child){display:none}.cases .section2 .img{width:100%;height:100%}.model7 .swiper-slide{width:200px}.model8 .wrap{grid-template-columns:250px minmax(0,1fr);gap:35px}}
@media(max-width:620px){.wrap,.model7>.title{width:calc(100% - 32px)}.banner>img{height:320px;min-height:320px}.banner .top{width:calc(100% - 32px);gap:18px}.banner .square1,.banner .square2{display:none}.banner .title p{font-size:27px}.banner .desc{gap:2px 8px}.banner .desc p,.banner .desc .item{font-size:11px;line-height:17px}.overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title,.cases .section1 .title{gap:8px;font-size:23px;line-height:32px}.overview .section1 .title svg,.customdraw .section1 .title svg,.scenario .section1 .title svg,.cases .section1 .title svg{width:24px}.overview .section1 .desc,.cases .section1 .desc{font-size:12px;line-height:20px}.overview,.customdraw,.model3,.customservice,.scenario,.cases,.model7,.model8{padding-top:43px;padding-bottom:48px}.overview .section1{margin-bottom:22px}.overview .section2 .swiper-wrapper{gap:9px}.overview .section2 .swiper-slide{flex-basis:155px;width:155px;height:185px}.overview .section2 .content{padding:25px 11px 11px}.overview .section2 .content p{font-size:12px;line-height:18px}.overview .section3{margin-top:18px}.overview .section3 .swiper-slide{padding:20px 17px}.overview .section3 .text1{font-size:17px;line-height:24px}.overview .section3 .text2,.overview .section3 .text3,.overview .section3 .item{font-size:11px;line-height:18px}.overview .section3 .list{grid-template-columns:1fr}.overview .section3 .bottom-right{width:100%}.customdraw .section2{margin-top:20px;padding:20px 16px}.customdraw .text1{font-size:18px;line-height:27px}.customdraw .text2{font-size:12px;line-height:20px}.customdraw .bottom{flex-direction:column;align-items:stretch}.customdraw .btn1,.customdraw .btn2{width:100%}.model3 .title{margin-bottom:22px}.model3 .title strong{font-size:24px;line-height:34px}.model3 .title .desc{font-size:12px;line-height:20px}.model3 .tab_item{min-width:160px;flex-basis:160px;height:54px;padding:0 13px}.model3 .tab_item .label{font-size:12px}.model3 .content{height:255px}.customservice{border-radius:16px}.customservice .back{font-size:72px}.customservice .section1 .title{font-size:23px;line-height:32px}.customservice .section2{grid-template-columns:1fr;gap:10px}.customservice .item{height:190px}.customservice .item .content{left:18px;right:18px;top:18px}.customservice .text1{font-size:15px}.customservice .text2{font-size:11px}.scenario .section1{margin-bottom:22px}.scenario .prev,.scenario .next{width:28px;height:28px}.scenario .swiper-slide{width:250px;height:175px}.scenario .swiper-slide .content{left:13px;bottom:11px;font-size:13px}.cases .section2 .item,.cases .section2 .item:first-child{grid-template-columns:1fr;gap:18px}.cases .section2 .img{height:auto;aspect-ratio:460/407}.cases .text2{font-size:21px;line-height:30px}.cases .station,.cases .rival{grid-template-columns:1fr;gap:4px}.cases .edge{margin-top:18px;padding:11px 13px}.cases .edge-right span{font-size:34px}.model7>.title{align-items:flex-start;flex-direction:column;gap:16px}.model7 .value{font-size:24px;line-height:34px}.model7 .buttons{top:-3px}.model7 .swiper-wrapper{gap:10px}.model7 .swiper-slide{width:160px;height:145px}.model7 .swiper-slide .cover{inset:10px 10px 35px;width:calc(100% - 20px);height:calc(100% - 45px)}.model8 .wrap{display:block}.model8 .side{margin-bottom:30px}.model8 .side .strong{font-size:24px;line-height:34px}.model8 .desc{margin-top:13px;font-size:12px;line-height:20px}.model8 .title-text{min-height:50px}.model8 .label{font-size:12px}}

/* Final visual alignment with the OEM2 artwork. */
.overview .section3 .swiper-slide{color:#222;background:#fff;border:1px solid #ffd0b3;border-radius:8px;box-shadow:0 8px 24px rgba(28,42,58,.08)}
.overview .section3 .text1{color:#151515}.overview .section3 .text2,.overview .section3 .item{color:#687383}.overview .section3 .text3{color:#303944}.overview .section3 .line{background:#e7e9ec}.overview .section3 .bottom-right{color:#fff;background:var(--navy);border-color:var(--navy)}
.customdraw{background:#f1f2f4}.customdraw .section2{background-color:#fff;box-shadow:0 5px 18px rgba(28,42,58,.05)}
.model3{background:#fff}.model3 .title .desc{color:#8a93a0}
.cases{min-height:0;color:#1a2532;background:#f1f2f4 url("../img/oem2/cases-back.png") center top/cover no-repeat}.cases .section1 .title{color:#1a2532}.cases .section1 .desc{color:#8a93a0}.cases .section2 .item{grid-template-columns:390px minmax(0,1fr);gap:48px}.cases .section2 .img{border-radius:7px}.cases .right{padding:12px 0 5px}.cases .text2{color:#1a2532}.cases .text3{color:#8a93a0}.cases .text4,.cases .text5{color:#4d5968}.cases .edge{border:1px solid #ffd0b3;border-right:2px solid var(--orange);border-left:0;border-radius:7px;background:#fff}.cases .text6,.cases .text8{color:#1a2532}.cases .text7{color:#8a93a0}
@media(max-width:900px){.cases .section2 .item,.cases .section2 .item:first-child{grid-template-columns:38% minmax(0,1fr);gap:26px}.cases .edge{border-right:2px solid var(--orange)}}
@media(max-width:620px){.cases .section2 .item,.cases .section2 .item:first-child{grid-template-columns:1fr;gap:18px}.cases .edge{border-right:2px solid var(--orange)}}

/* Keep the recommendation and FAQ modules proportional to the original OEM page. */
.model7{padding:72px 0 78px;background:#f7f8fa}
.model7>.title{width:80vw;margin:0 auto 34px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}
.model7 .label{gap:10px;font-size:14px;line-height:20px;font-weight:800;text-transform:uppercase}
.model7 .value{margin-top:10px;padding-bottom:16px;font-size:36px;line-height:46px;font-weight:800}
.model7 .value:after{left:50%;bottom:0;width:42px;height:3px;transform:translateX(-50%)}
.model7 .swiper{width:100%;margin:0;overflow:visible}
.model7 .swiper-wrapper{gap:18px;align-items:stretch}
.model7 .swiper-slide{width:232px;height:250px;padding:18px 18px 24px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;border:8px solid #e5ebf2;border-radius:10px;background:#f4f4f3}
.model7 .swiper-slide .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:1}
.model7 .swiper-slide .cover{position:relative;inset:auto;width:174px;height:150px;margin-bottom:21px;object-fit:contain}
.model7 .name{position:relative;left:auto;right:auto;bottom:auto;font-size:14px;line-height:22px;font-weight:800}
.model7 .buttons{position:static;width:80vw;margin:28px auto 0;display:flex;align-items:center;justify-content:center;gap:18px}
.model7 .prev,.model7 .next{width:38px;height:38px;border:1px solid var(--orange)}
.model8{padding:64px 0 44px;background:linear-gradient(180deg,#fff 0%,#f7f8fa 100%)}
.model8 .wrap{display:flex;align-items:flex-start;gap:76px}
.model8 .side{width:250px;flex:0 0 auto}
.model8 .side .title{display:block;padding:26px 0 0 0}.model8 .side .title:before{left:0;top:0;width:42px;height:3px}
.model8 .side .strong{font-size:34px;line-height:42px;font-weight:800;letter-spacing:1px}.model8 .side .span{font-size:24px;line-height:34px;letter-spacing:8px;text-transform:uppercase}
.model8 .desc{width:235px;margin-top:28px;font-size:14px;line-height:26px;font-weight:700}.model8 .button{width:158px;height:54px;margin-top:34px;gap:28px;border-radius:8px;color:#111827;font-size:14px;line-height:20px;font-weight:800}.model8 .button i{width:6px;height:6px;border-radius:50%;background:var(--orange)}
.model8 .list{flex:1;width:auto;display:flex;flex-direction:column}.model8 .title-text{min-height:78px;gap:28px}.model8 .label{font-size:16px;line-height:28px;font-weight:800}.model8 .faq-icon{width:26px;height:26px}.model8 .faq-icon:before{width:10px;height:2px}.model8 .faq-icon:after{width:2px;height:10px}.model8 .item.item-active .title-text{min-height:72px;color:var(--orange)}.model8 .text{font-size:13px;line-height:24px;font-weight:500}.model8 .item.item-active .text{max-height:170px;padding:0 50px 24px 0;transform:none}
@media(max-width:900px){.model7>.title{width:calc(100% - 40px)}.model7 .swiper-wrapper{overflow-x:auto}.model7 .buttons{width:calc(100% - 40px)}.model8 .wrap{display:block}.model8 .side{width:100%;margin-bottom:30px}.model8 .desc{width:min(100%,420px)}.model8 .list{width:100%}}
@media(max-width:620px){.model7{padding:48px 0 56px}.model7>.title{width:calc(100% - 32px);margin-bottom:26px}.model7 .value{font-size:27px;line-height:37px}.model7 .swiper-wrapper{gap:12px}.model7 .swiper-slide{width:180px;height:205px;padding:12px 12px 17px;border-width:6px}.model7 .swiper-slide .cover{width:135px;height:120px;margin-bottom:15px}.model7 .name{font-size:12px;line-height:18px}.model7 .buttons{width:calc(100% - 32px);margin-top:22px}.model7 .prev,.model7 .next{width:32px;height:32px}.model8{padding:48px 0 58px}.model8 .side .strong{font-size:28px;line-height:36px}.model8 .side .span{font-size:20px;line-height:28px}.model8 .label{font-size:13px}.model8 .title-text{min-height:58px}.model8 .item.item-active .title-text{min-height:58px}.model8 .item.item-active .text{padding:0 12px 18px 0}}

/* Wide desktop composition used by the OEM2 artwork. The source artwork is laid out
   on a broad canvas, so the content tracks grow with the viewport instead of being
   capped at the fixed reading width used on ordinary desktop screens. */
@media(min-width:1600px){
  .wrap,.model7>.title{width:80vw;max-width:none}
  .header-index{--header-index-inner-width:80vw}
  .header-index.header-region-open{--header-index-inner-width:100%}
  .header-index-inner{width:80vw;max-width:none}
  .overview,.customdraw,.model3,.customservice,.scenario,.cases,.model7,.model8{padding-top:5vw;padding-bottom:5.4vw}
  .overview .section1{margin-bottom:2.2vw}
  .overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title,.cases .section1 .title{gap:.8vw;font-size:2.1vw;line-height:2.9vw}
  .overview .section2 .swiper-wrapper,.scenario .swiper-wrapper,.model7 .swiper-wrapper{gap:1vw}
  .overview .section2 .swiper-slide{height:15.3vw}
  .overview .section2 .content{padding:2.3vw 1vw 1vw}
  .overview .section2 .content p{font-size:1.1vw;line-height:1.6vw}
  .overview .section3{margin-top:1.8vw}
  .overview .section3 .swiper-slide{min-height:26vw;padding:1.8vw 2.2vw}
  .overview .section3 .text1{font-size:1.35vw;line-height:1.9vw}
  .overview .section3 .text2,.overview .section3 .text3,.overview .section3 .item{font-size:.82vw;line-height:1.35vw}
  .customdraw .section2{min-height:12vw;padding:2vw 2.7vw}
  .customdraw .text1{font-size:1.4vw;line-height:2vw}
  .customdraw .text2{font-size:.82vw;line-height:1.4vw}
  .model3 .title strong{font-size:1.9vw;line-height:2.8vw}
  .model3 .title .desc{width:25vw;font-size:.82vw;line-height:1.35vw}
  .model3 .tab_item{height:3.9vw;font-size:.9vw}
  .model3 .content{height:38vw}
  .customservice{border-radius:1.4vw}
  .customservice .section1 .title{font-size:2.1vw;line-height:2.9vw}
  .customservice .section1 .desc{font-size:.82vw;line-height:1.35vw}
  .customservice .section2{gap:1vw 1.2vw}
  .customservice .item{height:20.8vw}
  .customservice .item .content{left:1.5vw;right:1.5vw;top:auto;bottom:1.2vw}
  .customservice .num{position:absolute;top:1.2vw;right:1.4vw;color:#fff;font-size:3.1vw;line-height:1;font-weight:800}
  .customservice .text1{margin-top:0}
  .customservice .text1{font-size:1.1vw;line-height:1.7vw}
  .customservice .text2{font-size:.78vw;line-height:1.3vw}
  .scenario .swiper{overflow:visible}
  .scenario .swiper-wrapper{gap:0}
  .scenario .swiper-slide{width:31%;height:19vw}
  .scenario .swiper-slide .content{left:1.1vw;bottom:.9vw;font-size:1vw}
  .cases .section2{height:auto;gap:1.5vw}
  .cases .section2 .item{gap:0}
  .cases .section2 .img{height:auto;aspect-ratio:1380/1221}
  .cases .text2{font-size:1.55vw;line-height:2.2vw}
  .cases .text3,.cases .text4,.cases .text5{font-size:.82vw;line-height:1.35vw}
  .model7>.title{margin-bottom:2.2vw}
  .model7 .value{font-size:2.1vw;line-height:2.9vw}
  .model7 .swiper-slide{width:15.1vw;height:19vw;border-width:.55vw}
  .model7 .swiper-slide .cover{width:11.3vw;height:9.8vw}
  .model7 .name{font-size:.82vw;line-height:1.35vw}
  .model8 .side{width:17vw}
  .model8 .side .strong{font-size:2.1vw;line-height:2.8vw}
  .model8 .side .span{font-size:1.5vw;line-height:2.1vw}
  .model8 .desc{width:16vw;font-size:.82vw;line-height:1.5vw}
  .model8 .label{font-size:.95vw;line-height:1.6vw}
  .model8 .title-text{min-height:4.8vw}
}

/* The artwork presents two case studies one below the other. */
.cases .section2{height:auto;display:flex;flex-direction:column;gap:24px}
.cases .section2 .item,.cases .section2 .item:first-child{position:relative;inset:auto;display:grid}
.cases .section2 .item:nth-child(2){display:grid}
.cases .section2 .item:nth-child(n+3){display:none}
.cases .section2 .item{gap:0}
.cases .right{align-self:stretch;height:100%;padding:28px 32px 0;border:1px solid #ffd0b3;border-left:0;border-right:2px solid var(--orange);border-radius:0 7px 7px 0;background:#fff}
.cases .edge{border:0;border-radius:0;background:#f7f8fa}
@media(max-width:620px){.cases .section2{gap:28px}.cases .section2 .item,.cases .section2 .item:first-child{display:grid;gap:0}.cases .section2 .img{border-radius:7px 7px 0 0}.cases .right{padding:22px 18px 0;border:1px solid #ffd0b3;border-top:0;border-right:2px solid var(--orange);border-radius:0 0 7px 7px}}

html{scroll-behavior:smooth;scroll-padding-top:80px}#overview,#customdraw,#materials,#process,#scenario,#cases,#products,#faq{scroll-margin-top:80px}

@media(min-width:1600px){
  .cases .section1,.cases .section2,.cases .section3{width:80vw;max-width:none;margin-left:auto;margin-right:auto}
  .cases .section1{margin-bottom:3.7vw}
  .cases .section1 .desc{max-width:48vw;margin:2vw auto 0;font-size:1.3vw;line-height:1.9vw}
  .cases .section2{gap:3.5vw}
  .cases .section2 .item{grid-template-columns:39.1% minmax(0,1fr)}
  .cases .section2 .img{width:100%;aspect-ratio:1380/1221;border-radius:1.5vw 0 0 1.5vw}
  .cases .right{padding:2.2vw 3.3vw 2.2vw;border:0;border-right:.36vw solid var(--orange);border-radius:0 1.5vw 1.5vw 0}
  .cases .text1{align-self:flex-start;padding:.5vw 1vw;border-radius:999px;color:var(--orange);background:#fff1e7;font-size:1.05vw;line-height:1.35vw;font-weight:700}
  .cases .text2{margin-top:1.35vw;font-size:1.9vw;line-height:2.65vw}
  .cases .station,.cases .rival{grid-template-columns:7.6vw minmax(0,1fr);gap:.8vw}
  .cases .station{margin-top:2vw}
  .cases .rival{margin-top:1.35vw}
  .cases .text3{font-size:1.2vw;line-height:1.7vw;font-weight:700}
  .cases .text4,.cases .text5{font-size:1.1vw;line-height:1.75vw;font-weight:600}
  .cases .station .text4 p{display:inline-block;padding-bottom:.15vw;border-bottom:.12vw solid var(--orange);color:var(--orange)}
  .cases .rival .dot{width:.35vw;height:.35vw;margin-top:.68vw;background:#536174}
  .cases .edge{min-height:9.3vw;margin-top:auto;padding:1.45vw 1.7vw;border:0;border-radius:1.15vw;background:linear-gradient(90deg,#f6f8fa,#fff9f4)}
  .cases .text6,.cases .text8{font-size:1.15vw;line-height:1.65vw;font-weight:800}
  .cases .text7{margin-top:.45vw;font-size:.92vw;line-height:1.5vw}
  .cases .edge-right{min-width:11.2vw;min-height:6.4vw;padding:.5vw 1.1vw;display:flex;align-items:center;justify-content:center;border:1px solid #e8ebef;border-radius:1vw;background:#fff;box-shadow:0 .18vw .48vw rgba(32,45,61,.12);font-size:1.2vw}
  .cases .edge-right span{font-size:4.1vw;line-height:1;font-weight:800}
  .cases .section3{margin-top:2.3vw}
  .cases .section3 svg{width:3.4vw}
}

/* Desktop overview composition: match the broad product strip and expanded
   specification panel shown in the OEM artwork. */
@media(min-width:901px){
  .overview{padding-top:80px;padding-bottom:85px}
  .overview .wrap{width:80vw}
  .overview .section1{margin-bottom:34px}
  .overview .section1 .title{gap:12px;font-size:clamp(30px,2.7vw,42px);line-height:56px}
  .overview .section1 .title svg{width:clamp(28px,2.5vw,38px)}
  .overview .section1 .desc{margin-top:30px;font-size:clamp(14px,1.1vw,18px);line-height:28px}
  /* Allow the selected card's outward outline to render in full. */
  .overview .section2{overflow:visible}
  .overview .section2 .swiper{overflow:visible}
  .overview .section2 .swiper-wrapper{gap:28px;align-items:center}
  .overview .section2 .swiper-slide{flex-basis:calc((100% - 112px)/5);height:clamp(210px,14vw,225px);border:0;border-radius:20px}
  .overview .section2 .swiper-slide:first-child{z-index:2;border:0;outline:4px solid var(--orange);outline-offset:3px;border-radius:20px;transform:none}
  .overview .section2 .content{padding:48px 14px 20px;text-align:center}
  .overview .section2 .line{width:35px;height:3px;margin:0 auto 14px}
  .overview .section2 .content p{font-size:clamp(16px,1.15vw,18px);line-height:26px}
  .overview .section3{margin-top:28px}
  .overview .section3 .swiper-slide{min-height:clamp(340px,26.5vw,408px);padding:clamp(30px,3.55vw,55px) clamp(34px,3.6vw,56px) 32px;border:3px solid #ffe0cc;border-radius:24px}
  .overview .section3 .top{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:15px}
  .overview .section3 .text1{flex:none;width:auto;font-size:clamp(25px,1.9vw,32px);line-height:1.35}
  .overview .section3 .text2{flex:none;width:min(860px,100%);font-size:clamp(14px,1vw,16px);line-height:1.7}
  .overview .section3 .line{margin:36px 0 34px}
  .overview .section3 .bottom{align-items:center;gap:32px}
  .overview .section3 .bottom-left{min-width:0;flex:1}
  .overview .section3 .text3{margin-bottom:20px;font-size:clamp(14px,1vw,16px);line-height:1.5;font-weight:600}
  .overview .section3 .list{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 34px}
  .overview .section3 .item{gap:10px;font-size:clamp(13px,.95vw,15px);line-height:1.45}
  .overview .section3 .dot{width:7px;height:7px}
  .overview .section3 .bottom-right{flex:0 0 clamp(160px,11.8vw,184px);min-width:0;height:72px;padding:0 18px;gap:10px;border-radius:16px;font-size:clamp(15px,1.15vw,18px);line-height:22px}
  .overview .section3 .bottom-right svg{width:26px;height:26px}
}

@media(min-width:1281px){
  .overview .wrap{width:80vw;max-width:none}
}

/* Keep the action label inside the overview card independent from global p rules. */
#app .overview .section3 .bottom-right,#app .overview .section3 .bottom-right p{color:#fff}
#app .overview .section3 .bottom-right p{display:block;margin:0;font-size:inherit;line-height:inherit;font-weight:inherit}

/* The drawing panel follows the OEM model2 composition: artwork on the left,
   separated copy and actions on the right. */
@media(min-width:901px){
  .customdraw{padding:42px 0 70px;background:#e9e9e9}
  .customdraw .wrap{width:80vw;max-width:none}
  .customdraw .section1{margin-bottom:40px}
  .customdraw .section1 .title{gap:12px;font-size:42px;line-height:56px}
  .customdraw .section1 .title svg{width:38px}
  .customdraw .section2{width:100%;height:376px;min-height:0;margin:0;padding:0;display:flex;align-items:stretch;gap:0;overflow:hidden;border-radius:12px;background:#fff url("../img/oem2/customdraw-back.png") left center/58% 100% no-repeat;box-shadow:0 8px 20px rgba(20,44,72,.18)}
  .customdraw .section2-left{width:58%;height:376px;flex:0 0 58%;display:flex;align-items:center;justify-content:center}
  .customdraw .section2-left img{display:block;width:100%;max-width:none;height:100%;object-fit:contain}
  .customdraw .line1{width:2px;height:100%;flex:none;margin:0;background:rgba(201,201,201,.6)}
  .customdraw .section2-right{width:auto;min-width:0;flex:1;padding:42px;display:flex;flex-direction:column;justify-content:center;text-align:left;background:#f8fafc}
  .customdraw .line2{width:50px;height:4px;margin:0 0 22px;background:var(--orange)}
  .customdraw .text1{color:#17233a;font-size:29px;line-height:34px;font-weight:700}
  .customdraw .text2{max-width:none;margin-top:20px;color:#748397;font-size:16px;line-height:27px}
  .customdraw .bottom{margin-top:28px;display:flex;align-items:center;gap:16px}
  .customdraw .btn1,.customdraw .btn2{height:60px;min-width:186px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;color:#fff;background:var(--orange);box-shadow:0 8px 18px rgba(255,133,48,.26);font-size:16px;line-height:20px;font-weight:700}
  .customdraw .btn2{background:#172b49;box-shadow:0 8px 18px rgba(23,43,73,.22)}
  .customdraw .btn1 svg,.customdraw .btn2 svg{width:18px;height:18px}
}

@media(max-width:900px){
  .customdraw{padding:46px 0;background:#e9e9e9}
  .customdraw .section1{margin-bottom:28px}
  .customdraw .section1 .title{font-size:20px;line-height:30px}
  .customdraw .section1 .title svg{width:24px}
  .customdraw .section2{width:94%;height:auto;min-height:0;margin:28px auto 0;padding:0;display:flex;flex-direction:column;align-items:stretch;background:#fff url("../img/oem2/customdraw-back.png") center top/100% auto no-repeat}
  .customdraw .section2-left{width:100%;height:310px;flex:0 0 auto}
  .customdraw .section2-left img{width:100%;height:100%;object-fit:contain}
  .customdraw .line1{width:100%;height:2px;margin:0;background:rgba(201,201,201,.6)}
  .customdraw .section2-right{width:100%;padding:28px;display:flex;flex-direction:column;justify-content:center;text-align:left;background:#f8fafc}
  .customdraw .bottom{flex-wrap:wrap;gap:12px}
  .customdraw .btn1,.customdraw .btn2{height:44px;min-width:132px;padding:0 18px;font-size:13px}
  .customdraw .btn2{color:#fff;border-color:#172b49;background:#172b49;box-shadow:0 8px 18px rgba(23,43,73,.22)}
}

@media(max-width:620px){
  .customdraw{padding:38px 0}
  .customdraw .section1{margin-bottom:22px}
  .customdraw .section1 .title{font-size:18px;line-height:26px}
  .customdraw .section2{width:calc(100% - 32px);margin-top:22px;border-radius:10px}
  .customdraw .section2-left{height:220px}
  .customdraw .section2-right{padding:18px}
  .customdraw .line2{margin-bottom:14px}
  .customdraw .text1{font-size:18px;line-height:27px}
  .customdraw .text2{margin-top:12px;font-size:12px;line-height:20px}
  .customdraw .bottom{margin-top:20px;flex-direction:column;align-items:stretch;gap:10px}
  .customdraw .btn1,.customdraw .btn2{width:100%;min-width:0}
}

/* Service workflow panel: match the wide six-step composition. */
@media(min-width:901px){
  .customservice{padding:78px 0 126px;border-radius:58px;background:#101827}
  .customservice .wrap{width:80vw;max-width:none}
  .customservice .back{top:-8px;font-size:150px;line-height:1;color:rgba(255,255,255,.075)}
  .customservice .section1{margin-bottom:48px}
  .customservice .section1 .title{color:var(--orange);font-size:42px;line-height:56px;font-weight:800}
  .customservice .section1 .desc{margin-top:14px;color:rgba(255,255,255,.78);font-size:16px;line-height:25px}
  .customservice .section2{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .customservice .item{height:auto;aspect-ratio:1692/840;border-radius:14px;background:#142235}
  .customservice .item:after{background:linear-gradient(180deg,rgba(5,16,28,.02) 25%,rgba(5,16,28,.78) 100%)}
  .customservice .item>img{object-fit:cover}
  .customservice .item .content{left:34px;right:34px;top:auto;bottom:25px}
  .customservice .num{position:absolute;top:auto;right:0;bottom:calc(100% + 74px);color:#fff;font-size:84px;line-height:.9;font-weight:800}
  .customservice .text1{margin-top:0;color:#fff;font-size:22px;line-height:32px;font-weight:700}
  .customservice .text1 span{color:var(--orange)}
  .customservice .text2{max-width:none;margin-top:10px;color:rgba(255,255,255,.78);font-size:15px;line-height:25px}
}

@media(min-width:1600px){
  .customservice .wrap{width:80vw}
  .customservice .section1 .title{font-size:2.7vw;line-height:3.6vw}
  .customservice .section1 .desc{font-size:1vw;line-height:1.6vw}
  .customservice .section2{gap:1.6vw}
  .customservice .item{border-radius:1vw}
  .customservice .item .content{left:2.2vw;right:2.2vw;bottom:1.6vw}
  .customservice .num{font-size:5.5vw;bottom:calc(100% + 4.8vw)}
  .customservice .text1{font-size:1.45vw;line-height:2.1vw}
  .customservice .text2{margin-top:.65vw;font-size:.95vw;line-height:1.6vw}
}

@media(max-width:900px){
  .customservice{padding:58px 0 70px;border-radius:30px}
  .customservice .wrap{width:calc(100% - 40px)}
  .customservice .back{top:-3px;font-size:100px}
  .customservice .section1{margin-bottom:30px}
  .customservice .section1 .title{font-size:30px;line-height:42px}
  .customservice .section1 .desc{margin-top:8px;font-size:13px;line-height:21px}
  .customservice .section2{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
  .customservice .item{height:auto;aspect-ratio:1692/840;border-radius:9px}
  .customservice .item:after{background:linear-gradient(180deg,rgba(5,16,28,.02) 25%,rgba(5,16,28,.78) 100%)}
  .customservice .item .content{left:18px;right:18px;top:auto;bottom:16px}
  .customservice .num{position:absolute;top:15px;right:17px;font-size:48px;line-height:1}
  .customservice .text1{margin-top:0;font-size:15px;line-height:23px}
  .customservice .text2{margin-top:6px;font-size:11px;line-height:18px}
}

@media(max-width:620px){
  .customservice{padding:43px 0 52px;border-radius:24px}
  .customservice .wrap{width:calc(100% - 32px)}
  .customservice .back{font-size:72px}
  .customservice .section1{margin-bottom:22px}
  .customservice .section1 .title{font-size:23px;line-height:32px}
  .customservice .section1 .desc{font-size:12px;line-height:20px}
  .customservice .section2{grid-template-columns:1fr;gap:10px}
  .customservice .item{aspect-ratio:1692/840;border-radius:8px}
  .customservice .item .content{left:16px;right:16px;top:auto;bottom:13px}
  .customservice .num{display:none}
  .customservice .text1{font-size:15px;line-height:22px}
  .customservice .text2{font-size:11px;line-height:18px}
}

/* Materials selection composition. */
@media(min-width:901px){
  .model3{padding:64px 0 88px;background:#fff}
  .model3 .wrap{width:80vw;max-width:none}
  .model3 .title{margin-bottom:36px;padding-bottom:24px;border-bottom:1px solid #d7dee7}
  .model3 .title .p{gap:10px;color:var(--orange);font-size:14px;line-height:20px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase}
  .model3 .title .p img{width:20px;height:20px;object-fit:contain}
  .model3 .title .strong{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:48px}
  .model3 .title strong{color:#101a2b;font-size:clamp(38px,3.4vw,52px);line-height:1.2;font-weight:800}
  .model3 .title .desc{width:min(390px,30vw);padding-left:26px;color:#738198;font-size:16px;line-height:26px;text-align:right}
  .model3 .title .desc:before{left:0;width:2px;height:50px;background:var(--orange)}
  .model3 .list{display:grid;grid-template-columns:minmax(360px,34%) minmax(0,1fr);gap:clamp(72px,8vw,122px);align-items:start}
  .model3 .tabs{width:100%;display:flex;flex-direction:column;gap:24px}
  .model3 .tab_item{height:92px;padding:0 42px;display:flex;align-items:center;justify-content:space-between;border:2px solid #e1e8f0;color:#182941;background:#fff;box-shadow:none;cursor:pointer}
  .model3 .tab_item .label{font-size:22px;line-height:30px;font-weight:700}
  .model3 .tab_item .icon{width:20px;height:20px}
  .model3 .tab_item .icon svg{display:block;width:20px;height:20px}
  .model3 .tab_item.item-active{border-color:var(--orange);color:var(--orange);background:#101a2b;box-shadow:0 12px 24px rgba(16,26,43,.12)}
  .model3 .tab_item.item-active .icon path{stroke:var(--orange)}
  .model3 .content{height:466px;overflow:visible;border-radius:14px;background:#e4e5e5}
  .model3 .content .item{height:466px;overflow:visible}
  .model3 .content .item>img{width:100%;height:100%;border-radius:14px;object-fit:cover}
  .model3 .content .text{left:-54px;right:auto;bottom:-100px;width:min(578px,42vw);min-height:235px;padding:42px 38px;color:#101010;border-radius:14px;background:rgba(244,244,244,.88);box-shadow:0 5px 18px rgba(25,35,49,.16);backdrop-filter:blur(8px)}
  .model3 .content .text .p{color:#111;font-size:18px;line-height:34px}
  .model3 .content .text .p:first-child{font-size:24px;line-height:32px;font-weight:800}
  .model3 .content .text strong{color:#111;font-weight:800}
  .model3 .content .line{width:100%;height:1px;margin:22px 0 20px;background:rgba(40,40,40,.28)}
}

@media(min-width:1600px){
  .model3{padding-top:4.2vw;padding-bottom:5.8vw}
  .model3 .wrap{width:80vw}
  .model3 .title{margin-bottom:2.4vw;padding-bottom:1.6vw}
  .model3 .title .p{font-size:1vw;line-height:1.4vw}
  .model3 .title .p img{width:1.35vw;height:1.35vw}
  .model3 .title .strong{margin-top:1vw}
  .model3 .title strong{font-size:3.4vw;line-height:4vw}
  .model3 .title .desc{width:25vw;padding-left:1.7vw;font-size:1vw;line-height:1.65vw}
  .model3 .title .desc:before{height:3.3vw}
  .model3 .list{gap:8vw}
  .model3 .tabs{gap:1.6vw}
  .model3 .tab_item{height:6.1vw;padding:0 2.8vw}
  .model3 .tab_item .label{font-size:1.45vw;line-height:2vw}
  .model3 .content,.model3 .content .item{height:30.5vw}
  .model3 .content .text{left:-3.5vw;bottom:-6.5vw;width:37.7vw;min-height:15.3vw;padding:2.7vw 2.5vw}
  .model3 .content .text .p{font-size:1.15vw;line-height:2.15vw}
  .model3 .content .text .p:first-child{font-size:1.55vw;line-height:2.1vw}
  .model3 .content .line{margin:1.4vw 0 1.25vw}
}

@media(max-width:900px){
  .model3{padding:58px 0 64px}
  .model3 .wrap{width:calc(100% - 40px)}
  .model3 .title{margin-bottom:28px;padding-bottom:18px}
  .model3 .title .p{font-size:13px;line-height:20px}
  .model3 .title .strong{margin-top:10px;align-items:flex-start;flex-direction:column;gap:14px}
  .model3 .title strong{font-size:34px;line-height:44px}
  .model3 .title .desc{width:100%;padding-left:16px;font-size:13px;line-height:22px;text-align:left}
  .model3 .title .desc:before{height:40px}
  .model3 .list{display:flex;flex-direction:column;gap:22px}
  .model3 .tabs{width:100%;flex-direction:row;gap:10px;overflow-x:auto;scrollbar-width:none}
  .model3 .tabs::-webkit-scrollbar{display:none}
  .model3 .tab_item{min-width:190px;flex:0 0 190px;height:68px;padding:0 18px;border-width:1px}
  .model3 .tab_item .label{font-size:16px;line-height:24px}
  .model3 .content{width:100%;height:350px;flex:0 0 350px;overflow:hidden;border-radius:10px}
  .model3 .content .item{height:350px;overflow:hidden}
  .model3 .content .item>img{border-radius:10px}
  .model3 .content .text{left:16px;right:16px;bottom:16px;width:auto;min-height:0;padding:20px;color:#101010;border-radius:10px;background:rgba(244,244,244,.9);box-shadow:0 3px 12px rgba(25,35,49,.15);backdrop-filter:blur(6px)}
  .model3 .content .text .p{font-size:14px;line-height:22px}
  .model3 .content .text .p:first-child{font-size:18px;line-height:26px}
  .model3 .content .line{margin:12px 0 10px}
}

@media(max-width:620px){
  .model3{padding:43px 0 52px}
  .model3 .wrap{width:calc(100% - 32px)}
  .model3 .title{margin-bottom:22px;padding-bottom:16px}
  .model3 .title .p{font-size:11px;line-height:17px}
  .model3 .title .p img{width:16px;height:16px}
  .model3 .title .strong{margin-top:8px;gap:10px}
  .model3 .title strong{font-size:28px;line-height:36px}
  .model3 .title .desc{font-size:12px;line-height:20px}
  .model3 .tabs{gap:8px}
  .model3 .tab_item{min-width:160px;flex-basis:160px;height:56px;padding:0 14px}
  .model3 .tab_item .label{font-size:13px;line-height:20px}
  .model3 .content{height:255px;flex:0 0 255px;border-radius:8px}
  .model3 .content .item{height:255px}
  .model3 .content .item>img{border-radius:8px}
  .model3 .content .text{left:12px;right:12px;bottom:12px;padding:14px;border-radius:8px}
  .model3 .content .text .p{font-size:12px;line-height:19px}
  .model3 .content .text .p:first-child{font-size:16px;line-height:23px}
  .model3 .content .line{margin:9px 0 8px}
}

/* Application scenarios carousel. */
@media(min-width:901px){
  .scenario{padding:80px 0 96px;background:#fff}
  .scenario .wrap{width:80vw;max-width:none}
  .scenario .section1{margin-bottom:44px}
  .scenario .section1 .title{gap:12px;font-size:42px;line-height:56px;font-weight:800}
  .scenario .section1 .title svg{width:38px}
  .scenario .prev,.scenario .next{top:50%;width:42px;height:42px;border:2px solid var(--orange);border-radius:50%;background:#fff;transform:translateY(-50%);z-index:2}
  .scenario .prev{left:20%}
  .scenario .next{right:20%}
  .scenario .prev svg,.scenario .next svg{width:14px;height:20px}
  .scenario .swiper{overflow:visible}
  .scenario .swiper-wrapper{gap:20px;align-items:stretch}
  .scenario .swiper-slide{width:28.5%;height:auto;aspect-ratio:1200/780;border-radius:10px;background:#172333}
  .scenario .swiper-slide:after{background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.68) 100%)}
  .scenario .swiper-slide img{object-fit:cover}
  .scenario .swiper-slide .content{left:26px;right:20px;bottom:20px;z-index:1;color:#fff;font-size:16px;line-height:22px;font-weight:700}
  .scenario .swiper-slide .content:before{content:"";position:absolute;left:-26px;bottom:-20px;width:6px;height:74px;background:var(--orange)}
  .scenario .swiper-slide .content p{display:inline-block;padding:8px 24px;border-radius:5px;color:#fff;background:var(--orange);font-size:16px;line-height:22px;font-weight:700}
}

@media(min-width:1600px){
  .scenario{padding-top:5.2vw;padding-bottom:6.3vw}
  .scenario .wrap{width:80vw}
  .scenario .section1{margin-bottom:2.9vw}
  .scenario .section1 .title{gap:.8vw;font-size:2.7vw;line-height:3.6vw}
  .scenario .section1 .title svg{width:2.5vw}
  .scenario .prev,.scenario .next{width:2.8vw;height:2.8vw}
  .scenario .prev{left:20%}
  .scenario .next{right:20%}
  .scenario .swiper-wrapper{gap:1.35vw}
  .scenario .swiper-slide{border-radius:.7vw}
  .scenario .swiper-slide .content{left:1.7vw;right:1.3vw;bottom:1.3vw;font-size:1vw;line-height:1.4vw}
  .scenario .swiper-slide .content:before{left:-1.7vw;bottom:-1.3vw;width:.4vw;height:4.8vw}
  .scenario .swiper-slide .content p{padding:.55vw 1.55vw;border-radius:.35vw;font-size:1vw;line-height:1.4vw}
}

@media(max-width:900px){
  .scenario{padding:58px 0 70px}
  .scenario .wrap{width:calc(100% - 40px)}
  .scenario .section1{margin-bottom:28px}
  .scenario .section1 .title{gap:8px;font-size:30px;line-height:42px}
  .scenario .section1 .title svg{width:28px}
  .scenario .prev,.scenario .next{width:34px;height:34px;border-width:1px}
  .scenario .prev{left:4%}
  .scenario .next{right:4%}
  .scenario .swiper{overflow:visible}
  .scenario .swiper-wrapper{gap:12px}
  .scenario .swiper-slide{width:330px;height:auto;aspect-ratio:1200/780;border-radius:8px}
  .scenario .swiper-slide .content{left:18px;right:14px;bottom:14px;font-size:14px;line-height:20px}
  .scenario .swiper-slide .content:before{left:-18px;bottom:-14px;width:4px;height:58px}
  .scenario .swiper-slide .content p{padding:6px 18px;border-radius:4px;font-size:14px;line-height:20px}
}

@media(max-width:620px){
  .scenario{padding:43px 0 52px}
  .scenario .wrap{width:calc(100% - 32px)}
  .scenario .section1{margin-bottom:22px}
  .scenario .section1 .title{gap:8px;font-size:23px;line-height:32px}
  .scenario .section1 .title svg{width:24px}
  .scenario .prev,.scenario .next{width:28px;height:28px}
  .scenario .prev{left:0}
  .scenario .next{right:0}
  .scenario .swiper-wrapper{gap:10px}
  .scenario .swiper-slide{width:250px;border-radius:7px}
  .scenario .swiper-slide .content{left:14px;bottom:11px;font-size:13px;line-height:18px}
  .scenario .swiper-slide .content:before{left:-14px;bottom:-11px;width:4px;height:48px}
  .scenario .swiper-slide .content p{padding:5px 15px;border-radius:4px;font-size:13px;line-height:18px}
}

/* Case studies: show the first two cards initially, then reveal the rest. */
.cases .section2 .item:nth-child(n+3){display:none}
.cases.is-expanded .section2 .item{display:grid}
.cases .section3 svg{cursor:pointer}

@media(min-width:901px){
  .cases{min-height:0;padding:86px 0 82px;background-color:#f4f5f7}
  .cases .section1{width:80vw;margin:0 auto 44px;text-align:center}
  .cases .section1 .title{font-size:48px;line-height:62px;font-weight:800}
  .cases .section1 .title svg{width:38px}
  .cases .section1 .desc{max-width:760px;margin:24px auto 0;font-size:18px;line-height:28px}
  .cases .section2{width:80vw;height:auto;margin:0 auto;display:flex;flex-direction:column;gap:48px}
  .cases .section2 .item,.cases .section2 .item:first-child{position:relative;inset:auto;display:grid;grid-template-columns:36% minmax(0,1fr);gap:0}
  .cases .section2 .item:nth-child(n+3){display:none}
  .cases.is-expanded .section2 .item{display:grid}
  .cases .section2 .img{width:100%;height:auto;aspect-ratio:1380/1221;overflow:hidden;border-radius:14px 0 0 14px}
  .cases .section2 .img img{display:block;width:100%;height:100%;object-fit:cover}
  .cases .right{height:100%;padding:32px 42px 28px;display:flex;flex-direction:column;border:1px solid #ffd0b3;border-left:0;border-right:4px solid var(--orange);border-radius:0 14px 14px 0;background:#fff}
  .cases .text1{align-self:flex-start;padding:7px 13px;border-radius:999px;color:var(--orange);background:#fff1e7;font-size:14px;line-height:20px;font-weight:700}
  .cases .text2{margin-top:18px;color:#17233a;font-size:28px;line-height:38px;font-weight:800}
  .cases .station,.cases .rival{margin-top:18px;grid-template-columns:100px minmax(0,1fr);gap:18px}
  .cases .text3{color:#8a96a7;font-size:14px;line-height:23px;font-weight:700}
  .cases .text4,.cases .text5{color:#4d5968;font-size:14px;line-height:23px;font-weight:600}
  .cases .station .text4 p{display:inline-block;padding-bottom:3px;border-bottom:2px solid var(--orange);color:var(--orange)}
  .cases .rival-right{display:flex;flex-direction:column;gap:5px}
  .cases .text5{display:flex;gap:8px}
  .cases .dot{width:5px;height:5px;margin-top:9px;background:#536174}
  .cases .edge{min-height:100px;margin-top:auto;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:12px;background:linear-gradient(90deg,#f6f8fa,#fff9f4)}
  .cases .text6,.cases .text8{color:#17233a;font-size:15px;line-height:23px;font-weight:800}
  .cases .text7{margin-top:4px;color:#8a96a7;font-size:13px;line-height:21px}
  .cases .edge-right{min-width:126px;min-height:72px;padding:8px 14px;display:flex;align-items:center;justify-content:center;border:1px solid #e8ebef;border-radius:10px;color:#8a96a7;background:#fff;box-shadow:0 3px 8px rgba(32,45,61,.12);font-size:15px;font-weight:700}
  .cases .edge-right span{color:var(--orange);font-size:48px;line-height:1;font-weight:800}
  .cases .section3{margin-top:42px;display:flex;justify-content:center}
  .cases .section3 svg{width:48px;height:auto}
}

@media(min-width:1600px){
  .cases .section1,.cases .section2{width:80vw}
  .cases .section1 .title{font-size:48px;line-height:62px}
  .cases .section1 .desc{font-size:18px;line-height:28px}
  .cases .section2{gap:48px}
  .cases .right{padding:32px 42px 28px;border-right:4px solid var(--orange)}
  .cases .text1{font-size:14px;line-height:20px}
  .cases .text2{margin-top:18px;font-size:28px;line-height:38px}
  .cases .station,.cases .rival{margin-top:18px;grid-template-columns:100px minmax(0,1fr);gap:18px}
  .cases .text3,.cases .text4,.cases .text5{font-size:14px;line-height:23px}
  .cases .edge{min-height:100px;padding:16px 20px;border-radius:12px}
  .cases .text6,.cases .text8{font-size:15px;line-height:23px}
  .cases .text7{font-size:13px;line-height:21px}
  .cases .edge-right{min-width:126px;min-height:72px;border-radius:10px;font-size:15px}
  .cases .edge-right span{font-size:48px}
  .cases .section3{margin-top:42px}
  .cases .section3 svg{width:48px}
}

@media(max-width:900px){
  .cases{padding:58px 0 64px}
  .cases .section1{margin-bottom:28px;text-align:center}
  .cases .section1 .title{font-size:30px;line-height:42px}
  .cases .section1 .desc{margin-top:10px;font-size:13px;line-height:21px}
  .cases .section2{width:calc(100% - 40px);height:auto;margin:0 auto;display:flex;flex-direction:column;gap:28px}
  .cases .section2 .item,.cases .section2 .item:first-child{display:grid;grid-template-columns:1fr;gap:0}
  .cases .section2 .item:nth-child(n+3){display:none}
  .cases.is-expanded .section2 .item{display:grid}
  .cases .section2 .img{width:100%;height:auto;aspect-ratio:1380/1221;border-radius:8px 8px 0 0}
  .cases .right{height:auto;padding:22px 18px 18px;border:1px solid #ffd0b3;border-top:0;border-right:2px solid var(--orange);border-radius:0 0 8px 8px}
  .cases .text2{font-size:21px;line-height:30px}
  .cases .station,.cases .rival{grid-template-columns:1fr;gap:4px}
  .cases .edge{margin-top:18px;padding:11px 13px}
  .cases .section3{margin-top:28px}
  .cases .section3 svg{width:42px}
}

@media(max-width:900px){
  .overview .section2,
  .overview .section2 .swiper{overflow:visible}
  .overview .section2 .swiper-wrapper{
    justify-content:flex-start;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    touch-action:pan-x;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .overview .section2 .swiper-slide{scroll-snap-align:start}
  .model3 .tabs{
    justify-content:flex-start;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    touch-action:pan-x;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .model3 .tab_item{scroll-snap-align:start}
  .model7 .swiper{overflow:hidden}
  .model7 .swiper-wrapper{
    justify-content:flex-start;
    gap:0;
    overflow:visible;
    touch-action:pan-x;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .scenario .swiper{overflow:hidden}
  .scenario .swiper-wrapper{gap:0;overflow:visible;touch-action:pan-x}
  .customdraw .btn1{color:#fff!important}
  .customdraw .btn2{color:#fff!important;background:#172b49}
}

@media(max-width:620px){
  .cases{padding:43px 0 48px}
  .cases .section1{margin-bottom:22px}
  .cases .section1 .title{font-size:23px;line-height:32px}
  .cases .section1 .desc{font-size:12px;line-height:20px}
  .cases .section2{width:calc(100% - 32px);gap:28px}
  .cases .right{padding:18px 15px 15px}
  .cases .text1{font-size:12px;line-height:18px}
  .cases .text2{font-size:18px;line-height:26px}
  .cases .text3,.cases .text4,.cases .text5{font-size:12px;line-height:20px}
  .cases .text6,.cases .text8{font-size:12px;line-height:19px}
  .cases .text7{font-size:11px;line-height:18px}
  .cases .edge-right{min-width:76px;min-height:52px;font-size:12px}
  .cases .edge-right span{font-size:30px}
  .cases .section3{margin-top:24px}
  .cases .section3 svg{width:36px}
}

/* Keep wide screens readable instead of scaling every module with viewport units. */
@media(min-width:901px) and (max-width:1599px){
  .overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title{font-size:34px;line-height:46px}
  .overview .section1 .desc,.cases .section1 .desc{font-size:14px;line-height:22px}
  .customdraw .text1{font-size:24px;line-height:32px}
  .customdraw .text2{font-size:14px;line-height:23px}
  .model3 .title strong{font-size:38px;line-height:48px}
  .model3 .tab_item .label{font-size:20px;line-height:28px}
  .customservice .section1 .title{font-size:36px;line-height:48px}
  .customservice .text1{font-size:20px;line-height:29px}
  .customservice .text2{font-size:14px;line-height:23px}
  .cases .section1 .title{font-size:38px;line-height:50px}
  .cases .text2{font-size:26px;line-height:36px}
  .cases .text3,.cases .text4,.cases .text5{font-size:13px;line-height:21px}
  .model7 .value{font-size:32px;line-height:42px}
  .model8 .side .strong{font-size:32px;line-height:42px}
}

@media(min-width:1600px){
  .wrap,.model7>.title{width:80vw;max-width:none}
  .overview .wrap{width:80vw;max-width:none}
  .customdraw .wrap{width:80vw;max-width:none}
  .model3 .wrap,.scenario .wrap{width:80vw;max-width:none}
  .customservice .wrap{width:80vw;max-width:none}
  .cases .section1,.cases .section2,.cases .section3{width:80vw;max-width:none}

  .overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title{font-size:clamp(34px,2.1vw,44px);line-height:1.35}
  .overview .section1 .desc,.cases .section1 .desc{font-size:clamp(14px,.9vw,18px);line-height:1.6}
  .customdraw .text1{font-size:clamp(22px,1.35vw,30px);line-height:1.35}
  .customdraw .text2{font-size:clamp(13px,.78vw,16px);line-height:1.65}
  .model3 .title strong{font-size:clamp(36px,2.6vw,48px);line-height:1.25}
  .model3 .tab_item .label{font-size:clamp(18px,1.1vw,22px);line-height:1.4}
  .customservice .section1 .title{font-size:clamp(34px,2.2vw,46px);line-height:1.35}
  .customservice .text1{font-size:clamp(18px,1.2vw,24px);line-height:1.45}
  .customservice .text2{font-size:clamp(13px,.78vw,16px);line-height:1.65}
  .cases .section1 .title{font-size:clamp(38px,2.6vw,50px);line-height:1.3}
  .cases .text2{font-size:clamp(24px,1.6vw,32px);line-height:1.4}
  .cases .text3,.cases .text4,.cases .text5{font-size:clamp(13px,.85vw,16px);line-height:1.65}
  .model7 .value{font-size:clamp(30px,2.1vw,40px);line-height:1.35}
  .model8 .side .strong{font-size:clamp(30px,2.1vw,40px);line-height:1.35}
}

/* Use the same desktop reading width as oem.css. */
@media(min-width:1281px){
  .wrap,.model7>.title{width:80vw;max-width:none}
  .overview .wrap,.customdraw .wrap,.model3 .wrap,.customservice .wrap,.scenario .wrap{width:80vw;max-width:none}
  .cases .section1,.cases .section2,.cases .section3{width:80vw;max-width:none}
  .banner .content{left:50%;right:auto;width:80vw;max-width:none;margin-left:-40vw}
  .banner .top{width:920px;max-width:920px}
}

@media(min-width:901px) and (max-width:1280px){
  .wrap,.model7>.title{width:80vw;max-width:none}
  .overview .wrap,.customdraw .wrap,.model3 .wrap,.customservice .wrap,.scenario .wrap{width:80vw;max-width:none}
  .cases .section1,.cases .section2,.cases .section3{width:80vw;max-width:none}
  .banner .content{left:10vw;right:auto;width:80vw;max-width:none;margin-left:0}
  .banner .top{width:80vw;max-width:none}
}

/* Materials selection: match the design board proportions. */
@media(min-width:901px){
  .model3 .wrap{width:80vw;max-width:none}
  .model3{padding:60px 0 72px}
  .model3 .title{margin-bottom:34px;padding-bottom:22px}
  .model3 .title .p{gap:10px;font-size:14px;line-height:20px;letter-spacing:1.2px}
  .model3 .title .p img{width:18px;height:18px}
  .model3 .title .strong{margin-top:12px;gap:40px}
  .model3 .title strong{font-size:52px;line-height:62px}
  .model3 .title .desc{width:390px;padding-left:26px;font-size:16px;line-height:26px}
  .model3 .title .desc:before{height:48px}
  .model3 .list{grid-template-columns:393px minmax(0,1fr);gap:115px}
  .model3 .tabs{gap:24px}
  .model3 .tab_item{height:88px;padding:0 42px}
  .model3 .tab_item .label{font-size:22px;line-height:30px}
  .model3 .content{height:445px;border-radius:12px}
  .model3 .content .item{height:445px}
  .model3 .content .item>img{border-radius:12px}
  .model3 .content .text{left:-50px;bottom:-96px;width:552px;min-height:226px;padding:40px 34px;border-radius:12px}
  .model3 .content .text .p{font-size:18px;line-height:34px}
  .model3 .content .text .p:first-child{font-size:24px;line-height:32px}
  .model3 .content .line{margin:20px 0 18px}
}

/* Keep the mobile strips scrollable while the detail panel follows the active card. */
.overview .section3 .swiper-wrapper{transition:transform .45s ease}
@media(min-width:901px){
  .overview .section2 .swiper-slide:first-child:not(.item-active){outline:none}
  .overview .section2 .swiper-slide.item-active{outline:4px solid var(--orange);outline-offset:3px}
}
@media(max-width:900px){
  .overview .section2{overflow:visible}
  .overview .section2 .swiper{overflow:hidden}
  .overview .section2 .swiper-wrapper{width:100%;min-width:100%;}
  .overview .section2 .swiper-slide.item-active{outline:3px solid var(--orange);outline-offset:2px}
  .model3 .tabs{width:100%;min-width:0;flex:0 0 auto;justify-content:flex-start;}
  .model3 .tab_item{flex:0 0 185px;min-width:185px;}
}
@media(max-width:620px){
  .model3 .tab_item{flex-basis:160px;min-width:160px;}
}

/* Swiper applies its own slide spacing; avoid adding a second CSS gap. */
.model7 .swiper-wrapper,.scenario .swiper-wrapper{gap:0}

/* Mobile horizontal strips: keep one complete item and expose the next one. */
@media(max-width:900px){
  .overview .section2 .swiper-wrapper{
    gap:16px;
    padding:0 10px 4px;
    scroll-padding-inline:10px;
  }
  .overview .section2 .swiper-slide{
    flex:0 0 clamp(155px,38.35vw,255px);
    width:clamp(155px,38.35vw,255px);
    height:clamp(185px,45.5vw,303px);
    scroll-snap-align:start;
  }
  .model3 .tabs{
    gap:14px;
    padding:0 4px 4px;
    scroll-padding-inline:4px;
  }
  .model3 .tab_item{
    min-width:clamp(160px,39.7vw,264px);
    flex:0 0 clamp(160px,39.7vw,264px);
    height:clamp(54px,13.8vw,92px);
    scroll-snap-align:start;
  }
}

.overview .section2 .swiper-wrapper,
.model3 .tabs{cursor:grab}
.overview .section2 .swiper-wrapper.is-dragging,
.model3 .tabs.is-dragging{cursor:grabbing;user-select:none}

/* On small screens show every overview card and material tab without clipping. */
@media(max-width:900px){
  .overview .section2,
  .overview .section2 .swiper{overflow:visible}
  .overview .section2 .swiper-wrapper{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    width:100%;
    padding:0;
    overflow:visible;
  }
  .overview .section2 .swiper-slide{
    width:100%;
    min-width:0;
    height:auto;
    min-height:0;
    aspect-ratio:2 / 1;
    border:1px solid #e0e4e9;
    flex:none;
  }
  .overview .section2 .swiper-slide img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
  .overview .section2 .content{position:absolute;width:100%;bottom:0}
  .overview .section2 .line{display:none}
  .model3 .tabs{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    width:100%;
    min-width:0;
    height:auto;
    padding:0;
    overflow:visible;
  }
  .model3 .tab_item{
    width:100%;
    min-width:0;
    flex:none;
    height:58px;
    padding:0 13px;
  }
}

@media(max-width:414px){
  .overview .section2 .swiper-wrapper{gap:9px}
  .overview .section2 .swiper-slide{min-height:0;aspect-ratio:2.5 / 1}
  .model3 .tabs{gap:8px}
  .model3 .tab_item{height:54px;padding:0 10px}
  .model3 .tab_item .label{font-size:12px;line-height:18px}
}


/* Both custom-drawing actions use white text on their filled backgrounds. */
#app .customdraw .btn1,
#app .customdraw .btn2{color:#fff}

/* Desktop type scale: keep the page close to the original OEM proportions. */
@media(min-width:901px){
  .banner .title p{font-size:42px;line-height:54px}
  .banner .desc p,.banner .desc .item{font-size:13px;line-height:20px}
  .overview .section1 .title,.customdraw .section1 .title,.scenario .section1 .title{font-size:28px;line-height:38px}
  .overview .section1 .desc,.cases .section1 .desc{font-size:12px;line-height:20px}
  .overview .section2 .content p{font-size:14px;line-height:20px}
  .overview .section3 .text1{font-size:20px;line-height:28px}
  .overview .section3 .text2,.overview .section3 .text3,.overview .section3 .item{font-size:12px;line-height:20px}
  .customdraw .text1{font-size:20px;line-height:29px}
  .customdraw .text2{font-size:12px;line-height:21px}
  .customdraw .btn1,.customdraw .btn2{font-size:12px}
  .model3 .title strong{font-size:30px;line-height:40px}
  .model3 .title .desc{font-size:12px;line-height:20px}
  .model3 .tab_item .label{font-size:16px;line-height:24px}
  .model3 .content .text .p{font-size:14px;line-height:24px}
  .model3 .content .text .p:first-child{font-size:20px;line-height:28px}
  .customservice .section1 .title{font-size:30px;line-height:42px}
  .customservice .section1 .desc{font-size:12px;line-height:20px}
  .customservice .num{font-size:56px}
  .customservice .text1{font-size:17px;line-height:25px}
  .customservice .text2{font-size:12px;line-height:20px}
  .scenario .section1 .title{font-size:30px;line-height:42px}
  .scenario .swiper-slide .content,.scenario .swiper-slide .content p{font-size:14px;line-height:20px}
  .cases .section1 .title{font-size:32px;line-height:44px}
  .cases .text1{font-size:12px;line-height:18px}
  .cases .text2{font-size:22px;line-height:30px}
  .cases .text3,.cases .text4,.cases .text5{font-size:12px;line-height:20px}
  .cases .text6,.cases .text8{font-size:13px;line-height:20px}
  .cases .text7{font-size:11px;line-height:18px}
  .cases .edge-right{font-size:13px}
  .cases .edge-right span{font-size:36px}
  .model7 .value{font-size:28px;line-height:38px}
  .model8 .side .strong{font-size:30px;line-height:40px}
  .model8 .side .span{font-size:20px;line-height:28px}
}

/* Final model3 sizing override after the shared desktop type scale. */
@media(min-width:901px){
  .model3 .wrap{width:80vw;max-width:none}
  .model3{padding:60px 0 72px}
  .model3 .title{margin-bottom:34px;padding-bottom:22px}
  .model3 .title .p{font-size:14px;line-height:20px}
  .model3 .title .p img{width:18px;height:18px}
  .model3 .title .strong{margin-top:12px;gap:40px}
  .model3 .title strong{font-size:48px;line-height:58px}
  .model3 .title .desc{width:390px;padding-left:26px;font-size:16px;line-height:26px}
  .model3 .title .desc:before{height:48px}
  .model3 .list{grid-template-columns:393px minmax(0,1fr);gap:115px}
  .model3 .tabs{gap:24px}
  .model3 .tab_item{height:88px;padding:0 42px}
  .model3 .tab_item .label{font-size:20px;line-height:28px}
  .model3 .content{height:445px;border-radius:12px}
  .model3 .content .item{height:445px}
  .model3 .content .item>img{border-radius:12px}
  .model3 .content .text{left:-50px;bottom:-96px;width:552px;min-height:226px;padding:40px 34px;border-radius:12px}
  .model3 .content .text .p{font-size:16px;line-height:30px}
  .model3 .content .text .p:first-child{font-size:22px;line-height:30px}
  .model3 .content .line{margin:20px 0 18px}
}

/* Requested hover interactions */
.overview .section3 .bottom-right{transition:transform .3s ease,box-shadow .3s ease}.overview .section3 .bottom-right:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(16,26,43,.18)}
.customdraw .btn1,.customdraw .btn2{transition:transform .3s ease,box-shadow .3s ease}.customdraw .btn1:hover,.customdraw .btn2:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(16,26,43,.18)}
.model3 .content .item>img{transition:transform .5s ease}.model3 .content .item:hover>img{transform:scale(1.05)}
.scenario .prev,.scenario .next{transition:transform .3s ease,box-shadow .3s ease,background-color .3s ease}.scenario .prev:hover,.scenario .next:hover{transform:translateY(-50%) scale(1.08);box-shadow:0 6px 14px rgba(255,133,48,.25);background:#fff7f1}
.cases .section2 .img img{transition:transform .5s ease}.cases .section2 .img:hover img{transform:scale(1.05)}
.model7 .swiper-slide .cover{transition:transform .5s ease}.model7 .swiper-slide:hover .cover{transform:scale(1.05)}
.model8 .label{transition:color .24s ease}.model8 .title-text:hover .label{color:var(--orange)}

/* Related news cards */
.relatenew{width:100%;padding:58px 0 60px;overflow:hidden;background:#f4f4f4}.relatenew .section1{display:flex;align-items:center;justify-content:center;gap:13px;margin-bottom:44px;padding:0 20px}.relatenew .section1 .line{width:65px;height:3px;flex:0 0 65px;background:var(--orange)}.relatenew .section1 .title{color:#202020;font-size:28px;line-height:38px;font-weight:800;white-space:nowrap}.relatenew .section2{width:100%;overflow:hidden}.relatenew .section2 .swiper{width:100%;overflow:hidden}.relatenew .section2 .swiper-wrapper{display:flex;align-items:stretch}.relatenew .section2 .swiper-slide{width:calc((100% - 76px)/3);flex:0 0 calc((100% - 76px)/3);height:auto;min-height:382px;display:flex;flex-direction:column;overflow:hidden;background:#fff;color:var(--ink);text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}.relatenew .section2 .swiper-slide:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(16,26,43,.12)}.relatenew .section2 .img{width:100%;height:180px;flex:0 0 180px;overflow:hidden}.relatenew .section2 .img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}.relatenew .section2 .swiper-slide:hover .img img{transform:scale(1.04)}.relatenew .section2 .content{min-width:0;flex:1;padding:24px;display:flex;flex-direction:column}.relatenew .section2 .content-top{display:flex;align-items:center;gap:12px}.relatenew .section2 .date p{color:var(--orange);font-family:"Space Mono","Courier New",monospace;font-size:14px;line-height:20px;font-weight:700;white-space:nowrap}.relatenew .section2 .tag{height:24px;padding:0 12px;border-radius:12px;color:#fff;background:#006f3f;font-size:12px;line-height:24px;font-weight:700;white-space:nowrap}.relatenew .section2 .content-middle p{min-height:56px;margin-top:18px;color:#161616;font-size:18px;line-height:28px;font-weight:700;transition:color .24s ease}.relatenew .section2 .swiper-slide:hover .content-middle p{color:var(--orange)}.relatenew .section2 .content-bottom{margin-top:auto;padding-top:22px;display:flex;align-items:center;justify-content:space-between;color:#71717a;font-family:Inter,Arial,sans-serif;font-size:13px;line-height:18px;font-weight:800;text-transform:uppercase}.relatenew .section2 .icon{width:40px;height:40px;flex:0 0 40px;display:flex;align-items:center;justify-content:center;border:1px solid #e4e4e7;border-radius:50%;background:#fff;transition:background .25s ease,border-color .25s ease,transform .25s ease}.relatenew .section2 .icon svg{width:16px;height:16px}.relatenew .section2 .icon path{transition:stroke .25s ease}.relatenew .section2 .swiper-slide:hover .icon{border-color:var(--orange);background:var(--orange);transform:translateX(4px)}.relatenew .section2 .swiper-slide:hover .icon path{stroke:#fff}
@media(max-width:1280px){.relatenew .section2{padding:0 3%}}@media(max-width:900px){.relatenew{padding:48px 0 52px}.relatenew .section1{margin-bottom:30px}.relatenew .section1 .title{font-size:24px;line-height:32px}.relatenew .section1 .line{width:52px;flex-basis:52px}.relatenew .section2 .swiper-slide{width:calc((100% - 24px)/2);flex-basis:calc((100% - 24px)/2);min-height:212px;flex-direction:row}.relatenew .section2 .img{width:200px;height:auto;flex:0 0 200px}.relatenew .section2 .content{padding:16px 20px}}@media(max-width:768px){.relatenew .section2 .swiper-slide{min-height:0;flex-direction:column}.relatenew .section2 .img{width:100%;height:180px;flex:0 0 180px}.relatenew .section2 .content{padding:16px}.relatenew .section2 .content-middle p{min-height:0}}@media(max-width:600px){.relatenew{padding:40px 0 44px}.relatenew .section1{gap:10px;margin-bottom:26px}.relatenew .section1 .title{font-size:20px;line-height:28px}.relatenew .section1 .line{width:38px;height:2px;flex-basis:38px}.relatenew .section2{padding:0 16px}.relatenew .section2 .swiper-slide{width:100%;flex-basis:100%}.relatenew .section2 .content{padding:18px}.relatenew .section2 .content-middle p{min-height:0;margin-top:14px;font-size:16px;line-height:24px}.relatenew .section2 .content-bottom{padding-top:20px}}@media(max-width:380px){.relatenew .section2 .img{height:160px;flex-basis:160px}.relatenew .section2 .date p{font-size:12px}.relatenew .section2 .tag{padding:0 9px;font-size:11px}}