:root{
  --bg:#050a11;--bg2:#081321;--card:#0c1725;--card2:#101f31;
  --line:#1b3652;--blue:#087cff;--blue2:#20a0ff;--white:#f7faff;
  --muted:#a8b7c8;--green:#22c978;--orange:#ff9d3d;--r:20px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:
radial-gradient(circle at 85% 0%,rgba(0,126,255,.18),transparent 28%),
radial-gradient(circle at 0 40%,rgba(0,126,255,.07),transparent 30%),var(--bg);
color:var(--white);font-family:Inter,Arial,sans-serif;line-height:1.5}
a{text-decoration:none;color:inherit}button{font:inherit;cursor:pointer}
.container{width:min(1180px,92%);margin:auto}
header{position:sticky;top:0;z-index:50;background:rgba(5,10,17,.88);
backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{height:72px;display:flex;align-items:center;gap:24px}
.logo{font-weight:950;font-size:20px;letter-spacing:.08em}.logo span{color:var(--blue)}
nav.mainnav{display:flex;gap:24px;margin-left:auto;color:#c6d3e1;font-size:14px}
nav.mainnav a:hover{color:#fff}
nav.mainnav a.active{color:#fff;position:relative}
nav.mainnav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-24px;height:2px;background:var(--blue)}
.nav-phone{font-weight:900;white-space:nowrap}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:26px}
.mobile-panel{display:none;position:fixed;inset:72px 0 0 0;z-index:49;
background:linear-gradient(180deg,var(--bg2),var(--card));
backdrop-filter:blur(18px);padding:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.mobile-panel.open{display:block}
.mobile-panel a{display:block;padding:16px 14px;margin-bottom:8px;font-size:18px;font-weight:800;
border-radius:14px;background:var(--card2);border:1px solid var(--line);color:#e7eef7}
.mobile-panel a.active{color:#20a0ff;border-color:#20a0ff}

.hero{padding:88px 0 70px}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:center}
.badge{display:inline-flex;padding:8px 13px;border-radius:999px;border:1px solid #205788;
background:rgba(0,126,255,.08);color:#71bdff;font-weight:800;font-size:12px}
h1{font-size:clamp(42px,6vw,76px);line-height:.98;margin:20px 0 22px;letter-spacing:-.03em}
h1 span{color:#1688ff}.lead{font-size:19px;color:var(--muted);max-width:690px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}.btn{
display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;border-radius:13px;
background:linear-gradient(135deg,#087cff,#0055c9);font-weight:900;border:1px solid #218dff;color:#fff;
box-shadow:0 12px 35px rgba(0,108,255,.2);transition:.2s}.btn:hover{transform:translateY(-2px)}
.btn.secondary{background:transparent;border-color:#2a4d6d;box-shadow:none}
.quick{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.quick a{padding:8px 12px;background:#0b1b2c;border:1px solid #183653;border-radius:10px;color:#c9d8e8;font-size:13px}
.visual{min-height:470px;border-radius:32px;border:1px solid #183a5d;position:relative;overflow:hidden;
background:radial-gradient(circle at 50% 35%,rgba(0,126,255,.28),transparent 28%),linear-gradient(145deg,#0d2034,#050a11 70%);
box-shadow:0 30px 80px rgba(0,0,0,.4)}
.visual:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:#087cff22;filter:blur(30px);left:20%;bottom:-90px}
.device{position:absolute;border:1px solid #355b7e;background:linear-gradient(145deg,#172b40,#07101a);box-shadow:0 25px 50px #0009}
.screen{position:absolute;inset:10px;bottom:24px;border-radius:8px;background:linear-gradient(135deg,#041a34,#1688ff);display:grid;place-items:center;font-weight:950;font-size:15px;line-height:1.25;text-align:center;letter-spacing:.03em}
.monitor{width:62%;height:205px;right:5%;top:12%;border-radius:14px}.laptop{width:62%;height:115px;left:4%;bottom:25%;border-radius:12px;transform:skew(-5deg)}
.monitor .stand{position:absolute;left:50%;bottom:-22px;width:10px;height:22px;transform:translateX(-50%);background:linear-gradient(#2a4a6a,#17293c)}
.monitor .base{position:absolute;left:50%;bottom:-26px;width:70px;height:6px;border-radius:3px;transform:translateX(-50%);background:#213a54}
.laptop .keyboard{position:absolute;left:10%;right:10%;bottom:14px;height:34px;border-radius:4px;background:#0d1c2c;border:1px solid #2a4a6a}
.laptop .trackpad{position:absolute;left:38%;right:38%;bottom:20px;height:16px;border-radius:3px;background:#16283c}
.router{width:48%;height:78px;right:8%;bottom:12%;border-radius:15px}
.router:before{content:"";position:absolute;left:18px;right:18px;top:24px;height:3px;background:#21a0ff;box-shadow:0 0 16px #1688ff}
.antenna{position:absolute;top:-58px;width:3px;height:70px;background:#7692ab}.a1{left:20%}.a2{left:50%}.a3{right:20%}
.router .led{position:absolute;bottom:14px;width:6px;height:6px;border-radius:50%;background:#22c978;box-shadow:0 0 8px #22c978}
.router .l1{left:18px}.router .l2{left:32px}.router .l3{left:46px;background:#20a0ff;box-shadow:0 0 8px #20a0ff}

section{padding:78px 0}.eyebrow{color:#4db1ff;font-size:12px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.section-title{font-size:clamp(30px,4vw,45px);margin:7px 0 10px}.section-sub{color:var(--muted);margin:0 0 34px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.card{background:linear-gradient(145deg,var(--card),#08111b);border:1px solid var(--line);border-radius:var(--r);padding:24px;transition:.22s;box-shadow:0 18px 55px rgba(0,0,0,.18)}
.card:hover{transform:translateY(-4px);border-color:#2a6ca4}.icon{font-size:29px}.card h3{margin:10px 0 8px}.card p{color:var(--muted);margin:0}
.link{display:inline-flex;margin-top:16px;color:#55b5ff;font-weight:800;font-size:14px}
.feature{border-color:#1a66a3;background:radial-gradient(circle at 100% 0,rgba(0,126,255,.16),transparent 38%),var(--card)}

.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.price-card{background:linear-gradient(145deg,#0b1725,#08111a);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.price-card h3{margin-top:0;font-size:22px}.row{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.075)}
.row:last-child{border:0}.price{font-weight:950;white-space:nowrap}.muted{color:var(--muted)}
.note{font-size:13px;color:#8fa2b7;margin-top:15px}.tag{display:inline-flex;padding:5px 8px;border-radius:7px;background:#092b49;color:#5db8ff;font-size:11px;font-weight:900}
.big{font-size:34px;color:#31a2ff;font-weight:950}.sale{color:#50e79a;font-weight:900}
.promo{margin-top:18px;padding:15px;border-radius:14px;background:#0a1f31;border:1px solid #19496f}

.faq{display:grid;gap:10px;max-width:900px}.faq details{background:#0b1724;border:1px solid var(--line);border-radius:15px;padding:17px 19px}.faq summary{cursor:pointer;font-weight:850}.faq p{color:var(--muted);margin-bottom:0}
.cta{padding:65px 0}.cta-box{border:1px solid #1c66a5;border-radius:28px;padding:40px;
display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
background:radial-gradient(circle at 85% 20%,rgba(0,126,255,.24),transparent 35%),#091625}
.cta-box h2{font-size:36px;margin:0 0 7px}.cta-box p{margin:0;color:var(--muted)}
footer{border-top:1px solid rgba(255,255,255,.08);padding:30px 0;color:#8da0b5}
.footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;font-size:14px}
.bottom{display:none}

.breadcrumbs{color:#7d93aa;font-size:13px;margin-bottom:18px}
.breadcrumbs a{color:#7d93aa}.breadcrumbs a:hover{color:#fff}
/* Форма заявки */
.request-wrap{display:grid;grid-template-columns:1fr .75fr;gap:20px;align-items:stretch}
.request-card{background:linear-gradient(145deg,#0b1725,#07111b);border:1px solid #1b4164;border-radius:22px;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.request-card h3{font-size:25px;margin:0 0 7px}.request-card>p{color:var(--muted);margin:0 0 22px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}
.field label{font-size:13px;font-weight:800;color:#c9d6e4}
.field input,.field select,.field textarea{
  width:100%;border:1px solid #254762;background:#07111c;color:#fff;border-radius:12px;
  padding:13px 14px;outline:none;font:inherit;transition:.2s
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#1688ff;box-shadow:0 0 0 3px rgba(8,124,255,.12)}
.field textarea{min-height:105px;resize:vertical}
.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:17px}
.whatsapp{background:linear-gradient(135deg,#19c86a,#0b9f50);border-color:#29df7c;box-shadow:0 12px 35px rgba(20,200,105,.18)}
.privacy{font-size:11px;color:#74899d;margin-top:12px}
.request-info{background:radial-gradient(circle at 80% 15%,rgba(0,126,255,.2),transparent 35%),#0a1725;border:1px solid #173653;border-radius:22px;padding:28px}
.request-info h3{margin-top:0;font-size:24px}.request-info ul{padding:0;margin:22px 0;list-style:none}
.request-info li{display:flex;gap:12px;margin:15px 0;color:#c7d5e4}.request-info li b{color:#fff}
.wa-box{padding:17px;border-radius:15px;background:#09271b;border:1px solid #145d3b;color:#b8f3d1}
.wa-box strong{color:#45df8b}
.form-success{display:none;margin-top:15px;padding:13px 15px;border-radius:12px;background:#09271b;border:1px solid #176642;color:#a9f0c8}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-card{background:linear-gradient(145deg,var(--card),#08111b);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.contact-card h3{margin-top:0}
.map-box{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);min-height:320px}
.map-box iframe{width:100%;height:100%;min-height:320px;border:0;display:block}

@media(max-width:900px){nav.mainnav{display:none}.menu-btn{display:block;margin-left:auto}.hero-grid{grid-template-columns:1fr}.visual{min-height:390px}.cards{grid-template-columns:1fr 1fr}.contact-grid{grid-template-columns:1fr}}
@media(max-width:650px){
 .nav-phone{font-size:13px}.hero{padding-top:55px}.cards,.price-grid{grid-template-columns:1fr}
 section{padding:58px 0}.cta-box{flex-direction:column;align-items:flex-start}.cta-box h2{font-size:29px}
 .bottom{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:60;background:rgba(5,10,17,.95);backdrop-filter:blur(16px);
 padding:10px 12px;border-top:1px solid #183653;gap:9px}.bottom a{flex:1;text-align:center;padding:12px 7px;border-radius:11px;background:#0d2033;font-size:12px;font-weight:900}.bottom .call{background:#087cff}
 footer{padding-bottom:85px}
 .request-wrap{grid-template-columns:1fr}
}
@media(max-width:550px){.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}