/* Гид «Как работает Бортовой»: стили (UI v7). Всё под .hw и с префиксом hw-,
   чтобы не пересекаться с site.css на публичной странице. */
.hw{--hw-app:#f2f2f5;--hw-card:#fff;--hw-ink:#16181d;--hw-ink2:#5d6169;--hw-line:#e1e2e7;--hw-acc:#1d4f91;--hw-accbg:#e8eef7;--hw-ok:#eaf3ec;--hw-okline:#b9d7c0;
  color:var(--hw-ink);font-size:17px;line-height:1.35;padding:6px 0 40px;text-align:left;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.hw *{box-sizing:border-box}
.hw[data-mode="web"]{background:var(--hw-app);border-radius:16px;max-width:560px;margin:24px auto 0}
.hw h1{font-size:28px;line-height:1.15;margin:14px 16px 6px;font-weight:700;letter-spacing:-.3px;color:var(--hw-ink)}
.hw-lead{font-size:17px;color:var(--hw-ink2);margin:0 16px 4px}
.hw-sec{font-size:14px;color:var(--hw-ink2);text-transform:uppercase;letter-spacing:.4px;margin:24px 16px 8px;font-weight:600}
.hw-group{background:var(--hw-card);margin:0 16px;border-radius:12px;overflow:hidden}
.hw-row{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px;min-height:60px;cursor:pointer;font-family:inherit;color:var(--hw-ink)}
div.hw-row{cursor:default}
.hw-group>.hw-row+.hw-row{border-top:1px solid var(--hw-line)}
.hw-row:focus-visible,.hw-btn:focus-visible,.hw-back:focus-visible{outline:2px solid var(--hw-acc);outline-offset:-2px}
.hw-rt{flex:1;min-width:0;display:flex;flex-direction:column}
.hw-nm{font-size:17px;font-weight:600}
.hw-nm.hw-plain{font-weight:400}
.hw-sub{font-size:15px;color:var(--hw-ink2);margin-top:2px}
.hw-chev{color:#a3a6ad;font-size:24px;line-height:1}
.hw-num{flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:var(--hw-acc);color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;margin-top:2px}
.hw-row.hw-step{align-items:flex-start;padding:14px}
.hw-row.hw-step .hw-t{flex:1;font-size:17px}
.hw-flink{color:var(--hw-acc);font-size:16px;white-space:nowrap}
.hw-btn{all:unset;box-sizing:border-box;display:block;width:100%;min-height:52px;text-align:center;font-size:17px;font-weight:600;padding:15px 12px;border-radius:12px;cursor:pointer;background:var(--hw-acc);color:#fff;font-family:inherit}
.hw-btn.hw-btn2{background:#fff;color:var(--hw-acc);border:1.5px solid var(--hw-acc);padding:13.5px 12px}
.hw-btns{display:flex;gap:10px;margin:0 16px}
.hw-btns .hw-btn{flex:1}
.hw-pad{margin:12px 16px 0}
.hw-notice{margin:12px 16px 0;background:var(--hw-ok);border:1px solid var(--hw-okline);border-radius:12px;padding:12px 14px;font-size:16px}
.hw-essence{margin:14px 16px 0;font-size:19px;line-height:1.35;font-weight:600}
.hw-cap{font-size:15px;color:var(--hw-ink2);margin:8px 16px 0}
.hw-vwrap{margin:8px 16px 0}
.hw-vwrap+.hw-cap{text-align:center}
.hw video{display:block;width:240px;max-width:100%;aspect-ratio:720/1556;background:#000;border-radius:18px;margin:0 auto}
.hw-shot{margin:16px auto 0;width:220px;text-align:center}
.hw-shot img{display:block;width:220px;height:auto;border:6px solid #1b1c20;border-radius:24px;background:#fff}
.hw-shot p{font-size:14px;color:var(--hw-ink2);margin:8px 0 0}
.hw-tip{margin:14px 16px 0;background:var(--hw-accbg);border-radius:12px;padding:12px 14px;font-size:16px}
.hw-mono{font-family:ui-monospace,Menlo,monospace;font-size:15px;word-break:break-all}
.hw-body{margin:12px 16px;font-size:19px}
.hw-desk{margin:14px 16px 0;border:2px solid #3a3d44;border-radius:10px;background:#fff;display:grid;grid-template-columns:1fr 2fr 1.2fr;height:130px;overflow:hidden;font-size:13px;color:var(--hw-ink2)}
.hw-desk div{padding:8px;display:flex;align-items:center;justify-content:center;text-align:center;border-right:1px solid var(--hw-line)}
.hw-desk div:last-child{border-right:0}
.hw-desk b{color:var(--hw-ink)}
.hw-back{all:unset;box-sizing:border-box;display:block;margin:6px 16px 0;padding:10px 0;color:var(--hw-acc);font-size:16px;cursor:pointer;font-family:inherit}
