*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#030914;color:#eef7ff;font-family:Inter,Arial,sans-serif;overflow-x:hidden}.nav{height:76px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:rgba(2,10,24,.94);border-bottom:1px solid #0d8dff;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}.brand{display:flex;gap:10px;align-items:center;color:white;text-decoration:none;font-size:25px;font-weight:800;letter-spacing:-1px}.brand b{color:#18cfff}.brand small{display:block;font-size:9px;letter-spacing:3px;color:#8ca7bc}.brand-icon{font-size:31px}nav{display:flex;gap:30px}nav a{color:#dce9f5;text-decoration:none;font-weight:600}nav a:hover{color:#18cfff}.nav-cta,.btn{border-radius:10px;text-decoration:none;font-weight:800}.nav-cta{padding:11px 20px;background:#0b8fff;color:white}.hero{min-height:650px;display:grid;grid-template-columns:48% 52%;align-items:center;padding:55px 5%;position:relative;background:radial-gradient(circle at 80% 45%,#063e73 0,transparent 40%),linear-gradient(125deg,#030914,#061a35)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 45%,rgba(0,195,255,.08) 46%,transparent 47%);background-size:240px 100%;animation:slide 7s linear infinite;pointer-events:none}.hero-content{position:relative;z-index:2}.eyebrow{color:#25d5ff;font-size:13px;font-weight:900;letter-spacing:3px;margin-bottom:14px}.hero h1{font-size:clamp(42px,5vw,72px);line-height:.98;margin:0 0 22px;text-transform:uppercase;letter-spacing:-3px}.hero h1 span,h2 span{color:#19d6ff;text-shadow:0 0 24px rgba(25,214,255,.35)}.hero p{font-size:19px;line-height:1.6;color:#b8cbda;max-width:620px}.hero-buttons{display:flex;gap:12px;margin:30px 0}.btn{padding:15px 22px}.primary{background:#079cff;color:#fff;box-shadow:0 0 25px rgba(0,156,255,.3)}.ghost{border:1px solid #168bc5;color:white}.trust-row{display:flex;gap:25px;flex-wrap:wrap;color:#bdeaff;font-size:12px}.hero-art{position:relative}.hero-art img{width:100%;display:block;border-radius:22px;filter:saturate(1.12);box-shadow:0 20px 70px rgba(0,0,0,.55);animation:float 5s ease-in-out infinite}.pulse{position:absolute;width:12px;height:12px;border-radius:50%;background:#24dcff;box-shadow:0 0 0 0 rgba(36,220,255,.7);animation:pulse 2s infinite}.p1{top:31%;right:29%}.p2{top:54%;right:10%;animation-delay:.6s}.p3{bottom:19%;left:21%;animation-delay:1.2s}.ticker{overflow:hidden;background:#051b09;border-block:1px solid #7fff00;color:#d6ff18;white-space:nowrap;font-weight:900;letter-spacing:1px;padding:12px 0}.ticker-track{display:inline-flex;gap:24px;animation:ticker 22s linear infinite}.ticker i{color:#bfff00}.services{padding:90px 5%;max-width:1500px;margin:auto}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.section-head h2,.contact h2{font-size:42px;margin:0;letter-spacing:-2px}.section-head p{max-width:470px;color:#9fb2c3}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#071525;border:1px solid #18344c;border-radius:18px;overflow:hidden;transition:.3s;box-shadow:0 10px 30px rgba(0,0,0,.25)}.card:hover{transform:translateY(-9px);border-color:#1ccfff;box-shadow:0 15px 45px rgba(0,180,255,.18)}.card-image{height:185px;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(135deg,#092746,#020b17)}.service-icon{font-size:74px;filter:drop-shadow(0 0 18px rgba(0,210,255,.55));animation:iconFloat 3s ease-in-out infinite}.scan{position:absolute;inset:0;background:linear-gradient(transparent,rgba(0,225,255,.12),transparent);height:35%;animation:scan 2.6s linear infinite}.camera-light{position:absolute;width:160px;height:160px;border-radius:50%;border:2px solid #35ff62;box-shadow:0 0 40px #35ff62;animation:camera 1.8s infinite}.wifi-wave{width:150px;height:150px;border:5px solid #b54dff;border-radius:50%;animation:wifi 1.8s infinite}.card-body{padding:21px}.card h3{font-size:22px;margin:0 0 5px}.card strong{font-size:12px;color:#1bd5ff}.card ul{padding-left:18px;line-height:1.9;color:#adc1d0;font-size:13px;min-height:142px}.card li::marker{color:#22d6ff}.card-btn{display:block;text-align:center;padding:12px;background:#078eff;border-radius:10px;color:#fff;text-decoration:none;font-weight:800;font-size:13px}.cctv .card-btn{background:#31cf5a}.desktop .card-btn{background:#ffad18;color:#101010}.wifi .card-btn{background:#a93fff}.contact{margin:20px 5% 70px;padding:42px 5%;border:1px solid #20e7b4;border-radius:24px;background:linear-gradient(100deg,#06271f,#061b31);display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;overflow:hidden}.contact h2{font-size:34px}.contact p{color:#b2c6d5}.contact-actions{display:flex;gap:12px}.contact-box{min-width:240px;padding:17px 20px;border:1px solid #1f6683;border-radius:12px;color:#fff;text-decoration:none;background:rgba(0,0,0,.2)}.contact-box small{display:block;color:#35d9ff;font-size:10px;letter-spacing:2px;margin-bottom:5px}.contact-box b{font-size:16px}.contact-glow{position:absolute;width:300px;height:300px;border-radius:50%;background:#00e0a0;filter:blur(100px);opacity:.1;right:20%;top:-150px}footer{padding:25px 5%;display:flex;justify-content:center;gap:35px;flex-wrap:wrap;border-top:1px solid #173149;color:#b6c7d5;font-size:12px;letter-spacing:1px}footer b{color:#21d7ff}@keyframes ticker{to{transform:translateX(-50%)}}@keyframes float{50%{transform:translateY(-8px)}}@keyframes iconFloat{50%{transform:translateY(-8px) scale(1.04)}}@keyframes pulse{70%{box-shadow:0 0 0 18px transparent}}@keyframes scan{from{transform:translateY(-180%)}to{transform:translateY(480%)}}@keyframes camera{50%{opacity:.35;transform:scale(1.15)}}@keyframes wifi{50%{transform:scale(1.15);opacity:.4}}@keyframes slide{to{background-position:240px 0}}@media(max-width:1050px){.service-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-art{max-width:750px;margin:35px auto 0}.contact{flex-direction:column;align-items:flex-start}.contact-actions{width:100%;flex-wrap:wrap}}@media(max-width:650px){.nav{height:68px}.nav nav{display:none}.nav-cta{padding:9px 13px}.brand{font-size:18px}.brand small{font-size:7px}.hero{padding:45px 5%}.hero h1{font-size:43px}.hero p{font-size:16px}.hero-buttons{flex-direction:column}.btn{text-align:center}.trust-row{display:grid;gap:10px}.service-grid{grid-template-columns:1fr}.section-head{display:block}.section-head h2,.contact h2{font-size:31px}.contact-actions{flex-direction:column;width:100%}.contact-box{min-width:0;width:100%}}
