:root{
  color-scheme:dark;
  --logo:url("/logo.jpg");
  --acc:255,43,61; --acc-hi:255,140,150; --acc-deep:150,8,22; --ex:#3a040a;
  --bg:#0a0405; --bg2:#12070a; --bg3:#070203; --stripe-k:#0b0506;
  --ink:#f4eef0; --ink-rgb:244,238,240; --dim:#b98d93; --faint:#6e4a50;
  --ok:#3fe08a;
  --display:"Sofia Sans Extra Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{
  margin:0;overflow-x:clip;color:var(--ink);
  font:400 14px/1.7 var(--mono);-webkit-font-smoothing:antialiased;
  background:
    radial-gradient(1200px 620px at 50% -8%,rgba(var(--acc),.16),transparent 62%),
    radial-gradient(900px 500px at 50% 112%,rgba(var(--acc),.08),transparent 60%),
    var(--bg);
}
::selection{background:rgb(var(--acc));color:var(--bg3)}
a{color:inherit}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.veil{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    repeating-linear-gradient(to bottom,rgba(0,0,0,.20) 0 1px,transparent 1px 3px),
    radial-gradient(ellipse at 50% 40%,transparent 50%,rgba(0,0,0,.6))}
.top,main,.foot{position:relative;z-index:1}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:max(16px,3vw)}
section[id]{scroll-margin-top:96px}

/* сигнальная лента */
.hazard{height:10px;
  background:linear-gradient(135deg,rgb(var(--acc)) 25%,var(--stripe-k) 25% 50%,rgb(var(--acc)) 50% 75%,var(--stripe-k) 75%) 0 0/22px 22px;
  box-shadow:0 0 18px rgba(var(--acc),.28);animation:crawl 1.8s linear infinite}
@keyframes crawl{to{background-position:22px 0}}

/* титровый шрифт: градиент, строчная фактура и объём */
.grad{
  background:
    repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 4px),
    linear-gradient(180deg,rgb(var(--acc-hi)) 0%,rgb(var(--acc)) 50%,rgb(var(--acc-deep)) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 var(--ex)) drop-shadow(0 1px 0 var(--ex)) drop-shadow(0 2px 0 #000) drop-shadow(0 0 18px rgba(var(--acc),.28));
}

/* кнопки-плашки */
.plate{position:relative;overflow:hidden;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:12px 20px;min-height:42px;border-radius:5px;border:1px solid #000;cursor:pointer;appearance:none;
  font:600 12px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--ink);text-decoration:none;
  background:linear-gradient(180deg,#34343a,#1b1b1f 55%,#121214);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -2px 0 rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.05),0 8px 18px rgba(0,0,0,.55);
  transition:transform .14s ease,box-shadow .2s ease,filter .2s}
.plate small{font-size:8px;letter-spacing:.3em;opacity:.78}
.plate:hover{transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -2px 0 rgba(0,0,0,.55),0 0 0 1px rgba(var(--acc),.55),0 10px 26px rgba(var(--acc),.18)}
.plate:active{transform:translateY(1px)}
.plate.hot{color:var(--bg3);border-color:rgba(0,0,0,.8);
  background:linear-gradient(180deg,rgb(var(--acc-hi)) 0%,rgb(var(--acc)) 52%,rgb(var(--acc-deep)) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 0 rgba(0,0,0,.35),0 0 0 1px rgba(var(--acc),.35),0 8px 22px rgba(var(--acc),.28)}
.plate.hot:hover{filter:brightness(1.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.35),0 0 0 1px rgba(var(--acc),.6),0 12px 34px rgba(var(--acc),.42)}
.plate.hot::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);animation:sheen 5s ease-in-out infinite}
@keyframes sheen{0%,72%{left:-60%}100%{left:130%}}
.plate.big{padding:16px 28px;font-size:13px}
:is(a,button,summary):focus-visible{outline:2px solid rgb(var(--acc-hi));outline-offset:3px}

/* шапка */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;
  background:rgba(0,0,0,.8);background:color-mix(in srgb,var(--bg3) 84%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.top-in{display:flex;align-items:center;gap:22px;min-height:66px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.mini{width:38px;height:38px;flex:none;border-radius:50%;background:var(--logo) center/cover;
  box-shadow:0 0 0 1px rgba(var(--acc),.6),0 0 16px rgba(var(--acc),.35)}
.wm{font:900 32px/1 var(--display);letter-spacing:.02em;text-transform:uppercase}
.nav{display:flex;gap:18px}
.nav a{position:relative;padding:8px 0;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-decoration:none;white-space:nowrap;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:rgb(var(--acc));transition:right .25s}
.nav a:hover{color:var(--ink)}
.nav a:hover::after{right:0}
.top-cta{display:flex;gap:10px}
.top-cta .plate{padding:9px 16px;min-height:40px}

/* нижняя панель на телефоне */
.tabbar{display:none}

/* первый экран */
.hero{padding-block:clamp(40px,7vw,84px) 34px;text-align:center}
.hero-mark{display:flex;align-items:center;justify-content:center;gap:clamp(14px,3vw,36px)}
.ring{position:relative;flex:none;width:clamp(96px,13vw,150px);aspect-ratio:1;border-radius:50%}
.ring::before{content:"";position:absolute;inset:-7px;border-radius:50%;
  background:conic-gradient(from 0deg,rgba(var(--acc),0) 0 52%,rgb(var(--acc)) 82%,rgba(var(--acc),0) 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  animation:spin 5s linear infinite}
.ring .logo{position:absolute;inset:0;border-radius:50%;background:var(--logo) center/cover;
  box-shadow:0 0 0 2px #000,0 0 44px rgba(var(--acc),.42);animation:breathe 4s ease-in-out infinite}
@keyframes spin{to{transform:rotate(1turn)}}
@keyframes breathe{50%{box-shadow:0 0 0 2px #000,0 0 70px rgba(var(--acc),.62)}}
.title{position:relative;margin:0;font:900 clamp(64px,15vw,172px)/.8 var(--display);letter-spacing:.005em;text-transform:uppercase}
.title .t{display:block;animation:power 1.1s ease-out both}
@keyframes power{0%{opacity:.18}8%{opacity:1}12%{opacity:.35}20%{opacity:1}27%{opacity:.6}33%,100%{opacity:1}}
.title::before,.title::after{content:attr(data-text);content:attr(data-text) / "";position:absolute;inset:0;pointer-events:none;opacity:0;-webkit-text-fill-color:currentColor}
.title::before{color:rgb(var(--acc-hi));animation:gl1 7s steps(1) infinite}
.title::after{color:rgba(var(--ink-rgb),.9);animation:gl2 7s steps(1) infinite}
@keyframes gl1{0%,90%,100%{opacity:0;transform:none;clip-path:none}91%{opacity:.9;transform:translateX(-5px);clip-path:inset(10% 0 66% 0)}93%{opacity:.9;transform:translateX(6px);clip-path:inset(56% 0 22% 0)}95%{opacity:0}}
@keyframes gl2{0%,91%,100%{opacity:0;transform:none;clip-path:none}92%{opacity:.7;transform:translateX(4px);clip-path:inset(38% 0 44% 0)}94%{opacity:.7;transform:translateX(-3px);clip-path:inset(76% 0 6% 0)}96%{opacity:0}}
.kicker{margin:22px 0 0;font:500 clamp(12.5px,1.8vw,18px)/1.45 var(--mono);letter-spacing:.22em;text-transform:uppercase;text-wrap:balance}
.kicker b{color:rgb(var(--acc));font-weight:700;text-shadow:0 0 14px rgba(var(--acc),.45)}
.intro{max-width:790px;margin:16px auto 0;color:var(--dim);font-size:14.5px;line-height:1.78;text-wrap:pretty}
.intro b{color:var(--ink);font-weight:600}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px}
.flash{max-width:790px;margin:22px auto 0;padding:12px 16px;border-radius:6px;text-align:left;font-size:13.5px;
  border:1px solid rgba(var(--acc),.55);background:rgba(var(--acc),.09)}
.flash::before{content:"▪";margin-right:10px;color:rgb(var(--acc))}
.flash.ok{border-color:rgba(63,224,138,.55);background:rgba(63,224,138,.08)}
.flash.ok::before{color:var(--ok)}

.stats{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;max-width:1010px;margin:38px auto 0;
  background:rgba(var(--acc),.2);border:1px solid rgba(var(--acc),.22)}
.stat{padding:17px 10px 15px;background:var(--bg);background:color-mix(in srgb,var(--bg) 90%,transparent)}
.stat b{display:block;font:700 17px/1.1 var(--mono);letter-spacing:.05em;color:rgb(var(--acc));text-shadow:0 0 14px rgba(var(--acc),.45);font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:8px;font:600 9.5px/1.35 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.stats::before,.stats::after{content:"";position:absolute;top:50%;width:9px;height:9px;margin-top:-5px;background:rgb(var(--acc));transform:rotate(45deg);
  box-shadow:0 0 12px rgba(var(--acc),.9);animation:blink 2.4s ease-in-out infinite}
.stats::before{left:-6px}
.stats::after{right:-6px;animation-delay:1.2s}
@keyframes blink{50%{opacity:.35}}

/* секции */
.sec{padding-block:clamp(54px,8vw,96px)}
.sec-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:18px 56px;align-items:end;margin-bottom:30px}
.eyebrow{font:600 11.5px/1 var(--mono);letter-spacing:.26em;text-transform:uppercase;color:rgb(var(--acc))}
.h2{margin:12px 0 0;font:900 clamp(46px,7vw,86px)/.86 var(--display);text-transform:uppercase;text-wrap:balance}
.sec-lead{margin:0;max-width:52ch;color:var(--dim);text-wrap:pretty}
.sec-lead b{color:var(--ink);font-weight:600}
.sec-lead a{color:rgb(var(--acc-hi))}

/* карточки с живыми экранами */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{position:relative;display:flex;flex-direction:column;gap:14px;padding:12px 14px 22px;border-radius:9px;
  border:1px solid rgba(var(--acc),.16);
  background:radial-gradient(380px 240px at var(--mx,50%) var(--my,-60%),rgba(var(--acc),.12),transparent 62%),
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 30%),var(--bg2);
  box-shadow:0 24px 48px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .25s,transform .25s}
.card::before{content:"";position:absolute;left:12px;right:12px;top:-1px;height:2px;
  background:linear-gradient(90deg,transparent,rgb(var(--acc)) 18% 82%,transparent);box-shadow:0 0 14px rgba(var(--acc),.6)}
.card:hover{border-color:rgba(var(--acc),.42);transform:translateY(-2px)}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font:600 10px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.card-top em{font-style:normal;color:rgb(var(--acc))}
.screen{position:relative;height:136px;overflow:hidden;border-radius:7px;background:var(--bg3);border:1px solid rgba(var(--acc),.14);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 12px 30px rgba(0,0,0,.7)}
.screen::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.26) 0 1px,transparent 1px 3px),radial-gradient(ellipse at 50% 0%,rgba(var(--acc),.08),transparent 70%)}
.screen canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.card h3{margin:6px 0 0;font:900 clamp(36px,3.7vw,46px)/.88 var(--display);text-transform:uppercase}
.card p{margin:0;color:var(--dim);font-size:13px;line-height:1.72}
.card p b{color:var(--ink);font-weight:600}

/* балансировщик */
.bal{position:absolute;inset:10px 12px 12px;z-index:1;display:grid;align-content:space-between;font:500 10.5px/1 var(--mono)}
.bal-head{display:flex;justify-content:space-between;font-size:8.5px;letter-spacing:.2em;color:rgba(var(--acc),.75)}
.bal-row{display:grid;grid-template-columns:10px 96px minmax(0,1fr) 46px;align-items:center;gap:8px;color:rgba(var(--ink-rgb),.5);transition:color .3s}
.bal-row .mk{color:rgb(var(--acc));opacity:0;transition:opacity .3s;font-size:9px}
.bal-bar{position:relative;height:4px;overflow:hidden;border-radius:1px;background:rgba(var(--acc),.12)}
.bal-bar b{position:absolute;inset:0 auto 0 0;width:50%;background:rgba(var(--acc),.4);transition:width .8s cubic-bezier(.2,.8,.2,1),background .3s}
.bal-ms{text-align:right;font-variant-numeric:tabular-nums}
.bal-row.win{color:var(--ink)}
.bal-row.win .mk{opacity:1}
.bal-row.win .bal-bar b{background:rgb(var(--acc));box-shadow:0 0 8px rgba(var(--acc),.8)}

/* бегущая строка */
.ticker{position:relative;z-index:1;overflow:hidden;white-space:nowrap;background:var(--bg3);border-block:1px solid rgba(var(--acc),.3)}
.ticker-track{display:inline-flex;padding-block:13px;animation:tick 46s linear infinite;
  font:600 11.5px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:rgba(var(--ink-rgb),.78)}
.ticker-track span{display:inline-flex;align-items:center;gap:10px;padding-right:56px}
.ticker-track b{color:rgb(var(--acc));font-weight:600}
.dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(63,224,138,.6);animation:ping 2s ease-out infinite}
.dot.down{background:rgb(var(--acc));animation:none}
.dot.off{background:var(--faint);animation:none}
@keyframes ping{70%{box-shadow:0 0 0 7px rgba(63,224,138,0)}100%{box-shadow:0 0 0 0 rgba(63,224,138,0)}}
@keyframes tick{to{transform:translateX(-50%)}}

/* входы */
.io-name{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.io-name h3{margin:0}
.proto{font:600 10px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:rgb(var(--acc));text-align:right}
.wave{position:relative;height:58px;border-block:1px dashed rgba(var(--acc),.2)}
.wave canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.best{margin-top:auto;padding-top:12px;border-top:1px solid rgba(var(--acc),.12);font:600 10px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.best b{color:var(--ink);font-weight:600}

/* тарифы */
.plans{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:18px}
.plan{position:relative;display:flex;flex-direction:column;gap:12px;padding:20px 20px 22px;border-radius:9px;border:1px solid rgba(var(--acc),.16);
  background:radial-gradient(380px 260px at var(--mx,50%) var(--my,-60%),rgba(var(--acc),.12),transparent 62%),var(--bg2);
  box-shadow:0 24px 48px rgba(0,0,0,.45);transition:transform .25s,border-color .25s}
.plan:hover{transform:translateY(-3px);border-color:rgba(var(--acc),.45)}
.plan.pop{border-color:rgba(var(--acc),.6);box-shadow:0 0 0 1px rgba(var(--acc),.25),0 24px 64px rgba(var(--acc),.14)}
.plan-h{display:flex;justify-content:space-between;align-items:center;min-height:24px}
.plan-code{font:600 11px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.tape{display:inline-block;padding:3px;border-radius:2px;
  background:linear-gradient(135deg,rgb(var(--acc)) 25%,var(--stripe-k) 25% 50%,rgb(var(--acc)) 50% 75%,var(--stripe-k) 75%) 0 0/12px 12px}
.tape b{display:block;padding:5px 8px;background:#000;color:rgb(var(--acc));font:700 9.5px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase}
.tag{font:700 9.5px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:rgb(var(--acc));border:1px solid rgba(var(--acc),.45);padding:6px 8px;border-radius:2px}
.plan-name{font:800 28px/1 var(--display);letter-spacing:.03em;text-transform:uppercase}
.plan-price{display:flex;align-items:flex-start;gap:6px}
.plan-price b{font:900 94px/.8 var(--display)}
.plan-price span{margin-top:6px;font:800 28px/1 var(--display);color:rgb(var(--acc))}
.plan-sub{min-height:1.7em;color:var(--dim);font-size:12.5px}
.plan-sub b{color:var(--ink);font-weight:600}
.plan form{margin:auto 0 0}
.plan form .plate{width:100%}
.fine{display:flex;flex-wrap:wrap;gap:8px 28px;margin:24px 0 0;padding:0;list-style:none;color:var(--dim);font-size:12.5px}
.fine li::before{content:"▪";margin-right:9px;color:rgb(var(--acc))}

/* шаги и приложения */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.step{padding:18px 18px 22px;border-radius:9px;border:1px solid rgba(var(--acc),.16);
  background:radial-gradient(360px 220px at var(--mx,50%) var(--my,-60%),rgba(var(--acc),.1),transparent 62%),var(--bg2)}
.step-h{display:flex;align-items:center;gap:14px}
.step-n{font:900 62px/.8 var(--display);color:transparent;-webkit-text-stroke:1.2px rgb(var(--acc))}
.trace{position:relative;flex:1;height:2px;background:repeating-linear-gradient(90deg,rgba(var(--acc),.75) 0 6px,transparent 6px 12px) 0 0/12px 2px;animation:run .7s linear infinite}
.trace::after{content:"";position:absolute;right:-3px;top:-3px;width:8px;height:8px;background:rgb(var(--acc));transform:rotate(45deg);box-shadow:0 0 10px rgba(var(--acc),.8)}
@keyframes run{to{background-position:12px 0}}
.step h3{margin:18px 0 8px;font:800 30px/1 var(--display);text-transform:uppercase}
.step p{margin:0;color:var(--dim);font-size:13px}
.step p b{color:var(--ink);font-weight:600}

.apps{margin-top:18px;padding:16px;border-radius:9px;border:1px solid rgba(var(--acc),.16);background:var(--bg2)}
.apps-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.apps-title{font:600 11px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.tabs{display:flex;flex-wrap:wrap;gap:8px}
.tab{appearance:none;cursor:pointer;padding:10px 12px;border-radius:4px;border:1px solid rgba(var(--acc),.22);background:transparent;
  font:600 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:color .2s,background .2s,border-color .2s}
.tab:hover{color:var(--ink);border-color:rgba(var(--acc),.5)}
.tab[aria-selected="true"]{color:var(--bg3);background:rgb(var(--acc));border-color:rgb(var(--acc))}
.app-list{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:10px;margin-top:14px}
.app{display:flex;flex-direction:column;gap:11px;padding:13px 14px;border-radius:6px;border:1px solid rgba(var(--acc),.12);background:rgba(0,0,0,.32);animation:pop .35s ease-out both}
.app.rec{border-color:rgba(var(--acc),.55);box-shadow:inset 0 0 24px rgba(var(--acc),.07)}
@keyframes pop{from{transform:translateY(4px)}}
.app-name{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:700 15px/1 var(--mono)}
.app-name em{font:600 9px/1 var(--mono);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:rgb(var(--acc))}
.app-io{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.app-io i{padding:6px 2px;border-radius:3px;text-align:center;font:600 9px/1 var(--mono);font-style:normal;letter-spacing:.06em;text-transform:uppercase;
  background:rgba(var(--acc),.17);color:var(--ink)}
.app-io i.off{background:transparent;color:var(--faint);text-decoration:line-through;outline:1px dashed rgba(var(--ink-rgb),.16);outline-offset:-1px}
.ru-no,.ru-yes{align-self:flex-start;padding:3px 7px;border-radius:2px;font:600 9px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.ru-no{color:#ffb038;border:1px solid rgba(255,176,56,.4)}
.ru-yes{color:var(--ok);border:1px solid rgba(63,224,138,.4)}
.app-links{display:flex;flex-wrap:wrap;gap:6px 12px}
.app-links a{font:600 10px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--acc));text-decoration:none;border-bottom:1px dashed rgba(var(--acc),.5)}
.app-links a:hover{color:rgb(var(--acc-hi))}
.apps-warn{margin:14px 0 0;padding:12px 14px;border-radius:6px;font-size:12.5px;color:var(--dim);
  border:1px solid rgba(255,176,56,.45);background:rgba(255,176,56,.06)}
.apps-warn b{color:var(--ink);font-weight:600}
.more{display:inline-block;margin-top:14px;font:600 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:rgb(var(--acc));text-decoration:none}
.more:hover{color:rgb(var(--acc-hi))}
.apps-note{margin:14px 0 0;color:var(--dim);font-size:12.5px;max-width:78ch}

/* вопросы */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px 60px;align-items:start}
.faq-grid .sec-head{display:block;margin:0}
.faq-grid .sec-lead{margin-top:18px}
.faq details{border-top:1px solid rgba(var(--acc),.16)}
.faq details:last-child{border-bottom:1px solid rgba(var(--acc),.16)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;cursor:pointer;list-style:none;
  font:600 14.5px/1.45 var(--mono);color:var(--ink);transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:400 22px/1 var(--mono);color:rgb(var(--acc));transition:transform .25s}
.faq summary:hover{color:rgb(var(--acc-hi))}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 20px;max-width:62ch;color:var(--dim);font-size:13.5px}

/* финал */
.final{position:relative;overflow:hidden;margin-block:10px 70px;padding:52px 20px 44px;border-radius:10px;text-align:center;
  border:1px solid rgba(var(--acc),.32);background:radial-gradient(700px 300px at 50% 0%,rgba(var(--acc),.2),transparent 70%),var(--bg2)}
.final .hazard{position:absolute;inset:0 0 auto}
.final .h2{margin:0}
.final p{margin:16px auto 0;max-width:56ch;color:var(--dim)}
.final p a{color:var(--ink)}

/* подвал */
.foot{background:var(--bg3)}
.foot-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding-block:24px}
.foot .wm{font-size:28px}
.foot-mid{color:var(--dim);font-size:12px;line-height:1.8;text-align:center}
.foot-mid a{color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(var(--acc),.4)}
.foot-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:18px}
.foot-links a{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);text-decoration:none}
.foot-links a:hover{color:var(--ink)}

/* узкие экраны */
@media (max-width:1199px){
  .nav a:nth-child(n+5){display:none}
}
@media (max-width:999px){
  .nav,.top-cta .plate:not(.hot){display:none}
  .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;justify-content:space-around;
    padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(var(--acc),.3);
    background:rgba(0,0,0,.9);background:color-mix(in srgb,var(--bg3) 92%,transparent);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:56px;padding:6px 4px;
    font:600 9px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);text-decoration:none}
  .tabbar svg{width:22px;height:22px}
  .tabbar a.on{color:rgb(var(--acc))}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .app-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:940px){
  .grid3,.steps{grid-template-columns:1fr}
  .faq-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .sec-head{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat:last-child{grid-column:1/-1}
  .foot-in{grid-template-columns:1fr;text-align:center}
  .foot .brand{justify-content:center;margin:0}
  .foot-links{justify-content:center}
}
@media (max-width:700px){
  .plans{grid-template-columns:1fr}
}
@media (max-width:620px){
  .hero-mark{flex-direction:column}
  .top-in{min-height:58px}
  .wm{font-size:28px}
  .mini{width:32px;height:32px}
  .app-list{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}