
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{
--bg:#020b13;--bg2:#061521;--panel:#071c2c;--panel2:#09263a;
--line:rgba(114,185,232,.17);--text:#f4f8fb;--muted:#9db2c3;
--blue:#0797ff;--blue2:#39b2ff;--cyan:#6bd1ff;--max:1320px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}
body.no-scroll{overflow:hidden}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 56px));margin:auto}
.progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,#078fff,#63d2ff);z-index:1000}
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(2,11,19,.65);backdrop-filter:blur(16px);border-bottom:1px solid transparent;transition:.3s}
header.scrolled{background:rgba(2,11,19,.95);border-color:var(--line)}
.nav{height:96px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{height:78px;width:auto;object-fit:contain;border-radius:5px}
.navlinks{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:600}
.navlinks>a,.drop>button{color:#d6e3ec;transition:.2s;background:none;border:0;cursor:pointer}
.navlinks>a:hover,.navlinks>a.active,.drop>button:hover{color:#39b2ff}
.drop{position:relative;z-index:20}
.drop-menu{position:absolute;top:calc(100% + 8px);left:-18px;min-width:220px;background:#061521;border:1px solid var(--line);border-radius:7px;padding:10px;box-shadow:0 25px 70px #000b;opacity:0;pointer-events:none;transform:translateY(4px);transition:.2s;z-index:50}
.drop-menu:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.drop:hover .drop-menu,.drop.open .drop-menu{opacity:1;pointer-events:auto;transform:none}
.drop-menu a{display:block;padding:10px 12px;color:#a9bdcc;font-size:13px;border-radius:4px}
.drop-menu a:hover{background:#0a2940;color:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;background:var(--blue);color:#fff;padding:13px 20px;border-radius:5px;font-weight:700;font-size:13px;cursor:pointer;transition:.22s;box-shadow:0 12px 35px rgba(0,151,255,.18)}
.btn:hover{background:#23a5ff;transform:translateY(-2px);box-shadow:0 16px 42px rgba(0,151,255,.3)}
.btn.outline{background:transparent;border:1px solid #5d778b;box-shadow:none}.btn.outline:hover{border-color:#39b2ff;background:#072337}
.menu{display:none;border:0;background:none;color:#fff;font-size:27px;cursor:pointer}
.hero{min-height:850px;position:relative;display:flex;align-items:center;overflow:hidden;background:
linear-gradient(90deg,#020b13 0%,rgba(2,11,19,.97) 25%,rgba(2,11,19,.68) 50%,rgba(2,11,19,.15) 100%),
url("assets/hero-industrial.jpg") center/cover no-repeat}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 23%,rgba(2,11,19,.12));pointer-events:none}
.hero-content{position:relative;z-index:2;padding-top:90px}
.kicker{color:#3ab4ff;text-transform:uppercase;letter-spacing:3px;font-size:11px;font-weight:800;margin-bottom:15px}
h1{font-size:clamp(48px,6.5vw,88px);line-height:.98;letter-spacing:-3px;max-width:850px}
h1 span{color:var(--blue)}
.lead{color:#c2d0dc;max-width:680px;font-size:17px;margin:25px 0 31px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.quick{display:flex;gap:28px;flex-wrap:wrap;margin-top:43px;color:#d9e7f0;font-size:12px;font-weight:600}
.quick span{display:flex;align-items:center;gap:8px}.quick i{color:#2daeff;font-style:normal;font-size:18px}
.floating-card{position:absolute;right:5%;bottom:110px;z-index:3;width:230px;padding:18px;background:rgba(5,24,38,.76);border:1px solid var(--line);backdrop-filter:blur(10px);border-radius:7px}
.floating-card strong{display:block;font-size:15px}.floating-card small{color:#91a7b8}
.section{padding:105px 0}.section.soft{background:#061521}.section.hero-gap{padding-top:60px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px}
.section-head h2{font-size:40px;line-height:1.08;letter-spacing:-1px}.section-head p{max-width:600px;color:var(--muted);font-size:14px}
.grid{display:grid;gap:17px}.products-grid{grid-template-columns:repeat(4,1fr)}
.card{background:linear-gradient(160deg,#09253a,#05141f);border:1px solid var(--line);border-radius:6px;overflow:hidden;position:relative;transition:.28s}
.card:after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,transparent 55%,rgba(21,163,255,.08));pointer-events:none}
.card:hover{transform:translateY(-7px);border-color:rgba(57,178,255,.6);box-shadow:0 25px 60px rgba(0,0,0,.3)}
.card img{width:100%;aspect-ratio:1.32;object-fit:cover;transition:.35s}.card:hover img{transform:scale(1.035)}
.card-body{padding:17px}.card h3{font-size:16px;margin-bottom:7px}.card p{color:#91a8b9;font-size:12px;min-height:58px}.arrow{float:right;color:#38b4ff;font-size:18px}
.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:28px}.filter{background:#061a29;border:1px solid var(--line);color:#a9bdcc;padding:10px 15px;border-radius:4px;cursor:pointer;font-size:12px;font-weight:700}.filter.active,.filter:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.solution-grid{grid-template-columns:repeat(3,1fr)}
.solution{padding:31px;min-height:260px;border:1px solid var(--line);background:linear-gradient(145deg,#08243a,#061623);border-radius:7px;transition:.25s}.solution:hover{transform:translateY(-5px);border-color:rgba(57,178,255,.5)}
.solution .icon{font-size:30px;color:#25a9ff;margin-bottom:33px}.solution h3{font-size:18px;margin-bottom:9px}.solution p{color:var(--muted);font-size:13px}
.industry-grid{grid-template-columns:repeat(4,1fr)}
.industry{min-height:190px;padding:24px;display:flex;align-items:end;border:1px solid var(--line);background:linear-gradient(135deg,#0b293d,#05131e);border-radius:5px;position:relative;overflow:hidden}.industry:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(0,151,255,.24),transparent 45%)}.industry h3{position:relative;font-size:17px}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}.step{position:relative}.num{width:54px;height:54px;border:1px solid #148fd7;border-radius:50%;display:grid;place-items:center;color:#39b4ff;font-weight:800;margin-bottom:16px;background:#061a28}.step h3{font-size:15px}.step p{color:var(--muted);font-size:12px;margin-top:5px}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.about-image{min-height:470px;border:1px solid var(--line);border-radius:7px;background:url("assets/products/filter-house.jpg") center/cover no-repeat;position:relative;overflow:hidden}.about-image:after{content:"SCRIPE";position:absolute;bottom:22px;left:22px;font-size:12px;letter-spacing:5px;color:#fff;background:#03111dcc;padding:10px 13px}
.cta{padding:60px;display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(105deg,#061a29,#0a2a42);border:1px solid var(--line);border-radius:7px}.cta h2{font-size:37px}.cta p{color:var(--muted);margin-top:5px}
.page-hero{padding:165px 0 85px;background:radial-gradient(circle at 78% 20%,rgba(0,151,255,.17),transparent 32%),#03111d;border-bottom:1px solid var(--line)}.page-hero h1{font-size:clamp(44px,5vw,70px)}.page-hero p{max-width:700px;color:var(--muted);font-size:16px;margin-top:18px}
.product-detail{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:start}.product-detail>img{width:100%;border:1px solid var(--line);border-radius:7px}.spec{padding:32px;border:1px solid var(--line);background:#061a28;border-radius:7px}.spec h2{font-size:35px;line-height:1.1;margin-bottom:12px}.spec p{color:var(--muted);font-size:14px}.list{display:grid;gap:9px;margin:23px 0 28px}.list li{list-style:none;color:#c4d3de;font-size:13px}.list li:before{content:"✓";color:#24a9ff;margin-right:10px}
.contact-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:24px}.contact-box,.form{border:1px solid var(--line);background:#061a28;border-radius:7px;padding:30px}.contact-box{display:grid;gap:23px}.contact-item small{display:block;color:#6e8da3;text-transform:uppercase;letter-spacing:1px;font-size:10px}.contact-item strong{display:block;margin-top:4px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{color:#b9cbd8;font-size:12px}.field input,.field textarea,.field select{width:100%;background:#03111b;border:1px solid var(--line);color:#fff;padding:13px;border-radius:4px;outline:none}.field input:focus,.field textarea:focus,.field select:focus{border-color:#1599e9}.field textarea{min-height:160px;resize:vertical}
footer{padding:50px 0 22px;background:#020a11;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:35px}.footer-logo{height:72px;width:auto}.footer p,.footer a,.footer span{font-size:12px;color:#849bad}.footer p{max-width:370px;margin-top:12px}.footer h4{font-size:13px;margin-bottom:12px}.footer-links{display:grid;gap:7px}.footer-links a:hover{color:#3bb3ff}.copyright{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:34px;padding-top:17px}
.reveal{opacity:0;transform:translateY(25px);transition:.7s ease}.reveal.visible{opacity:1;transform:none}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:25px;z-index:300}.modal.open{display:flex}.modal-box{width:min(900px,100%);background:#061a28;border:1px solid var(--line);border-radius:8px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr}.modal-box img{height:100%;width:100%;object-fit:cover}.modal-copy{padding:34px}.close{float:right;border:0;background:none;color:#fff;font-size:25px;cursor:pointer}
@media(max-width:1050px){.navlinks{gap:15px}.nav>.btn{display:none}.products-grid{grid-template-columns:repeat(2,1fr)}.industry-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.product-detail,.about-grid,.contact-grid{grid-template-columns:1fr}.modal-box{grid-template-columns:1fr}}
@media(max-width:720px){.container{width:calc(100% - 30px)}.nav{height:80px}.logo{height:66px}.menu{display:block}.navlinks{display:none;position:absolute;top:80px;left:0;right:0;background:#03111d;border-bottom:1px solid var(--line);padding:20px;flex-direction:column;align-items:flex-start}.navlinks.open{display:flex}.drop-menu{position:static;opacity:1;pointer-events:auto;transform:none;display:none;margin-top:8px}.drop.open .drop-menu{display:block}.hero{min-height:820px;background:linear-gradient(90deg,#020b13 0%,rgba(2,11,19,.9) 100%),url("assets/hero-industrial.jpg") center/cover}.floating-card{display:none}.section{padding:72px 0}.section-head{display:block}.section-head h2{font-size:33px;margin-bottom:12px}.products-grid,.solution-grid,.industry-grid,.steps{grid-template-columns:1fr}.cta{display:block;padding:35px}.cta h2{font-size:30px}.cta .btn{margin-top:20px}.about-grid{gap:30px}.about-image{min-height:320px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:6px}h1{letter-spacing:-2px}.quick{gap:15px}}
