*{box-sizing:border-box}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
  color:#16130f;
  background:#faf7f3;
}
a{color:#f0480a;text-decoration:none}
a:hover{color:#c93c08}
.page{
  min-height:100vh;
  background:radial-gradient(120% 80% at 50% -10%,#ffefe6 0%,#faf7f3 46%);
  padding:40px 24px 72px;
}
.wrap{max-width:920px;margin:0 auto}
.topnav{
  display:flex;justify-content:space-between;align-items:center;
  gap:16px;margin-bottom:40px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;color:#16130f;font-weight:700}
.brand svg{display:block;border-radius:10px;box-shadow:0 6px 16px rgba(240,72,10,.28)}
.nav-links{display:flex;gap:16px;align-items:center;font-size:14px;font-weight:600}
.lang{display:inline-flex;border:1px solid #ebe5de;border-radius:999px;overflow:hidden}
.lang button{
  border:0;background:#fff;padding:6px 12px;font:inherit;font-size:12px;
  font-weight:700;cursor:pointer;color:#8a837b;
}
.lang button.is-active{background:#16130f;color:#fff}
.hero{text-align:center;padding:24px 0 8px}
.hero-icon{
  width:72px;height:72px;margin:0 auto;border-radius:18px;overflow:hidden;
  box-shadow:0 12px 30px rgba(240,72,10,.34);line-height:0;
}
.eyebrow{
  font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:#c08560;margin-top:22px;
}
h1{
  font-size:clamp(28px,5vw,42px);font-weight:800;letter-spacing:-.03em;
  line-height:1.08;margin:14px 0 0;
}
.lead{
  font-size:18px;line-height:1.55;color:#6b6560;margin:18px auto 0;max-width:560px;
}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 18px;border-radius:12px;font-weight:700;font-size:14px;
}
.btn-primary{background:#f0480a;color:#fff;box-shadow:0 8px 20px rgba(240,72,10,.28)}
.btn-primary:hover{color:#fff;background:#d94008}
.btn-ghost{background:#fff;border:1.5px solid #ebe5de;color:#16130f}
.btn-ghost:hover{color:#16130f;background:#fff5f0}
.card{
  background:#fff;border:1px solid #eee8e1;border-radius:22px;
  padding:28px 30px;box-shadow:0 4px 20px rgba(22,19,15,.05);margin-top:28px;
}
.card h2{margin:0 0 12px;font-size:22px;letter-spacing:-.01em}
.card p,.card li{color:#6b6560;line-height:1.6;font-size:15px}
.card ul{padding-left:18px;margin:10px 0}
.muted{color:#a79f96;font-size:13px;text-align:center;margin-top:36px}
.prose h2{margin-top:28px;font-size:20px}
.prose h3{margin-top:20px;font-size:16px}
.prose p,.prose li{color:#4b4641;line-height:1.65;font-size:15px}
.prose strong{color:#16130f}
[data-lang]{display:none}
html[lang="ru"] [data-lang="ru"],
html[lang="en"] [data-lang="en"]{display:block}
html[lang="ru"] span[data-lang="ru"],
html[lang="en"] span[data-lang="en"],
html[lang="ru"] a[data-lang="ru"],
html[lang="en"] a[data-lang="en"]{display:inline}
/* welcome steps reuse */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:48px}
.num{
  width:34px;height:34px;flex:0 0 34px;border-radius:10px;background:#f0480a;color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;
}
.card-head{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.card-title{font-size:18px;font-weight:750}
.illu-toolbar,.illu-menu{background:#2b2b2e;border-radius:14px;padding:14px;position:relative;overflow:hidden}
.illu-row{display:flex;align-items:center;gap:9px}
.sq{width:22px;height:22px;border-radius:7px;background:#3e3e42;display:inline-block}
.sq.sm{border-radius:6px;background:#4a4a4e}
.illu-omnibox{flex:1;height:26px;background:#3e3e42;border-radius:8px}
.puzzle{
  width:30px;height:30px;border-radius:8px;background:#5a5a5f;
  box-shadow:0 0 0 3px rgba(240,72,10,.9),0 0 0 8px rgba(240,72,10,.25);
  display:flex;align-items:center;justify-content:center;
}
.avatar{width:22px;height:22px;border-radius:50%;background:#4a4a4e}
.menu{background:#242427;border-radius:10px;padding:12px 4px 8px}
.menu-title{font-size:12px;font-weight:700;color:#edecce;padding:0 12px 10px;border-bottom:1px solid #38383c}
.menu-row{display:flex;align-items:center;gap:10px;padding:9px 12px}
.menu-row--active{background:rgba(240,72,10,.14);border-radius:8px}
.menu-icon{width:20px;height:20px;border-radius:5px;background:#4a4a4e;flex:0 0 20px}
.menu-bar{flex:1;height:8px;background:#3e3e42;border-radius:4px}
.menu-name{flex:1;font-size:12px;font-weight:600;color:#fff}
.pin{display:flex;width:24px;height:24px;align-items:center;justify-content:center;border-radius:6px;box-shadow:0 0 0 2.5px rgba(240,72,10,.95)}
.banner{
  margin-top:32px;background:linear-gradient(135deg,#ff7a3c,#f0480a);border-radius:22px;
  padding:32px;color:#fff;box-shadow:0 16px 40px rgba(240,72,10,.28);
}
.banner h2{margin:0;font-size:24px}
.banner p{opacity:.95;line-height:1.55;margin:12px 0 0}
