/* Блог Alteco. Оформление по брендбуку alteco_brandbook_5.pdf:
   палитра — цвета, проверенные прямо в файле книги (#7F4EFF, #31E3AF, #1E1E1E, #FFFFFF);
   типографика — только Manrope, заголовки 36/24/20, текст 16/14/12, межстрочный 140%.
   Классы с приставкой blg-, чтобы не пересекаться с остальным сайтом. */
body{margin:0;background:#FFFFFF}
.blg{
  --purple:#7F4EFF; --mint:#31E3AF; --ink:#1E1E1E; --card:#FFFFFF; --page:#F5F5F5;
  --grad-pm:linear-gradient(135deg,#7F4EFF 0%,#31E3AF 100%);
  --grad-bm:linear-gradient(135deg,#1E1E1E 0%,#31E3AF 100%);
  --grad-bp:linear-gradient(135deg,#1E1E1E 0%,#7F4EFF 100%);
  --purple-soft:#F1ECFF; --mint-soft:#E1FAF2;
  --ink-2:#6B6B6B; --ink-3:#9B9B9B; --line:#E8E8E8; --line-strong:#D9D9D9;
  --radius:12px;
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--ink); font-size:14px; font-weight:500; line-height:1.4;
  background:var(--card); padding-bottom:0;
}
.blg *,.blg *::before,.blg *::after{box-sizing:border-box}
.blg a{color:inherit;text-decoration:none}
.blg button,.blg input{font-family:inherit}
.blg-shell{max-width:1120px;margin:0 auto;padding:0 24px}

/* ---------- шапка сайта ---------- */
.blg-top{display:flex;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid var(--line)}
/* Знак — настоящий логотип Alteco из assets/img/svg/logo.svg, векторный.
   Красится currentColor, поэтому один и тот же файл годится и на светлом, и на тёмном. */
.blg-logo{display:inline-flex;align-items:center;color:var(--ink);line-height:0}
.blg-logo svg{height:26px;width:auto;display:block}
.blg-logo:hover{color:var(--purple)}
.blg-nav{display:flex;gap:22px;margin-left:28px}
.blg-nav a{font-size:14px;color:var(--ink-2)}
.blg-nav a:hover{color:var(--ink)}
.blg-nav a[aria-current]{color:var(--purple);font-weight:600}
.blg-top__cta{margin-left:auto;display:flex;gap:10px}
.blg .blg-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--purple);
  color:#fff;padding:9px 18px;border-radius:8px;font-size:14px;font-weight:500;border:none;cursor:pointer}
.blg .blg-btn:hover{background:#6a49f2;color:#fff}
.blg .blg-btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}
.blg .blg-btn--ghost:hover{background:var(--page);color:var(--ink)}
.blg .blg-btn--mint{background:var(--mint);color:var(--ink)}
.blg .blg-btn--mint:hover{background:#25d29f;color:var(--ink)}

/* ---------- хлебные крошки ---------- */
.blg-crumbs{font-size:12px;color:var(--ink-3);padding:16px 0 0;display:flex;gap:7px;flex-wrap:wrap}
.blg-crumbs a{color:var(--ink-2)}
.blg-crumbs a:hover{color:var(--ink)}

/* ---------- шапка раздела ---------- */
.blg-head{padding:26px 0 8px;display:flex;gap:28px;align-items:flex-end;flex-wrap:wrap}
.blg-head__t{flex:1;min-width:280px}
.blg-head h1{font-size:36px;font-weight:600;line-height:1.15;margin:0;max-width:18ch}  /* Заголовок 03 */
.blg-head p{font-size:16px;color:var(--ink-2);margin:12px 0 0;max-width:58ch}
.blg-search{display:flex;align-items:center;gap:9px;border:1px solid var(--line-strong);
  border-radius:10px;padding:0 14px;height:44px;min-width:250px;background:var(--card)}
.blg-search svg{width:16px;height:16px;stroke:var(--ink-3);fill:none;stroke-width:2;flex:none}
.blg-search input{border:0;outline:0;font-size:14px;font-weight:500;color:var(--ink);
  background:transparent;width:100%;height:100%}
.blg-search input::placeholder{color:var(--ink-3)}
.blg-search:focus-within{border-color:var(--purple)}

/* ---------- рубрики ---------- */
.blg-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 34px}
.blg .blg-tab{font-size:13px;padding:8px 15px;border-radius:100px;border:1px solid var(--line);
  color:var(--ink-2);background:var(--card)}
.blg .blg-tab:hover{border-color:var(--line-strong);color:var(--ink)}
.blg .blg-tab--on{background:var(--ink);border-color:var(--ink);color:#fff}
.blg .blg-tab--on:hover{color:#fff}
.blg-tab b{font-weight:500;color:inherit;opacity:.55;margin-left:6px}

.blg-eyebrow{font-size:12px;color:var(--ink-3);text-transform:uppercase;letter-spacing:1px;
  margin-bottom:12px;font-weight:500}

/* ---------- главная статья ---------- */
.blg-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.blg-lead{display:grid;grid-template-columns:400px 1fr;gap:0;overflow:hidden;margin-bottom:38px;
  transition:border-color .15s ease,box-shadow .15s ease}
.blg-lead:hover{border-color:var(--purple);box-shadow:0 6px 20px rgba(127,78,255,.12)}
.blg-lead img{width:100%;height:100%;object-fit:cover;object-position:left center;display:block;min-height:230px}
.blg-lead__b{padding:26px 28px;display:flex;flex-direction:column}
.blg-lead h2{font-size:24px;font-weight:600;line-height:1.25;margin:10px 0 10px}  /* Заголовок 04 */
.blg-lead p{font-size:14px;color:var(--ink-2);margin:0 0 18px;max-width:56ch}
.blg-meta{font-size:12px;color:var(--ink-3);margin-top:auto;padding-top:14px;
  border-top:1px solid var(--line);display:flex;gap:14px;flex-wrap:wrap}

.blg-badge{font-size:12px;padding:4px 10px;border-radius:100px;display:inline-block;width:max-content;letter-spacing:.2px}
.blg .blg-badge--portfel{background:var(--purple-soft);color:var(--purple)}
.blg .blg-badge--kripto{background:var(--mint);color:var(--ink)}
.blg .blg-badge--ii{background:var(--ink);color:#fff}
.blg .blg-badge--obligacii{background:#E8F0FF;color:#2C5AA8}

/* ---------- сетка статей ---------- */
.blg-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.blg-post{display:flex;flex-direction:column;overflow:hidden;position:relative;
  transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
a.blg-post:hover{border-color:var(--purple);box-shadow:0 6px 20px rgba(127,78,255,.12);transform:translateY(-2px)}
.blg-post img{width:100%;aspect-ratio:16/9;height:auto;flex:none;object-fit:cover;object-position:left center;display:block}
.blg-post__b{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.blg-post h3{font-size:20px;font-weight:600;line-height:1.25;margin:10px 0 7px}  /* Заголовок 05 */
.blg-post p{font-size:14px;color:var(--ink-2);margin:0 0 16px}
a.blg-post::after{content:'→';position:absolute;right:18px;bottom:16px;font-size:16px;
  color:var(--ink-3);opacity:0;transition:opacity .15s ease,transform .15s ease}
a.blg-post:hover::after{opacity:1;color:var(--purple);transform:translateX(3px)}

/* ---------- подписка ---------- */
.blg-sub{margin-top:38px;border-radius:var(--radius);background:var(--grad-bp);color:#fff;
  padding:34px 36px;display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.blg-sub h2{font-size:24px;font-weight:600;margin:0 0 8px;color:#fff}
.blg-sub p{font-size:14px;color:rgba(255,255,255,.78);margin:0;max-width:52ch}

/* ---------- призыв в сканер ---------- */
.blg-cta{margin-top:16px;border:1px solid var(--line);border-radius:var(--radius);padding:28px 32px;
  display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--page)}
.blg-cta h2{font-size:20px;font-weight:600;margin:0 0 6px}
.blg-cta p{font-size:14px;color:var(--ink-2);margin:0;max-width:56ch}

/* ---------- подвал ---------- */
.blg-foot{margin-top:56px;border-top:1px solid var(--line);padding:30px 0 52px;
  display:grid;grid-template-columns:1fr 1fr;gap:22px 40px;
  font-size:13px;line-height:1.6;color:var(--ink-2)}
.blg-foot__co,.blg-foot__ln{display:flex;flex-direction:column;gap:3px}
.blg-foot__ln{align-items:flex-start}
.blg-foot b{font-weight:700;color:var(--ink)}
.blg-foot a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:var(--line-strong)}
.blg-foot a:hover{text-decoration-color:var(--ink)}
@media(max-width:640px){.blg-foot{grid-template-columns:1fr;gap:20px}}

@media(max-width:760px){
  .blg-head h1{font-size:28px}
  .blg-lead{grid-template-columns:1fr}
  /* меню оставляем: без него с телефона не перейти из блога в сканер */
  .blg-top{flex-wrap:wrap;row-gap:10px}
  .blg-nav{gap:16px;margin-left:16px;order:3;width:100%}
  .blg-search{min-width:100%;order:3}
}
@media(max-width:480px){
  .blg .blg-btn{padding:8px 14px;font-size:13px}
  .blg-logo svg{height:22px}
}