/* ============================================================
   news.css — раздел «Новости» (SSR, api/news.js)
   Подключается отдельным файлом, как seo-landing.css: страницы
   раздела рендерит сервер, в app.bundle.min.css их стили не нужны.
   Токены берём из _tokens.css (он внутри app.bundle.min.css).
   ============================================================ */

/* ---------- Шапка ---------- */
.nw-header {
  position: fixed; top: 0; width: 100%; z-index: 100;
  background: rgba(244, 246, 238, 0.92);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: var(--bar) solid var(--rule-soft);
  padding: 14px 0;
}
.nw-header__in { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.nw-brand {
  display: flex; align-items: center; gap: 8px;
  font-size: 20px; font-weight: 800; letter-spacing: -0.03em; text-decoration: none; flex: none;
}
.nw-brand img { display: block; flex: none; }
.nw-brand__a { color: var(--accent-deep); }
.nw-brand__b { color: var(--accent); }
.nw-nav { display: flex; align-items: center; gap: 22px; font-size: var(--fs-sm); }
.nw-nav a { color: var(--ink-2); text-decoration: none; white-space: nowrap; }
.nw-nav a:hover { color: var(--accent); }

.nw-main { padding-top: 76px; }
.nw-wrap { padding-top: 32px; padding-bottom: 72px; }

/* ---------- Крошки ---------- */
.nw-crumbs { font-size: var(--fs-xs); color: var(--muted); margin-bottom: 24px; }
.nw-crumbs a { color: var(--accent); text-decoration: none; }
.nw-crumbs a:hover { text-decoration: underline; }

/* ---------- Лид раздела ---------- */
.nw-lead { max-width: 760px; margin-bottom: 40px; }
.nw-lead h1 {
  font-size: var(--fs-3xl); line-height: 1.08; letter-spacing: -0.03em;
  margin: 12px 0 16px; color: var(--ink);
}
.nw-lead__sub { font-size: var(--fs-lg); line-height: 1.55; color: var(--ink-2); margin: 0; }

/* ---------- Рубрики ---------- */
.nw-cats { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 40px; }
.nw-cats a {
  font-size: var(--fs-sm); text-decoration: none; color: var(--accent-deep);
  border: 1px solid var(--rule-soft); border-radius: 999px;
  padding: 7px 16px; background: #fff; transition: background .15s, border-color .15s;
}
.nw-cats a:hover { background: var(--accent-tint-2); border-color: var(--accent-soft); }
.nw-cats a.is-on { background: var(--accent-deep); color: #fff; border-color: var(--accent-deep); }

/* ---------- Сетка карточек ---------- */
.nw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 28px; }
.nw-card {
  border-top: var(--bar) solid var(--rule); padding-top: 18px;
  display: flex; flex-direction: column;
}
.nw-card__meta {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: var(--fs-2xs); letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 10px;
}
.nw-card__meta a { color: var(--muted); text-decoration: none; }
.nw-card__meta a:hover { color: var(--accent); }
.nw-card__title { font-size: var(--fs-xl); line-height: 1.22; letter-spacing: -0.02em; margin: 0 0 10px; }
.nw-card__title a { color: var(--ink); text-decoration: none; }
.nw-card__title a:hover { color: var(--accent); }
.nw-card__ex { font-size: var(--fs-sm); line-height: 1.6; color: var(--muted); margin: 0 0 14px; flex: 1; }
.nw-card__more { font-size: var(--fs-sm); font-weight: 600; color: var(--accent); text-decoration: none; }
.nw-card__more:hover { text-decoration: underline; }

/* ---------- Статья ---------- */
.nw-wrap--article { max-width: 1080px; }
.nw-article { max-width: 720px; }
.nw-article__head { margin-bottom: 36px; }
.nw-article__head h1 {
  font-size: clamp(30px, 4.4vw, 50px); line-height: 1.1; letter-spacing: -0.03em;
  margin: 14px 0 16px; color: var(--ink);
}
.nw-article__meta {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: var(--fs-2xs); letter-spacing: .08em; text-transform: uppercase;
  color: var(--muted); padding-bottom: 20px; border-bottom: var(--bar) solid var(--rule-soft);
}
.nw-article__lead {
  font-size: var(--fs-lg); line-height: 1.6; color: var(--ink-2);
  margin: 24px 0 0; font-weight: 500;
}

.nw-article__body { font-size: var(--fs-md); line-height: 1.72; color: var(--ink-2); }
.nw-article__body h2 {
  font-size: var(--fs-2xl); line-height: 1.18; letter-spacing: -0.02em;
  color: var(--ink); margin: 44px 0 16px; scroll-margin-top: 90px;
}
.nw-article__body h3 {
  font-size: var(--fs-lg); line-height: 1.3; color: var(--ink); margin: 30px 0 12px; font-weight: 700;
}
.nw-article__body p { margin: 0 0 18px; }
.nw-article__body a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.nw-article__body ul, .nw-article__body ol { margin: 0 0 20px; padding-left: 22px; }
.nw-article__body li { margin-bottom: 9px; }
.nw-article__body strong { color: var(--ink); font-weight: 650; }

/* Врезка */
.nw-note {
  background: var(--accent-tint-2); border-left: 3px solid var(--accent);
  padding: 16px 20px; margin: 0 0 22px; font-size: var(--fs-sm); line-height: 1.65; color: var(--ink-2);
}
.nw-note a { color: var(--accent-deep); }

/* Таблицы — на мобильных скроллятся внутри своего контейнера,
   страница по горизонтали не едет */
.nw-tablewrap { overflow-x: auto; margin: 0 0 8px; -webkit-overflow-scrolling: touch; }
.nw-table { border-collapse: collapse; width: 100%; min-width: 420px; font-size: var(--fs-sm); }
.nw-table th, .nw-table td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--rule-soft); vertical-align: top; }
.nw-table th {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: var(--fs-2xs); letter-spacing: .06em; text-transform: uppercase;
  color: var(--muted); border-bottom: var(--bar) solid var(--rule); font-weight: 500; white-space: nowrap;
}
.nw-table tbody tr:hover { background: var(--accent-tint-2); }
.nw-tablecap { font-size: var(--fs-xs); color: var(--muted); margin: 0 0 24px; }

/* ---------- FAQ и источники ---------- */
.nw-faq, .nw-sources { max-width: 720px; margin-top: 48px; }
.nw-faq h2, .nw-sources h2 {
  font-size: var(--fs-2xl); letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 20px; scroll-margin-top: 90px;
}
.nw-faq .seo-faq-item { border-top: 1px solid var(--rule-soft); }
.nw-sources ul { padding-left: 20px; font-size: var(--fs-sm); line-height: 1.7; color: var(--muted); }
.nw-sources a { color: var(--accent); }

/* ---------- CTA-полоса. Намеренно div, не заголовок:
     заголовочный CTA рвёт иерархию H1→H2→H3 ---------- */
.nw-band {
  background: var(--accent-deep); color: #fff; padding: 36px 32px; margin: 56px 0 0; max-width: 720px;
}
.nw-band__t { font-size: var(--fs-xl); font-weight: 700; letter-spacing: -0.02em; margin-bottom: 10px; }
.nw-band p { font-size: var(--fs-sm); line-height: 1.6; color: rgba(255, 255, 255, 0.82); margin: 0 0 20px; }
.nw-band__cta {
  display: inline-block; background: #fff; color: var(--accent-deep);
  font-weight: 650; font-size: var(--fs-sm); padding: 13px 26px; text-decoration: none;
}
.nw-band__cta:hover { background: var(--accent-tint); }

/* ---------- Похожие ---------- */
.nw-related { margin-top: 64px; }
.nw-related h2 {
  font-size: var(--fs-2xl); letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 24px; padding-top: 28px; border-top: var(--bar) solid var(--rule);
}

/* ---------- Футер ---------- */
.nw-footer { border-top: var(--bar) solid var(--rule); padding: 48px 0 32px; background: var(--paper-2); }
.nw-footer__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 28px; }
.nw-footer__cols > div { display: flex; flex-direction: column; gap: 9px; }
.nw-footer__h {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: var(--fs-2xs); letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); margin-bottom: 4px;
}
.nw-footer__cols a { font-size: var(--fs-sm); color: var(--ink-2); text-decoration: none; }
.nw-footer__cols a:hover { color: var(--accent); text-decoration: underline; }
.nw-footer__legal {
  font-size: var(--fs-xs); color: var(--muted);
  margin: 36px 0 0; padding-top: 20px; border-top: 1px solid var(--rule-soft);
}
.nw-footer__legal a { color: var(--accent); text-decoration: none; }

/* ---------- Карта сайта ---------- */
.nw-map__sec { margin-bottom: 48px; }
.nw-map__sec h2 {
  font-size: var(--fs-xl); letter-spacing: -0.02em; color: var(--ink);
  margin: 0 0 6px; padding-top: 22px; border-top: var(--bar) solid var(--rule);
}
.nw-map__hint { font-size: var(--fs-sm); color: var(--muted); margin: 0 0 18px; }
.nw-map__links { columns: 3 240px; column-gap: 32px; }
.nw-map__links a {
  display: block; font-size: var(--fs-sm); line-height: 1.55; color: var(--ink-2);
  text-decoration: none; margin-bottom: 7px; break-inside: avoid;
}
.nw-map__links a:hover { color: var(--accent); text-decoration: underline; }
.nw-map__co { font-size: var(--fs-xs); color: var(--muted); }

@media (max-width: 640px) {
  .nw-nav { gap: 14px; font-size: var(--fs-xs); }
  .nw-nav a:not(.btn-ghost) { display: none; }
  .nw-grid { grid-template-columns: 1fr; gap: 24px; }
  .nw-band { padding: 28px 22px; }
  .nw-map__links { columns: 1; }
}