.product-item{display:block;background:#fff;border:1px solid var(--color-line);border-radius:var(--radius);overflow:hidden;transition:border-color .3s,box-shadow .3s,transform .3s}
.product-item:hover{border-color:var(--color-main);box-shadow:0 12px 30px rgba(26,112,218,.12);transform:translateY(-4px)}
.product-item__pic{position:relative;aspect-ratio:1;background:#f7f9fc;overflow:hidden}
.product-item__pic img{width:100%;height:100%;object-fit:contain;padding:18px;transition:transform .4s}
.product-item:hover .product-item__pic img{transform:scale(1.06)}
.product-item__title{padding:14px 12px 16px;text-align:center;font-size:15px;font-weight:600;line-height:1.4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.news-item{display:grid;grid-template-columns:78px minmax(0,1fr);gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--color-line)}
.news-item__body{min-width:0;overflow:hidden}
.news-item__date{display:flex;flex-direction:column;align-items:center;justify-content:center;height:78px;background:#f3f7fd;border-radius:var(--radius);color:var(--color-main)}
.news-item__date strong{font-size:26px;line-height:1;font-weight:700}
.news-item__date span{margin-top:6px;font-size:12px;color:#88a}
.news-item__body h3{font-size:16px;font-weight:600;line-height:1.5;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.news-item__body p{margin-top:8px;color:var(--color-muted);line-height:1.7;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.news-item:hover .news-item__body h3{color:var(--color-main)}
.home-banner-wrap{position:relative;background:#08111d}
.home-banner{height:clamp(240px,42vw,620px)}
.home-banner .swiper,.home-banner .swiper-slide{height:100%}
.home-banner__pic{position:absolute;inset:0}
.home-banner__pic img{width:100%;height:100%;object-fit:cover;display:block}
.home-banner__pic:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,17,29,.78) 8%,rgba(26,112,218,.18) 58%,rgba(8,17,29,.2) 100%)}
.home-banner__info{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;height:100%;color:#fff}
.home-banner__info span{display:inline-block;margin-bottom:14px;padding-left:12px;border-left:3px solid var(--color-main);color:#9ec4f2;letter-spacing:.2em;font-size:13px;text-transform:uppercase}
.home-banner__info h2{max-width:720px;font-size:clamp(28px,4.2vw,56px);font-weight:700;line-height:1.2}
.home-banner__info p{max-width:560px;margin:18px 0 28px;color:#d5e4f6;font-size:clamp(14px,1.3vw,18px);line-height:1.8}
.home-banner__btns{display:flex;flex-wrap:wrap;gap:14px}
.home-banner .swiper-pagination{bottom:28px}
.home-banner .swiper-pagination-bullet{width:10px;height:10px;background:#fff;opacity:.35}
.home-banner .swiper-pagination-bullet-active{opacity:1;background:var(--color-main)}
.home-banner .swiper-button-prev,.home-banner .swiper-button-next{width:46px;height:46px;margin-top:-23px;background:rgba(255,255,255,.12);border-radius:50%;color:#fff}
.home-banner .swiper-button-prev:after,.home-banner .swiper-button-next:after{font-size:16px}
.home-banner .swiper-button-prev:hover,.home-banner .swiper-button-next:hover{background:var(--color-main)}
.home-product-wrap{padding:80px 0;background:#fff}
.home-product{position:relative}
.home-product__radio{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.home-product__tabs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin:-8px 0 32px}
.home-product__tab{min-width:110px;height:40px;padding:0 22px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-line);border-radius:20px;color:#555;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.home-product__tab:hover{color:var(--color-main);border-color:var(--color-main)}
#home-product-switch:checked ~ .home-product__tabs [for="home-product-switch"],#home-product-connector:checked ~ .home-product__tabs [for="home-product-connector"],#home-product-capacitor:checked ~ .home-product__tabs [for="home-product-capacitor"]{background:var(--color-main);border-color:var(--color-main);color:#fff}
.home-product__panel{display:none;grid-template-columns:repeat(4,1fr);gap:20px}
#home-product-switch:checked ~ .home-product__panels .home-product__panel--switch,#home-product-connector:checked ~ .home-product__panels .home-product__panel--connector,#home-product-capacitor:checked ~ .home-product__panels .home-product__panel--capacitor{display:grid}
.home-product__panel--connector .product-item__pic,.home-product__panel--capacitor .product-item__pic{background:#111}
.home-product__more{display:flex;width:fit-content;margin:32px auto 0}
.home-about-wrap{padding:80px 0;background:#f5f8fc url("../images/temp-bg.webp") center/cover no-repeat}
.home-about{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.home-about__pic{position:relative;border-radius:12px;overflow:hidden;min-height:480px;box-shadow:0 18px 40px rgba(13,27,46,.12)}
.home-about__pic img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.home-about__pic:after{content:'';position:absolute;inset:auto 24px 24px auto;width:46%;height:38%;border:8px solid #fff;border-radius:10px;background:url("../temp/product/about-2.webp") center/cover no-repeat;box-shadow:0 10px 24px rgba(13,27,46,.18)}
.home-about__body .mod-title{text-align:left;margin-bottom:22px}
.home-about__body .mod-title h2:after{margin-left:0}
.home-about__body p{color:var(--color-muted);font-size:15px;line-height:1.9;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:6;-webkit-box-orient:vertical}
.home-about__nums{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0 32px}
.home-about__nums li{padding:16px 10px;background:#fff;border-radius:var(--radius);text-align:center;box-shadow:0 8px 20px rgba(26,112,218,.06)}
.home-about__nums strong{display:block;color:var(--color-main);font-size:28px;font-weight:700;line-height:1.2}
.home-about__nums span{display:block;margin-top:6px;color:#777;font-size:13px}
.home-adv-wrap{padding:80px 0;background:#fff}
.home-adv__list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.home-adv__item{position:relative;padding:36px 28px 32px;background:#f6f9fd;border:1px solid transparent;border-radius:10px;transition:transform .3s,box-shadow .3s,border-color .3s,background .3s}
.home-adv__item:hover{background:#fff;border-color:#d7e6f8;box-shadow:0 16px 32px rgba(26,112,218,.1);transform:translateY(-6px)}
.home-adv__item i{display:block;width:52px;height:52px;margin-bottom:22px;border-radius:12px;background:rgba(26,112,218,.1);position:relative}
.home-adv__item i:before{content:'';position:absolute;inset:14px;background:var(--color-main);mask-position:center;mask-repeat:no-repeat;mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain}
.home-adv__list li:nth-child(1) i:before{mask-image:var(--svg-culture);-webkit-mask-image:var(--svg-culture)}
.home-adv__list li:nth-child(2) i:before{mask-image:var(--svg-quality);-webkit-mask-image:var(--svg-quality)}
.home-adv__list li:nth-child(3) i:before{mask-image:var(--svg-tech);-webkit-mask-image:var(--svg-tech)}
.home-adv__list li:nth-child(4) i:before{mask-image:var(--svg-mission);-webkit-mask-image:var(--svg-mission)}
.home-adv__item h3{margin-bottom:12px;font-size:20px;font-weight:700}
.home-adv__item p{color:var(--color-muted);line-height:1.8;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.home-field-wrap{padding:80px 0;background:var(--color-dark)}
.home-field .mod-title h2,.home-field .mod-title span{color:#fff}
.home-field .mod-title h2:after{background:#fff}
.home-field__list{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.home-field__item{position:relative;display:block;height:320px;border-radius:10px;overflow:hidden}
.home-field__item img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.home-field__item:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,17,29,.05),rgba(8,17,29,.78))}
.home-field__item h3{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:22px 16px;color:#fff;font-size:20px;text-align:center}
.home-field__item:hover img{transform:scale(1.08)}
.home-news-wrap{padding:80px 0;background:#fff}
.home-news__head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px}
.home-news__head .mod-title{margin-bottom:0;text-align:left}
.home-news__head .mod-title h2:after{margin-left:0}
.home-news__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:stretch}
.home-news__featured{display:block;position:relative;min-height:420px;border-radius:12px;overflow:hidden}
.home-news__featured img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .5s}
.home-news__featured:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,17,29,.1),rgba(8,17,29,.82))}
.home-news__featured:hover img{transform:scale(1.05)}
.home-news__featured div{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:28px}
.home-news__featured span{display:inline-block;margin-bottom:10px;color:#9ec4f2;font-size:13px}
.home-news__featured h3{color:#fff;font-size:22px;font-weight:700;line-height:1.5;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.home-news__featured p{margin-top:10px;color:#d7e3f3;line-height:1.7;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.home-news__list{display:grid;gap:20px;min-width:0}
.home-news__list li{min-width:0;overflow:hidden}
.home-news__list .news-item{padding:28px 0}
.home-news__list .news-item:first-child{padding-top:0}
.home-news__list .news-item:last-child{border-bottom:0;padding-bottom:0}
.home-news__list .news-item__body h3{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:unset}
.home-brand-wrap{padding:60px 0 80px;background:#f5f8fc}
.home-brand .swiper-slide{height:auto}
.home-brand__item{display:flex;align-items:center;justify-content:center;height:184px;padding:16px 18px;background:#fff;border:1px solid var(--color-line);border-radius:8px}
.home-brand__item img{max-width:100%;max-height:128px;object-fit:contain;filter:grayscale(1);opacity:.78;transition:filter .3s,opacity .3s}
.home-brand__item:hover img{filter:none;opacity:1}
:root{--svg-culture:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none'%3E%3Cpath d='M8 40V16l16-10 16 10v24H8z' stroke='%231a70da' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M20 40V28h8v12' stroke='%231a70da' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");--svg-quality:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none'%3E%3Cpath d='M24 6l5.6 4.2L36.8 11l1.4 7.2L43 24l-4.8 5.8L36.8 37 29.6 37.8 24 42l-5.6-4.2L11.2 37l-1.4-7.2L6 24l4.8-5.8L11.2 11l7.2-.8L24 6z' stroke='%231a70da' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M16 24l5 5 11-12' stroke='%231a70da' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");--svg-tech:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none'%3E%3Crect x='8' y='8' width='32' height='32' rx='4' stroke='%231a70da' stroke-width='2'/%3E%3Cpath d='M16 24h16M24 16v16' stroke='%231a70da' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='16' cy='16' r='2' fill='%231a70da'/%3E%3Ccircle cx='32' cy='32' r='2' fill='%231a70da'/%3E%3C/svg%3E");--svg-mission:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none'%3E%3Cpath d='M10 38V12l14-6 14 6v26L24 44 10 38z' stroke='%231a70da' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M24 22a5 5 0 100-10 5 5 0 000 10zM16 34c1.6-4 4.4-6 8-6s6.4 2 8 6' stroke='%231a70da' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E")}
@media (max-width:1440px){
.home-about{gap:36px}
.home-field__item{height:280px}
}
@media (max-width:1280px){
.home-product__panel{grid-template-columns:repeat(3,1fr)}
.home-adv__list{grid-template-columns:repeat(2,1fr)}
.home-field__list{grid-template-columns:repeat(3,1fr)}
.home-field__list li:nth-child(4),.home-field__list li:nth-child(5){grid-column:span 1}
.home-news__grid{grid-template-columns:minmax(0,1fr);gap:24px}
.home-news__featured{min-height:320px}
}
@media (max-width:1024px){
.home-banner .swiper-button-prev,.home-banner .swiper-button-next{display:none}
.home-about{grid-template-columns:1fr;gap:28px}
.home-about__pic{min-height:300px}
.home-product-wrap,.home-about-wrap,.home-adv-wrap,.home-field-wrap,.home-news-wrap{padding:56px 0}
.home-brand-wrap{padding:40px 0 56px}
}
@media (max-width:768px){
.home-banner{height:clamp(280px,68vw,420px)}
.home-banner__pic:after{background:linear-gradient(180deg,rgba(8,17,29,.25),rgba(8,17,29,.82))}
.home-banner__info{justify-content:flex-end;padding-bottom:48px}
.home-product__panel{grid-template-columns:repeat(2,1fr);gap:12px}
.home-about__pic:after{width:42%;height:34%;inset:auto 12px 12px auto;border-width:5px}
.home-about__nums{grid-template-columns:repeat(3,1fr);gap:8px}
.home-about__nums strong{font-size:20px}
.home-adv__list,.home-field__list{grid-template-columns:1fr}
.home-field__item{height:220px}
.home-news__featured{min-height:260px}
.home-news__featured h3{font-size:18px}
.news-item{grid-template-columns:64px minmax(0,1fr);gap:12px}
.news-item__date{height:64px}
.news-item__date strong{font-size:20px}
.news-item__body h3{font-size:15px}
}