@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --blue:#0758c9;--cyan:#11b7ef;--navy:#06182f;--ink:#10243d;--muted:#607087;
  --light:#f4f8fd;--white:#fff;--line:#dce7f3;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{text-decoration:none;color:inherit}.container{width:min(1160px,92%);margin:auto}
.header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:45px;height:45px;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-size:27px;font-weight:900}.brand strong{display:block;font-size:23px;letter-spacing:2px;line-height:1}.brand small{font-size:9px;font-weight:700;letter-spacing:1.6px;color:#49627e}.nav nav{display:flex;gap:28px;font-weight:600;font-size:14px}.nav nav a:hover{color:var(--blue)}.menu{display:none;border:0;background:none;font-size:26px}
.hero{overflow:hidden;background:radial-gradient(circle at 80% 20%,#e7f6ff 0,#f7fbff 30%,#fff 70%);padding:85px 0 70px}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:2px;margin:0 0 12px}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.02;letter-spacing:-3px;margin:0 0 22px}.hero h1 span{display:block;color:var(--blue)}.lead{font-size:18px;color:var(--muted);max-width:620px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}.btn{display:inline-flex;padding:14px 22px;border-radius:10px;font-weight:800}.primary{background:var(--blue);color:white;box-shadow:0 10px 25px #0758c933}.outline{border:1px solid #a9bfd7;background:white}.trust-row{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;font-weight:700;color:#49627e}
.hero-card{height:420px;border-radius:30px;background:linear-gradient(145deg,#dcefff,#fff 55%,#b9dcf7);position:relative;box-shadow:0 30px 70px #0758c926;border:1px solid #cfe3f5;overflow:hidden}.hero-card:before{content:"";position:absolute;width:270px;height:270px;border-radius:50%;background:#fff8;left:50%;top:35px;transform:translateX(-50%)}.camera{position:absolute;background:linear-gradient(145deg,#fff,#d8e2ea);border:1px solid #b7c4ce;box-shadow:0 18px 35px #20384c2e}.camera:after{content:"";position:absolute;border-radius:50%;background:radial-gradient(circle,#111 0 18%,#1678bb 19% 35%,#0b1e2f 36% 58%,#000 59%);border:8px solid #eaf0f4}.camera-a{width:155px;height:115px;border-radius:70px 70px 35px 35px;left:55px;top:105px;transform:rotate(-12deg)}.camera-a:after{width:60px;height:60px;left:42px;top:24px}.camera-b{width:180px;height:135px;border-radius:80px 80px 35px 35px;left:50%;top:90px;transform:translateX(-50%)}.camera-b:after{width:78px;height:78px;left:43px;top:27px}.camera-c{width:145px;height:105px;border-radius:65px 65px 30px 30px;right:50px;top:115px;transform:rotate(12deg)}.camera-c:after{width:58px;height:58px;left:39px;top:22px}.recorder{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);width:340px;height:90px;border-radius:10px;background:linear-gradient(#202a34,#080d12);color:white;padding:20px;font-weight:800;letter-spacing:2px;box-shadow:0 15px 30px #07121f55}.recorder i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#19bde9;margin-left:15px}.hero-card>p{position:absolute;bottom:13px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:4px;font-weight:800;color:#34536f}
.features{background:var(--navy);color:white}.feature-grid{display:grid;grid-template-columns:repeat(5,1fr)}.feature-grid div{padding:24px 12px;display:flex;align-items:center;justify-content:center;gap:10px;border-right:1px solid #ffffff22;font-size:12px;font-weight:700}.feature-grid b{display:grid;place-items:center;width:38px;height:38px;border:2px solid #4bbaf0;border-radius:50%;color:#4bbaf0}
.section{padding:95px 0}.section-head{text-align:center;max-width:700px;margin:0 auto 48px}.section-head h2,.promo h2,.contact h2{font-size:clamp(32px,4vw,48px);line-height:1.1;margin:0 0 14px;letter-spacing:-1.5px}.section-head p:not(.eyebrow){color:var(--muted)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-grid article{padding:28px;border:1px solid var(--line);border-radius:18px;background:white;transition:.25s;box-shadow:0 8px 30px #092c4d08}.service-grid article:hover{transform:translateY(-5px);box-shadow:0 18px 40px #092c4d12}.icon{width:46px;height:46px;border-radius:12px;background:#e9f5ff;color:var(--blue);display:grid;place-items:center;font-size:21px;font-weight:800}.service-grid h3{margin:18px 0 7px}.service-grid p{margin:0;color:var(--muted);font-size:14px}
.dark{background:var(--navy);color:white}.light .eyebrow{color:#4ec7f3}.light p:not(.eyebrow){color:#a8bdd3}.solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.solution{height:280px;border-radius:20px;padding:25px;display:flex;flex-direction:column;justify-content:end;overflow:hidden;position:relative;background:linear-gradient(160deg,#164f82,#06182f)}.solution:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,#35b9ef55,transparent 40%)}.solution>*{position:relative}.solution span{font-size:11px;font-weight:800;letter-spacing:2px;color:#55c9f3}.solution h3{margin:5px 0 0;font-size:21px}.office{background:linear-gradient(160deg,#0c5d82,#07192e)}.shop{background:linear-gradient(160deg,#155c69,#07192e)}.factory{background:linear-gradient(160deg,#335d72,#07192e)}
.brands{background:#f7faff}.brand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.brand-grid div{background:white;border:1px solid var(--line);border-radius:14px;padding:27px;text-align:center;font-size:20px;font-weight:900;letter-spacing:1px;color:#263e57}
.promo{padding:90px 0;background:linear-gradient(110deg,#eaf7ff,#fff)}.promo-grid{display:grid;grid-template-columns:1fr .8fr;gap:55px;align-items:center}.promo p:not(.eyebrow){color:var(--muted);max-width:580px}.promo img{width:100%;border-radius:18px;box-shadow:0 25px 60px #092c4d22}
.contact{padding:80px 0;background:#eef7ff}.contact-grid{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center}.contact-card{background:white;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 15px 40px #092c4d10}.contact-card a{display:flex;flex-direction:column;padding:20px 24px;border-bottom:1px solid var(--line)}.contact-card a:last-child{border:0}.contact-card strong{font-size:17px}.contact-card span{color:var(--muted);font-size:12px}
footer{background:#041224;color:#b9c9d9;padding:25px 0}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:12px}.footer-inner strong{display:block;color:white}.footer-inner span{font-size:10px}
@media(max-width:800px){.nav nav{display:none}.menu{display:block}.hero{padding:55px 0}.hero-grid,.promo-grid,.contact-grid{grid-template-columns:1fr}.hero-card{height:340px}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-grid div:last-child{grid-column:1/-1}.service-grid{grid-template-columns:1fr 1fr}.solution-grid{grid-template-columns:1fr 1fr}.brand-grid{grid-template-columns:1fr 1fr}.footer-inner{flex-direction:column;align-items:flex-start}}
@media(max-width:520px){.brand strong{font-size:19px}.hero h1{letter-spacing:-2px}.hero-card{height:280px}.camera-a{left:10px;top:80px;transform:scale(.7) rotate(-12deg)}.camera-b{top:65px;transform:translateX(-50%) scale(.72)}.camera-c{right:5px;top:85px;transform:scale(.7) rotate(12deg)}.recorder{width:270px;height:70px;bottom:35px;padding:16px;font-size:12px}.service-grid,.solution-grid,.brand-grid{grid-template-columns:1fr}.section{padding:70px 0}.feature-grid div{padding:18px 7px;font-size:10px}}