:root{
  --bg:#030913; --panel:#071525; --line:rgba(183,211,255,.16);
  --text:#f5f8ff; --muted:#a8b5c6; --muted2:#7d8ea3;
  --blue:#0b86ff; --blue2:#31c8ff; --purple:#915dff; --green:#28d59e; --warning:#f3b64a;
  --radius:18px; --max:1440px; --shadow:0 30px 90px rgba(0,0,0,.36);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:Inter,Segoe UI,Roboto,Arial,sans-serif; color:var(--text);
  background:radial-gradient(circle at 75% 10%,rgba(33,135,255,.16),transparent 34rem),
             radial-gradient(circle at 12% 3%,rgba(147,82,255,.10),transparent 32rem),
             linear-gradient(180deg,#030913 0%,#061221 55%,#030913 100%);
  line-height:1.5;
}
img{max-width:100%;display:block} a{color:inherit;text-decoration:none} button,input,textarea,select{font:inherit}
.wrap{width:min(var(--max),calc(100% - 44px));margin-inline:auto}
.skip-link{position:absolute;left:-999px;top:10px;background:white;color:#020713;padding:10px;border-radius:8px;z-index:999}.skip-link:focus{left:10px}
.site-header{position:sticky;top:0;z-index:70;background:rgba(3,9,19,.78);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.logo{display:flex;align-items:center;gap:10px;flex:none}.logo img{width:132px;height:auto}
.nav-links{display:flex;align-items:center;gap:28px;font-size:14px;color:#d7e2f0}
.nav-links a{position:relative;opacity:.92}.nav-links a:hover{color:#fff}.nav-links a.active{color:var(--blue2)}
.nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-25px;height:2px;background:var(--blue)}
.header-actions{display:flex;align-items:center;gap:12px}
.lang-switch{display:flex;align-items:center;border:1px solid rgba(210,225,255,.18);border-radius:999px;padding:3px;background:rgba(255,255,255,.035)}
.lang-switch button{
  min-width:42px;border:0;background:transparent;color:#a8b5c6;border-radius:999px;padding:7px 10px;
  font-size:12px;font-weight:850;letter-spacing:.06em;cursor:pointer
}
.lang-switch button.active{background:linear-gradient(135deg,var(--blue),#126bff);color:white;box-shadow:0 8px 22px rgba(11,134,255,.25)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:11px 18px;border-radius:10px;border:1px solid rgba(30,145,255,.75);background:rgba(6,20,38,.50);color:white;font-size:14px;font-weight:750;cursor:pointer;transition:.18s ease}
.btn:hover{transform:translateY(-1px);border-color:rgba(88,190,255,.95)}
.btn.primary{background:linear-gradient(135deg,var(--blue),#126bff);border-color:transparent;box-shadow:0 12px 34px rgba(11,134,255,.25)}
.btn.ghost{background:transparent;border-color:rgba(210,225,255,.22)}
.menu-btn{display:none}
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero .wrap{min-height:430px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;padding:70px 0 64px}
.eyebrow{color:var(--blue2);text-transform:uppercase;font-weight:850;letter-spacing:.28em;font-size:12px;margin-bottom:16px}
h1,h2,h3,p{margin-top:0} h1{font-size:clamp(42px,6vw,70px);line-height:1.02;margin-bottom:22px;letter-spacing:-.045em}
h2{font-size:clamp(30px,4vw,44px);line-height:1.1;letter-spacing:-.035em;margin-bottom:14px}
h3{font-size:18px;margin-bottom:8px}.accent{color:var(--blue)}
.lead{font-size:18px;color:#c2cad8;max-width:620px;margin-bottom:28px}.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-art{height:330px;position:relative}.stars{position:absolute;inset:0;background-image:radial-gradient(rgba(76,170,255,.65) 1px,transparent 1px);background-size:42px 42px;opacity:.17}
.orb{position:absolute;inset:18px 0 0 auto;width:420px;height:280px;border-radius:50%;border:2px solid rgba(75,168,255,.42);border-left-color:transparent;border-bottom-color:transparent;filter:drop-shadow(0 0 28px rgba(0,132,255,.45));transform:rotate(-22deg)}
.orb:after{content:"";position:absolute;left:42%;top:72%;width:130px;height:6px;border-radius:999px;background:var(--blue2);box-shadow:0 0 45px 20px rgba(0,132,255,.42)}
.section{padding:56px 0}.section.compact{padding:38px 0}.section-head{text-align:center;margin-bottom:26px}.section-head p{max-width:740px;margin-inline:auto;color:var(--muted)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{border:1px solid var(--line);background:linear-gradient(180deg,rgba(11,25,43,.84),rgba(7,16,29,.72));border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.icon{width:36px;height:36px;border:1px solid rgba(56,163,255,.65);border-radius:10px;display:grid;place-items:center;color:var(--blue2);margin-bottom:18px;font-size:18px}
.icon.purple{border-color:rgba(158,105,255,.70);color:#ad7cff}.icon.green{border-color:rgba(37,214,155,.70);color:var(--green)}.icon.warn{border-color:rgba(243,182,74,.70);color:var(--warning)}
p,.muted{color:var(--muted)}.small{font-size:13px;color:var(--muted)}
.product-row{border:1px solid var(--line);background:linear-gradient(180deg,rgba(8,18,32,.88),rgba(5,13,25,.90));border-radius:var(--radius);padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.product{display:flex;align-items:center;gap:18px;border:1px solid var(--line);border-radius:14px;padding:18px;background:rgba(255,255,255,.025)}
.product-badge{width:54px;height:54px;border-radius:16px;background:radial-gradient(circle at 30% 30%,#43d4ff,#125fff 60%,#10162a);display:grid;place-items:center;font-size:24px;flex:none}
.status{display:inline-block;margin-top:8px;color:var(--blue2);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:22px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:rgba(8,19,33,.74)}
.trust div{padding:20px 22px;border-right:1px solid var(--line);display:flex;gap:12px;align-items:flex-start}.trust div:last-child{border-right:0}
.trust strong{display:block}.trust small{display:block;color:var(--muted);margin-top:3px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.list{display:grid;gap:12px}.list-item{display:flex;justify-content:space-between;gap:18px;padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}
.visual{min-height:280px;border-radius:var(--radius);border:1px solid var(--line);background:radial-gradient(circle at 65% 32%,rgba(53,165,255,.18),transparent 14rem),linear-gradient(135deg,rgba(13,31,55,.92),rgba(4,12,24,.88));position:relative;overflow:hidden}
.visual:before{content:"";position:absolute;inset:20px;border-radius:50%;border:1px solid rgba(70,160,255,.22);border-left-color:transparent;transform:rotate(-28deg)}
.visual:after{content:"";position:absolute;left:40%;right:16%;bottom:30%;height:3px;border-radius:99px;background:var(--blue2);box-shadow:0 0 35px 15px rgba(0,132,255,.35)}
.contact-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form-grid .full{grid-column:1/-1}
.form label{display:block;color:#dfe8f5;font-size:14px;font-weight:650}
.form input,.form select,.form textarea{width:100%;margin-top:7px;padding:13px 14px;border-radius:10px;border:1px solid var(--line);background:#05101e;color:white;outline:none}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,134,255,.12)}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--muted);line-height:1.35}.form .check input{width:auto;margin-top:3px}
.form-note{font-size:13px;color:var(--muted);margin-top:12px}.hp-field{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.legal-page .card p,.legal-page .card li{color:#c2cedd}.legal-page ul{padding-left:22px}
.site-footer{border-top:1px solid var(--line);padding:36px 0 22px;background:rgba(3,9,19,.72)}
.footer-grid{display:grid;grid-template-columns:1.35fr repeat(5,1fr);gap:30px}.site-footer h4{margin:0 0 12px;color:white;font-size:14px}.site-footer a,.site-footer p{display:block;color:var(--muted);font-size:14px;margin:7px 0}
.bottom{margin-top:28px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted2);font-size:13px;gap:18px}
.cookie{position:fixed;left:20px;right:20px;bottom:20px;z-index:100;display:none}.cookie.show{display:block}
.cookie-box{max-width:1000px;margin:0 auto;background:rgba(7,20,35,.98);border:1px solid rgba(69,155,255,.38);box-shadow:var(--shadow);border-radius:20px;padding:22px;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:980px){
  .nav-links{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:flex-start;background:#030913;padding:20px 24px;border-bottom:1px solid var(--line)}
  .nav-links.open{display:flex}.nav-links a.active:after{display:none}.menu-btn{display:inline-flex}
  .hero .wrap,.split{grid-template-columns:1fr}.hero-art{height:240px}
  .grid4,.trust,.footer-grid,.grid3{grid-template-columns:1fr 1fr}.product-row,.grid2{grid-template-columns:1fr}.cookie-box{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wrap{width:min(100% - 28px,var(--max))}.grid4,.grid3,.trust,.footer-grid{grid-template-columns:1fr}
  .trust div{border-right:0;border-bottom:1px solid var(--line)}.trust div:last-child{border-bottom:0}
  h1{font-size:40px}.hero .wrap{padding-top:48px}.header-actions .btn.ghost{display:none}
}

/* V4 mobile polish */
@media(max-width:760px){
  .nav{
    height:64px;
    gap:8px;
  }

  .logo img{
    width:122px;
  }

  .header-actions{
    gap:8px;
  }

  .lang-switch button{
    min-width:36px;
    padding:6px 8px;
    font-size:11px;
  }

  .btn{
    min-height:40px;
    padding:9px 14px;
    font-size:13px;
  }

  .menu-btn{
    min-width:74px;
  }

  .hero .wrap{
    min-height:auto;
    padding:42px 0 34px;
    gap:20px;
  }

  .hero h1{
    font-size:clamp(38px, 11vw, 52px);
    margin-bottom:18px;
  }

  .lead{
    font-size:17px;
    margin-bottom:22px;
  }

  .hero-art{
    height:170px;
    margin-top:8px;
    opacity:.78;
  }

  .visual{
    min-height:150px;
    margin-top:6px;
    opacity:.72;
  }

  .visual:before{
    inset:26px;
  }

  .visual:after{
    left:38%;
    right:16%;
    bottom:33%;
    height:3px;
  }

  .section{
    padding:38px 0;
  }

  .section.compact{
    padding:28px 0;
  }

  .grid4,
  .grid3,
  .grid2{
    gap:14px;
  }

  .card{
    padding:20px;
    border-radius:16px;
  }

  .services .card,
  .grid4 .card,
  .grid3 .card,
  .grid2 .card{
    min-height:auto;
  }

  .icon{
    width:32px;
    height:32px;
    margin-bottom:14px;
  }

  .product-row{
    padding:14px;
    gap:14px;
  }

  .product{
    padding:16px;
    gap:14px;
    align-items:flex-start;
  }

  .product-badge{
    width:48px;
    height:48px;
    border-radius:14px;
    font-size:21px;
  }

  .trust div{
    padding:17px 18px;
  }

  .contact-form-grid{
    grid-template-columns:1fr;
    gap:15px;
  }

  .contact-form-grid .full{
    grid-column:auto;
  }

  .form input,
  .form select,
  .form textarea{
    min-height:50px;
    font-size:16px;
  }

  .site-footer{
    padding:28px 0 18px;
  }

  .footer-grid{
    gap:22px;
  }

  .site-footer .logo img{
    width:118px;
  }
}

@media(max-width:420px){
  .wrap{
    width:min(100% - 28px,var(--max));
  }

  .logo img{
    width:112px;
  }

  .lang-switch button{
    min-width:34px;
    padding:6px 7px;
  }

  .menu-btn{
    min-width:68px;
  }

  .hero .wrap{
    padding:36px 0 30px;
  }

  .hero-art,
  .visual{
    height:135px;
    min-height:135px;
  }
}

/* V5 desktop + mobile polish */
@keyframes arcPulse{
  0%,100%{opacity:.58; transform:scale(1) rotate(-18deg)}
  50%{opacity:.95; transform:scale(1.025) rotate(-14deg)}
}
@keyframes arcBeam{
  0%{transform:translateX(-18%) rotate(-20deg); opacity:.35}
  50%{transform:translateX(10%) rotate(-20deg); opacity:1}
  100%{transform:translateX(34%) rotate(-20deg); opacity:.35}
}
@keyframes arcFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
.interactive-visual{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.interactive-visual .signal-stars{
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(76,170,255,.60) 1px, transparent 1px);
  background-size:44px 44px;
  opacity:.18;
}
.interactive-visual .signal-orbit{
  position:absolute;
  inset:12% 6%;
  border-radius:50%;
  border:2px solid rgba(74,165,255,.34);
  border-left-color:transparent;
  border-bottom-color:rgba(74,165,255,.08);
  filter:drop-shadow(0 0 22px rgba(0,132,255,.34));
  transform:rotate(-18deg);
  animation:arcPulse 6.5s ease-in-out infinite;
}
.interactive-visual .signal-orbit.two{
  inset:24% 14%;
  opacity:.42;
  animation-duration:8s;
  animation-direction:reverse;
}
.interactive-visual .signal-beam{
  position:absolute;
  left:42%;
  right:12%;
  bottom:36%;
  height:7px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, #31c8ff 22%, #0b86ff 78%, transparent);
  box-shadow:0 0 34px 13px rgba(0,132,255,.32);
  transform:rotate(-20deg);
  animation:arcBeam 5.4s ease-in-out infinite;
}
.interactive-visual .signal-core{
  position:absolute;
  width:120px;
  height:120px;
  right:18%;
  bottom:22%;
  border-radius:50%;
  background:radial-gradient(circle, rgba(49,200,255,.24), transparent 70%);
  filter:blur(2px);
  animation:arcFloat 5s ease-in-out infinite;
}
.visual.interactive-visual:before,
.visual.interactive-visual:after{
  content:none;
}
.hero-art.interactive-visual .orb,
.hero-art.interactive-visual .stars{
  display:none;
}
.product.product-logo-card{
  align-items:center;
}
.product-brand{
  width:210px;
  max-width:42%;
  flex:none;
}
.product-brand img{
  width:100%;
  height:auto;
  border-radius:12px;
}
.product-brand.statto-mark{
  width:78px;
  height:78px;
  border-radius:22px;
  display:grid;
  place-items:center;
  font-size:30px;
  color:white;
  background:
    radial-gradient(circle at 38% 35%, rgba(255,255,255,.82), rgba(72,185,255,.88) 16%, rgba(20,96,255,.95) 58%, rgba(11,18,42,1));
  box-shadow:0 12px 30px rgba(11,134,255,.20);
}
.services-grid{
  align-items:stretch;
}
@media(min-width:981px){
  .wrap{
    width:min(var(--max), calc(100% - 110px));
  }
  .site-header .wrap{
    width:min(1440px, calc(100% - 96px));
  }
  .hero .wrap{
    min-height:590px;
    grid-template-columns:minmax(460px,610px) minmax(560px,1fr);
    gap:90px;
    padding:92px 0 82px;
  }
  .hero h1{
    max-width:650px;
  }
  .lead{
    max-width:680px;
  }
  .hero-art{
    height:420px;
  }
  .visual{
    min-height:340px;
  }
  .section > .wrap{
    width:min(1320px, calc(100% - 110px));
  }
  .grid4{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .grid2.services-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .product-row{
    max-width:1320px;
    margin-inline:auto;
  }
  .footer-grid{
    max-width:1320px;
    margin-inline:auto;
  }
}
@media(max-width:980px){
  .hero-art,
  .visual{
    display:none !important;
  }
  .hero .wrap{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .product-brand{
    width:165px;
    max-width:100%;
  }
}
@media(max-width:760px){
  .site-header{
    background:rgba(3,9,19,.92);
  }
  .hero .wrap{
    padding:34px 0 30px;
  }
  .section{
    padding:34px 0;
  }
  .section-head{
    margin-bottom:20px;
  }
  .card{
    padding:18px;
  }
  .product{
    flex-direction:column;
  }
  .product-brand.statto-mark{
    width:56px;
    height:56px;
    border-radius:16px;
    font-size:22px;
  }
  .contact-form-grid{
    grid-template-columns:1fr !important;
  }
  .form input,
  .form select,
  .form textarea{
    width:100%;
  }
}
@media(prefers-reduced-motion:reduce){
  .interactive-visual .signal-orbit,
  .interactive-visual .signal-beam,
  .interactive-visual .signal-core{
    animation:none;
  }
}