/* ==========================================================================
   vkotlov3 — обновлённые шапка и подвал.
   Подключается последним, поэтому перебивает vkotlov.css и ace.css.
   Прежние правила написаны через !important, отсюда !important и здесь —
   иначе перебить их нечем.

   Цвет-акцент один, в переменной --vk-gold: если не понравится, меняется
   в одном месте.
   ========================================================================== */

:root{
  --vk-ink:#1B1F24;
  --vk-ink-2:#14181C;
  --vk-gold:#C9A961;
  --vk-line:rgba(255,255,255,.13);
  --vk-muted:rgba(255,255,255,.62);
  /* Высота шапки. Она закреплена сверху, от этого значения считается
     отступ внутренних страниц — держать в согласии с вёрсткой ниже. */
  --vk-head-h:101px;
}

/* ---------- Шапка ---------- */
header.vk-head{
  position:fixed;top:0;left:0;right:0;width:100%;
  /* Флекс не ради раскладки: в нём игнорируются текстовые узлы из
     пробелов между блоками, иначе они дают лишнюю строку в 15 пикселей
     и шапка оказывается выше, чем считает --vk-head-h. */
  display:flex;flex-direction:column;
  z-index:1000;
  background:transparent !important;
  box-shadow:0 1px 0 var(--vk-line);
  text-align:left;
  font-family:-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
.vk-head__wrap{
  max-width:1200px;margin:0 auto;padding:0 24px;
  display:flex;align-items:center;gap:20px;
}

/* Служебная полоса */
.vk-head__top{
  background:var(--vk-ink-2);
  border-bottom:1px solid var(--vk-line);
}
.vk-head__top .vk-head__wrap{height:36px;justify-content:space-between}
.vk-head__contacts{display:flex;align-items:center;gap:22px;min-width:0}
.vk-head__contact{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13px;color:var(--vk-muted) !important;text-decoration:none;white-space:nowrap;
  transition:color .16s;
}
.vk-head__contact i{color:var(--vk-gold);font-size:12px}
.vk-head__contact:hover{color:#fff !important}

.vk-head__lang{display:flex;align-items:center;gap:10px}
.vk-head__lang a{
  font-size:12px;font-weight:700;letter-spacing:.08em;
  color:var(--vk-muted) !important;text-decoration:none;padding:2px 0;
  border-bottom:1px solid transparent;transition:color .16s,border-color .16s;
}
.vk-head__lang a:hover{color:#fff !important}
.vk-head__lang a.is-active{color:var(--vk-gold) !important;border-color:var(--vk-gold)}
.vk-head__lang-sep{width:1px;height:12px;background:var(--vk-line)}

/* Основная полоса */
.vk-head__main{
  background:rgba(27,31,36,.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}
.vk-head__main .vk-head__wrap{height:64px;justify-content:space-between}

.vk-head__brand{
  display:inline-flex;align-items:center;gap:12px;
  color:#fff !important;text-decoration:none;flex:0 0 auto;
}
.vk-head__mark{color:var(--vk-gold);font-size:22px;line-height:1}
.vk-head__name{display:flex;flex-direction:column;line-height:1.15}
.vk-head__name-pre{
  font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--vk-gold);
}
.vk-head__name-full,.vk-head__name-short{
  font-size:19px;font-weight:600;letter-spacing:.01em;color:#fff;white-space:nowrap;
}
.vk-head__name-short{display:none}

/* ---------- Меню ---------- */
/* Разметка меню прежняя, aceMenu сам управляет бургером на 768px —
   раскладку во флекс включаем только выше этой границы, иначе сломается
   его slideToggle. */
.vk-head__nav{min-width:0}
.vk-head nav.ace-responsive{width:auto !important;background:none !important}

.vk-head .ace-responsive-menu > li > a{
  font-family:inherit !important;
  font-size:14px !important;font-weight:500 !important;
  letter-spacing:.02em;
  color:rgba(255,255,255,.86) !important;
  padding:10px 14px !important;
  border-radius:8px;
  transition:color .16s,background .16s;
}
.vk-head .ace-responsive-menu > li > a:hover{
  font-size:14px !important;padding:10px 14px !important;
  color:#fff !important;background:rgba(255,255,255,.08) !important;
}
.vk-head .ace-responsive-menu > li.menu-active > a{
  color:var(--vk-gold) !important;background:rgba(201,169,97,.12) !important;
}

/* Выпадающие списки */
.vk-head .ace-responsive-menu li ul.sub-menu{
  background:#20252B !important;
  border:1px solid var(--vk-line);border-radius:10px;
  padding:6px !important;margin-top:6px !important;
  box-shadow:0 14px 34px rgba(0,0,0,.35);
  min-width:270px;
}
/* Между пунктом и выпавшим списком 6 пикселей пустоты: курсор проходил
   по ней, пункт переставал считаться наведённым и список закрывался
   раньше, чем до него доводили мышь. Перекрываем зазор невидимой
   полосой — она часть самого списка, поэтому наведение не теряется. */
.vk-head .ace-responsive-menu li ul.sub-menu::before{
  content:'';position:absolute;left:0;right:0;top:-10px;height:10px;
}
.vk-head .ace-responsive-menu li ul.sub-menu li a{
  font-family:inherit !important;
  font-size:13.5px !important;line-height:1.35 !important;
  color:rgba(255,255,255,.82) !important;
  background:transparent !important;
  padding:9px 12px !important;border-radius:7px;
}
.vk-head .ace-responsive-menu li ul.sub-menu li a:hover{
  color:#fff !important;background:rgba(255,255,255,.09) !important;
}

/* Бургер */
.vk-head .menu-toggle{float:none;margin-left:auto}
.vk-head .menu-toggle #menu-btn,
.vk-head .menu-toggle #menu-btn2{margin:0 !important;padding:6px !important}
.vk-head .menu-toggle .icon-bar{background:#fff}

@media screen and (min-width:769px){
  .vk-head .ace-responsive-menu{
    display:flex !important;align-items:center;gap:2px;
    background:none !important;
  }
  .vk-head .ace-responsive-menu > li{float:none}
}

/* ---------- Отступ содержимого под закреплённой шапкой ---------- */
/* Раньше было margin-top:9rem под шапку в 132px. Держим в согласии
   с новой высотой, иначе заголовок страницы уезжает под меню. */
.second_page{margin-top:calc(var(--vk-head-h) + 26px) !important}

/* vkotlov.css задаёт шапке min-height:7rem на экранах до 800px — это
   лишние 15 пикселей поверх её содержимого, из-за них отступ внутренних
   страниц переставал сходиться с --vk-head-h. */
@media screen and (max-width:800px){
  header.vk-head{min-height:0 !important}
}

@media screen and (max-width:768px){
  :root{--vk-head-h:97px}
  .vk-head__wrap{padding:0 16px;gap:12px}
  .vk-head__top .vk-head__wrap{height:34px}
  .vk-head__main .vk-head__wrap{height:62px}
  .vk-head__contact--mail{display:none}
  .vk-head__name-full{display:none}
  .vk-head__name-short{display:inline}
  .vk-head__name-full,.vk-head__name-short{font-size:17px}

  .vk-head__main{position:relative}
  /* vkotlov.css объявляет nav.ace-responsive относительным, и выпавшее
     меню считает ширину от него — от узкой колонки с бургером. Убираем
     эту точку отсчёта, чтобы панель растянулась по ширине шапки. */
  .vk-head nav.ace-responsive{position:static !important}

  /* Выпавшее меню — отдельной панелью во всю ширину под шапкой */
  .vk-head .ace-responsive-menu{
    position:absolute;left:0;right:0;top:100%;
    width:auto !important;float:none !important;
    background:#20252B !important;
    border-top:1px solid var(--vk-line);
    padding:6px 10px 10px !important;margin:0 !important;
    box-shadow:0 18px 34px rgba(0,0,0,.4);
    max-height:calc(100vh - var(--vk-head-h));overflow-y:auto;
  }
  .vk-head .ace-responsive-menu > li{
    float:none !important;width:100%;
    border-bottom:1px solid var(--vk-line) !important;border-top:0 !important;
  }
  .vk-head .ace-responsive-menu > li:last-child{border-bottom:0 !important}
  .vk-head .ace-responsive-menu > li > a{
    display:block;padding:13px 8px !important;font-size:15px !important;border-radius:0;
  }
  /* ace.css на узких экранах красит наведение в белый — с белым текстом
     пункт становится нечитаемым. */
  .vk-head .ace-responsive-menu li a:hover{
    background:rgba(255,255,255,.09) !important;color:#fff !important;
  }
  .vk-head .ace-responsive-menu li ul.sub-menu{
    position:static !important;
    box-shadow:none;border:0;border-radius:0;
    background:rgba(255,255,255,.04) !important;
    min-width:0;width:auto !important;margin:0 0 6px !important;padding:4px 0 !important;
  }
  .vk-head .ace-responsive-menu li ul.sub-menu li a{padding:10px 18px !important}
}
@media screen and (max-width:400px){
  .vk-head__contact span{font-size:12px}
  .vk-head__name-short{font-size:15px}
}

/* ==========================================================================
   Подвал
   ========================================================================== */
footer.vk-foot{
  background:var(--vk-ink);color:var(--vk-muted);
  position:relative;z-index:1;
  font-family:-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:14px;line-height:1.6;
}
.vk-foot__wrap{
  max-width:1200px;margin:0 auto;padding:44px 24px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);gap:40px;
}
.vk-foot__col{min-width:0;display:flex;flex-direction:column}
.vk-foot__h{
  font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--vk-gold);margin-bottom:14px;
}
/* Внутри инфоблоков размеры проставлены инлайном (18px у span и font),
   перебить их можно только !important — иначе подвал разъезжается на
   три разных кегля. Один размер на весь подвал, правовая информация
   мельче: это сноска, а не основной текст. */
.vk-foot__prose,.vk-foot__prose *{
  font-size:13.5px !important;line-height:1.6 !important;
  font-family:inherit !important;color:var(--vk-muted) !important;
}
.vk-foot__prose--small,.vk-foot__prose--small *{
  font-size:12.5px !important;line-height:1.55 !important;
  color:rgba(255,255,255,.5) !important;
}
.vk-foot__prose p{margin:0 0 .7em}
.vk-foot__prose p:last-child{margin-bottom:0}
.vk-foot__prose a,.vk-foot .vk-foot__prose a{color:rgba(255,255,255,.8) !important;font-weight:600 !important}
.vk-foot__prose a:hover{color:var(--vk-gold) !important}
/* В инфоблоке контактов телефоны и адрес идут отдельными строками —
   даём им воздуха и не даём номерам переноситься. */
.vk-foot__contacts p,.vk-foot__contacts div{margin:0 0 6px}

.vk-foot__doc{
  display:block;padding:5px 0;
  font-size:13.5px;line-height:1.6;
  color:var(--vk-muted) !important;text-decoration:none;transition:color .16s;
}
.vk-foot__doc:hover{color:var(--vk-gold) !important}

.vk-foot__bottom{border-top:1px solid var(--vk-line)}
.vk-foot__wrap--bottom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:8px 20px;padding:16px 24px;
  font-size:13.5px;color:rgba(255,255,255,.45);
}
.vk-foot__author a{color:rgba(255,255,255,.45) !important}
.vk-foot__author a:hover{color:var(--vk-gold) !important}

@media screen and (max-width:900px){
  .vk-foot__wrap{grid-template-columns:1fr 1fr;gap:30px;padding:34px 18px}
}
@media screen and (max-width:600px){
  .vk-foot__wrap{grid-template-columns:1fr;gap:26px;padding:28px 16px}
  .vk-foot__wrap--bottom{padding:14px 16px}
}

/* ==========================================================================
   Новости и хлебные крошки
   ========================================================================== */

/* ---------- Хлебные крошки ---------- */
.vk-crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;
  font-size:13px;line-height:1.4;color:#8A939C;
  margin:0 0 18px;
}
.vk-crumbs a{
  color:#8A939C !important;text-decoration:none;transition:color .16s;
}
.vk-crumbs a:hover{color:var(--vk-ink,#1B1F24) !important}
.vk-crumbs__sep{color:#C7CDD3}
.vk-crumbs__current{color:var(--vk-ink,#1B1F24);font-weight:600}

/* ---------- Заголовок раздела ---------- */
.vk-page-title{
  margin:0 0 20px;padding-bottom:12px;
  font-size:clamp(26px,3.4vw,38px);line-height:1.15;font-weight:700;
  color:var(--vk-ink,#1B1F24);
  border-bottom:2px solid var(--vk-ink,#1B1F24);
}

/* ---------- Фильтр по категориям ---------- */
.vk-newsnav{
  display:flex;flex-wrap:wrap;gap:8px;
  margin:0 0 26px;
}
.vk-newsnav__item{
  display:inline-block;padding:7px 14px;border-radius:999px;
  font-size:13px;line-height:1.3;white-space:nowrap;
  color:#4A545E !important;text-decoration:none;
  background:#EFF1F3;border:1px solid transparent;
  transition:background .16s,color .16s,border-color .16s;
}
.vk-newsnav__item:hover{background:#E4E8EB;color:var(--vk-ink,#1B1F24) !important}
.vk-newsnav__item.is-active{
  background:var(--vk-ink,#1B1F24);color:#fff !important;
}

/* ---------- Сетка карточек ---------- */
.vk-news{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;
}
.vk-news__card{
  display:flex;flex-direction:column;
  background:#fff;border:1px solid #E4E8EB;border-radius:12px;overflow:hidden;
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
.vk-news__card:hover{
  border-color:var(--vk-gold,#C9A961);
  box-shadow:0 10px 28px rgba(27,31,36,.10);
  transform:translateY(-2px);
}
.vk-news__media{
  position:relative;display:block;
  aspect-ratio:16/9;background:#EFF1F3;overflow:hidden;
}
@supports not (aspect-ratio:16/9){
  .vk-news__media{height:0;padding-bottom:56.25%}
  .vk-news__media img{position:absolute;inset:0}
}
.vk-news__media img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease;
}
.vk-news__card:hover .vk-news__media img{transform:scale(1.05)}
.vk-news__cat{
  position:absolute;left:10px;top:10px;
  background:rgba(27,31,36,.86);color:#fff;
  font-size:11px;font-weight:600;letter-spacing:.03em;
  padding:5px 10px;border-radius:6px;
  max-width:calc(100% - 20px);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.vk-news__body{
  display:flex;flex-direction:column;gap:8px;
  padding:16px 18px 18px;flex:1 1 auto;
}
.vk-news__date{
  font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:#8A939C;
}
.vk-news__title{
  margin:0;font-size:16px;line-height:1.35;font-weight:700;
}
.vk-news__title a{color:var(--vk-ink,#1B1F24) !important;text-decoration:none}
.vk-news__title a:hover{color:var(--vk-gold,#C9A961) !important}
/* Описания приходят из базы со своей разметкой, поэтому режем по строкам,
   а не по символам — иначе карточки разной высоты. */
.vk-news__text{
  font-size:13.5px;line-height:1.55;color:#5A646E;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden;flex:1 1 auto;
}
.vk-news__more{
  margin-top:4px;align-self:flex-start;
  font-size:13px;font-weight:600;
  color:var(--vk-gold,#C9A961) !important;text-decoration:none;
  border-bottom:1px solid transparent;transition:border-color .16s;
}
.vk-news__more:hover{border-color:var(--vk-gold,#C9A961)}
.vk-news__empty{color:#8A939C;font-size:15px;padding:20px 0}

/* ---------- Постраничная навигация ---------- */
.vk-pager{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;
  margin:32px 0 8px;
}
.vk-pager__num,.vk-pager__step{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;padding:0 12px;
  font-size:14px;font-weight:600;
  color:#4A545E !important;text-decoration:none;
  background:#fff;border:1px solid #E4E8EB;border-radius:8px;
  transition:border-color .16s,background .16s,color .16s;
}
.vk-pager__num:hover,.vk-pager__step:hover{
  border-color:var(--vk-ink,#1B1F24);color:var(--vk-ink,#1B1F24) !important;
}
.vk-pager__num.is-active{
  background:var(--vk-ink,#1B1F24);border-color:var(--vk-ink,#1B1F24);color:#fff !important;
}
.vk-pager__gap{color:#A6AEB6;padding:0 2px}

@media screen and (max-width:560px){
  .vk-news{grid-template-columns:1fr;gap:16px}
  /* Одиннадцать категорий столбиком занимали пол-экрана — на телефоне
     это одна прокручиваемая строка. */
  .vk-newsnav{
    flex-wrap:nowrap;overflow-x:auto;gap:6px;margin-bottom:20px;
    padding-bottom:6px;-webkit-overflow-scrolling:touch;
  }
  .vk-newsnav__item{font-size:12.5px;padding:6px 12px;flex:0 0 auto}
  .vk-pager__num,.vk-pager__step{min-width:34px;height:34px;padding:0 9px;font-size:13px}
}

/* Дата над заголовком новости — вместо строки с автором */
.vk-post__date{
  font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:#8A939C;margin-bottom:10px;
}
.news-post h1.heading-large{
  margin:0 0 14px;font-size:clamp(24px,3vw,34px);line-height:1.2;font-weight:700;
  color:var(--vk-ink,#1B1F24);
}
.news-post .news-post-description{
  font-size:16px !important;line-height:1.6;color:#4A545E;
  padding-left:14px;border-left:3px solid var(--vk-gold,#C9A961);
}
.news-post .news-post-image img{border-radius:12px}

/* ==========================================================================
   Таблицы в содержимом страниц (прайс правовой помощи и т. п.)
   Разметка приезжает из админки и вставлена из Word: вложенные span
   с font-size:20px, Times New Roman и жёсткими ширинами ячеек в пикселях.
   Содержимое не трогаем, поэтому всё перебиваем через !important.
   ========================================================================== */

.vk-table-wrap{
  margin:24px 0;
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid #E4E8EB;border-radius:12px;
  background:#fff;
}

.page_content table{
  width:100% !important;
  margin:0 !important;
  border-collapse:collapse !important;
  border:0 !important;
  font-size:15px;line-height:1.45;color:var(--vk-ink,#1B1F24);
  text-align:left;
}

.page_content table td,
.page_content table th{
  width:auto !important;
  padding:11px 16px !important;
  border:0 !important;
  border-bottom:1px solid #EDF0F2 !important;
  vertical-align:top;
  text-align:left !important;
}
.page_content table tr:last-child td{border-bottom:0 !important}

/* Гасим ворды: размеры, гарнитуры и межстрочные из вставленной разметки */
.page_content table td *,
.page_content table th *{
  font-size:inherit !important;
  font-family:inherit !important;
  line-height:inherit !important;
}
.page_content table td p,
.page_content table th p{margin:0 !important;padding:0 !important}
.page_content table td p + p{margin-top:6px !important}

/* Шапка */
.page_content table tr.vk-table__head td{
  background:var(--vk-ink,#1B1F24) !important;
  color:#fff !important;
  font-weight:700;
  font-size:13px;letter-spacing:.04em;text-transform:uppercase;
  padding-top:13px !important;padding-bottom:13px !important;
  border-bottom:0 !important;
}
.page_content table tr.vk-table__head td *{color:#fff !important}

/* Строка-раздел: подзаголовок внутри таблицы */
.page_content table tr.vk-table__section td{
  background:#F4F6F7 !important;
  font-weight:700;
  color:var(--vk-ink,#1B1F24);
  border-top:1px solid #E4E8EB !important;
  border-bottom:1px solid #E4E8EB !important;
  padding-top:12px !important;padding-bottom:12px !important;
}

/* Колонка цен — только если в ней действительно числа */
.vk-table--price td:last-child{
  text-align:right !important;
  white-space:nowrap;
  font-weight:700;
  color:var(--vk-ink,#1B1F24);
  width:1% !important;
}
.vk-table--price tr.vk-table__head td:last-child{text-align:right !important}
.vk-table--price tr.vk-table__section td{text-align:left !important}

/* Первая колонка не должна ужиматься до столбика по одному слову */
.vk-table--price td:first-child{min-width:180px}

/* Сноски под таблицей набраны звёздочками — им хватает мелкого кегля */
.page_content .vk-table-wrap + p{margin-top:14px}

@media screen and (max-width:600px){
  .page_content table{font-size:14px}
  .page_content table td,
  .page_content table th{padding:10px 12px !important}
  .page_content table tr.vk-table__head td{font-size:12px}
  .vk-table--price td:first-child{min-width:0}
  .vk-table-wrap{margin:18px 0;border-radius:10px}
}

/* Пустая строка таблицы — след вёрстки исходника, не содержимое */
.page_content table tr.vk-table__blank{display:none}

/* На телефоне таблица цен не помещается в строку: колонка с ценой
   уезжала за экран, и её приходилось искать боковой прокруткой.
   Разворачиваем строки в столбик — услуга, под ней цена. */
@media screen and (max-width:560px){
  .page_content .vk-table-wrap{overflow-x:visible}

  .page_content table.vk-table--price,
  .page_content table.vk-table--price tbody,
  .page_content table.vk-table--price tr,
  .page_content table.vk-table--price td{
    display:block;width:auto !important;
  }

  .page_content table.vk-table--price tr{
    padding:11px 14px;border-bottom:1px solid #EDF0F2;
  }
  .page_content table.vk-table--price tr:last-child{border-bottom:0}
  .page_content table.vk-table--price td{
    padding:0 !important;border:0 !important;
  }
  .page_content table.vk-table--price td:last-child{
    text-align:left !important;margin-top:5px;font-size:15px;
    color:var(--vk-ink,#1B1F24);
  }

  /* Шапка остаётся одной строкой-легендой */
  .page_content table.vk-table--price tr.vk-table__head{
    display:flex;justify-content:space-between;align-items:baseline;gap:12px;
    background:var(--vk-ink,#1B1F24);border-bottom:0;
  }
  .page_content table.vk-table--price tr.vk-table__head td{
    background:transparent !important;flex:0 1 auto;
  }

  .page_content table.vk-table--price tr.vk-table__section{
    padding:12px 14px;background:#F4F6F7;
  }
  .page_content table.vk-table--price tr.vk-table__section td{
    background:transparent !important;
  }
}

/* У строки-раздела остаётся одна ячейка — она одновременно первая и
   последняя, поэтому ловила nowrap от колонки цен и не переносилась.
   На узком экране это выталкивало страницу вбок. */
.page_content table.vk-table--price tr.vk-table__section td{
  white-space:normal !important;
  text-align:left !important;
  width:auto !important;
}

/* Внутри ячеек лежат <p align="center"> из Word — они перебивали
   выравнивание колонки. Пусть наследуют от ячейки. */
.page_content table.vk-table--price td p{text-align:inherit !important}

/* ==========================================================================
   Текст страниц: читаемый кегль, ритм и списки.
   Размеры внутри содержимого проставлены инлайном (span с font-size:14px),
   поэтому гасим их принудительно — содержимое правится в админке, и
   переписывать разметку ради оформления не нужно.
   ========================================================================== */
.page_content{
  font-size:16px;line-height:1.7;color:#39424B;
}
.page_content span{font-size:inherit !important}
.page_content p{margin:0 0 1.05em}
.page_content p:last-child{margin-bottom:0}
/* Строка длиной во весь экран читается тяжело; таблиц ограничение
   не касается — они лежат в своей обёртке. */
.page_content > p,
.page_content > ol,
.page_content > ul{max-width:82ch}

.page_content > p.lead{
  font-size:17px !important;font-weight:600;color:var(--vk-ink,#1B1F24);
  margin:1.6em 0 .9em;
}

/* Нумерованный список — правила с кружками в цвете акцента */
.page_content ol{
  margin:0 0 1.3em;padding:0;list-style:none;counter-reset:vk-num;
}
.page_content ol > li{
  position:relative;padding-left:42px;margin-bottom:.9em;counter-increment:vk-num;
}
.page_content ol > li:last-child{margin-bottom:0}
.page_content ol > li::before{
  content:counter(vk-num);
  position:absolute;left:0;top:2px;
  width:28px;height:28px;border-radius:50%;
  background:var(--vk-gold,#C9A961);color:#fff;
  font-size:13px;font-weight:700;line-height:28px;text-align:center;
}

.page_content ul{margin:0 0 1.3em;padding:0;list-style:none}
.page_content ul > li{position:relative;padding-left:22px;margin-bottom:.6em}
.page_content ul > li::before{
  content:'';position:absolute;left:4px;top:.65em;
  width:6px;height:6px;border-radius:50%;background:var(--vk-gold,#C9A961);
}

@media screen and (max-width:700px){
  /* Выключка по ширине на узком экране даёт дыры между словами */
  .page_content.align_justify{text-align:left}
  .page_content{font-size:15px;line-height:1.65}
  .page_content > p.lead{font-size:16px !important}
  .page_content ol > li{padding-left:36px}
  .page_content ol > li::before{width:24px;height:24px;line-height:24px;font-size:12px}
}