*,*::before,*::after{box-sizing:border-box}
:root{--navy:#0b3a8f;--navy2:#071a45;--red:#e11d2e;--green:#12b76a;--ink:#0f1f3d;--mut:#5b6b88;--line:#e3e9f4;--bg:#f4f7fc;--r:10px}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55;font-size:15px;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}ul,ol{margin:0;padding:0;list-style:none}h1,h2,h3,h4,p{margin:0}
.ic{flex:none;vertical-align:middle}.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}
.muted{color:var(--mut)}.spacer{height:40px}
h1{font-size:clamp(26px,4vw,40px);line-height:1.15;font-weight:800}h2{font-size:clamp(20px,2.6vw,26px);font-weight:800;color:var(--navy2)}.h3{font-size:18px;font-weight:800;margin-bottom:12px}.h4{font-size:16px;font-weight:800;margin:20px 0 10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:7px;font-weight:700;font-size:14px;border:1.5px solid transparent;cursor:pointer;transition:.15s;font-family:inherit;line-height:1.2;text-align:center}
.btn:hover{filter:brightness(1.07);transform:translateY(-1px)}.btn-red{background:var(--red);color:#fff}.btn-wa{background:var(--green);color:#fff}.btn-white{background:#fff;color:var(--navy2)}
.btn-line{background:#fff;border-color:var(--red);color:var(--red)}.btn-line-red{background:#fff;border-color:var(--red);color:var(--red)}.btn-line-blue{background:#fff;border-color:var(--navy);color:var(--navy)}.btn-ghost{border-color:#fff;color:#fff;background:rgba(255,255,255,.06)}.btn-block{display:flex;width:100%}
/* topbar & header */
.topbar{background:var(--navy2);color:#d8e2f8;font-size:12px}.tb-in{display:flex;justify-content:space-between;gap:16px;padding-top:7px;padding-bottom:7px}.tb-l,.tb-r{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.tb-l a,.tb-r a{display:inline-flex;gap:6px;align-items:center}.topbar a:hover{color:#fff}.soc{display:flex;gap:10px}
.hdr{background:#fff;position:sticky;top:0;z-index:50;box-shadow:0 1px 0 var(--line)}.hdr-in{display:flex;align-items:center;gap:22px;padding-top:12px;padding-bottom:12px}
.logo{display:flex;align-items:center;flex:none}.logo-img{height:48px;width:auto}.logo-def{display:flex;align-items:center;gap:8px}.logo-txt{display:flex;flex-direction:column;line-height:1.1}.logo-txt b{font-size:15px;letter-spacing:.2px}.logo-txt small{font-size:8.5px;letter-spacing:.6px;opacity:.85;margin-top:3px}
.search{flex:1;display:flex;max-width:520px;border:1.5px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}.search input{flex:1;border:0;padding:11px 14px;font-size:14px;outline:0;min-width:0;font-family:inherit}.search button{background:var(--red);color:#fff;border:0;width:54px;cursor:pointer}
.hdr-act{display:flex;align-items:center;gap:18px;margin-left:auto}.act-link{display:flex;gap:8px;align-items:center;font-weight:700;color:var(--navy2);font-size:14px}.burger{display:none;background:none;border:0;color:var(--navy);padding:6px;cursor:pointer;margin-left:auto}
.nav{background:var(--navy)}.nav>.wrap>ul{display:flex;flex-wrap:wrap}.nav li{position:relative}.nav>.wrap>ul>li>a{display:flex;align-items:center;gap:6px;color:#fff;font-weight:600;font-size:14px;padding:14px 18px}.nav>.wrap>ul>li.on>a,.nav>.wrap>ul>li>a:hover{background:var(--red)}
.dd{display:none;position:absolute;left:0;top:100%;min-width:220px;background:#fff;box-shadow:0 12px 30px #0b2a6f33;border-radius:0 0 8px 8px;z-index:60;padding:6px 0}.has-dd:hover .dd,.has-dd:focus-within .dd{display:block}.dd a{display:block;padding:9px 18px;color:var(--ink);font-size:14px}.dd a:hover{background:var(--bg);color:var(--red)}
/* hero */
.hero-slider{position:relative}.slide{display:none;color:#fff;background-size:cover;background-position:center;min-height:420px}.slide.on{display:flex;align-items:center}.hero-in{padding-top:56px;padding-bottom:56px;max-width:1240px}.hero-in>*{max-width:620px}
.eyebrow{letter-spacing:3px;font-size:12px;font-weight:600;opacity:.9;margin-bottom:12px}.hero h1,.hero .h1{font-size:clamp(28px,5vw,46px);font-weight:800;line-height:1.1;margin-bottom:16px}.hero em{font-style:normal;color:var(--red)}.lead{opacity:.92;margin-bottom:24px;font-size:15px}.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.dots{position:absolute;bottom:14px;left:0;right:0;display:flex;gap:8px;justify-content:center}.dots button{width:9px;height:9px;border-radius:50%;border:0;background:#ffffff66;cursor:pointer;padding:0}.dots button.on{background:#fff}
.page-hero{color:#fff;background-size:cover;background-position:center;padding:22px 0 34px}.page-hero .bc{margin-bottom:22px}.page-hero h1{margin-bottom:10px}.page-hero p{max-width:640px;opacity:.92}.page-hero .eyebrow{margin:0 0 8px}
.hero-badges{display:flex;gap:20px;flex-wrap:wrap;margin-top:22px;background:#0a1e4ccc;padding:12px 18px;border-radius:10px;width:fit-content;max-width:100%}.hero-badges li{display:flex;gap:10px;align-items:center}.hero-badges span{display:flex;flex-direction:column;font-size:13px}.hero-badges small{opacity:.8;font-size:11px}
.bc ol{display:flex;flex-wrap:wrap;gap:6px;font-size:12.5px;padding:14px 0 0}.page-hero .bc ol{padding:0}.bc li+li::before{content:'›';margin-right:6px;opacity:.6}.bc a:hover{text-decoration:underline}.wrap>.bc{margin-bottom:6px}
/* sections */
.sec{padding-top:34px;padding-bottom:34px}.sec.alt{background:var(--bg)}.sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:18px;flex-wrap:wrap}.sec-h p{color:var(--mut);margin-top:4px;font-size:14px}.more-link{color:var(--navy);font-weight:700;font-size:13.5px;display:inline-flex;gap:6px;align-items:center}
.strip{background:var(--bg);border-block:1px solid var(--line)}.strip-in{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;padding-top:16px;padding-bottom:16px}.strip-in.four{grid-template-columns:repeat(4,1fr)}
.feat{display:flex;gap:12px;align-items:center}.feat div{display:flex;flex-direction:column;font-size:13px}.feat small,.why-i small{color:var(--mut);font-size:12px}.feat.stat b{font-size:20px;color:var(--navy2)}.fi{width:50px;height:50px;border-radius:50%;background:#e5edfb;color:var(--navy);display:inline-grid;place-items:center;flex:none}
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cat{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:var(--r);padding:8px;background:#fff;position:relative;transition:.15s}.cat:hover{box-shadow:0 8px 24px #0b3a8f1c;border-color:#c9d6ee}.cat img{width:96px;height:76px;object-fit:cover;border-radius:6px;background:var(--bg)}.cat span{display:flex;flex-direction:column;font-size:13px;min-width:0}.cat small{color:var(--mut);font-size:11.5px}.cat i{margin-left:auto;color:var(--navy);padding-right:4px}
.brand-band{background:var(--bg);padding:20px 0}.brand-in{display:grid;grid-template-columns:260px 1fr;gap:20px;align-items:center}.brand-t h2{font-size:18px}.brand-t p{font-size:12.5px;color:var(--mut)}.brand-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}.brand-chip{background:#fff;border:1px solid var(--line);border-radius:8px;height:60px;display:grid;place-items:center;font-weight:800;color:var(--navy);padding:6px}.brand-chip img{max-height:36px;width:auto}
.pgrid{display:grid;gap:14px}.pgrid-6{grid-template-columns:repeat(6,1fr)}.pgrid-4{grid-template-columns:repeat(4,1fr)}
.pcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.15s}.pcard:hover{box-shadow:0 10px 28px #0b3a8f1f}.badge-pop{position:absolute;left:8px;top:8px;background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:3px 9px;border-radius:4px;z-index:2}
.pimg{background:#fff;aspect-ratio:4/3;display:block;overflow:hidden}.pimg img{width:100%;height:100%;object-fit:cover}.pbody{padding:10px 12px 14px;display:flex;flex-direction:column;gap:6px;flex:1}.pbrand{min-height:24px;display:flex;align-items:center}.bm-txt{font-weight:800;color:var(--red);font-size:12.5px;text-transform:uppercase}.bm-img{max-height:24px;width:auto}
.pcard h3{font-size:14.5px;font-weight:700}.pmeta{font-size:11.5px;color:var(--mut);flex:1}.pprice{font-weight:800;color:var(--navy2)}.pprice small{font-weight:400;color:var(--mut)}.pcard .btn{padding:8px 10px;font-size:13px}
.ind{color:#fff;background-size:cover;background-position:center;padding:32px 0}.ind-in{display:grid;grid-template-columns:290px 1fr;gap:26px;align-items:center}.ind-t h2{color:#fff;margin-bottom:10px}.ind-t p{opacity:.9;margin-bottom:16px;font-size:14px}
.ind-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.ind-grid.big{grid-template-columns:repeat(3,1fr)}.ind-card{min-height:170px;border-radius:var(--r);background:#13306f center/cover;display:flex;align-items:flex-end;color:#fff;padding:12px;font-size:13px;font-weight:700;transition:.15s}.ind-grid.big .ind-card{min-height:230px}.ind-card:hover{transform:translateY(-3px)}.ind-card span{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.agrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.agrid-3{grid-template-columns:repeat(3,1fr)}.acard{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}.aimg{aspect-ratio:2/1;overflow:hidden;display:block;background:var(--bg)}.aimg img{width:100%;height:100%;object-fit:cover}.abody{padding:12px 14px 16px;display:flex;flex-direction:column;gap:6px;flex:1}.abody h3{font-size:16px;line-height:1.3}.abody p{font-size:13px;color:var(--mut);flex:1}.ameta{font-size:12px;color:var(--mut);display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tag{background:#e5edfb;color:var(--navy);padding:2px 8px;border-radius:4px;font-size:11.5px;font-weight:600}.more{color:var(--navy);font-weight:700;font-size:13px;display:inline-flex;gap:6px;align-items:center}
.why-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.why-i{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px}.why-i div{display:flex;flex-direction:column;font-size:13px}.why-i .fi{width:42px;height:42px}
.cta-band{color:#fff;background-size:cover;background-position:center;padding:28px 0}.cta-in{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.cta-band h2{color:#fff;font-size:22px}.cta-band p{opacity:.9;font-size:14px;margin-top:4px}.cta-btns{display:flex;gap:12px;flex-wrap:wrap}
/* catalog */
.cat-layout{display:grid;grid-template-columns:240px 1fr 280px;gap:22px;padding-top:22px;padding-bottom:30px;align-items:start}.box{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px}.box h3{font-size:15px;font-weight:800;margin-bottom:10px;color:var(--navy2)}
.catlist li a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:6px;font-size:13.5px;font-weight:600}.catlist li.on a,.catlist li a:hover{background:#fdecee;color:var(--red)}
.chk{display:flex;gap:8px;align-items:center;padding:4px 0;font-size:13.5px;cursor:pointer}.chk input{accent-color:var(--red);width:16px;height:16px}.sel{display:block;margin-bottom:10px;font-size:13px;font-weight:600}.sel select,.form select,.form input,.form textarea,.cm-tools select{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:7px;font:inherit;font-size:14px;background:#fff;margin-top:5px}.cm-tools select{margin:0;width:auto}.reset{display:block;text-align:center;margin-top:10px;font-size:13px;color:var(--navy);text-decoration:underline}
.cm-h{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;margin-bottom:14px;flex-wrap:wrap}.cm-h p{color:var(--mut);font-size:13px}.cm-tools{display:flex;gap:10px;align-items:center}.filter-open,.filter-close{display:none}
.pager{display:flex;gap:6px;justify-content:center;margin:24px 0;flex-wrap:wrap}.pager a,.pager .gap{min-width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;font-weight:600;font-size:13px;background:#fff}.pager a.on{background:var(--red);color:#fff;border-color:var(--red)}.pager .gap{border:0}
.cta-box{background:var(--navy2) center/cover;color:#fff;border-radius:var(--r);padding:18px;margin-bottom:14px}.cta-box h3{color:#fff;font-size:17px;margin-bottom:12px}.cta-box p{font-size:13px;opacity:.9;margin-bottom:10px}.cta-box li{display:flex;gap:8px;align-items:center;font-size:13px;margin-bottom:6px}.cta-box li .ic{color:var(--red);background:#fff;border-radius:50%;padding:2px}.cta-box .btn{margin-top:10px}
.dl-box img{width:140px;margin:0 auto 10px;border-radius:6px}.ticks li{display:flex;gap:8px;align-items:center;font-size:13.5px;margin:6px 0}.ticks .ic{color:var(--red)}.ticks.big li{font-size:14.5px;margin:10px 0}.ticks.red .ic{color:var(--red)}.dl-box .btn{margin-top:10px}
.help li{display:flex;gap:10px;align-items:center;margin:8px 0;font-size:13.5px}.help .ic{color:var(--navy)}.help p{font-size:13px;color:var(--mut);margin-bottom:6px}.help .btn{margin-top:10px}
.empty{text-align:center;padding:50px 20px;color:var(--mut)}.empty .btn{margin-top:14px}
/* product detail */
.pd{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.1fr) 280px;gap:26px;padding-top:12px;padding-bottom:20px;align-items:start}.pd-main{position:relative;background:linear-gradient(#fff,#f2f5fb);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.pd-main>img{width:100%;aspect-ratio:4/3;object-fit:cover}.pd-badges{position:absolute;left:10px;top:10px;display:flex;flex-direction:column;gap:6px}.pd-badges li{background:#fff;border:1px solid var(--line);color:var(--navy);font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:6px;display:flex;gap:6px;align-items:center}
.pd-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto}.pd-thumbs button{border:2px solid var(--line);border-radius:8px;padding:0;background:#fff;width:84px;flex:none;overflow:hidden;cursor:pointer}.pd-thumbs button.on{border-color:var(--red)}.pd-thumbs img{width:100%;aspect-ratio:4/3;object-fit:cover}
.pd-info h1{font-size:clamp(22px,3vw,30px);color:var(--navy2)}.pd-brand{font-weight:700;margin:2px 0 10px}.pd-desc{color:var(--mut);font-size:14px;margin-bottom:14px}.pd-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.pd-specs li{display:flex;gap:10px;align-items:flex-start;font-size:12.5px}.pd-specs .ic{color:var(--navy);margin-top:2px}.pd-specs span{display:flex;flex-direction:column}.pd-specs small{color:var(--mut)}
.pd-price{font-size:26px;font-weight:800;color:var(--navy2);margin-bottom:12px}.pd-price small{font-size:14px;font-weight:400;color:var(--mut)}.pd-price em{display:block;font-size:12px;font-weight:400;color:var(--mut);font-style:normal}.pd-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.pd-btns .btn{flex:1;min-width:190px;padding:13px}
.pd-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;font-size:11.5px}.pd-mini li{display:flex;gap:6px;align-items:flex-start}.pd-mini .ic{color:var(--navy)}.pd-mini span{display:flex;flex-direction:column}.pd-mini small{color:var(--mut)}
.bb-h{display:flex;gap:12px;align-items:center;margin-bottom:10px;font-size:12.5px}.pd-side .box{margin-bottom:12px}
.tabs{display:flex;gap:0;background:var(--bg);border-radius:8px;overflow-x:auto;margin:10px 0 18px;-webkit-overflow-scrolling:touch}.tabs a{padding:13px 24px;font-weight:600;font-size:14px;white-space:nowrap}.tabs a:first-child,.tabs a.on{background:var(--red);color:#fff;border-radius:8px}
.spec-grid{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:16px;align-items:start}.spec{width:100%;border-collapse:collapse;font-size:13.5px}.spec th,.spec td{padding:9px 12px;border:1px solid var(--line);text-align:left}.spec th{background:#f6f8fd;width:42%;font-weight:600}.zebra thead th{background:var(--navy);color:#fff;width:auto}.tscroll{overflow-x:auto;margin:14px 0}
.struct img{margin:0 auto;max-height:420px;object-fit:contain}.docs li{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px}.docs li .ic{color:var(--red)}.docs span{flex:1;display:flex;flex-direction:column}.docs small{color:var(--mut)}.docs a{color:var(--red);text-decoration:underline;font-weight:600}.docs.boxed{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:6px 16px}
.sizes-box{margin-top:14px;border-radius:var(--r);color:#fff;padding:16px;background-size:cover;display:flex;flex-direction:column;gap:10px;align-items:flex-start;font-size:13.5px}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.faq{background:#fff;border:1px solid var(--line);border-radius:8px}.faq summary{padding:14px 16px;font-weight:600;font-size:14px;display:flex;justify-content:space-between;gap:12px;cursor:pointer;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq[open] summary .ic{transform:rotate(45deg)}.faq div{padding:0 16px 14px;color:var(--mut);font-size:14px}
.rich{font-size:15px;line-height:1.75}.rich h2{font-size:22px;margin:26px 0 10px}.rich h3{font-size:18px;margin:20px 0 8px}.rich ul{list-style:disc;padding-left:22px;margin:10px 0}.rich ol{list-style:decimal;padding-left:22px;margin:10px 0}.rich p{margin:10px 0}.rich a{color:var(--navy);text-decoration:underline}.rich img{border-radius:8px;margin:14px 0}.rich table{width:100%;border-collapse:collapse;font-size:14px}.rich th,.rich td{border:1px solid var(--line);padding:9px 12px;text-align:left}.rich th{background:var(--navy);color:#fff}.rich blockquote{border-left:4px solid var(--red);background:#fdf2f3;margin:14px 0;padding:12px 16px}.narrow{max-width:860px}
/* brand */
.brand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.bcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px;text-align:center;transition:.15s}.bcard:hover{box-shadow:0 10px 28px #0b3a8f1f}.bl{height:70px;display:grid;place-items:center;margin-bottom:10px;font-size:22px;color:var(--red)}.bcard h2{font-size:18px}.bcard p{font-size:13px;color:var(--mut)}.bcard small{color:var(--navy);font-weight:600}
.brand-hero{background:#f4f7fc center/cover;padding:30px 0}.bh-in{display:grid;grid-template-columns:300px 1fr;gap:30px;align-items:center}.bh-logo{text-align:center;font-size:44px;font-weight:900;color:var(--red)}.bh-logo img{margin:0 auto}.brand-hero h1{color:var(--navy2);font-size:clamp(24px,3.5vw,34px)}.bh-tag{font-weight:700;font-size:17px;margin:4px 0 8px}.bh-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.bh-badges li{display:flex;gap:8px;font-size:12.5px;color:var(--navy)}.bh-badges span{display:flex;flex-direction:column}.bh-badges small{color:var(--mut)}
.about-b{display:grid;grid-template-columns:1fr 1.3fr;gap:24px;margin-top:12px;align-items:start}.about-b p{margin-bottom:14px;color:#34456a}.b4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.b4i{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--navy)}.b4i small{color:var(--mut)}
.adv{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:12px}.certs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cert{border:1px solid var(--line);border-radius:8px;padding:12px;text-align:center;font-size:12.5px;display:flex;flex-direction:column;gap:6px;align-items:center}.cert .ic{color:var(--navy)}.cert a{color:var(--red);font-weight:600}
/* about */
.about-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:26px}.about-grid>div:first-child p{margin:10px 0;color:#34456a}.about-img{width:100%;border-radius:var(--r);aspect-ratio:3/2;object-fit:cover;grid-row:span 2}.mini4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:var(--bg);padding:14px;border-radius:var(--r);margin-top:14px}.mini4 li{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12.5px}.mini4 small{color:var(--mut);font-size:11px}.mini4 .fi{width:44px;height:44px}
.vm .box{display:flex;gap:14px}.vm .box p{font-size:14px;color:#34456a}.div-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:14px}.div-c{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.div-c img{width:100%;aspect-ratio:2/1;object-fit:cover}.div-c span{display:flex;flex-direction:column;gap:6px;padding:12px;font-size:13px}.div-c small{color:var(--mut)}.div-c i{color:var(--navy);font-style:normal;font-weight:700;display:flex;gap:6px;align-items:center}
.why-dark{background:var(--navy2);color:#fff;padding:34px 0}.wd-in{display:grid;grid-template-columns:340px 1fr;gap:30px;align-items:center}.why-dark h2{color:#fff}.why-dark p{opacity:.85;margin-top:10px;font-size:14px}.wd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.wd-grid>div{display:flex;gap:10px;align-items:center}.wd-grid .fi{background:#ffffff1f;color:#fff}.wd-grid span:last-child{display:flex;flex-direction:column;font-size:13.5px}.wd-grid small{opacity:.8}
.client-row{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin-top:14px}.client{background:#fff;border:1px solid var(--line);border-radius:8px;height:70px;display:grid;place-items:center;font-weight:800;color:var(--navy);padding:6px;text-align:center;font-size:13px}.client img{max-height:44px;width:auto}.client span{font-weight:500;color:var(--mut)}
.info-3{display:grid;grid-template-columns:1.1fr .9fr 1.1fr 1fr;gap:18px;margin-top:20px}.info-3>div{display:flex;gap:12px;font-size:13.5px}.info-3 .ic{color:var(--navy);margin-top:2px}.info-3 h3{margin-bottom:4px}.info-3 p{color:#34456a;margin-bottom:8px}.map-mini{min-height:140px;background:#dfe8f7;border-radius:8px;overflow:hidden;display:grid!important;place-items:center}.map-mini iframe,.map iframe{width:100%;height:100%;min-height:200px;border:0}.map-mini a,.map a{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--navy);font-weight:600}
/* contact */
.c4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:-14px;position:relative;z-index:2}.c4 .box{display:flex;gap:14px}.c4 h3{margin-bottom:4px}.c4 p{font-size:13px;color:#34456a;margin-bottom:10px}.c4 .big{font-size:20px;display:block;margin-bottom:6px;color:var(--navy2)}.c4 .mid{display:block;margin-bottom:6px;color:var(--navy2);word-break:break-all;font-size:14px}.c4.sm{margin-top:14px}.ci{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff}.ci.blue{background:var(--navy)}.ci.green{background:var(--green)}.ci.red{background:var(--red)}
.c2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:16px 0 26px}.form{display:flex;flex-direction:column;gap:12px;margin-top:14px}.form label{font-size:13px;font-weight:600}.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hp{position:absolute!important;left:-9999px}.alert{padding:12px 14px;border-radius:8px;margin-top:12px;font-size:14px}.alert.ok{background:#e7f7ef;color:#067647}.alert.err{background:#fdecee;color:#b42318}
.map{height:250px;background:#dfe8f7;border-radius:8px;overflow:hidden;display:grid;place-items:center;margin:12px 0}.route{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13px}.route>div{flex:1}.route p{color:#34456a}
/* article */
.two-col{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}.art h1{font-size:clamp(24px,3.5vw,34px);color:var(--navy2);margin:10px 0}.lead-d{color:#34456a;margin-bottom:14px}.art-by{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13px;margin-bottom:16px}.av{width:38px;height:38px;border-radius:50%;background:var(--bg);display:grid;place-items:center;color:var(--navy)}.share{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:13px;color:var(--mut)}.share a,.share button{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:0;background:#e5edfb;color:var(--navy);cursor:pointer}.art-img{width:100%;border-radius:var(--r);margin-bottom:18px;aspect-ratio:2/1;object-fit:cover}
.art-body{display:grid;grid-template-columns:200px 1fr;gap:20px;align-items:start}.toc ol{list-style:decimal;padding-left:18px;font-size:13px}.toc li{margin:6px 0}.toc a:hover{color:var(--red)}.inline-cta{display:flex;gap:14px;align-items:center;background:#fdecee;border:1px solid #f9c7cd;border-radius:var(--r);padding:14px;margin:20px 0;flex-wrap:wrap}.inline-cta>div{flex:1;display:flex;flex-direction:column;min-width:200px}.inline-cta>.ic{color:var(--green)}
.poplist li a{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}.poplist img{width:64px;height:48px;object-fit:cover;border-radius:4px;flex:none}.poplist span{display:flex;flex-direction:column}.poplist small{color:var(--mut)}.catcount li a{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px}.catcount span{background:var(--bg);padding:0 8px;border-radius:10px;font-size:12px}.mini-search{display:flex}.mini-search input{flex:1;border:1.5px solid var(--line);border-radius:7px 0 0 7px;padding:9px 12px;font:inherit;min-width:0}.mini-search button{background:var(--red);color:#fff;border:0;padding:0 14px;border-radius:0 7px 7px 0}
.dl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:10px}.dl-i{display:flex;gap:14px;align-items:center}.dl-i .ic{color:var(--red)}.dl-i>div{flex:1;display:flex;flex-direction:column}.dl-i small,.dl-i p{color:var(--mut);font-size:12.5px}.nf{text-align:center;padding:80px 20px}.nf h1{font-size:80px;color:var(--navy)}.nf p{margin:10px 0 20px}
/* footer */
.ftr{background:var(--navy2);color:#c9d6f2;margin-top:0}.ftr-grid{display:grid;grid-template-columns:1.5fr .8fr 1fr 1fr 1.4fr;gap:26px;padding-top:34px;padding-bottom:26px}.ftr h4{color:#fff;font-size:14px;margin-bottom:12px}.ftr li{margin:7px 0;font-size:13px}.ftr a:hover{color:#fff}.f-about p{font-size:13px;margin:14px 0;max-width:340px}.f-soc{display:flex;gap:10px}.f-soc a{color:#fff}.f-contact li{display:flex;gap:10px;align-items:flex-start}.f-contact .ic{color:#fff;margin-top:2px}
.f-bot{background:#05122f;font-size:12.5px}.f-bot-in{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}.f-links{display:flex;gap:18px}.totop{background:var(--red);color:#fff;width:40px;height:40px;border-radius:6px;display:grid;place-items:center}
.wa-float{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:54px;height:54px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;box-shadow:0 6px 18px #0004;z-index:40}
/* responsive */
@media(max-width:1180px){.pgrid-6{grid-template-columns:repeat(4,1fr)}.cat-layout{grid-template-columns:230px 1fr}.side-r{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.pd{grid-template-columns:1fr 1fr}.pd-side{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:14px}.ind-grid{grid-template-columns:repeat(3,1fr)}.ind-in{grid-template-columns:1fr}.why-grid{grid-template-columns:repeat(3,1fr)}.agrid{grid-template-columns:repeat(2,1fr)}.cat-grid{grid-template-columns:repeat(2,1fr)}.spec-grid{grid-template-columns:1fr 1fr}.spec-grid>.box:first-child{grid-column:1/-1}.ftr-grid{grid-template-columns:1fr 1fr 1fr}.div-grid{grid-template-columns:repeat(3,1fr)}.client-row{grid-template-columns:repeat(4,1fr)}.c4{grid-template-columns:repeat(2,1fr)}.info-3{grid-template-columns:1fr 1fr}.brand-grid{grid-template-columns:repeat(3,1fr)}.wd-in{grid-template-columns:1fr}.hide-lg{display:none!important}}
@media(max-width:900px){.hide-md{display:none!important}.burger{display:block}.hdr-in{flex-wrap:wrap;gap:10px}.search{order:3;flex-basis:100%;max-width:none}.hdr-act .act-link{display:none}.hdr-act{margin-left:auto}.hdr-act .btn span{display:none}.hdr-act .btn{padding:10px 12px}.nav{display:none}.nav.open{display:block}.nav>.wrap>ul{flex-direction:column}.nav>.wrap>ul>li>a{padding:13px 4px;border-bottom:1px solid #ffffff1f}.dd{position:static;display:block;box-shadow:none;background:#0a2f75;border-radius:0;padding:0}.dd a{color:#dbe6ff;padding:9px 18px}.has-dd>a .ic:last-child{display:none}
.cat-layout{grid-template-columns:1fr}.side-l{position:fixed;inset:0 25% 0 0;background:#fff;z-index:80;padding:14px;overflow:auto;transform:translateX(-105%);transition:.25s;box-shadow:6px 0 30px #0005}.side-l.open{transform:none}.filter-open,.filter-close{display:inline-flex}.filter-close{margin-bottom:12px}.pgrid-4,.pgrid-6{grid-template-columns:repeat(2,1fr)}.side-r{grid-template-columns:1fr}
.strip-in,.strip-in.four{grid-template-columns:repeat(2,1fr)}.brand-in{grid-template-columns:1fr}.pd{grid-template-columns:1fr}.pd-side{grid-template-columns:1fr}.pd-specs{grid-template-columns:repeat(2,1fr)}.pd-mini{grid-template-columns:repeat(2,1fr)}.spec-grid{grid-template-columns:1fr}.faq-grid{grid-template-columns:1fr}.two-col{grid-template-columns:1fr}.art-body{grid-template-columns:1fr}.bh-in{grid-template-columns:1fr}.bh-badges{grid-template-columns:repeat(2,1fr)}.about-b,.adv,.about-grid,.c2{grid-template-columns:1fr}.about-img{grid-row:auto}.b4{grid-template-columns:repeat(2,1fr)}.mini4{grid-template-columns:repeat(2,1fr)}.dl-grid{grid-template-columns:1fr}.agrid-3{grid-template-columns:repeat(2,1fr)}.ind-grid.big{grid-template-columns:repeat(2,1fr)}.cta-in{flex-direction:column;align-items:flex-start}}
@media(max-width:560px){.wrap{padding:0 14px}.tb-r{display:none}.cat-grid,.agrid,.agrid-3,.why-grid,.c4,.info-3,.fr,.certs,.brand-grid,.wd-grid{grid-template-columns:1fr}.pgrid-4,.pgrid-6{gap:10px}.ind-grid{grid-template-columns:repeat(2,1fr)}.ind-card{min-height:130px}.div-grid{grid-template-columns:repeat(2,1fr)}.client-row{grid-template-columns:repeat(2,1fr)}.ftr-grid{grid-template-columns:1fr 1fr}.f-about,.f-contact{grid-column:1/-1}.hero-in{padding-top:36px;padding-bottom:40px}.slide{min-height:360px}.hero-btns .btn{flex:1}.pd-btns .btn{min-width:100%}.tabs a{padding:12px 16px}.pcard h3{font-size:13.5px}.pcard .btn{font-size:12px;padding:8px 4px}.hero-badges{gap:12px}.share{margin-left:0}.brand-chip{height:52px}.page-hero{padding-bottom:26px}.c4{margin-top:0;padding-top:14px}.f-bot-in{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.cat-layout>*,.pd>*,.spec-grid>*,.two-col>*,.c2>*,.about-grid>*{min-width:0}.spec-grid>.box{overflow-x:auto}.spec th,.spec td{overflow-wrap:anywhere}
.vid{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#000}.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cable-svg{width:100%;height:auto;max-height:420px}.struct .cable-svg{max-height:380px}.adv3{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:20px;align-items:center;margin-top:14px}.adv-img img{margin:0 auto}.adv3 .certs{grid-template-columns:repeat(3,1fr)}.seal{width:56px;height:56px;border:2px solid var(--navy);border-radius:8px;display:grid;place-items:center;font-weight:900;color:var(--navy);font-size:14px;background:#f6f8fd}.cert b{font-size:12px}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.testi-grid blockquote{margin:0}.testi-grid .ic{color:var(--red);margin-bottom:6px}.testi-grid p{color:#34456a;margin-bottom:10px}.testi-grid footer{display:flex;flex-direction:column;font-size:13px}.testi-grid small{color:var(--mut)}
@media(max-width:900px){.adv3{grid-template-columns:1fr}.testi-grid{grid-template-columns:1fr}}
.smap{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.smap .wide{grid-column:1/-1}.smap li{padding:4px 0;font-size:14px}.smap a:hover{color:var(--red)}.smap .cols{columns:3}@media(max-width:900px){.smap{grid-template-columns:1fr}.smap .cols{columns:1}}
.facc{border-bottom:1px solid var(--line)}.facc summary{display:flex;justify-content:space-between;align-items:center;padding:11px 2px;font-weight:700;font-size:13.5px;cursor:pointer;list-style:none}.facc summary::-webkit-details-marker{display:none}.facc[open] summary .ic{transform:rotate(180deg)}.facc select{width:100%;padding:9px 11px;border:1.5px solid var(--line);border-radius:7px;font:inherit;margin-bottom:10px;background:#fff}.pprice{white-space:nowrap}.pprice small{font-size:11px}
.tb-l{flex-wrap:nowrap;gap:16px;min-width:0}.tb-l a{white-space:nowrap}.tb-l a:last-child{overflow:hidden;text-overflow:ellipsis;max-width:520px;display:inline-block}.tb-r{flex-wrap:nowrap}.topbar{font-size:11.5px}
@media(min-width:1181px){.about-grid{grid-template-columns:1.15fr 1fr .85fr;align-items:start}.about-img{grid-row:auto;height:100%;max-height:420px}.vm{display:flex;flex-direction:column}.vm .box{margin-bottom:12px}}
@media(min-width:901px) and (max-width:1180px){.about-grid{grid-template-columns:1fr 1fr}.vm{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:14px}}
.c4 .mid{font-size:13px;overflow-wrap:anywhere}.c4 .big{font-size:19px}

/* login (halaman publik) */
.login{background:linear-gradient(120deg,#f4f8ff,#e8eefb) center/cover;padding:10px 0 60px}.login-in{display:grid;grid-template-columns:1fr 440px;gap:50px;align-items:center;padding-top:40px}.login-t h1{font-size:clamp(28px,4vw,40px);color:var(--navy2);margin:6px 0 14px}.login-t>p{color:#334155;max-width:440px}.login-t ul{margin-top:26px;display:flex;flex-direction:column;gap:16px}.login-t li{display:flex;gap:14px;align-items:center}.login-t li div{display:flex;flex-direction:column}.login-t small{color:var(--mut)}.fi.sq{border-radius:10px;width:54px;height:54px}.eyebrow.red{color:var(--red);font-weight:700;letter-spacing:3px;font-size:13px}
.login-card{background:#fff;border-radius:14px;box-shadow:0 20px 60px #0b3a8f26;padding:30px;display:flex;flex-direction:column;gap:14px}.lc-logo{display:flex;justify-content:center}.login-card h2{text-align:center;font-size:24px;margin-top:6px}.login-card>p{text-align:center;color:var(--mut);font-size:13.5px}.lf{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:8px;padding:0 12px;color:#94a3b8}.lf input{border:0;outline:0;flex:1;padding:13px 0;font:inherit;min-width:0}.lf button{background:none;border:0;color:#94a3b8;cursor:pointer}.lrow{display:flex;justify-content:space-between;font-size:13px}.lrow a{color:var(--red)}.or{text-align:center;color:var(--mut);font-size:13px;position:relative}.or::before{content:'';position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--line)}.or span{background:#fff;padding:0 12px;position:relative}.lock{display:flex;gap:10px;background:#fdecee;border:1px solid #f9c7cd;color:#b42318;padding:12px;border-radius:8px;font-size:13px;align-items:center}.feat.col{flex-direction:column;text-align:center}.feat.col div{align-items:center}.login-feat{background:#fff}
@media(max-width:900px){.login-in{grid-template-columns:1fr;gap:30px}}
.btn-line-gray{border-color:#cbd5e1;background:#fff;color:var(--ink)}