/* ============================================================
   ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ — ГОСТ Р 52872-2019
   Кнопка в шапке включает режим: панель настроек + перекраска сайта.
   Классы на <html>: vi-on, vi-fs-1..3, vi-c-white|black|beige|blue,
   vi-k-1..3, vi-serif, vi-img-off.
   ============================================================ */

/* ---- Кнопка включения (в верхней строке) ---- */
.vi-trigger { display: inline-flex; align-items: center; gap: 7px; background: none; border: 0; color: inherit; cursor: pointer; font: inherit; font-weight: 700; padding: 0; }
.vi-trigger:hover { text-decoration: underline; }
.vi-trigger svg { width: 17px; height: 17px; flex-shrink: 0; }
@media (max-width: 720px) { .vi-trigger span { display: none; } }

/* ---- Вариант кнопки внутри мобильного меню (с подписью, как пункт меню) ---- */
.mm-vi { font-family: var(--font-display); font-size: 21px; font-weight: 700; padding: 15px 0; border-bottom: 1px solid var(--line); width: 100%; justify-content: flex-start; gap: 12px; color: inherit; }
.mm-vi svg { width: 21px; height: 21px; }
@media (max-width: 720px) { .mm-vi span { display: inline; } }

/* ---- Панель настроек (скрыта, пока режим выключен) ---- */
.vi-panel { display: none; }
html.vi-on .vi-panel { display: block; }
.vi-panel-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; padding: 12px 0; }
.vi-title { font-weight: 800; font-size: 15px; }
.vi-set { display: inline-flex; align-items: center; gap: 8px; }
.vi-lbl { font-size: 14px; font-weight: 600; }
.vi-group { display: inline-flex; gap: 5px; }
.vi-group button { font: inherit; font-weight: 700; line-height: 1; min-width: 34px; padding: 7px 11px; cursor: pointer; border: 1px solid currentColor; background: transparent; color: inherit; }
.vi-normal { font: inherit; font-weight: 800; padding: 8px 16px; cursor: pointer; margin-left: auto; border: 0; }

/* Панель всегда тёмная и контрастная — не зависит от выбранной схемы */
html.vi-on .vi-panel { background: #1a1a1a !important; color: #fff !important; border-bottom: 3px solid #fff; }
html.vi-on .vi-panel * { color: #fff !important; font-family: Arial, Verdana, sans-serif !important; letter-spacing: normal !important; }
html.vi-on .vi-panel .vi-group button { border-color: #fff !important; background: transparent !important; font-size: 14px !important; }
html.vi-on .vi-panel .vi-group[data-vi="fs"] button:nth-child(2) { font-size: 17px !important; }
html.vi-on .vi-panel .vi-group[data-vi="fs"] button:nth-child(3) { font-size: 21px !important; }
html.vi-on .vi-panel .vi-group button.on { background: #fff !important; color: #1a1a1a !important; }
html.vi-on .vi-panel .vi-normal { background: #ffd400 !important; color: #1a1a1a !important; font-size: 14px !important; }

/* ================= СХЕМЫ ЦВЕТА ================= */
html.vi-on { --vi-bg: #ffffff; --vi-fg: #111111; --vi-link: #0000cc; }
html.vi-on.vi-c-black { --vi-bg: #000000; --vi-fg: #ffffff; --vi-link: #ffff00; }
html.vi-on.vi-c-beige { --vi-bg: #f7f2d8; --vi-fg: #34280a; --vi-link: #12100a; }
html.vi-on.vi-c-blue  { --vi-bg: #9dd1ff; --vi-fg: #06294a; --vi-link: #042e5c; }

/* ================= ОБЩАЯ ПЕРЕКРАСКА ================= */
html.vi-on body { background: var(--vi-bg) !important; color: var(--vi-fg) !important; line-height: 1.6 !important; }
html.vi-on * {
  font-family: Arial, Verdana, Tahoma, sans-serif !important;
  box-shadow: none !important; text-shadow: none !important;
  background-image: none !important; border-radius: 0 !important;
  animation: none !important; transition: none !important;
  filter: none !important;
}
/* Показываем контент, скрытый анимацией появления (reveal), не трогая другие transform */
html.vi-on .reveal { opacity: 1 !important; transform: none !important; }
/* Мобильное меню прячется через transform — держим его закрытым, чтобы не перехватывало клики */
html.vi-on .mobile-menu:not(.open) { transform: translateX(100%) !important; }
html.vi-on.vi-serif * { font-family: Georgia, "PT Serif", "Times New Roman", serif !important; }

/* Фоны контейнеров — прозрачные (виден фон body выбранной схемы) */
html.vi-on section, html.vi-on header, html.vi-on footer, html.vi-on nav,
html.vi-on article, html.vi-on aside, html.vi-on ul, html.vi-on ol, html.vi-on li,
html.vi-on dl, html.vi-on figure, html.vi-on form, html.vi-on span, html.vi-on p,
html.vi-on details, html.vi-on summary, html.vi-on h1, html.vi-on h2, html.vi-on h3,
html.vi-on h4, html.vi-on h5, html.vi-on h6, html.vi-on div:not(.vi-panel) { background-color: transparent !important; }

/* Текст — цветом схемы */
html.vi-on h1, html.vi-on h2, html.vi-on h3, html.vi-on h4, html.vi-on h5, html.vi-on h6,
html.vi-on p, html.vi-on span, html.vi-on li, html.vi-on dt, html.vi-on dd, html.vi-on td,
html.vi-on th, html.vi-on label, html.vi-on small, html.vi-on b, html.vi-on strong,
html.vi-on em, html.vi-on figcaption, html.vi-on summary, html.vi-on blockquote,
html.vi-on time, html.vi-on i { color: var(--vi-fg) !important; }
html.vi-on svg:not(.vi-trigger svg) { color: var(--vi-fg) !important; }
html.vi-on svg:not(.vi-trigger svg) * { stroke: currentColor; }

/* Ссылки — подчёркнутые, цветом ссылки */
html.vi-on a, html.vi-on a * { color: var(--vi-link) !important; }
html.vi-on a { text-decoration: underline !important; }

/* Карточки и поля — рамка для структуры */
html.vi-on .contact-card, html.vi-on .doc-row, html.vi-on .route-card, html.vi-on .rev-card,
html.vi-on .price-row, html.vi-on .req-card, html.vi-on .lic-card, html.vi-on .quiz-card,
html.vi-on .faq-item, html.vi-on .promo-card, html.vi-on .doc-fold-toggle, html.vi-on .quiz-dir,
html.vi-on .dir-card, html.vi-on .doc-card, html.vi-on .iv-benefit, html.vi-on .step-card,
html.vi-on .ci-item, html.vi-on .trust-item, html.vi-on .offer, html.vi-on .cta-band,
html.vi-on input, html.vi-on textarea, html.vi-on select {
  border: 1px solid var(--vi-fg) !important; background: var(--vi-bg) !important;
}

/* Кнопки — контурные, без подчёркивания */
html.vi-on .btn { border: 2px solid var(--vi-fg) !important; background: var(--vi-bg) !important; color: var(--vi-fg) !important; text-decoration: none !important; font-weight: 700 !important; }
html.vi-on .btn * { color: var(--vi-fg) !important; }

/* Убираем декоративные наложения / полоски */
html.vi-on .hero-photo::after, html.vi-on .promo-card::before,
html.vi-on .eyebrow::before, html.vi-on .eyebrow::after,
html.vi-on .steps-sub .eyebrow::after, html.vi-on .section-head .eyebrow::after { display: none !important; }
html.vi-on .eyebrow { padding: 0 !important; }

/* Изображения */
html.vi-on img { border: 1px solid var(--vi-fg) !important; }
html.vi-on.vi-img-off img { display: none !important; }

/* Декоративная фоновая картинка в первом экране (подарок/сертификат) — в спецрежиме не нужна */
html.vi-on .hero-photo { display: none !important; }
/* Плавающую карточку раскладываем в обычный поток, чтобы ничего не наехало */
html.vi-on .contact-card.floating, html.vi-on .lead-form.floating {
  position: static !important; left: auto !important; right: auto !important; bottom: auto !important;
  width: auto !important; max-width: 480px !important; margin: 20px 0 0 !important;
}
html.vi-on .floating-badge { position: static !important; top: auto !important; right: auto !important; display: inline-block; margin-top: 10px; }
/* Плавающие кнопки/декор — скрываем в этом режиме, чтобы не мешали */
html.vi-on .float-cta, html.vi-on .to-top { display: none !important; }

/* ================= РАЗМЕР ШРИФТА ================= */
html.vi-on.vi-fs-1 body { font-size: 18px !important; }
html.vi-on.vi-fs-2 body { font-size: 21px !important; }
html.vi-on.vi-fs-3 body { font-size: 25px !important; }

html.vi-on.vi-fs-1 :is(p,li,a,td,th,dd,dt,label,small,span,figcaption,summary,input,textarea,select,.btn,.nav-links a,.doc-txt b,.pr-name,.pr-price) { font-size: 18px !important; }
html.vi-on.vi-fs-2 :is(p,li,a,td,th,dd,dt,label,small,span,figcaption,summary,input,textarea,select,.btn,.nav-links a,.doc-txt b,.pr-name,.pr-price) { font-size: 21px !important; }
html.vi-on.vi-fs-3 :is(p,li,a,td,th,dd,dt,label,small,span,figcaption,summary,input,textarea,select,.btn,.nav-links a,.doc-txt b,.pr-name,.pr-price) { font-size: 25px !important; }

html.vi-on.vi-fs-1 h1, html.vi-on.vi-fs-1 .display { font-size: 34px !important; }
html.vi-on.vi-fs-2 h1, html.vi-on.vi-fs-2 .display { font-size: 40px !important; }
html.vi-on.vi-fs-3 h1, html.vi-on.vi-fs-3 .display { font-size: 46px !important; }
html.vi-on.vi-fs-1 h2 { font-size: 27px !important; }
html.vi-on.vi-fs-2 h2 { font-size: 32px !important; }
html.vi-on.vi-fs-3 h2 { font-size: 37px !important; }
html.vi-on h3 { font-size: 1.25em !important; }

/* панель не масштабируем размером страницы */
html.vi-on .vi-panel :is(button,span,.vi-lbl,.vi-title) { font-size: 14px !important; }
html.vi-on .vi-panel .vi-group[data-vi="fs"] button:nth-child(2) { font-size: 17px !important; }
html.vi-on .vi-panel .vi-group[data-vi="fs"] button:nth-child(3) { font-size: 21px !important; }

/* ================= МЕЖБУКВЕННЫЙ ИНТЕРВАЛ ================= */
html.vi-on.vi-k-2 :is(p,li,a,span,h1,h2,h3,h4,dd,dt,td,th,label,.btn) { letter-spacing: 1.5px !important; }
html.vi-on.vi-k-3 :is(p,li,a,span,h1,h2,h3,h4,dd,dt,td,th,label,.btn) { letter-spacing: 3px !important; word-spacing: 3px !important; }
