/* Стили ВБ-гайдов. Переменные темы — из styles.css (тёмная наследуется). */

.guide-page{max-width:980px;margin:0 auto;padding:24px 16px 80px;
  font-family:'Manrope','Segoe UI','Noto Sans',sans-serif;font-size:15px}
@media(min-width:768px){.guide-page{padding:28px 24px 96px}}

/* ---------- Хлебные крошки ---------- */
.guide-breadcrumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  margin:8px 0 14px;color:var(--dim);font-size:11px}
.guide-breadcrumbs a{color:var(--dim);text-decoration:none}
.guide-breadcrumbs a:hover{color:var(--txt)}

/* ---------- Hero ---------- */
.guide-hero{border:1px solid var(--line);border-radius:14px;background:var(--panel);
  padding:18px;box-shadow:var(--shadow)}
.guide-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--dim);margin-bottom:10px}
.guide-hero h1{font-family:'Syne','Manrope',sans-serif;font-variant-numeric:lining-nums tabular-nums;
  font-size:clamp(24px,3vw,35px);line-height:1.15;margin:0 0 10px;color:var(--txt);font-weight:800}
.guide-sub{margin:0;color:var(--mut);line-height:1.55;max-width:72ch;font-size:14px}

/* ---------- Кнопки ---------- */
.guide-cta-row{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.guide-btn{border:1px solid var(--line);border-radius:10px;padding:9px 14px;
  text-decoration:none;font-size:12px;font-weight:600;color:var(--mut);background:var(--panel-2)}
.guide-btn:hover{color:var(--txt);border-color:var(--me-line)}
.guide-btn.primary{background:var(--me);border-color:transparent;color:#fff}
.guide-btn.primary:hover{color:#fff}

/* ---------- Секции гайда ---------- */
.guide-sections{display:grid;gap:12px;margin-top:14px}
.guide-section{border:1px solid var(--line);border-radius:12px;background:var(--panel);
  padding:14px;scroll-margin-top:80px}
.guide-section h2{font-family:'Syne','Manrope',sans-serif;font-variant-numeric:lining-nums tabular-nums;
  margin:0 0 8px;font-size:20px;font-weight:700;color:var(--txt)}
.guide-section h3{font-family:'Manrope',sans-serif;margin:14px 0 6px;font-size:14.5px;
  font-weight:700;color:var(--txt)}
.guide-section p{margin:0 0 10px;color:var(--mut);line-height:1.6}
.guide-section p:last-child{margin-bottom:0}
.guide-section a{color:var(--me);text-decoration:none;border-bottom:1px solid var(--me-line)}
.guide-section a:hover{border-bottom-color:var(--me)}
.guide-section strong{color:var(--txt);font-weight:700}

/* ---------- Списки ---------- */
.guide-list{margin:0;padding-left:24px;margin-left:2px;color:var(--txt)}
.guide-list li{margin:7px 0;line-height:1.55}

/* ---------- Заметки и врезки ---------- */
.guide-note{border-left:3px solid var(--me);background:var(--me-soft);border-radius:8px;
  padding:10px 12px;color:var(--txt);font-size:13px}
.guide-note a{color:var(--me);font-weight:700;text-decoration:none;border-bottom:1px solid var(--me-line)}

.guide-callout{margin-top:10px;border-left:3px solid #2b8a6e;border-radius:10px;
  background:rgba(43,138,110,.10);padding:12px}
.guide-callout--insight{border-left-color:#c47a1c;background:rgba(196,122,28,.12)}
.guide-callout h3{margin:0 0 8px;font-family:'Manrope',sans-serif;font-size:13px;color:var(--txt);font-weight:700}
.guide-callout p{margin:0;color:var(--mut);font-size:13px;line-height:1.55}
.guide-callout strong{color:var(--txt)}