/* Оформление контента из ТутКонтроль под дизайн-систему fngn.
   Ссылается на переменные сайта (--paper/--gray-500/--accent/...),
   поэтому автоматически совместимо с тёмной/светлой темой. */

.dc-body {
  font-family: var(--font-body);
  color: var(--gray-500);
  font-size: 17px;
  line-height: 1.7;
}
.dc-body > * + * { margin-top: 1.25em; }

.dc-body p { color: var(--gray-500); }
.dc-body strong, .dc-body b { color: var(--paper); font-weight: 600; }
.dc-body em, .dc-body i { font-style: italic; }
.dc-body a { color: var(--accent); text-decoration: none; }
.dc-body a:hover { text-decoration: underline; text-underline-offset: 4px; }

.dc-body h2 {
  font-family: var(--font-display);
  color: var(--paper);
  font-size: var(--fs-h3);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-top: 1.8em;
}
.dc-body h3 {
  font-family: var(--font-display);
  color: var(--paper);
  font-size: 19px;
  font-weight: 500;
  margin-top: 1.6em;
}

.dc-body ul, .dc-body ol { padding-left: 1.4em; }
.dc-body ul li { list-style: disc; margin-top: 0.5em; }
.dc-body ol li { list-style: decimal; margin-top: 0.5em; }

.dc-body blockquote,
.dc-quote {
  border-left: 2px solid var(--accent);
  padding-left: 1.25em;
  margin-left: 0;
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 1.5;
}
.dc-quote cite {
  display: block;
  margin-top: 0.5em;
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--ls-mono);
  text-transform: uppercase;
  color: var(--gray-600);
  font-style: normal;
}

.dc-image, .dc-cover, .dc-gallery { margin: 1.5em 0; }
/* Обложка статьи (LCP): резервируем место, чтобы не было CLS при загрузке с внешнего домена */
.dc-cover { aspect-ratio: 16 / 9; overflow: hidden; background: var(--graphite-2); }
.dc-cover img { width: 100%; height: 100%; object-fit: cover; }
.dc-image img, .dc-cover img, .dc-gallery img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--hairline);
  border-radius: 6px;
}
.dc-image figcaption, .dc-cover figcaption {
  margin-top: 0.6em;
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--ls-mono);
  text-transform: uppercase;
  color: var(--gray-600);
}
.dc-gallery { display: grid; gap: 12px; grid-template-columns: repeat(2, 1fr); }

.dc-faq { margin-top: 2em; border-top: 1px solid var(--hairline); padding-top: 0.5em; }
.dc-faq dt { font-family: var(--font-display); color: var(--paper); font-weight: 500; font-size: 18px; margin-top: 1.5em; }
.dc-faq dd { margin: 0.5em 0 0; color: var(--gray-500); }

.dc-links li { list-style: none; margin-top: 0.5em; }
.dc-disclaimer {
  border: 1px solid var(--hairline);
  background: var(--graphite);
  padding: 1em 1.25em;
  border-radius: 6px;
  color: var(--gray-500);
  font-size: 15px;
}
.dc-references li { list-style: decimal; margin-top: 0.4em; color: var(--gray-600); font-size: 15px; }
.dc-cta a { color: var(--accent); font-family: var(--font-display); font-weight: 500; }

/* Кнопка «назад» над статьёй */
.dc-back {
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--ls-mono);
  text-transform: uppercase;
}
.dc-back a { color: var(--gray-600); text-decoration: none; }
.dc-back a:hover { color: var(--accent); }

/* Обложка в карточке списка (aspect-ratio недоступен утилитами сайта) */
.dc-card-cover {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--graphite-2);
}
.dc-card-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}
.group:hover .dc-card-cover img { transform: scale(1.03); }