/* /software — хаб и страницы программ (Privacy, Duress, Automatic для Windows). Собирает build_software_2.py.
   Шапка и подвал — общие с турами (site-header.css, site-footer.css); здесь только тело страниц. */
@font-face{font-family:'Neue Machina';src:url('/assets/fonts/NeueMachina-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Neue Machina';src:url('/assets/fonts/NeueMachina-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
:root{--bg:#24272A;--bg2:#2a2e31;--ink:#F2F3F1;--muted:#B1B3B2;--dim:#76787C;--line:rgba(255,255,255,.12);--acc:#FF7878;--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg)}
body.sw{background:var(--bg);color:var(--ink);font-family:'Neue Machina',Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.sw a{color:inherit;text-decoration:none}
.sw main{padding-top:84px}
.sw em{font-style:normal;color:var(--acc)}
.wrap{width:min(1360px,100%);margin:0 auto;padding:0 clamp(16px,4vw,80px)}
.kicker{display:flex;align-items:center;gap:14px;font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.kicker:before{content:"";width:34px;height:1px;background:var(--acc)}
.h1{font-weight:500;font-size:clamp(40px,6vw,92px);line-height:.98;letter-spacing:-.02em;margin-top:22px}
.h2{font-weight:500;font-size:clamp(30px,3.6vw,54px);line-height:1.02;letter-spacing:-.015em}
.lead{font-size:clamp(16px,1.35vw,20px);line-height:1.5;color:#dfe1df;max-width:560px;margin-top:22px}
.p{font-size:16px;line-height:1.6;color:#cfd1cf;max-width:520px;margin-top:16px}
.note{font-size:12px;line-height:1.5;color:var(--dim);margin-top:18px;max-width:520px}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:12px;padding:15px 20px;border:1px solid var(--acc);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;transition:background .2s,color .2s}
.btn.solid{background:var(--acc);color:#24272A}.btn:hover{background:var(--acc);color:#24272A}
.btn i{display:inline-block;width:9px;height:10px;background:currentColor;clip-path:polygon(11% 0,100% 60%,0 100%);transition:transform .2s}.btn:hover i{transform:translateX(3px)}
.status{display:inline-flex;align-items:center;gap:8px;margin-top:26px;padding:7px 11px;border:1px solid var(--line);font-weight:500;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.status b{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 var(--acc);animation:ping 2.4s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--acc) 60%,transparent)}70%,100%{box-shadow:0 0 0 9px transparent}}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,72px);align-items:center;min-height:calc(100svh - 84px);padding-top:48px;padding-bottom:56px}   /* 24.10: не обнулять боковые поля .wrap (на телефоне текст прилипал к краю) */
.hero .h1{font-size:clamp(38px,4.6vw,74px)}
.visual{position:relative;aspect-ratio:16/10;overflow:hidden;background:#1d2023;isolation:isolate}
.visual img,.visual canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.visual canvas.hud{z-index:2;pointer-events:none}
.visual.live>img{opacity:0;transition:opacity .6s}
.visual:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,transparent 60%,#24272A66)}
.fm{position:absolute;width:16px;height:16px;z-index:3;border:0 solid var(--acc)}
.fm.tl{left:-1px;top:-1px;border-width:1.5px 0 0 1.5px}.fm.tr{right:-1px;top:-1px;border-width:1.5px 1.5px 0 0}
.fm.bl{left:-1px;bottom:-1px;border-width:0 0 1.5px 1.5px}.fm.br{right:-1px;bottom:-1px;border-width:0 1.5px 1.5px 0}
.cap{position:absolute;left:14px;bottom:12px;z-index:3;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* цифры */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fact{padding:28px clamp(14px,2vw,28px);border-left:1px solid var(--line)}.fact:first-child{border-left:0}
.fact b{display:block;font-weight:500;font-size:clamp(26px,2.6vw,40px);color:var(--acc);letter-spacing:-.01em}
.fact span{display:block;margin-top:8px;font-size:13px;line-height:1.45;color:var(--muted)}

/* разделы */
.sec{padding:clamp(72px,10vw,140px) 0}
.num{font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin-bottom:18px}
.split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,88px);align-items:center}
.split.rev{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.split.rev>.txt{order:2}
.list{list-style:none;margin-top:22px;display:grid;gap:10px}
.list li{position:relative;padding-left:22px;font-size:15px;line-height:1.5;color:#cfd1cf}
.list li:before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--acc);clip-path:polygon(0 0,100% 50%,0 100%)}

/* окно программы со скриншотом */
.shot{position:relative;overflow:hidden;background:#1d2023;border:1px solid var(--line);box-shadow:0 40px 80px #0006}
.shot img{display:block;width:100%;height:auto}
.shot .scan{position:absolute;left:0;right:0;height:60px;top:-60px;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--acc) 14%,transparent));border-bottom:1px solid color-mix(in srgb,var(--acc) 60%,transparent);animation:scan 5s var(--ease) infinite;pointer-events:none}
@keyframes scan{0%{top:-60px}70%,100%{top:100%}}
.shot .tag{position:absolute;z-index:2;padding:6px 9px;background:#24272Ae6;border:1px solid var(--acc);font-weight:500;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);white-space:nowrap}
.shot.phone{max-width:300px;margin:0 auto;border-radius:26px;overflow:hidden;border:6px solid #15171a}

/* живые демо */
.demo{border:1px solid var(--line);background:linear-gradient(180deg,#2a2e31,#25282b);padding:clamp(16px,2vw,26px);font-size:13px}
.demo-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line);font-weight:500;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid #ffffff0d}
.row small{display:block;margin-top:3px;font-size:11px;color:var(--dim)}
.tog{width:38px;height:20px;border-radius:20px;background:#3a3f43;position:relative;transition:background .3s}
.tog:after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#cfd1cf;transition:transform .3s var(--ease)}
.row.off .tog{background:var(--acc)}.row.off .tog:after{transform:translateX(18px);background:#24272A}
.row .st{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);min-width:84px;text-align:right}
.row.off .st{color:var(--acc)}
.lvl{display:grid;gap:8px;margin-top:14px}
.lvl div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;padding:14px;border:1px solid var(--line);transition:border-color .4s,background .4s}
.lvl div.on{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 8%,transparent)}
.lvl b{font-weight:500;color:var(--acc)}.lvl span{color:#cfd1cf;line-height:1.45}.lvl span em{color:var(--ink)}

/* цепочка шагов */
.chain{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:0;margin-top:44px;border-top:1px solid var(--line)}
.step{position:relative;padding:26px 22px 0 0}
.step:before{content:"";position:absolute;top:-1px;left:0;height:2px;width:0;background:var(--acc);transition:width .9s var(--ease)}
.step.on:before{width:100%}
.step i{font-style:normal;font-weight:500;font-size:11px;letter-spacing:.16em;color:var(--acc)}
.step b{display:block;margin-top:12px;font-weight:500;font-size:19px}
.step span{display:block;margin-top:8px;font-size:14px;line-height:1.5;color:var(--muted)}

/* хаб: три окна программ */
.trio{display:flex;height:min(72svh,720px);min-height:460px;border:1px solid var(--line)}
.trio .win{--c:var(--acc);position:relative;flex:1 1 0;min-width:0;overflow:hidden;border-left:1px solid var(--line);transition:flex-grow .8s var(--ease);isolation:isolate}
.trio .win:first-child{border-left:0}.trio .win.on{flex-grow:2.4}
.trio .media,.trio .media>*{position:absolute;inset:0;width:100%;height:100%}
.trio .media img{object-fit:cover;transition:opacity .6s,filter .8s}.trio .media.live img{opacity:0}
.trio .media{filter:grayscale(.85) brightness(.5);transition:filter .8s}.trio .win.on .media{filter:none}
.trio .hud{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.trio .shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#24272A00 40%,#24272Af0 92%);pointer-events:none}
.trio .copy{position:absolute;left:clamp(16px,2vw,32px);right:clamp(16px,2vw,32px);bottom:clamp(20px,4vh,40px);z-index:3}
.trio .edge{position:absolute;left:0;right:0;top:0;height:3px;background:var(--c);transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease);z-index:3}
.trio .win.on .edge{transform:scaleX(1)}
.trio small{display:block;font-weight:500;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--c)}
.trio strong{display:block;margin-top:10px;font-weight:500;font-size:clamp(28px,3.4vw,52px);line-height:.95;white-space:nowrap;transition:color .5s}
.trio .win.on strong{color:var(--c)}
.trio .more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .8s var(--ease),opacity .6s}.trio .more>div{overflow:hidden}
.trio .win.on .more{grid-template-rows:1fr;opacity:1}
.trio .more p{margin-top:12px;font-size:15px;line-height:1.5;color:#dfe1df;max-width:420px}
.trio .go{display:inline-flex;gap:12px;align-items:center;margin-top:16px;padding-bottom:7px;border-bottom:1px solid var(--c);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.trio .st{display:inline-block;margin-top:12px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--c) 50%,transparent);font-weight:500;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--c)}
.custom{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;padding:44px 0;border-top:1px solid var(--line)}

.intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px 64px;align-items:end;padding-top:40px;padding-bottom:32px}
.intro .h1{font-size:clamp(36px,4.4vw,68px)}.intro .lead{margin-top:0}
@media(max-width:900px){.intro{grid-template-columns:1fr}}
/* следующая программа */
.next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.next a{padding:30px clamp(16px,2vw,28px);border-left:1px solid var(--line);transition:background .3s}.next a:first-child{border-left:0}
.next a:hover{background:#ffffff06}.next small{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.next b{display:block;margin-top:10px;font-weight:500;font-size:24px;color:var(--k,var(--acc))}

.rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.rv.in{opacity:1;transform:none}

@media(max-width:900px){
  .hero,.split,.split.rev{grid-template-columns:1fr}.split.rev>.txt{order:0}.hero{min-height:0;padding-top:28px}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}.fact:nth-child(3){border-left:0}.fact:nth-child(n+3){border-top:1px solid var(--line)}
  .chain{grid-template-columns:1fr}.step{padding:22px 0 18px}
  .trio{flex-direction:column;height:auto;min-height:0}.trio .win{min-height:150px;border-left:0;border-top:1px solid var(--line)}.trio .win:first-child{border-top:0}
  .trio .win.on{min-height:420px}
  .custom{grid-template-columns:1fr}.next{grid-template-columns:1fr}.next a{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:600px){.sw main{padding-top:68px}}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01s!important;animation:none!important}.rv{opacity:1;transform:none}}
