/* ==========================================================================
   Текстовые страницы под редактор WordPress.

   ВАЖНО: это файл ТЕМЫ, в вёрстке его нет. Остальные css/*.css — точные копии
   вёрстки и перезаписываются при её обновлении, поэтому правила для the_content()
   держим здесь, а не в css/legal.css.

   Зачем: в макете разметка размечена классами (.doc__block, .doc__list,
   .doc__intro…), а редактор WordPress выдаёт «голые» теги — h2, h3, p, ul.
   Ниже те же самые значения из legal.css, но привязанные к тегам.
   Дополняет css/legal.css.
   ========================================================================== */

.doc__content > *:first-child { margin-top: 0; }

/* h2 = .doc__section-title (раздел документа) */
.doc__content h2 {
  margin-top: 56px;
  font-size: clamp(20px, 1.25vw, 24px);
  line-height: 1.35;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--ink);
}

/* h3 = заголовок блока; отступ 32px — это отступ самого .doc__block */
.doc__content h3 {
  margin-top: 32px;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 500;
  color: var(--ink-soft);
}

/* p = .doc__block p */
.doc__content p {
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.65;
  color: var(--grey-27);
}
.doc__content p + p { margin-top: 10px; }
.doc__content h3 + p { margin-top: 12px; }

/* ul = .doc__list: маркеров нет, пункты в макете начинаются с тире */
.doc__content ul {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-left: 0;
  list-style: none;
}
.doc__content ul li {
  font-size: 16px;
  line-height: 1.65;
  color: var(--grey-27);
}

.doc__content a { color: inherit; }
.doc__content a:hover { color: var(--blue); }

/* --------------------------------------------------------------------------
   Подстраховка: в макете этих элементов нет, но клиент может добавить их
   в редакторе. Без правил они выпали бы из оформления страницы.
   -------------------------------------------------------------------------- */
.doc__content h4 {
  margin-top: 32px;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 500;
  color: var(--ink-soft);
}
.doc__content ol {
  margin-top: 12px;
  padding-left: 22px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.doc__content ol li {
  font-size: 16px;
  line-height: 1.65;
  color: var(--grey-27);
}
.doc__content strong,
.doc__content b { font-weight: 500; color: var(--ink-soft); }
.doc__content img { max-width: 100%; height: auto; margin-top: 24px; }
.doc__content blockquote {
  margin-top: 24px;
  padding-left: 20px;
  border-left: 3px solid var(--blue);
}

/* --------------------------------------------------------------------------
   Первые абзацы страницы читаются по-разному, поэтому у обеих страниц свой
   модификатор. Всё, что идёт дальше, одинаково.
   -------------------------------------------------------------------------- */

/* «Политика конфиденциальности»: вводные абзацы (.doc__intro) */
.doc__content--policy > p:first-child { margin-top: 28px; }
.doc__content--policy > p:first-child + p { margin-top: 12px; }

/* «Правовая информация»: подпись издателя (.doc__meta-title) и адрес (.doc__address) */
.doc__content--legal > p:first-child {
  margin-top: 40px;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 500;
  color: var(--ink-soft);
}
.doc__content--legal > p:first-child + p {
  margin-top: 16px;
  max-width: 784px;
  font-size: 16px;
  line-height: 1.8;
  color: var(--grey-27);
}

/* ==========================================================================
   Адаптив — те же контрольные точки, что и в legal.css
   ========================================================================== */
@media (max-width: 1199px) {
  .doc__content h2 { margin-top: 44px; }
}

@media (max-width: 640px) {
  .doc__content h2 { margin-top: 32px; font-size: 18px; }
  .doc__content h3,
  .doc__content h4 { margin-top: 24px; font-size: 16px; }
  .doc__content p,
  .doc__content ul li,
  .doc__content ol li { font-size: 14px; }

  .doc__content--legal > p:first-child { margin-top: 24px; }
  .doc__content--legal > p:first-child + p { font-size: 14px; line-height: 1.7; }
}
