/* zaimok.kz — правки поверх шаблонного бандла vjweb_zaimok_2021.
   Подключается ПОСЛЕ него, поэтому переопределяет.

   Чинит три дефекта исходного шаблона:
   1) body{font-family:"Rubik"} — файлы шрифта в слепке отсутствуют (301),
      текст падал на засечный фолбэк. Плюс там же опечатка `font-size:16pxx`,
      из-за которой правило размера отбрасывалось браузером.
   2) Иконки меню рисовались глифами "Font Awesome 5 Free" — шрифта тоже нет,
      на их месте были пустые квадраты. Заменены на инлайновые SVG.
   3) Хлебные крошки переносились на вторую строку. */

/* html body (0,0,2) бьёт body{font-family:Rubik} из бандла (0,0,1)
   независимо от порядка подключения — бандл грузится ПОСЛЕ site.css.
   Rubik в слепке отсутствует (301) → фолбэк был засечным. */
html body,
html body .page-content {
  font-family: "Montserrat", "Montserrat-fallback", "Open Sans", "OpenSans-fallback", -apple-system, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
}
html body main h1 { font-size: 2rem; font-weight: 600; line-height: 1.2; color: #222; }

.page-content { line-height: 1.6; color: #2f2f2f; }
.page-content h2 { font-size: 1.5rem; font-weight: 600; margin: 1.6em 0 .6em; }
.page-content h3 { font-size: 1.2rem; font-weight: 600; margin: 1.4em 0 .5em; }
.page-content h4,
.page-content h5 { font-size: 1.05rem; font-weight: 600; margin: 1.2em 0 .5em; }
.page-content p { margin: 0 0 1em; }
.page-content ul,
.page-content ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.page-content li { margin-bottom: .45em; }
.page-content table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; }
.page-content th,
.page-content td { border: 1px solid #e3e3e3; padding: 10px 12px; text-align: left; }
.page-content th { background: #f4f8f4; font-weight: 600; }

/* --- хлебные крошки --- */
nav[aria-label] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: .85rem; }
nav[aria-label] a { color: #6b6b6b; }
nav[aria-label] a:hover { color: #3d8b40; }
nav[aria-label] span[aria-hidden] { color: #c4c4c4; }
nav[aria-label] > span:last-child { color: #9b9b9b; }

/* --- список документов --- */
.doc-list { list-style: none; padding-left: 0; }
.doc-list li { margin-bottom: .7em; padding-left: 26px; position: relative; }
.doc-list li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 16px; height: 18px;
  background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d33' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3C/svg%3E");
}
.doc-list .doc-meta { color: #9b9b9b; font-size: .8rem; }

/* --- иконки правого меню: вместо отсутствующего Font Awesome --- */
.menu__item-city::after,
.menu__item-map::after {
  content: "" !important;
  font-family: inherit !important;
  width: 22px; height: 22px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.menu__item-city::after {
  top: 4px !important; left: 23px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23535f55' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}
.menu__item-map::after {
  top: 16px !important; left: 19px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23535f55' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='8' y1='6' x2='21' y2='6'/%3E%3Cline x1='8' y1='12' x2='21' y2='12'/%3E%3Cline x1='8' y1='18' x2='21' y2='18'/%3E%3Cline x1='3' y1='6' x2='3.01' y2='6'/%3E%3Cline x1='3' y1='12' x2='3.01' y2='12'/%3E%3Cline x1='3' y1='18' x2='3.01' y2='18'/%3E%3C/svg%3E");
}

/* --- мобильный sticky-CTA: на новом шаблоне калькулятор и «Получить деньги»
   уходят на ~3 экрана вниз; фиксированная кнопка возвращает конверсию в поле зрения --- */
.mcta { display: none; }
@media (max-width: 991px) {
  .mcta {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 300;
    background: #fff; box-shadow: 0 -2px 12px rgba(0,0,0,.12); padding: 8px 14px;
  }
  .mcta a {
    display: block; width: 100%; height: 52px; line-height: 52px; text-align: center;
    background: linear-gradient(180deg, #ffe08b 0%, #ffcb11 100%); border-radius: 26px;
    color: #5b4a0e; font-weight: 600; text-transform: uppercase; text-decoration: none;
  }
  /* контент не должен подлезать под фиксированную нижнюю кнопку (52+16) и утилити-навбар */
  body { padding-bottom: 84px; }
}

.city-cols { list-style: none; padding-left: 0; columns: 3; column-gap: 18px; }
.city-cols li { margin-bottom: .35em; }
@media (max-width: 767px) { .city-cols { columns: 2; } }

/* --- сетка городов в модалке «Выбрать город» --- */
.city-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 6px 14px; margin-top: 12px; }
.city-grid a { color: #3d8b40; font-size: .95rem; padding: 3px 0; }
.city-grid a:hover { text-decoration: underline; }

/* --- иконки блока «Как это работает»: Font Awesome отсутствует (пустые квадраты) → инлайновые SVG --- */
.steps-item__icon .fa-thumbs-up,
.steps-item__icon .fa-list-alt,
.steps-item__icon .fa-money-bill-alt {
  font-family: inherit !important;
  display: inline-block; width: 34px; height: 34px;
  background: no-repeat center / contain;
}
.steps-item__icon .fa-thumbs-up::before,
.steps-item__icon .fa-list-alt::before,
.steps-item__icon .fa-money-bill-alt::before { content: "" !important; }
.steps-item__icon .fa-thumbs-up {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b4a0e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3'/%3E%3C/svg%3E");
}
.steps-item__icon .fa-list-alt {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b4a0e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11H3v10h18V11h-6M9 5h6M8 15h.01M8 19h.01M12 15h4M12 19h4'/%3E%3Crect x='9' y='3' width='6' height='4' rx='1'/%3E%3C/svg%3E");
}
.steps-item__icon .fa-money-bill-alt {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b4a0e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='6' width='20' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M6 12h.01M18 12h.01'/%3E%3C/svg%3E");
}

/* --- приветственный попап НЕ показывается на мобильных (intrusive interstitial).
   На новом шаблоне это делает /script.js; на старом его jQuery-попап игнорирует
   вьюпорт, поэтому дублируем правилом CSS (бьёт inline display:block от JS). --- */
@media (max-width: 767px) {
  .popup, .overlay { display: none !important; }
}

/* --- переключатель языка: активный язык не должен быть ссылкой на себя --- */
.menu__lang_active { font-weight: 600; color: #3d8b40; }

/* --- тап-таргеты ≥44px на мобильном (a11y / Google mobile-friendly) --- */
@media (max-width: 991px) {
  .menu__elipce a,
  .menu__lang_active { min-width: 44px; min-height: 44px; display: inline-flex;
    align-items: center; justify-content: center; }
  .footer-sec__menu a,
  .footer-sec__docs a { display: inline-block; padding: 14px 0; line-height: 1.25; }
}

@media (max-width: 991px) {
  .page-content { font-size: 15px; }
}

.article-actual { background: #eaf6ea; border-left: 3px solid #5cb85c; border-radius: 8px; padding: 12px 16px; margin: 0 0 1.4em; font-size: .95rem; }

.journal-item { border-bottom: 1px solid #ececec; padding: 14px 0; }
.journal-item h2 { font-size: 1.15rem; margin: 0 0 4px; }
.journal-item h2 a { color: #3d8b40; }
.journal-date { font-size: .8rem; color: #9b9b9b; margin: 0 0 6px; }