/* Страницы новостей и статей. Опирается на style.css лендинга:
   переменные, шапка, подвал и кнопки берутся оттуда. */
.c-wrap { padding: 2rem 0 4rem; max-width: 46rem; }
.crumbs { font-size: .85rem; color: var(--muted); margin-bottom: 1.5rem; }
.crumbs a { color: var(--muted); text-decoration: none; }
.crumbs a:hover { color: var(--violet-deep); }
.crumbs span { margin: 0 .4rem; }
.crumbs .here { display: none; }
.post h1 { font-size: 2rem; line-height: 1.2; margin: 0 0 .8rem; }
.post .meta { display: flex; gap: .6rem; align-items: center;
  flex-wrap: wrap; font-size: .85rem; color: var(--muted); margin-bottom: 1.4rem; }
.post .tag { background: rgba(120,120,240,.1); color: var(--violet-deep);
  padding: .2rem .6rem; border-radius: 999px; text-decoration: none; }
.post .lead { font-size: 1.15rem; line-height: 1.55; font-weight: 500;
  margin: 0 0 1.6rem; }
.post .text { font-size: 1rem; line-height: 1.7; }
.post .text h2 { font-size: 1.3rem; margin: 2rem 0 .6rem; }
.post .text h3 { font-size: 1.1rem; margin: 1.6rem 0 .5rem; }
.post .text ul, .post .text ol { padding-left: 1.2rem; }
.post .text li { margin: .3rem 0; }
.post .text table { width: 100%; border-collapse: collapse; margin: 1.2rem 0;
  font-size: .95rem; }
.post .text th, .post .text td { border: 1px solid rgba(0,0,0,.1);
  padding: .5rem .7rem; text-align: left; }
.sources { margin-top: 2.5rem; padding-top: 1.2rem;
  border-top: 1px solid rgba(0,0,0,.08); font-size: .9rem; }
.sources h2 { font-size: 1rem; margin: 0 0 .5rem; }
.sources ul { padding-left: 1.1rem; margin: 0; }
.promo { margin: 3rem 0; padding: 1.6rem; border-radius: 16px;
  background: linear-gradient(135deg, rgba(120,120,240,.09),
  rgba(120,120,240,.03)); }
.promo h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
/* Второй блок — про телеграм. Цвет свой, чтобы два призыва подряд не
   слились в один и читатель видел, что предложения разные. */
.promo-tg { background: linear-gradient(135deg, rgba(42,171,238,.12),
  rgba(42,171,238,.04)); margin-top: -1.4rem; }
.btn-tg { background: #2aabee; }
.btn-tg:hover { background: #1f96d4; }
.promo p { margin: 0 0 1rem; font-size: .95rem; line-height: 1.6; }
/* Кнопка со значком: выравниваем по средней линии текста, а не по низу. */
.promo .btn { display: inline-flex; align-items: center; gap: .5rem; }
.ico { width: 1.05em; height: 1.05em; fill: currentColor; flex: none; }
.rel { margin: 2.5rem 0; }
.rel h2 { font-size: 1.1rem; margin: 0 0 .8rem; }
.cards { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.cards a { display: block; padding: .8rem 1rem; border-radius: 12px;
  background: rgba(0,0,0,.02); text-decoration: none; color: inherit;
  font-size: .95rem; line-height: 1.4; }
.cards a:hover { background: rgba(120,120,240,.07); }
.cards .k { display: block; font-size: .75rem; color: var(--muted);
  margin-bottom: .2rem; }
.cards.flat { grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); }
.cards.flat .n { color: var(--muted); font-size: .8rem; }
.feed { list-style: none; padding: 0; margin: 2rem 0; display: grid;
  gap: 1.4rem; }
.feed a { text-decoration: none; color: inherit; display: block; }
.feed time { font-size: .8rem; color: var(--muted); }
.feed h2 { font-size: 1.15rem; margin: .2rem 0 .3rem; line-height: 1.35; }
.feed a:hover h2 { color: var(--violet-deep); }
.feed p { margin: 0; font-size: .95rem; color: var(--muted); line-height: 1.5; }
.pager { display: flex; gap: .4rem; margin: 2rem 0; }
.pager a, .pager span { padding: .4rem .8rem; border-radius: 8px;
  text-decoration: none; font-size: .9rem; background: rgba(0,0,0,.03);
  color: inherit; }
.pager .on { background: var(--violet); color: #fff; }
.empty { color: var(--muted); }
nav.main a.on { color: var(--violet-deep); }
@media (max-width: 640px) {
  .post h1 { font-size: 1.5rem; }
  .c-wrap { padding: 1.2rem 0 3rem; }
}