*{margin:0;padding:0;box-sizing:border-box}body{font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#f5f5f5;color:#1a1a1a;overflow-y:scroll;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:1100px;margin:0 auto;padding:32px 20px}.nav{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;border-radius:8px;background:linear-gradient(135deg,#0f172a,#1e3a5f);margin-bottom:24px;position:sticky;top:10px;z-index:100}.nav-brand{display:flex;align-items:center;gap:8px;text-decoration:none}.nav-brand img{height:30px}.nav-brand span{color:#fff;font-size:16px;font-weight:600}.nav-links{display:flex;gap:22px;align-items:center}.nav-links a{color:#ffffffb3;font-size:11px;text-decoration:none;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:#fff}.nav-btn{padding:6px 14px;border-radius:5px;font-size:11px;font-weight:500;background:#d4a853;color:#fff;border:none;cursor:pointer;transition:background .2s;font-family:inherit}.nav-btn:hover{background:#c49540}.lang-btn{padding:5px 10px;border-radius:5px;font-size:11px;font-weight:500;background:transparent;color:#ffffffb3;border:1px solid rgba(255,255,255,.3);cursor:pointer;transition:all .2s;font-family:inherit}.lang-btn:hover{color:#fff;border-color:#fff9}.hero{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:16/7;background:linear-gradient(135deg,#0c1a2b,#0f2847 30%,#132f52 60%,#0a1628);margin-bottom:32px}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 60% 80% at 35% 50%,rgba(14,165,233,.15),transparent 70%),radial-gradient(ellipse 50% 60% at 70% 40%,rgba(212,168,83,.12),transparent 60%)}.hero-product{position:absolute;right:6%;top:50%;transform:translateY(-50%);width:42%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 40%,rgba(212,168,83,.25),rgba(14,165,233,.1) 50%,transparent 70%);display:flex;align-items:center;justify-content:center}.hero-product-ring{width:75%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff6}.hero-content{position:absolute;left:8%;top:48%;transform:translateY(-50%);max-width:46%;z-index:1}.hero-tagline{color:#7dd3fc;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px}.hero h1{color:#fff;font-size:28px;font-weight:500;line-height:1.2;margin-bottom:10px}.hero-sub{color:#ffffff80;font-size:12px;line-height:1.6;margin-bottom:20px}.hero-btns{display:flex;gap:10px}.btn{padding:9px 22px;border-radius:6px;font-size:12px;font-weight:500;border:none;cursor:pointer;transition:all .2s;display:inline-block;text-decoration:none;font-family:inherit}.btn-primary{background:linear-gradient(135deg,#d4a853,#b8861e);color:#fff}.btn-primary:hover{background:linear-gradient(135deg,#c49540,#a0721a)}.btn-outline{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff}.btn-outline:hover{background:#ffffff14}.btn-wa{background:#25d366;color:#fff}.btn-wa:hover{background:#1da851}.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}.cat-card{border-radius:12px;overflow:hidden;aspect-ratio:3/4;display:flex;flex-direction:column;background:#fff;border:1px solid #e2e8f0;cursor:pointer;transition:all .2s;text-decoration:none;color:inherit}.cat-card:hover{box-shadow:0 4px 20px #0000001a;transform:translateY(-2px)}.cat-img{flex:1;position:relative;display:flex;align-items:center;justify-content:center}.cat-img:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.5),transparent 40%)}.cat-label{position:relative;z-index:1;color:#fff;font-size:12px;font-weight:500;padding:6px 14px;border-radius:20px;border:1px solid rgba(255,255,255,.25)}.cat-body{padding:14px}.cat-body h3{font-size:13px;font-weight:500;color:#1a1a2e;margin-bottom:4px}.cat-body p{font-size:11px;color:#888;line-height:1.5}.cat-body .link{font-size:10px;color:#1a56db;font-weight:500;margin-top:6px}.cta{border-radius:12px;padding:28px 36px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#0c1a2b,#132f52);position:relative;overflow:hidden;margin-bottom:32px}.cta:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 60% 100% at 85% 50%,rgba(212,168,83,.12),transparent 60%)}.cta h2{color:#fff;font-size:18px;font-weight:500;position:relative;z-index:1}.cta p{color:#ffffff80;font-size:11px;margin-top:4px;position:relative;z-index:1}.cta .btn{position:relative;z-index:1;flex-shrink:0}.page-header{margin-bottom:24px}.page-header h1{font-size:20px;font-weight:500;margin-bottom:4px}.breadcrumb{font-size:11px;color:#888;margin-bottom:4px}.breadcrumb a{color:#1a56db;text-decoration:none}.brand-card{border-radius:12px;overflow:hidden;display:grid;grid-template-columns:1fr 1.4fr;min-height:180px;margin-bottom:32px}.brand-left{background:linear-gradient(135deg,#0f1923,#162536);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.brand-right{position:relative;overflow:hidden;background:linear-gradient(135deg,#0c4a6e,#0a2238 50%,#0c1a2b);display:flex;align-items:center;justify-content:center;padding:30px}.brand-right:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 70% 100% at 80% 50%,rgba(14,165,233,.18),transparent 60%)}.brand-info{position:relative;z-index:2;color:#fff}.brand-info h2{font-size:20px;font-weight:500;margin-bottom:4px}.brand-info .title{color:#7dd3fc;font-size:11px;margin-bottom:4px}.brand-info .company{color:#ffffff80;font-size:10px;font-style:italic;margin-bottom:10px}.brand-info .divider{width:40px;height:1px;background:#fff3;margin:8px 0}.brand-info .info-line{color:#ffffffbf;font-size:10px;line-height:2}.about-section{background:#fff;border-radius:12px;padding:28px;margin-bottom:24px;border:1px solid #e2e8f0}.about-section h2{font-size:16px;font-weight:500;margin-bottom:12px;color:#1a1a2e}.about-section p{font-size:12px;color:#666;line-height:1.8;margin-bottom:10px}.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:32px}.cap-card{border:1px solid #e2e8f0;border-radius:10px;padding:20px;text-align:center;background:#fff;transition:all .2s}.cap-card:hover{box-shadow:0 4px 16px #0000000f}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:32px}.tl-step{border:1px solid #e2e8f0;border-radius:12px;padding:24px 16px;text-align:center;background:#fff;transition:all .2s}.tl-step:hover{box-shadow:0 4px 16px #0000000f;transform:translateY(-2px)}.tl-num{width:36px;height:36px;border-radius:50%;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:#fff;background:linear-gradient(135deg,#0c4a6e,#1e3a5f)}.tl-step h4{font-size:13px;font-weight:500;color:#1a1a2e;margin-bottom:6px}.tl-step p{font-size:10px;color:#888;line-height:1.5}.oem-detail{background:#fff;border-radius:12px;padding:28px;margin-bottom:24px;border:1px solid #e2e8f0}.oem-detail h2{font-size:16px;font-weight:500;margin-bottom:16px;color:#1a1a2e}.oem-services{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.oem-service{padding:14px;border:1px solid #e2e8f0;border-radius:10px;display:flex;gap:12px;align-items:flex-start;transition:all .2s}.oem-service:hover{background:#f8fafc}.oem-icon{font-size:20px;flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#f0f4f8;border-radius:8px}.oem-text h5{font-size:12px;font-weight:500;color:#1a1a2e;margin-bottom:2px}.oem-text p{font-size:10px;color:#888;line-height:1.4}.faq-section{background:#fff;border-radius:12px;padding:28px;margin-bottom:24px;border:1px solid #e2e8f0}.faq-section h2{font-size:16px;font-weight:500;margin-bottom:16px;color:#1a1a2e}.faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.faq-item{padding:14px;border:1px solid #e2e8f0;border-radius:10px;cursor:pointer;transition:all .2s}.faq-item:hover{background:#f8fafc;border-color:#d4a853}.faq-item .q{font-size:12px;font-weight:500;color:#1a1a2e}.faq-item .a{font-size:10px;color:#888;line-height:1.5;margin-top:6px;display:none}.faq-item.open{background:#fefce8;border-color:#eab308}.faq-item.open .a{display:block}.filters{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.filter-btn{padding:7px 16px;border-radius:20px;font-size:11px;font-weight:500;border:1px solid #e2e8f0;background:#fff;color:#888;cursor:pointer;transition:all .2s;font-family:inherit}.filter-btn:hover{color:#1a1a2e;border-color:#94a3b8}.filter-btn.active{background:#d4a853;border-color:#d4a853;color:#fff}.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}.prod-card{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;background:#fff;cursor:pointer;transition:all .2s}.prod-card:hover{box-shadow:0 4px 20px #0000001a;transform:translateY(-2px)}.prod-img{aspect-ratio:1;background:linear-gradient(135deg,#f0f4f8,#e2e8f0);display:flex;align-items:center;justify-content:center;font-size:11px;color:#94a3b8;position:relative}.prod-badge{position:absolute;top:10px;left:10px;padding:3px 8px;border-radius:4px;font-size:9px;font-weight:500}.prod-body{padding:14px}.prod-body .model{font-size:13px;font-weight:500;color:#1a1a2e}.prod-body .cat{font-size:11px;font-weight:500;margin-top:2px}.prod-body .specs{font-size:9px;color:#888;margin-top:4px}.detail{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:32px;background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e2e8f0}.detail-gallery{position:relative}.detail-main{aspect-ratio:4/3;background:linear-gradient(135deg,#0f172a,#1e3a5f);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.detail-slide{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ffffff80;font-size:12px;opacity:0;transition:opacity .3s}.detail-slide.active{opacity:1}.detail-thumbs{display:flex;gap:6px;padding:10px;background:#fff}.thumb{width:52px;height:52px;border-radius:6px;border:2px solid transparent;display:flex;align-items:center;justify-content:center;font-size:9px;color:#666;cursor:pointer;transition:all .2s;background:#e2e8f0}.thumb.active{border-color:#d4a853}.detail-dots{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;gap:6px;z-index:2}.dot{width:8px;height:8px;border-radius:50%;background:#ffffff4d;cursor:pointer;transition:all .2s}.dot.active{background:#fff;border:2px solid #d4a853}.detail-info{padding:24px;display:flex;flex-direction:column;justify-content:center;gap:10px}.detail-info .cat-name{font-size:11px;font-weight:500}.detail-info h2{font-size:20px;font-weight:500}.detail-info .desc{font-size:11px;color:#888;line-height:1.6}.detail-info .tech{font-size:10px;color:#555;line-height:2}.detail-info .actions{display:flex;gap:8px;margin-top:8px}.custom-bar{background:#f8fafc;border-radius:10px;padding:14px;font-size:11px;color:#666;margin-bottom:32px}.custom-bar strong{color:#1a1a2e}.prod-card-link{text-decoration:none;color:inherit;display:block}.prod-card-link .prod-card{height:100%}.prod-footer{padding:8px 14px;border-top:1px solid #f0f4f8;display:flex;align-items:center}.compare-check{display:flex;align-items:center;gap:6px;font-size:10px;color:#888;cursor:pointer}.compare-check input{cursor:pointer;accent-color:#d4a853}.compare-bar{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#1a1a2e;color:#fff;border-radius:10px;padding:12px 20px;display:flex;align-items:center;gap:14px;z-index:200;box-shadow:0 4px 20px #00000040;font-size:12px}.compare-clear{background:none;border:none;color:#ffffff80;cursor:pointer;font-size:11px;text-decoration:underline}.spec-table{display:flex;flex-direction:column;gap:6px;background:#f8fafc;border-radius:8px;padding:14px}.spec-row{display:flex;justify-content:space-between;align-items:center;font-size:11px}.spec-key{color:#888;font-weight:500}.spec-val{color:#1a1a2e;font-weight:500}.btn-sample{background:transparent;border:1px solid #d4a853;color:#d4a853}.btn-sample:hover{background:#fefce8}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:32px}.contact-info{background:linear-gradient(135deg,#0f172a,#1e3a5f);border-radius:12px;padding:28px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between}.contact-info:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 60% 80% at 30% 50%,rgba(14,165,233,.1),transparent 60%)}.contact-info-content{position:relative;z-index:1;flex:1}.contact-info h3{color:#fff;font-size:16px;font-weight:500;margin-bottom:14px}.contact-info .line{color:#fffc;font-size:11px;line-height:2.2}.contact-info .name{color:#fff;font-size:15px;font-weight:500;margin-bottom:2px}.contact-wa{display:flex;align-items:center;gap:10px;margin-top:16px;cursor:pointer;transition:opacity .2s}.contact-wa:hover{opacity:.85}.wa-icon{width:50px;height:50px;border-radius:10px;background:#25d366;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:600;text-align:center;line-height:1.2}.wa-text{font-size:10px;color:#ffffff80}.contact-logo{position:relative;z-index:1;flex-shrink:0}.contact-logo img{filter:drop-shadow(0 4px 20px rgba(0,0,0,.4));height:110px}.contact-form{background:#fff;border-radius:12px;padding:28px;border:1px solid #e2e8f0}.contact-form h3{font-size:15px;font-weight:500;margin-bottom:18px}.form-row{display:flex;flex-direction:column;gap:10px}.form-row input,.form-row textarea{width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:12px;font-family:inherit;outline:none;transition:border-color .2s}.form-row input:focus,.form-row textarea:focus{border-color:#d4a853}.form-row textarea{min-height:100px;resize:vertical}.form-response{font-size:11px;margin-top:12px;padding:10px;border-radius:8px}.form-response.success{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}.form-response.error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.footer{text-align:center;font-size:10px;color:#aaa;margin-top:40px;line-height:1.8;padding:20px 0}.footer a{color:#1a56db;text-decoration:none}.compare-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:9999;padding:24px}.compare-modal{background:#fff;border-radius:14px;width:100%;max-width:780px;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.compare-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 0}.compare-header h2{font-size:18px;font-weight:500}.compare-close{background:none;border:none;font-size:22px;color:#aaa;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1}.compare-close:hover{color:#333;background:#f0f4f8}.compare-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:16px}.compare-table th,.compare-table td{padding:12px 16px;text-align:center;vertical-align:middle}.compare-table thead th{border-bottom:2px solid #e2e8f0;font-weight:500;font-size:12px;color:#1a1a2e;background:#f8fafc;position:sticky;top:0;z-index:1}.compare-table thead th:first-child{text-align:left;color:#888;font-weight:400;min-width:100px}.compare-table tbody td{border-bottom:1px solid #f0f4f8}.compare-table tbody td:first-child{text-align:left;color:#888;font-size:11px;font-weight:500}.compare-table tbody td .spec-val{color:#1a1a2e;font-weight:500}.compare-img{width:80px;height:80px;border-radius:8px;object-fit:cover;background:#f0f4f8;display:block;margin:0 auto}.compare-name{font-size:13px;font-weight:500;color:#1a1a2e;margin-top:6px}.compare-cat{font-size:10px;margin-top:2px}.compare-actions{margin-top:8px}.compare-actions .btn{padding:5px 12px;font-size:11px}@media (max-width:768px){.nav-links{gap:12px}.nav-links a{font-size:10px}.cat-grid,.cap-grid{grid-template-columns:1fr}.prod-grid{grid-template-columns:repeat(2,1fr)}.detail,.timeline,.oem-services,.faq-grid,.contact-grid,.brand-card{grid-template-columns:1fr}.cta{flex-direction:column;text-align:center;gap:16px;padding:20px}.hero-content{max-width:80%}.hero h1{font-size:20px}.compare-modal{max-width:95vw;border-radius:10px}.compare-table th,.compare-table td{padding:8px 10px;font-size:10px}.compare-table thead th:first-child{min-width:70px}.compare-img{width:50px;height:50px}}
