:root{--o:#ff6500;--n:#071828;--b:#0d3a61}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:#111}.wrap{max-width:1220px;margin:auto;padding:0 20px}.top{display:flex;justify-content:space-between;align-items:center;padding-top:18px;padding-bottom:18px}.logo b,.logo strong,.logo small{display:block}.logo b{font-size:27px}.logo strong{font-size:22px;color:var(--o)}.contacts{display:flex;gap:20px}.contacts a,.contacts span{color:#111;text-decoration:none;font-weight:600}nav{background:var(--n)}.nav{display:flex;align-items:center}.nav #links{display:flex;flex:1}.nav a{color:#fff;text-decoration:none;padding:17px 11px}.btn{background:var(--o)!important;color:white!important;text-decoration:none;padding:15px 20px!important;border-radius:5px;font-weight:800}#menu{display:none}.hero{background:linear-gradient(120deg,#06131f,#15374e);color:white}.heroGrid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;min-height:410px}.tag{color:#ff8c42;font-weight:800}.hero h1{font-size:54px;line-height:1;margin:8px 0}.hero h1 em{color:var(--o);font-style:normal}.hero p{font-size:18px;line-height:1.5}.actions{display:flex;gap:15px;margin-top:25px}.outline{border:1px solid white;color:white;text-decoration:none;padding:14px 20px;border-radius:5px;font-weight:800}.showcase{background:#0b2030;border:1px solid #345;border-radius:12px;padding:25px;text-align:center}.monitor{background:#063b78;border:7px solid #111;padding:45px 15px;font-size:29px;font-weight:900}.monitor small,.pic small{display:block;font-size:12px;margin-top:8px}.devices{font-size:65px}.network{background:#111;padding:15px;font-size:25px}.benefits{display:grid;grid-template-columns:repeat(4,1fr);padding-top:17px;padding-bottom:17px;font-weight:700}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-top:28px;padding-bottom:25px}.cards article{border:1px solid #ddd;border-radius:6px;overflow:hidden}.cards h2{margin:0;background:var(--o);color:#fff;padding:14px;font-size:19px;min-height:70px}.cards h2.blue{background:var(--b)}.cards h2.light{background:#eee;color:#111}.cards h2.red{background:#df171f}.pic{height:145px;display:grid;place-content:center;text-align:center;font-size:25px;font-weight:900;color:#fff}.orange{background:linear-gradient(135deg,#102637,#f26700)}.navy{background:linear-gradient(135deg,#06213b,#1682b4)}.pale{background:#e9eef1;color:#1b9a40}.white{background:#f4f4f4;color:#d71920}.cards ul{font-size:14px;line-height:1.55;padding:0 20px 10px 32px}.cards li::marker{color:var(--o)}.brands{background:#f2f4f6;border-block:1px solid #ddd;padding:20px 0;text-align:center;font-size:20px;font-weight:900}.projects{background:#edf1f4;padding:25px 0}.projectGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.projectGrid div{height:145px;background:#173247;color:#fff;display:grid;place-items:center;font-size:50px;border-radius:5px;text-align:center}.projectGrid b{display:block;font-size:14px;padding:0 8px}.quote{background:var(--n);color:#fff;padding:24px 0}.quoteGrid{display:grid;grid-template-columns:2fr auto auto auto;gap:14px;align-items:center}.wa{background:#08a83d;color:#fff;text-decoration:none;padding:15px 20px;border-radius:5px;font-weight:800}.footer{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px;padding-top:30px;padding-bottom:30px}.footer h3 em{color:var(--o);font-style:normal}.footer a,.footer span{display:block;color:#111;text-decoration:none;margin:8px 0}.copy{text-align:center;background:#06131f;color:#fff;padding:16px}@media(max-width:900px){.contacts{display:none}#menu{display:block;background:none;border:0;color:#fff;font-size:26px;padding:12px}.nav{position:relative;justify-content:space-between}.nav #links{display:none;position:absolute;top:52px;left:0;right:0;background:var(--n);flex-direction:column;z-index:5}.nav #links.open{display:flex}.heroGrid{grid-template-columns:1fr;padding-block:35px}.showcase{display:none}.cards{grid-template-columns:1fr 1fr}.projectGrid{grid-template-columns:1fr 1fr}.quoteGrid{grid-template-columns:1fr 1fr}.footer{grid-template-columns:1fr}}@media(max-width:560px){.cards,.projectGrid,.quoteGrid{grid-template-columns:1fr}.benefits{grid-template-columns:1fr 1fr;gap:15px}.hero h1{font-size:38px}.actions{flex-direction:column}.logo small{display:none}}