@charset "UTF-8";
/* Общая шапка и подвал публичных страниц. Один источник на лендинг, /pricing и юр-страницы.
   Разметку даёт pub_shell_inc.php; страничные css сюда не лезут — всё под .ps-shell. */

.ps-shell{
  --ps-col:1760px; --ps-gut:32px;
  --ps-bg:var(--n950); --ps-line:var(--n700); --ps-line2:var(--n750); --ps-surf:var(--n850);
  --ps-bd:var(--n600); --ps-t:var(--n100); --ps-t2:var(--n200); --ps-t3:var(--n300); --ps-t4:var(--n400);
  --ps-acc:var(--acc); --ps-acc2:var(--acc-hi);
  font:400 14px/1.55 Inter,system-ui,sans-serif; color:var(--ps-t);
}
.ps-shell *,.ps-shell *::before,.ps-shell *::after{box-sizing:border-box}
/* Обёртка шапки в раскладке не участвует — иначе position:sticky липнет к ней,
 а не к странице, и шапка уезжает вверх вместе с первым экраном. */
.ps-flat{display:contents}
:where(.ps-shell a){color:inherit;text-decoration:none}
.ps-shell svg{display:block}
.ps-shell button{font:inherit}

/* Десктоп/мобилка переключаются только в режиме auto: на лендинге фрагменты
   выбирает сама страница и вариант приходит уже готовым. */
.ps-shell.ps-auto .ps-m{display:none}
.ps-shell.ps-auto .ps-menu.on{display:none}
/* Ниже 1200px десктопная строка не влезает — шапка переключается на бургер,
   как в макете «Шапка v2». Контент страниц живёт по своим брейкпоинтам. */
@media (max-width:1199.5px){
  .ps-shell.ps-auto .ps-d{display:none}
  .ps-shell.ps-auto .ps-m{display:block}
  .ps-shell.ps-auto .ps-menu{display:none}
  .ps-shell.ps-auto .ps-menu.on{display:flex}
}

/* ---------- иконки ---------- */
.ps-shell .ps-ic{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ps-shell .ps-arr{width:9px;height:9px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:.55}
.ps-shell .ps-sv{fill:currentColor}

/* ================= ШАПКА · десктоп =================
   Одна строка на всех ширинах 1200+: меню двумя плашками стоит по центру между
   логотипом и правым блоком (два одинаковых гибких промежутка .ps-gap), при
   сжатии clamp() сначала ужимает отступы, потом текст и иконки. */
.ps-hdr{position:sticky;top:0;z-index:20;background:var(--ps-bg);border-bottom:1px solid var(--ps-line)}
.ps-hrow{max-width:1824px;margin:0 auto;padding:8px clamp(10px,1.7vw,32px);
         min-height:40px;display:flex;align-items:center;white-space:nowrap}
.ps-gap{flex:1 1 0;min-width:clamp(8px,1.1vw,20px)}
.ps-mid{flex:none;display:flex;align-items:center;gap:clamp(8px,0.9vw,14px)}

.ps-brand{display:flex;align-items:center;gap:clamp(6px,0.65vw,10px);flex:none;min-width:0}
.ps-logo{width:clamp(23px,1.6vw,28px);height:clamp(23px,1.6vw,28px);flex:none;border-radius:50%;background:var(--ps-surf);border:1px solid var(--ps-bd);
         display:inline-flex;align-items:center;justify-content:center;font:700 clamp(12px,0.9vw,15px)/1 Oswald,sans-serif;color:var(--n0)}
.ps-name{min-width:0;font:600 clamp(13.5px,1vw,17px)/1 Oswald,sans-serif;letter-spacing:.02em;color:var(--n0);white-space:nowrap;
         overflow:hidden;text-overflow:ellipsis}
.ps-name span{color:var(--ps-acc)}

.ps-dot{width:6px;height:6px;border-radius:50%;background:var(--ps-acc);flex:none}

.ps-nav{display:inline-flex;align-items:stretch;flex:none;background:var(--pit);border:1px solid var(--ps-line);
        border-radius:10px;overflow:hidden;font:600 clamp(11px,0.78vw,13px)/1 Inter,sans-serif}
.ps-nav a{display:inline-flex;align-items:center;padding:9px clamp(7px,0.8vw,13px);color:var(--ps-t3);border-right:1px solid var(--ps-line)}
.ps-nav a:last-child{border-right:0}
.ps-nav a:hover{background:var(--ps-surf);color:var(--ps-t)}
.ps-nav a.ps-on{gap:clamp(5px,0.5vw,8px);padding:9px clamp(8px,0.85vw,14px);color:var(--n0);background:var(--n800);
                font:700 clamp(11.5px,0.85vw,14px)/1 Inter,sans-serif}
.ps-nav a.ps-on:hover{color:var(--ps-acc)}

.ps-sep{width:1px;height:26px;background:var(--ps-line);flex:none}

.ps-acad{display:inline-flex;align-items:stretch;flex:none;background:var(--ps-surf);border:1px solid var(--ps-line);
         border-radius:10px;overflow:hidden;font:600 clamp(11px,0.78vw,13px)/1 Inter,sans-serif;white-space:nowrap}
.ps-acad a{display:inline-flex;align-items:center;gap:clamp(4px,0.45vw,6px);padding:9px clamp(7px,0.8vw,13px);color:var(--ps-t2);border-right:1px solid var(--ps-line)}
.ps-acad a:last-child{border-right:0}
.ps-acad a:hover{background:var(--n800);color:var(--ps-t)}
.ps-acad a.ps-on{gap:clamp(5px,0.5vw,8px);padding:9px clamp(8px,0.85vw,14px);color:var(--n0);background:var(--stripe-dark);
                 font:700 clamp(11.5px,0.85vw,14px)/1 Inter,sans-serif}
.ps-acad a.ps-on:hover{color:var(--ps-acc)}
.ps-acad a.ps-on .ps-ic{width:clamp(11px,0.85vw,14px);height:clamp(11px,0.85vw,14px)}

.ps-hdr .ps-ic{width:clamp(10px,0.75vw,12px);height:clamp(10px,0.75vw,12px)}
.ps-hdr .ps-arr{width:clamp(7px,0.55vw,9px);height:clamp(7px,0.55vw,9px)}

.ps-right{flex:none;display:flex;gap:clamp(6px,0.7vw,12px);align-items:center;min-width:0;white-space:nowrap}

.ps-lang{display:inline-flex;background:var(--ps-surf);border:1px solid var(--ps-line);border-radius:8px;
         padding:2px;gap:2px;font:600 11px/1 Inter,sans-serif;letter-spacing:.06em;flex-shrink:0}
.ps-lang span{padding:5px 10px;border-radius:6px;cursor:pointer;color:var(--ps-t4)}
.ps-lang span.on{background:var(--ps-bd);color:var(--n0)}
.ps-hdr .ps-lang{font-size:clamp(10px,0.7vw,11px)}
.ps-hdr .ps-lang span{padding:5px clamp(6px,0.6vw,10px)}

/* Вошёл — аватар с ником вместо кнопки входа; на мобилке остаётся один аватар. */
.ps-me{display:inline-flex;align-items:center;gap:9px;height:36px;padding:2px 13px 2px 2px;
       border:1px solid var(--ps-line);border-radius:999px;background:var(--ps-surf);
       color:var(--ps-t);font:600 12.5px Inter,sans-serif;white-space:nowrap;flex:none}
.ps-me:hover{border-color:var(--n500)}
.ps-me img,.ps-me .ps-me-x{width:30px;height:30px;flex:none;border-radius:50%;object-fit:cover;
       background:var(--n750);border:1px solid var(--ps-line)}
.ps-me .ps-me-x{display:flex;align-items:center;justify-content:center;font:700 13px/1 Oswald,sans-serif;color:var(--ps-t2)}
/* Ник в шапке сдаётся первым: на узком десктопе он плавно ужимается до нуля,
   остаётся один аватар — строка из-за него не переносится. */
.ps-me-n{max-width:clamp(0px,calc(20vw - 290px),150px);overflow:hidden;text-overflow:ellipsis}
.ps-hdr .ps-me{gap:clamp(0px,0.55vw,9px);padding:2px clamp(2px,0.8vw,13px) 2px 2px}
.ps-me--min{height:auto;padding:0;gap:0;border:0;background:none}
.ps-me--min .ps-me-n{display:none}
.ps-me--min img,.ps-me--min .ps-me-x{width:32px;height:32px}

.ps-mcta{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 11px;flex:none;
         border:1px solid var(--ps-bd);border-radius:9px;color:var(--ps-t);
         font:600 12px Inter,sans-serif;white-space:nowrap}
.ps-mcta:hover{border-color:var(--n500)}
.ps-mcta svg{width:14px;height:14px;fill:currentColor}

.ps-hcta{display:inline-flex;align-items:center;gap:clamp(6px,0.5vw,8px);height:36px;padding:0 clamp(10px,1vw,16px);border-radius:10px;
         font:600 clamp(11.5px,0.8vw,12.5px) Inter,sans-serif;border:1px solid var(--ps-bd);color:var(--ps-t);white-space:nowrap}
.ps-hcta:hover{border-color:var(--n500)}
.ps-hcta svg{width:16px;height:16px;fill:currentColor}
.ps-hcta .ps-cts{display:none}
@media (max-width:1400px){
  .ps-hcta .ps-ctl{display:none}
  .ps-hcta .ps-cts{display:inline}
}

/* ================= ШАПКА · мобилка ================= */
.ps-mhdr{position:sticky;top:0;z-index:20;background:var(--ps-bg);border-bottom:1px solid var(--ps-line)}
.ps-mrow{padding:0 16px;height:52px;display:flex;align-items:center;gap:8px}
.ps-mrow .ps-brand{flex:1;min-width:0;overflow:hidden;gap:9px}
.ps-mrow .ps-logo{width:26px;height:26px;font-size:14px}
.ps-mrow .ps-name{font-size:16px}
.ps-mrow .ps-lang span{padding:5px 7px}
/* На телефоне в строку всё равно должны влезать все четверо — язык не прячем,
 а ужимаем сами элементы. Ступеньки подобраны так, чтобы строка не переносилась
 ни на 430, ни на 360, ни на 320. */
@media (max-width:430px){
  .ps-mrow{padding:0 12px;gap:6px}
  .ps-mrow .ps-logo{width:24px;height:24px;font-size:13px}
  .ps-mrow .ps-name{font-size:14.5px}
  .ps-mrow .ps-lang{padding:2px;font-size:10px}
  .ps-mrow .ps-lang span{padding:4px 6px}
  .ps-mcta{height:32px;padding:0 9px;font-size:11.5px;gap:5px}
  .ps-mcta svg{width:13px;height:13px}
  .ps-me--min img,.ps-me--min .ps-me-x{width:28px;height:28px}
  .ps-burger{width:38px;height:38px;margin-right:-8px}
  .ps-burger svg{width:20px;height:20px}
}
@media (max-width:344px){
  .ps-mrow .ps-name{display:none}
}
.ps-burger{width:44px;height:44px;margin-right:-10px;border:0;background:none;cursor:pointer;
           display:inline-flex;align-items:center;justify-content:center;color:var(--ps-t)}
.ps-burger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* Меню раскрывается на весь экран поверх сайта — и на телефоне, и на планшете.
   z-index выше кнопки «наверх» (60) и лайтбокса лендинга (60): поверх меню ничего не торчит. */
.ps-menu{position:fixed;inset:0;z-index:80;background:var(--band-bg);display:none;flex-direction:column;overflow:auto}
.ps-menu.on{display:flex}
.ps-menu-top{padding:0 16px;height:52px;display:flex;align-items:center;justify-content:space-between;
             border-bottom:1px solid var(--ps-line);flex-shrink:0}
.ps-menu-x{width:44px;height:44px;margin-right:-10px;border:0;background:none;cursor:pointer;color:var(--ps-t);
           display:inline-flex;align-items:center;justify-content:center}
.ps-menu-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ps-menu-nav{margin:10px 16px 4px;background:var(--pit);border:1px solid var(--ps-line);border-radius:12px;
             overflow:hidden;display:grid;font:600 15px/1 Inter,sans-serif}
.ps-menu-nav a{display:flex;align-items:center;padding:15px 16px;border-bottom:1px solid var(--ps-line2);color:var(--ps-t2)}
.ps-menu-nav a:last-child{border-bottom:0}
.ps-menu-nav a.ps-on{gap:10px;color:var(--n0);background:var(--n800);border-bottom-color:var(--ps-line);
                     font:700 16px/1 Inter,sans-serif}
.ps-menu-acad{margin:6px 16px;background:var(--ps-surf);border:1px solid var(--ps-line);border-radius:12px;
              overflow:hidden;font:600 15px/1 Inter,sans-serif}
.ps-menu-acad a{display:flex;align-items:center;gap:10px;padding:15px 16px;color:var(--ps-t2);border-bottom:1px solid var(--ps-line)}
.ps-menu-acad a:last-child{border-bottom:0}
.ps-menu-acad a.ps-on{color:var(--n0);background:var(--stripe-dark);font:700 16px/1 Inter,sans-serif}
.ps-menu-acad a.ps-on .ps-ic{width:16px;height:16px}
.ps-menu-acad .ps-ic{width:15px;height:15px}
.ps-menu-acad .ps-arr,.ps-menu-nav .ps-arr{width:10px;height:10px;margin-left:auto}
.ps-menu-foot{margin-top:auto;padding:18px 16px 24px;display:flex;gap:12px;align-items:center;border-top:1px solid var(--ps-line)}
.ps-menu-foot .ps-lang{font-size:12px}
.ps-menu-foot .ps-lang span{padding:6px 11px}
.ps-menu-steam{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:9px;height:46px;
               border-radius:10px;font:600 14px Inter,sans-serif;border:1px solid var(--ps-bd);color:var(--ps-t)}
.ps-menu-steam svg{width:17px;height:17px;fill:currentColor;flex-shrink:0}

/* ================= ПОДВАЛ ================= */
.ps-ftr{border-top:1px solid var(--ps-line);background:var(--ps-bg);padding:56px var(--ps-gut) 28px}
.ps-fin{max-width:var(--ps-col);margin:0 auto}
.ps-fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;align-items:start}
.ps-ftr .ps-logo{width:30px;height:30px;font-size:16px}
.ps-ftr .ps-name{font-size:19px}
.ps-ftag{margin:14px 0 22px;font-size:13.5px;color:var(--ps-t3);max-width:34ch}
.ps-soc{display:flex;gap:10px}
.ps-soc a{width:40px;height:40px;border-radius:10px;border:1px solid var(--ps-line);background:var(--ps-surf);
          display:inline-flex;align-items:center;justify-content:center;color:var(--ps-t2)}
.ps-soc a:hover{border-color:var(--n500);color:var(--ps-t)}
.ps-soc svg{width:17px;height:17px;fill:currentColor}
.ps-soc .ps-tg svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ps-soc .ps-tw svg{width:15px;height:15px}
.ps-fh{font:600 11px/1.4 Inter,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--ps-t4);margin-bottom:16px}
.ps-flist{display:grid;gap:12px;font-size:13.5px}
.ps-flist a{color:var(--ps-t2)}
.ps-flist a:hover{color:var(--ps-t)}
.ps-flist a.ps-ext{display:inline-flex;align-items:center;gap:6px}
.ps-fcta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 26px;
         border-radius:10px;font:600 14px Inter,sans-serif;background:transparent;border:1px solid var(--ps-bd);color:var(--ps-t)}
.ps-fcta:hover{border-color:var(--ps-acc);color:var(--ps-acc)}
.ps-fcta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ps-fct{display:flex;flex-direction:column;align-items:stretch;gap:10px;max-width:300px}
.ps-fbot{margin-top:44px;padding-top:20px;border-top:1px solid var(--ps-line2);display:flex;
         justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ps-t4)}
.ps-legal{text-align:right}
.ps-fbot a{color:var(--ps-t3);border-bottom:1px dashed var(--ps-bd)}

/* Подвал · мобилка. Один блок на оба режима: узкий экран — узкий подвал, откуда бы он ни пришёл. */
@media (max-width:720px){
  .ps-ftr{padding:40px 20px 24px}
  .ps-ftr .ps-fcols{grid-template-columns:1fr;gap:28px}
  .ps-ftr .ps-logo{width:28px;height:28px;font-size:15px}
  .ps-ftr .ps-name{font-size:18px}
  .ps-ftr .ps-ftag{margin:12px 0 18px;font-size:13px}
  .ps-ftr .ps-soc a{width:44px;height:44px}
  .ps-ftr .ps-fh{font-size:10.5px;margin-bottom:14px}
  .ps-ftr .ps-flist{gap:11px}
  .ps-ftr .ps-fcta{display:flex;width:100%;height:48px;padding:0 16px}
  .ps-ftr .ps-fct{max-width:none}
  .ps-ftr .ps-fbot{margin-top:32px;padding-top:16px;display:grid;gap:6px;font-size:11.5px}
  .ps-ftr .ps-legal{text-align:left}
}

/* Файл подключают только страницы с публичной шапкой: отступы оболочки приложения тут лишние */
body{padding-top:0 !important;margin-top:0 !important}
