/* Pocket Option — личный кабинет (Сайт 4, ПЕРЕРАБОТКА). DOCS/knowledge-base: сайдбар + статья. Префикс .ds- */
:root{
  --bg:#ffffff; --side:#f7f9fc; --ink:#172033; --ink2:#0d1626; --muted:#5b6880; --soft:#eef4ff;
  --brand:#0099FA; --brand-d:#0b6fd6; --line:#e7ecf3; --bd:#dde4ee; --ok:#16a34a; --warn:#e2532f;
  --hf:"Montserrat",system-ui,sans-serif; --bf:"Nunito Sans",system-ui,sans-serif;
  --mf:ui-monospace,SFMono-Regular,Menlo,monospace; --top:64px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--bf);background:var(--bg);color:var(--ink);font-size:17px;line-height:1.7}
h1,h2,h3{font-family:var(--hf);color:var(--ink2);line-height:1.25;font-weight:800;letter-spacing:-.01em}
a{color:var(--brand-d);text-decoration:none}
img{max-width:100%;display:block}

/* верхняя панель */
.ds-top{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--line);height:var(--top)}
.ds-top__in{max-width:1280px;margin:0 auto;height:var(--top);display:flex;align-items:center;gap:16px;padding:0 24px}
.ds-logo{display:flex;align-items:center;gap:9px;font-family:var(--hf);font-weight:800;font-size:19px;color:var(--ink2)}
.ds-logo b{color:var(--brand)} .ds-logo img{height:24px;width:auto}
.ds-top__tag{font-family:var(--mf);font-size:12px;color:var(--muted);border:1px solid var(--bd);border-radius:6px;padding:3px 9px;margin-left:4px}
.ds-top__cta{margin-left:auto;display:flex;gap:10px;align-items:center}
.ds-mtoggle{display:none;border:1px solid var(--bd);background:#fff;border-radius:8px;padding:8px 12px;font-family:var(--hf);font-weight:700;font-size:14px;cursor:pointer}

/* кнопки */
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--hf);font-weight:800;font-size:15px;border:0;border-radius:9px;padding:11px 20px;cursor:pointer;transition:.14s}
.ds-btn--cta{background:var(--brand);color:#fff}
.ds-btn--cta:hover{background:var(--brand-d)}
.ds-btn--ghost{background:var(--soft);color:var(--brand-d)}
.ds-btn--lg{padding:14px 26px;font-size:16px}
.ds-btn--block{width:100%}

/* двухпанельный каркас */
.ds-shell{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:270px minmax(0,1fr);gap:46px;padding:0 24px}

/* сайдбар */
.ds-side{position:sticky;top:var(--top);align-self:start;height:calc(100vh - var(--top));overflow-y:auto;padding:30px 8px 30px 0}
.ds-nav__grp{margin-bottom:22px}
.ds-nav__h{display:block;font-family:var(--hf);font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 8px 12px}
.ds-nav a{display:block;padding:8px 12px;border-radius:8px;color:var(--ink);font-size:14.5px;font-weight:600}
.ds-nav a:hover{background:var(--side)}
.ds-nav a[aria-current]{background:var(--soft);color:var(--brand-d);font-weight:800}
.ds-toc{border-top:1px solid var(--line);margin-top:8px;padding-top:18px}
.ds-toc__h{font-family:var(--hf);font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 10px 12px}
.ds-toc a{display:block;padding:5px 12px;border-left:2px solid var(--line);margin-left:12px;color:var(--muted);font-size:13.5px;line-height:1.4}
.ds-toc a:hover{color:var(--brand-d);border-left-color:var(--brand)}
.ds-side__cta{background:linear-gradient(160deg,#eaf5ff,#f4f9ff);border:1px solid #cfe4fb;border-radius:12px;padding:16px;margin:0 0 22px 12px}
.ds-side__cta p{font-family:var(--hf);font-weight:800;color:var(--ink2);margin-bottom:10px;font-size:14.5px}

/* главная колонка / статья */
.ds-main{min-width:0;padding:34px 0 0}
.ds-crumbs{font-family:var(--mf);font-size:12.5px;color:var(--muted);margin-bottom:16px}
.ds-crumbs a{color:var(--muted)}
.ds-art{max-width:760px}
.ds-art h1{font-size:clamp(30px,3.6vw,42px);line-height:1.15;margin-bottom:16px}
.ds-lead{font-size:20px;color:var(--muted);line-height:1.6;margin-bottom:20px}

/* CTA в геро статьи — сгруппирована с H1+лидом, разделитель ПОД ней (виден на первом экране web+mobile) */
.ds-art__cta{display:flex;align-items:center;flex-wrap:wrap;gap:13px 18px;margin:0 0 28px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.ds-art__cta-note{font-size:13.5px;color:var(--muted)}

/* факт-бар (stats) */
.ds-facts{display:flex;flex-wrap:wrap;border:1px solid var(--bd);border-radius:12px;overflow:hidden;margin:28px 0}
.ds-facts .f{flex:1 1 0;min-width:140px;padding:16px 18px;border-right:1px solid var(--line)}
.ds-facts .f:last-child{border-right:0}
.ds-facts .f b{display:block;font-family:var(--hf);font-size:23px;color:var(--brand-d)}
.ds-facts .f span{font-size:13px;color:var(--muted)}

/* список фич (cards → 2 колонки горизонтальных строк) */
.ds-block{margin:34px 0}
.ds-block__h{font-size:clamp(21px,2.5vw,27px);margin-bottom:6px}
.ds-block__sub{color:var(--muted);margin-bottom:18px}
.ds-features{display:grid;grid-template-columns:1fr 1fr;gap:8px 26px}
.ds-feat{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)}
.ds-feat .ic{flex:0 0 auto;width:38px;height:38px;border-radius:9px;background:var(--soft);display:grid;place-items:center;font-size:19px}
.ds-feat h3{font-size:16px;margin-bottom:3px} .ds-feat p{color:var(--muted);font-size:14.5px;line-height:1.55}

/* шаги — нумерованный ol */
.ds-steps{list-style:none;counter-reset:st;display:grid;gap:2px}
.ds-steps li{position:relative;padding:16px 0 16px 56px;border-bottom:1px solid var(--line)}
.ds-steps li::before{counter-increment:st;content:counter(st);position:absolute;left:0;top:14px;width:36px;height:36px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-family:var(--hf);font-weight:800;font-size:15px}
.ds-steps li h3{font-size:16px;margin-bottom:3px} .ds-steps li p{color:var(--muted);font-size:15px}

/* загрузки (stores) */
.ds-stores{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ds-store{display:flex;align-items:center;gap:12px;border:1px solid var(--bd);border-radius:10px;padding:13px 16px;color:var(--ink2)}
.ds-store:hover{border-color:var(--brand);background:var(--soft)}
.ds-store .ic{width:36px;height:36px;border-radius:8px;background:var(--soft);display:grid;place-items:center;font-size:18px}
.ds-store small{display:block;color:var(--muted);font-size:12px} .ds-store b{font-family:var(--hf);font-size:14.5px}

/* таблица */
.ds-tblwrap{overflow-x:auto;border:1px solid var(--bd);border-radius:10px;margin:8px 0}
.ds-tbl{width:100%;border-collapse:collapse;min-width:480px}
.ds-tbl th,.ds-tbl td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);font-size:14.5px}
.ds-tbl th{font-family:var(--hf);background:var(--side);color:var(--ink2)} .ds-tbl tr:last-child td{border-bottom:0}
.ds-tbl td:first-child{color:var(--muted)}

/* Q&A (faq — открытые блоки, не аккордеон) */
.ds-qa{display:grid;gap:16px}
.ds-qa .qa{padding-left:18px;border-left:3px solid var(--brand)}
.ds-qa .qa h3{font-size:16.5px;margin-bottom:5px;color:var(--ink2)}
.ds-qa .qa p{color:var(--muted)}

/* проза-статья */
.ds-prose h2{font-size:clamp(21px,2.5vw,27px);margin:30px 0 10px;scroll-margin-top:78px}
.ds-prose h2:first-child{margin-top:0}
.ds-prose h3{font-size:18px;margin:20px 0 7px}
.ds-prose p{margin-bottom:14px;color:#36425a}
.ds-prose ul{list-style:none;margin:6px 0 16px;display:grid;gap:8px}
.ds-prose li{position:relative;padding-left:24px;color:#36425a}
.ds-prose li::before{content:"→";position:absolute;left:2px;color:var(--brand);font-weight:700}
.ds-prose strong{color:var(--ink2)} .ds-prose a{text-decoration:underline}

/* inline-CTA (вместо band) */
.ds-cta{background:var(--soft);border:1px solid #cfe4fb;border-radius:14px;padding:28px;margin:34px 0;text-align:center}
.ds-cta h2{font-size:22px;margin-bottom:8px}
.ds-cta p{color:var(--muted);max-width:52ch;margin:0 auto 18px}

/* подвал статьи */
.ds-foot{border-top:1px solid var(--line);margin-top:46px;padding:26px 0 50px;color:var(--muted);font-size:13.5px}
.ds-foot__nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:16px;font-family:var(--hf);font-weight:700;font-size:13.5px}
.ds-foot__nav a{color:var(--muted)}
.ds-foot .age{border:1px solid var(--warn);color:var(--warn);border-radius:5px;padding:0 6px;font-family:var(--hf);font-weight:800;margin-right:7px}

@media(max-width:1000px){
  .ds-shell{grid-template-columns:1fr;gap:0}
  .ds-top__tag{display:none}
  .ds-top__in{padding:0 14px;gap:8px}
  .ds-logo{font-size:15px;gap:7px}
  .ds-logo img{height:21px}
  .ds-top__cta{margin-left:auto}
  .ds-top__cta .ds-btn{padding:9px 12px;font-size:13.5px;white-space:nowrap}
  .ds-mtoggle{display:inline-flex;align-items:center;padding:9px 12px;font-size:17px;line-height:1;flex:0 0 auto}
  .ds-side{position:fixed;top:var(--top);left:0;bottom:0;width:300px;max-width:84vw;background:#fff;border-right:1px solid var(--line);height:auto;padding:22px 16px;transform:translateX(-104%);transition:transform .22s;z-index:39;box-shadow:0 20px 50px rgba(13,22,38,.16)}
  body.nav-open .ds-side{transform:none}
  body.nav-open::after{content:"";position:fixed;inset:var(--top) 0 0 0;background:rgba(13,22,38,.4);z-index:38}
  .ds-main{padding-top:26px}
  .ds-features,.ds-stores{grid-template-columns:1fr}
  .ds-facts .f{flex:1 1 45%}
}
