/* Текстовые страницы: «О сайте», «Политика конфиденциальности» и любая другая
   страница WordPress, кроме главной и страниц-заглушек разделов.
   Макет: Claude Design, проект «Редизайн промокодной страницы», артборды p2 и p3
   (десктоп), их мобильные варианты в p5 и тёмные в d-экране.

   Подключается ПОСЛЕ fh-ui.css и работает на его токенах --fh-*, поэтому
   тёмная тема получается сама. Два токена макета в общей палитре отсутствуют
   и объявлены здесь локально:
     --fh-text-body   — цвет основного текста (в макете rgba .78, не сплошной ink);
     --fh-text-accent — цвет ссылок и точек списка. В тёмной теме макет берёт
                        #A98BFF вместо #6C3BFF: фиолетовый на почти чёрном фоне
                        не читается. Глобальный --fh-violet при этом НЕ трогаем —
                        он завязан на кнопки и карточки всего сайта. */

.fh-text{
  --fh-text-body:rgba(10,10,10,.78);
  --fh-text-accent:var(--fh-violet);
}
[data-theme="dark"] .fh-text{
  --fh-text-body:rgba(255,255,255,.78);
  --fh-text-accent:#A98BFF;
}

/* ⚠️ Фон тянется на всю ширину, а не по контейнеру 1320 px, как остальные
   блоки сайта. Причина: в тёмной теме body заливается #121212 (--bg-page старой
   палитры), а страница — #16161C (--fh-paper из макета). Оттенки разные, и
   контейнер с фоном рисовал по краям экрана заметную полосу, которой нет ни
   на главной, ни в «Гиде» — они фона не задают вовсе. Ограничивать здесь
   нечего: колонка текста и так 760 px по центру. */
.fh-textpage{background:var(--fh-paper)}
.fh-text{max-width:760px;margin:0 auto;padding:48px 32px 56px;box-sizing:border-box}

/* ── заголовки ───────────────────────────────────────── */
.fh-text .fh-text-title{
  margin:0;
  font:900 46px/1.05 'Unbounded',system-ui,sans-serif;
  letter-spacing:-.035em;color:var(--fh-ink);text-wrap:balance;
}
.fh-text h2{
  margin:38px 0 14px;
  font:800 24px/1.2 'Unbounded',system-ui,sans-serif;
  letter-spacing:-.03em;color:var(--fh-ink);
}
.fh-text h3{
  margin:28px 0 12px;
  font:800 19px/1.25 'Unbounded',system-ui,sans-serif;
  letter-spacing:-.02em;color:var(--fh-ink);
}

/* ── текст ───────────────────────────────────────────── */
.fh-text p{
  margin:0 0 14px;
  font:400 17px/1.65 'Onest',system-ui,sans-serif;
  color:var(--fh-text-body);
}
.fh-text a{color:var(--fh-text-accent);font-weight:700;text-decoration:none}
.fh-text a:hover{text-decoration:underline}
.fh-text strong{color:var(--fh-ink)}

/* Лид под заголовком — лаймовая плашка. В тёмной теме макет оставляет её
   как есть: правило «лаймовые блоки не меняются», поэтому рамка и текст
   тут заданы константами, а не токенами. */
.fh-text .fh-lede{
  margin:18px 0 0;padding:20px 22px;
  border:2px solid #0A0A0A;border-radius:16px;
  background:var(--fh-acid);color:#0A0A0A;
  font:600 16px/1.5 'Onest',system-ui,sans-serif;
}
.fh-text .fh-lede a{color:#0A0A0A;text-decoration:underline}

/* Строка «Дата обновления» */
.fh-text .fh-text-meta{
  margin:14px 0 0;
  font:600 14px/1 'Onest',system-ui,sans-serif;
  color:var(--fh-muted);
}
.fh-text .fh-text-meta + p{margin-top:18px}

/* ── списки: точка цвета акцента, как в «Гиде» ───────── */
.fh-text ul{list-style:none;margin:0 0 14px;padding:0}
.fh-text ul li{
  position:relative;padding-left:26px;margin:0 0 10px;
  font:400 16.5px/1.6 'Onest',system-ui,sans-serif;
  color:var(--fh-text-body);
}
.fh-text ul li::before{
  content:'';position:absolute;left:4px;top:.6em;
  width:7px;height:7px;border-radius:999px;background:var(--fh-text-accent);
}
.fh-text ol{margin:0 0 14px;padding-left:22px}
.fh-text ol li{
  margin:0 0 10px;
  font:400 16.5px/1.6 'Onest',system-ui,sans-serif;
  color:var(--fh-text-body);
}

/* ── врезка: blockquote редактора ────────────────────────
   Первый абзац внутри — заголовок врезки («Важно», «Изменения политики»).
   Так владелица делает врезку обычной кнопкой «Цитата» в редакторе,
   без ручной вёрстки. */
.fh-text blockquote{
  margin:28px 0 0;padding:22px 24px;
  border:2px solid var(--fh-ink);border-radius:18px;
  background:var(--fh-bg);
}
.fh-text blockquote > p{
  margin:0 0 10px;
  font:400 16px/1.6 'Onest',system-ui,sans-serif;
  color:var(--fh-text-body);
}
.fh-text blockquote > p:first-child{
  font:800 17px/1.2 'Onest',system-ui,sans-serif;
  color:var(--fh-ink);
}
.fh-text blockquote > p:last-child{margin-bottom:0}

/* ── строка «Связаться» ──────────────────────────────── */
.fh-text .fh-text-contact{
  margin:26px 0 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  font:600 16px/1 'Onest',system-ui,sans-serif;color:var(--fh-muted);
}
.fh-text .fh-text-contact a{font:700 16px/1 'Onest',system-ui,sans-serif}

/* ── телефон (макет 390 px) ──────────────────────────── */
@media (max-width:700px){
  .fh-text{padding:24px 18px 20px}
  .fh-text .fh-text-title{font-size:30px;line-height:1.06}
  .fh-text h2{margin:26px 0 12px;font-size:20px}
  .fh-text h3{margin:22px 0 10px;font-size:17px}
  .fh-text p{margin-bottom:13px;font-size:15.5px;line-height:1.68}
  .fh-text .fh-lede{margin-top:16px;padding:16px 18px;border-radius:14px;font-size:15px}
  .fh-text .fh-text-meta{margin-top:12px;font-size:13px}
  .fh-text .fh-text-meta + p{margin-top:16px}
  .fh-text ul li,
  .fh-text ol li{margin-bottom:9px;font-size:14.5px}
  .fh-text ul li{padding-left:22px}
  .fh-text ul li::before{width:6px;height:6px;left:3px}
  .fh-text blockquote{margin-top:22px;padding:18px;border-radius:14px}
  .fh-text blockquote > p{font-size:14.5px;margin-bottom:9px}
  .fh-text blockquote > p:first-child{font-size:15px}
  .fh-text .fh-text-contact{
    margin-top:20px;flex-direction:column;align-items:flex-start;gap:7px;
    font-size:14.5px;
  }
  .fh-text .fh-text-contact a{font-size:15.5px}
}