@font-face{font-family:Roboto;font-weight:400;font-display:swap;src:url(/assets/fonts/roboto-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Roboto;font-weight:500;font-display:swap;src:url(/assets/fonts/roboto-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Roboto;font-weight:700;font-display:swap;src:url(/assets/fonts/roboto-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Roboto;font-weight:900;font-display:swap;src:url(/assets/fonts/roboto-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Roboto Slab";font-weight:600;font-display:swap;src:url(/assets/fonts/roboto-slab-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Roboto Slab";font-weight:700;font-display:swap;src:url(/assets/fonts/roboto-slab-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Semi Condensed";font-weight:600;font-display:swap;src:url(/assets/fonts/barlow-semi-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Semi Condensed";font-weight:700;font-display:swap;src:url(/assets/fonts/barlow-semi-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:500;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:700;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Plus Jakarta Sans";font-weight:800;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-800-normal.woff2) format("woff2")}
:root{--dark:#161b25;--dark2:#202531;--yellow:#fcfd28;--red:#ca0000;--orange:#e74823;--orange-d:#c43a17;--cream:#fdf7ec;--ink:#111;--t:#3d3d3d;--m:#5a5a5a;--line:#ece6da;--wa:#128c4a}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Roboto,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--t);background:#fff;line-height:1.75;font-size:16px}
img{max-width:100%;height:auto;display:block}a{color:var(--red)}
.w{max-width:1140px;margin:0 auto;padding:0 16px}
h1,h2,h3,h4{color:var(--ink);line-height:1.25}
h1{font-family:Roboto,sans-serif;font-weight:700;font-size:clamp(30px,5vw,50px);text-transform:uppercase;margin:.1em 0 .3em}
h2{font-family:Roboto,sans-serif;font-weight:500;font-size:clamp(24px,3.2vw,32px);text-transform:uppercase;margin:1.2em 0 .5em}
h3{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;font-size:21px;margin:.4em 0}
h4{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;font-size:18px;margin:.4em 0}
.kicker{font-family:"Barlow Semi Condensed",sans-serif;font-weight:600;font-size:19px;color:var(--orange-d);text-transform:uppercase;letter-spacing:.06em;margin:0}
.lead{font-size:18px;color:var(--m)}.center{text-align:center}.center .lead{max-width:780px;margin-left:auto;margin-right:auto}
/* top & header */
.top{background:#0d1017;color:#fff;font-size:14px}.top .w{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:7px 16px}.top a{color:var(--yellow);font-weight:700}
header{background:var(--dark);position:sticky;top:0;z-index:20;box-shadow:0 2px 12px rgba(0,0,0,.25)}
header .w{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:6px 16px}
.logo img{height:64px;width:auto}
nav{display:flex;gap:20px}nav a{color:#f1f1f1;text-decoration:none;font-family:"Barlow Semi Condensed",sans-serif;font-weight:600;font-size:17px;text-transform:uppercase;letter-spacing:.03em}nav a:hover{color:var(--yellow)}
.call{background:var(--red);color:#fff!important;text-decoration:none;font-weight:700;padding:10px 18px;border-radius:3px;white-space:nowrap;font-size:15px}
.cs{display:none}
/* buttons */
.btn{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-family:Roboto,sans-serif;font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.02em;padding:14px 26px;border-radius:3px;border:0;cursor:pointer}
.btn:hover{filter:brightness(.9)}.btn.white{background:#fff;color:var(--red)}.btn.wa{background:var(--wa);color:#fff}.btn.orange{background:var(--orange-d)}.btn.sm{padding:9px 16px;font-size:13px}
/* hero */
.hero{background:linear-gradient(rgba(10,12,18,.55),rgba(10,12,18,.65)),url(/assets/img/hero-penangkal-petir-gedung.webp) center/cover no-repeat;color:#fff;text-align:center;padding:110px 0 120px}
.hero h1,.hero .h1{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.45);font-family:Roboto,sans-serif;font-weight:700;font-size:clamp(30px,5vw,50px);text-transform:uppercase;margin:.1em 0 .3em;line-height:1.2}
.hero .y{color:var(--yellow)}.hero p{color:#f2f2f2;font-size:18px;max-width:860px;margin:.6em auto;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.hero .btn{margin-top:18px}
.hero.inner{padding:70px 0 76px;text-align:left}.hero.inner p{margin-left:0}.hero.inner h1{font-size:clamp(28px,4.2vw,44px)}
.crumb{font-size:14px;color:#ddd;margin-bottom:6px}.crumb a{color:#ddd}
/* sections */
section.s{padding:64px 0}section.cream{background:var(--cream)}section.dark{background:var(--dark);color:#e8e8e8}section.dark h2,section.dark h3{color:#fff}
.grid{display:grid;gap:24px}@media(min-width:720px){.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(2,1fr)}}@media(min-width:1000px){.g4{grid-template-columns:repeat(4,1fr)}}
.split{display:grid;gap:36px;align-items:center}@media(min-width:900px){.split{grid-template-columns:1fr 1fr}.split.r{grid-template-columns:1.1fr .9fr}}
.card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:24px}.card p{margin:.4em 0;color:var(--m)}.card a{text-decoration:none}
.card h3 a{color:var(--ink)}.card h3 a:hover{color:var(--red)}
.svc{border-top:4px solid var(--orange-d)}
.prod{text-align:center;padding:18px}.prod img{width:150px;height:150px;margin:0 auto 8px;object-fit:contain}.prod .tag{font-size:12px;color:var(--orange-d);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
ul.chk{list-style:none;padding:0;margin:0}ul.chk li{position:relative;padding-left:28px;margin:8px 0}ul.chk li:before{content:"⚡";position:absolute;left:0;top:0;color:var(--orange-d)}
ul.dots li{margin:6px 0}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.chips a,.chips span{border:1px solid var(--line);background:#fff;border-radius:3px;padding:6px 12px;font-size:14px;color:var(--t);text-decoration:none}.chips a:hover{border-color:var(--red);color:var(--red)}
.tbl{overflow-x:auto;margin:16px 0;border:1px solid var(--line);border-radius:6px}table{width:100%;border-collapse:collapse;font-size:15px;min-width:720px}th,td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:var(--dark);color:#fff;font-weight:500}tr.grp td{background:var(--cream);font-weight:700;color:var(--orange-d)}
details{border:1px solid var(--line);border-radius:6px;padding:14px 18px;margin:10px 0;background:#fff}summary{font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;cursor:pointer;color:var(--ink)}
.cta{background:var(--dark) url(/assets/img/hero-penangkal-petir-gedung.webp) center/cover;background-blend-mode:multiply;color:#fff;text-align:center;border-radius:6px;padding:40px 24px;margin:40px 0}.cta h2{color:#fff;margin-top:0}.cta p{color:#eee}.cta .btn{margin:6px}
.form{background:#fff;border:1px solid var(--line);border-radius:6px;padding:26px}.form label{display:block;font-weight:500;margin:10px 0 6px}.form textarea{width:100%;min-height:170px;font:inherit;padding:12px;border:1px solid #ccc;border-radius:4px}
.note{font-size:13px;color:var(--m)}
footer{background:var(--dark);color:#c9c9c9;padding:48px 0 90px;font-size:14px}footer h3{color:#fff;font-family:"Barlow Semi Condensed",sans-serif;text-transform:uppercase;font-size:19px}footer a{color:#e6e6e6;text-decoration:none}footer a:hover{color:var(--yellow)}
.copy{background:#0d1017;color:#aaa;font-size:13px;padding:14px 0}
.fab{position:fixed;right:18px;bottom:18px;z-index:30;background:#25d366;color:#08331a;font-weight:800;text-decoration:none;border-radius:50px;padding:13px 20px;box-shadow:0 10px 26px rgba(0,0,0,.3)}
main.w{padding-bottom:10px}
@media(max-width:980px){header nav{display:none}}
@media(max-width:520px){.logo img{height:50px}.cn{display:none}.cs{display:inline}.hero{padding:70px 0 80px}}