/* ═══════════════════════════════════════════════════════════════════════
В активе более 1500 переводчиков
────────────────────────────────
Анкеты переводчиков: имя, стаж, языки, отрасли, образование, участие в проектах, фотография.
ЭТОТ ФАЙЛ - ДЛЯ ПРАВОК ТОЛЬКО ЭТОГО БЛОКА.
Заведено 17.08.2026 по решению Павла: «разведи блоки по файлам», чтобы
над разными блоками можно было работать одновременно и правки не
затирали друг друга.
ПРАВИЛА ДЛЯ ТОГО, КТО ПРАВИТ ЭТОТ ФАЙЛ:
1. Пиши сюда только то, что относится к этому блоку. Общее - карточки,
тени, ритм между блоками, заголовки разделов - в 00_obshchee.css.
2. Файл подключается ПОСЛЕ glavnaya.css и guide.css, поэтому перебивает
их при равной силе селектора. Но эталонные стили (css/etalon/*)
написаны через [data-h] и [data-b] - против них пиши той же формы
селектор или сильнее, иначе правило молча проиграет.
3. Каждой правке - комментарий: что меняем, по чьей команде, и строка
«Откат: …», чтобы можно было вернуть как было.
4. Эталонные файлы css/etalon/* не трогать: они заморожены, на них
ссылается манифест контрольных сумм.
5. Проверять замером на живой странице, а не на глаз.
═══════════════════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════════════
Правка 17.08.2026: анкета переводчика приведена к виду действующего
сайта (academperevod.ru, блок section.staff, 4 карточки в ряду).
Что было: все девять строк анкеты набраны одним кеглем 15 px без
иерархии, фото растянуто на всю ширину карточки, иконок и галочек нет.
Что стало: восемь шрифтовых уровней, фото 90×90 слева, значки-медаль и
конфедератка, круглые точки в образовании и красные галочки в проектах.
Селекторы намеренно начинаются с #perevodchiki: эталонные правила
написаны через [data-b] (0,2,0 … 0,4,1), идентификатор перебивает их
гарантированно.
═══════════════════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════════════
Правка 17.08.2026 (вторая): привязка по порядку строк заменена на
классы ролей.
Что было: анкета лежала одним текстом в поле «Анкета, одна строка -
один пункт» (home.TranslatorProfile.details), шаблон печатал её девятью
одинаковыми , и роль строки задавал её номер -
:nth-of-type(1) язык, (2) отрасль, (3) и (6) рубрики, (4) и (5)
образование, (n+7) проекты, :last-of-type итог. Стоило редактору
поменять строки местами или убрать одну, и блок разъезжался.
Что стало: в кабинете у каждой строки своё поле (требование Павла
«сделай отдельные поля в кабинете переводчика, под каждую строку»), а
шаблон печатает каждое поле со своим классом:
.anketa-staj - стаж;
.anketa-yazyk - рабочий язык (плашка);
.anketa-otrasl - отрасль (красная строка со значком-медалью);
.anketa-rubrika - подписи «Образование» и «Участие в проектах:»,
они стоят текстом в шаблоне, а не в кабинете;
.anketa-obrazovanie - институты (точки-маркеры);
.anketa-proekt - проекты (красные галочки);
.anketa-itogo - строка «Всего более N» (та же галочка, но 700).
Пустое поле шаблон вообще не печатает, поэтому пустых строк в анкете
не бывает и порядок больше ни на что не влияет.
Вид блока не менялся: все размеры, цвета, отступы и значки ниже - те
же, что были в первой правке. Сверено замером на живой странице до и
после: расхождений нет.
Откат: вернуть в шаблоне перебор строк item.details и заменить в
правилах 5, 7-12 классы обратно на :nth-of-type / :last-of-type.
═══════════════════════════════════════════════════════════════════════ */
/* ───────────────────────────────────────────────────────────────────────
1. Каркас блока.
Меняем: промежуток между карточками анкет.
Почему: на действующем сайте .staff-list - grid gap 20px при карточке
280px. У нас было 30px, карточка выходила 272,5px. Контейнер 1180px,
поэтому при gap: 20px четыре колонки дают ровно 280px.
Откат: убрать правило - вернутся 30px из glavnaya.css.
ОТМЕНЕНО 18.08.2026 по диктовке Павла: рядом стояло второе правило,
#perevodchiki > h2 { margin-bottom: 40px }. Его поставили сюда, приводя
блок к действующему сайту: там от заголовка до карточек ровно 40px.
Павел это отменил - «в активе более 1500 переводчиков: после сделать
тоже 70, сейчас меньше, непонятно почему поставил 40». Исключение
убрано, блок вернулся в общий ритм --sp-block (70px, glavnaya.css,
раздел 30). Замер: было 40px после заголовка, стало 70px.
Откат: вернуть правило #perevodchiki[data-b] > h2[data-b]
{ margin-bottom: 40px; } - и блок снова выпадет из общего ритма.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .strip[data-b].anketi {
gap: 20px;
}
/* ───────────────────────────────────────────────────────────────────────
2. Карточка анкеты.
Меняем: поля 20/24px на 15px и раскладку карточки на сетку из двух
колонок - 90px под фотографию и остаток под имя, стаж и язык.
Почему: на действующем сайте .staff-item имеет padding: 15px, а верх
карточки .staff-top - это flex «фото + столбец» с промежутком 15px.
Скругление 16px и тень 0 10px 20px 0 rgba(21,72,137,.08) у нас уже
совпадают с эталоном, их не трогаем.
align-content: start обязателен: guide.css задаёт карточке height:100%,
без него строки сетки растянулись бы и весь ритм анкеты поехал.
Откат: убрать правило - вернётся flex-колонка с полями 20/24px.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] {
padding: 15px;
display: grid;
grid-template-columns: 90px minmax(0, 1fr);
column-gap: 15px;
row-gap: 0;
align-content: start;
}
/* ───────────────────────────────────────────────────────────────────────
3. Фотография переводчика.
Меняем: было 100% ширины карточки, высота 180px, скругление 8px.
Стало 90×90, скругление 16px, кадрирование по центру, фото занимает
первую колонку и три строки сетки - ровно столько, сколько занимают
имя, стаж и плашка языка справа (16 + 24 + 50 = 90px).
Почему: на действующем сайте .staff-top img - это квадрат 90×90 с
object-fit: cover и радиусом 16px, без рамки и тени.
Откат: убрать правило - вернётся широкое фото из guide.css (п. 6.3).
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > img.anketaimg {
grid-column: 1;
grid-row: 1 / span 3;
align-self: start;
width: 90px;
height: 90px;
object-fit: cover;
border-radius: 16px;
border: 0;
box-shadow: none;
margin: 0;
}
/* ───────────────────────────────────────────────────────────────────────
4. Имя переводчика.
Меняем: межстрочный интервал 20,8px на 16px и цвет на #1E1F22.
Почему: на действующем сайте .staff-name - 16px/700, line-height 16px,
цвет #1E1F22. Кегль и начертание у нас уже совпадали.
Откат: убрать правило - вернётся общий стиль h3 из glavnaya.css.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > h3[data-b] {
grid-column: 2;
grid-row: 1;
margin: 0;
font-size: 16px;
font-weight: 700;
line-height: 16px;
color: #1E1F22;
}
/* ───────────────────────────────────────────────────────────────────────
5. Стаж.
Меняем: было 13px серым цветом #63676C, стало 16px/400 цветом #1E1F22.
Отступ от имени 8px.
Почему: на действующем сайте .staff-stage набран тем же кеглем, что и
имя, и тем же цветом - от имени его отличает только начертание.
Класс .anketa-staj добавлен шаблоном 17.08.2026 рядом со старым .staj:
держать вид на общем классе .staj нельзя, он встречается и в других
местах.
Откат: вернуть селектор > .staj[data-b].
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > .anketa-staj[data-b] {
grid-column: 2;
grid-row: 2;
margin: 8px 0 0;
font-size: 16px;
font-weight: 400;
line-height: 16px;
color: #1E1F22;
}
/* ───────────────────────────────────────────────────────────────────────
6. Общее для всех строк анкеты.
Меняем: снимаем нижний отступ 6px - вертикальный ритм анкеты на
действующем сайте задаётся верхними отступами (25 / 20 / 8 / 5px),
и держать оба набора отступов сразу нельзя.
Откат: убрать правило - вернётся margin: 0 0 6px из эталона.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b] {
grid-column: 1 / -1;
margin: 0;
}
/* ───────────────────────────────────────────────────────────────────────
7. Плашка языка (поле «Рабочий язык»).
Меняем: было 15px обычным текстом в общем потоке. Стало 14px/700 на
подложке rgba(30,31,34,.04) со скруглением 8px и полями 6px/10px,
прижата к низу правого столбца.
Почему: на действующем сайте .staff-lang - именно такая плашка, и она
стоит под стажем на расстоянии 24px, замыкая столбец высотой 90px.
justify-self: start нужен, чтобы плашка обнимала текст, а не
растягивалась на весь столбец, - как в эталоне (102px против 145px).
Откат: убрать правило - строка станет обычным абзацем анкеты.
Правка 17.08.2026: было :nth-of-type(1), стало .anketa-yazyk.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-yazyk {
grid-column: 2;
grid-row: 3;
justify-self: start;
align-self: end;
margin: 24px 0 0;
padding: 6px 10px;
font-size: 14px;
font-weight: 700;
line-height: 14px;
color: #1E1F22;
background: rgba(30, 31, 34, .04);
border-radius: 8px;
}
/* ───────────────────────────────────────────────────────────────────────
8. Отрасль (поле «Отрасль») со значком-медалью.
Меняем: было 15px чёрным. Стало 16px/700 фирменным красным #911A22,
межстрочный 18px, слева значок-медаль 14×14 того же цвета, отступ до
текста 7px, от верхней части карточки 25px.
Почему: на действующем сайте это .staff-area - единственная красная
строка анкеты, она отделяет «шапку» переводчика от его данных.
Значка в нашей разметке нет, поэтому он добавлен через ::before с
data-URI - шаблон при этом трогать не нужно. Контур медали снят с
действующего сайта один в один (viewBox 0 0 12 12, четыре пути).
Откат: убрать правило - строка станет обычным абзацем без значка.
Правка 17.08.2026: было :nth-of-type(2), стало .anketa-otrasl.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-otrasl {
display: flex;
gap: 7px;
margin-top: 25px;
font-size: 16px;
font-weight: 700;
line-height: 18px;
color: #911A22;
}
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-otrasl::before {
content: "";
flex: 0 0 14px;
width: 14px;
height: 14px;
margin-top: 1px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='%23911A22'%3E%3Cpath d='M6 9.1875C8.52 9.1875 10.5703 7.11375 10.5703 4.59375C10.5703 2.07375 8.52 0 6 0C3.48 0 1.42969 2.07375 1.42969 4.59375C1.42969 7.11375 3.48 9.1875 6 9.1875ZM3.65958 3.83295C3.70111 3.70591 3.81098 3.61322 3.9435 3.594L5.1465 3.41925L5.68484 2.32887C5.80294 2.08854 6.19706 2.08854 6.31519 2.32887L6.85352 3.41925L8.05652 3.594C8.18904 3.61322 8.29891 3.70591 8.34045 3.83295C8.38165 3.96033 8.34731 4.10004 8.25152 4.19344L7.38087 5.04248L7.58618 6.24103C7.60884 6.37287 7.55459 6.50609 7.44645 6.58505C7.33727 6.6637 7.19419 6.67371 7.07599 6.61148L6 6.04566L4.92403 6.61146C4.80593 6.67394 4.66277 6.6633 4.55358 6.58502C4.44544 6.50606 4.39118 6.37284 4.41384 6.24101L4.61916 5.04246L3.7485 4.19341C3.65271 4.10006 3.61838 3.96033 3.65958 3.83295Z'/%3E%3Cpath d='M5.34324 4.97897L5.22721 5.65771L5.83625 5.33739C5.88774 5.31025 5.94371 5.29687 6.00001 5.29687C6.05631 5.29687 6.11228 5.31025 6.16377 5.33739L6.77281 5.65771L6.65678 4.97897C6.63721 4.86499 6.67496 4.7486 6.75772 4.66793L7.25073 4.18727L6.56956 4.08839C6.45488 4.07191 6.35603 3.99982 6.30486 3.89613L6.00001 3.27881L5.69514 3.89611C5.64397 3.99979 5.54511 4.07189 5.43043 4.08836L4.74927 4.18725L5.24228 4.6679C5.32503 4.74857 5.36281 4.86497 5.34324 4.97897Z'/%3E%3Cpath d='M1.11557 10.7425C1.20965 10.8462 1.35522 10.8829 1.48808 10.8386L2.99322 10.3278L3.62254 11.7873C3.67815 11.9164 3.8165 11.9685 3.94527 11.9998C4.08397 11.9998 4.20997 11.9181 4.26662 11.791L5.14492 9.81464C3.92333 9.61413 2.8438 8.99482 2.05677 8.10645L1.05376 10.3628C0.997114 10.4905 1.02114 10.6395 1.11557 10.7425Z'/%3E%3Cpath d='M7.73344 11.791C7.79009 11.9181 7.91573 11.9998 8.05479 11.9998C8.17083 11.9778 8.32188 11.9163 8.37752 11.7873L9.00684 10.3278L10.512 10.8386C10.6445 10.8829 10.7904 10.8462 10.8845 10.7425C10.9789 10.6395 11.0029 10.4905 10.9463 10.3628L9.94331 8.10645C9.15628 8.99484 8.07675 9.61416 6.85516 9.81464L7.73344 11.791Z'/%3E%3C/svg%3E");
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
/* ───────────────────────────────────────────────────────────────────────
9. Подписи-рубрики «Образование» и «Участие в проектах:» (.anketa-rubrika).
Обе стоят текстом в шаблоне: они одинаковы у всех переводчиков, в
кабинете их нет.
Меняем: было 15px чёрным вровень с содержимым. Стало 16px/700 серым
#848D98 со значком-конфедераткой 14×14 того же цвета, отступ до текста
7px, от предыдущего блока 20px.
Почему: на действующем сайте у .staff-education и .staff-projects
стоит один и тот же значок-конфедератка - отдельной иконки проектов
там нет, поэтому и у нас обе подписи получают одинаковый значок.
Значок добавлен через ::before с data-URI, контур снят с действующего
сайта один в один (viewBox 0 0 12 12, три пути).
Откат: убрать оба правила - подписи станут обычными абзацами.
Правка 17.08.2026: было :nth-of-type(3) и (6), стало .anketa-rubrika.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika {
display: flex;
gap: 7px;
margin-top: 20px;
font-size: 16px;
font-weight: 700;
line-height: 16px;
color: #848D98;
}
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika::before {
content: "";
flex: 0 0 14px;
width: 14px;
height: 14px;
margin-top: 1px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='%23848D98'%3E%3Cpath d='M11.2469 7.96533V4.23291L10.5438 4.46729V7.96533C10.1065 8.11254 9.79065 8.5261 9.79065 9.01231V10.8951C9.79065 11.0893 9.94806 11.2467 10.1422 11.2467H11.6484C11.8426 11.2467 12 11.0893 12 10.8951V9.01231C12 8.5261 11.6841 8.11254 11.2469 7.96533Z'/%3E%3Cpath d='M5.6666 5.8706L2.25937 4.73486V7.12938C2.25937 7.22264 2.29642 7.31205 2.36235 7.37798C3.33412 8.34963 4.62606 8.88475 6.00016 8.88475C7.37428 8.88475 8.6661 8.34963 9.63766 7.37793C9.70359 7.312 9.74062 7.22259 9.74062 7.12938V4.73486L6.33351 5.87057C6.10061 5.94813 5.86617 5.93709 5.6666 5.8706Z'/%3E%3Cpath d='M6 5.22163C6.03755 5.22163 6.07509 5.21561 6.11116 5.20359L11.7596 3.32078C11.9032 3.27292 12 3.13858 12 2.98727C12 2.83596 11.9032 2.70161 11.7596 2.65375L6.11116 0.770947C6.03902 0.746924 5.96098 0.746924 5.88884 0.770947L0.240398 2.65375C0.0968203 2.70159 0 2.83593 0 2.98727C0 3.1386 0.0968203 3.27292 0.240398 3.32078L5.88884 5.20359C5.92491 5.21561 5.96245 5.22163 6 5.22163Z'/%3E%3C/svg%3E");
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
/* ───────────────────────────────────────────────────────────────────────
10. Список образования (поля «первый институт» и «второй институт»).
Меняем: было 15px без маркеров. Стало 14px/400, межстрочный 21px,
маркеры - обычные круглые точки с отбивкой 20px, от подписи 8px,
между пунктами 5px.
Почему: на действующем сайте это
внутри .staff-education со
штатным list-style: disc и padding-left: 20px. У нас это абзацы,
поэтому им задано display: list-item - маркер рисует сам браузер,
выдумывать значок не нужно.
Откат: убрать оба правила - пункты станут абзацами по 15px без точек.
Правка 17.08.2026: было :nth-of-type(4) и (5), стало .anketa-obrazovanie.
Отбивка 8px от подписи теперь висит не на четвёртой строке, а на первом
институте после рубрики - тогда при одном институте отступ не потеряется.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-obrazovanie {
display: list-item;
list-style: disc outside;
margin-left: 20px;
margin-top: 5px;
font-size: 14px;
font-weight: 400;
line-height: 21px;
color: #1E1F22;
}
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-obrazovanie {
margin-top: 8px;
}
/* ───────────────────────────────────────────────────────────────────────
11. Список проектов (поля «первый проект», «второй проект» и итог)
с красными галочками.
Меняем: было 15px без маркеров. Стало 14px/400, межстрочный 21px,
вместо точки - красная галочка 14×14, отступ до текста 7px, галочка
приподнята на 2px. От подписи 8px, между пунктами 5px.
Почему: на действующем сайте .staff-projects li - это display: flex с
псевдоэлементом ::before, в который подставлена картинка-галочка
цвета #911A22; сам список идёт без штатных маркеров.
Контур галочки скопирован с действующего сайта побайтно.
Откат: убрать три правила - пункты станут абзацами по 15px.
Правка 17.08.2026: было :nth-of-type(n+7), стало .anketa-proekt и
.anketa-itogo. Диапазон n+7 держался на том, что проекты идут седьмой
строкой и дальше; теперь галочку получает поле, а не позиция.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt,
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo {
display: flex;
margin-top: 5px;
font-size: 14px;
font-weight: 400;
line-height: 21px;
color: #1E1F22;
}
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt::before,
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo::before {
content: "";
flex: 0 0 14px;
width: 14px;
height: 14px;
margin: 2px 7px 0 0;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23911a22' d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E");
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
/* Отбивка 8px от подписи «Участие в проектах:» до первого пункта. Висит
на соседстве с рубрикой, а не на седьмой строке: если первый проект не
заполнен, отступ достанется второму, а если пусты оба - итоговой строке.
Откат: заменить на :nth-of-type(7). */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-proekt,
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-itogo {
margin-top: 8px;
}
/* ───────────────────────────────────────────────────────────────────────
12. Итоговая строка проектов («Всего более 35»).
Меняем: начертание с обычного на полужирное, кегль остаётся 14px.
Почему: на действующем сайте .staff-projects li:last-child набран
700 - это восьмой, последний шрифтовой уровень блока.
Откат: убрать правило - строка сравняется с остальными проектами.
Правка 17.08.2026: было :last-of-type, стало .anketa-itogo. Раньше
полужирным становился просто последний абзац анкеты - даже если это
был обычный проект, а итоговую строку редактор не заполнил.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo {
font-weight: 700;
}
/* ───────────────────────────────────────────────────────────────────────
13. Анкета без фотографии.
Меняем: если фотография не приложена, карточка раскладывается в одну
колонку вместо двух.
Почему: в шаблоне фотография условная - {% if item.image %}, и при
пустом поле тега ![]()
в разметке нет вовсе. Первая колонка сетки при
этом остаётся шириной 90px, и имя, стаж и плашка языка повисают на
105px правее отрасли и списков. Проверено замером: содержимое карточки
начинается на 437,5px, а имя - на 542,5px, карточка выглядит сломанной.
Достаточно одного пустого поля в кабинете, чтобы это увидел посетитель.
:has() понимают все текущие браузеры; там, где не понимают, правило
отбрасывается целиком - то есть хуже, чем сейчас, не станет.
Откат: убрать оба правила - карточка без фотографии снова разъедется.
Правка 17.08.2026: .staj заменён на .anketa-staj, :nth-of-type(1) - на
.anketa-yazyk.
─────────────────────────────────────────────────────────────────────── */
#perevodchiki[data-b] .anketa[data-b]:not(:has(> img.anketaimg)) {
grid-template-columns: minmax(0, 1fr);
}
#perevodchiki[data-b] .anketa[data-b]:not(:has(> img.anketaimg)) > h3[data-b],
#perevodchiki[data-b] .anketa[data-b]:not(:has(> img.anketaimg)) > .anketa-staj[data-b],
#perevodchiki[data-b] .anketa[data-b]:not(:has(> img.anketaimg)) > p.af[data-b].anketa-yazyk {
grid-column: 1;
}
/* ───────────────────────────────────────────────────────────────────────
Правка 18.08.2026: копии анкет для бесконечной карусели.
Диктовка Павла: «сейчас не работает переключение. Я вправо кручу -
ничего не отображается. Влево работает, а вправо нажимаю - не работает,
что-то зависает». Разбор дефекта и лечение - в js/site/glavnaya.js,
функции beskonechno() и anketi(): к ленте анкет дописываются копии
набора, и карусель идёт по кругу в обе стороны.
Стилям остаётся одно: на компьютере анкеты стоят не лентой, а сеткой из
четырёх колонок (эталон: .strip.anketi { display: grid; overflow:
visible }). Копии там встали бы вторым и третьим рядом - прячем их.
Заодно выключается и сам круг: сценарий меряет ширину набора по отступу
первой настоящей анкеты, у спрятанных копий отступ нулевой.
На телефоне (body.mob, до 640px) лента становится прокручиваемой -
правило не действует, копии видны и работают.
Откат: убрать это правило - на компьютере под анкетами появятся два
лишних ряда их копий.
─────────────────────────────────────────────────────────────────────── */
body:not(.mob) #perevodchiki[data-b] .strip[data-b].anketi > [data-klon] {
display: none;
}
/* ═══════════════════════════════════════════════════════════════════════
Правка 18.08.2026 (диктовка Павла, пункт 14): телефонный вид анкеты.
Дословно: «Здесь нужно тоже всё сделать поменьше: там, где "Юрий",
"английский", место образования, участие в проектах - берём такой же
шрифт, как 24/7, и он идёт в тех цветах, в которых сейчас; "15 лет"
тоже сюда. А где название института, названия проектов и "более
тридцати пяти" - маленький шрифт, как пояснительный текст на 24/7, там
где "онлайн-заказы". Расстояния тоже меньше. Сейчас в этом блоке левая
кнопка синяя, левая стрелка, правая серая. Плюс сама страничка
размещена не посредине: слева видно границу, справа видно границу.
Сделать для мобильной версии анкету переводчика уже, чтобы она
открывалась ровно посередине... чтобы сверху, слева и справа тень тоже
была видна».
ВСЁ НИЖЕ - ТОЛЬКО ТЕЛЕФОН. Каждое правило начинается с body.mob, класс
ставит auto_mob.js по условию max-width 640px. Компьютерный вид анкет
(сетка 4 в ряд) не затронут - сверено замером на 1440 до и после.
Образцы кеглей сняты замером с плашки «24/7» на первом экране
(телефон 375, 18.08.2026):
· цифра «24 / 7» - 16px, межстрочный 16px, начертание 700;
· подпись «Онлайн заказы» - 10,8px, межстрочный 14,58px (1,35), 400.
Плашку правит другой агент; если он поменяет её кегли, эти два числа
надо пересчитать - других зависимостей у правки нет.
Цвета строк анкеты не меняются: Павел прямо сказал «он идёт в тех
цветах, в которых сейчас». Начертания тоже не трогаем - речь была про
размер шрифта, а не про жирность.
Откат целиком: удалить весь этот раздел до конца файла.
═══════════════════════════════════════════════════════════════════════ */
/* ───────────────────────────────────────────────────────────────────────
14.1. Крупный кегль - как цифра «24 / 7»: 16px, межстрочный 16px.
В эту группу Павел отнёс имя, стаж («15 лет»), рабочий язык, подписи
«Образование» и «Участие в проектах:». Из них правки требует только
плашка языка: имя (16/700), стаж (16/400), отрасль (16/700) и подписи
(16/700) уже набраны нужным кеглем - замер до правки это подтвердил,
поэтому лишних правил не пишем.
Заодно ужаты поля самой плашки языка: 6px/10px -> 4px/8px, иначе при
выросшем кегле она стала бы заметно выше.
Откат: удалить правило - язык вернётся к 14px и полям 6px/10px.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-yazyk {
padding: 4px 8px;
font-size: 16px; /* было 14px */
line-height: 16px; /* было 14px */
}
/* ───────────────────────────────────────────────────────────────────────
14.2. Мелкий кегль - как подпись «Онлайн заказы» под цифрой:
10,8px, межстрочный 1,35 (14,58px).
В эту группу Павел отнёс названия институтов, названия проектов и
итоговую строку «Всего более 35». Было 14px с межстрочным 21px.
Значок-галочка у проектов уменьшен с 14x14 до 11x11, отбивка до текста
с 7px до 5px: значок в 14px рядом со строкой в 10,8px выглядел бы
крупнее самой строки. Кружок-маркер у образования рисует браузер, он
уменьшается вместе с кеглем сам; отбивка списка 20px -> 14px.
Откат: удалить три правила - вернутся 14px/21px, значок 14x14 и
отбивка 20px.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-obrazovanie,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo {
font-size: 10.8px; /* было 14px */
line-height: 1.35; /* было 21px, стало 14,58px */
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-obrazovanie {
margin-left: 14px; /* было 20px */
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt::before,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo::before {
flex: 0 0 11px; /* было 14px */
width: 11px;
height: 11px;
margin: 2px 5px 0 0; /* было 2px 7px 0 0 */
}
/* ───────────────────────────────────────────────────────────────────────
14.3. Расстояния внутри анкеты - меньше.
Замер до правки (телефон 375) и после:
поля карточки 15px -> 12px
от фотографии до текста 15px -> 12px
имя -> стаж 8px -> 6px
стаж -> плашка языка 24px -> 12px
язык -> отрасль 25px -> 14px
отрасль -> «Образование» 20px -> 12px
подпись -> первый пункт 8px -> 5px
между пунктами списка 5px -> 3px
Столбец справа от фотографии (имя, стаж, язык) остаётся высотой 90px:
его держит сама фотография, она разложена на три строки сетки. Поэтому
отступы 6px и 12px внутри столбца карточку не укорачивают - они только
выравнивают ритм; вся экономия высоты идёт ниже, на списках.
Откат: удалить шесть правил - вернутся 15/15/8/24/25/20/8/5.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .anketa[data-b] {
padding: 12px;
column-gap: 12px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > .anketa-staj[data-b] {
margin-top: 6px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-yazyk {
margin-top: 12px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-otrasl {
margin-top: 14px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika {
margin-top: 12px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-obrazovanie,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo {
margin-top: 3px;
}
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-obrazovanie,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-proekt,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-rubrika + p.af[data-b].anketa-itogo {
margin-top: 5px;
}
/* ───────────────────────────────────────────────────────────────────────
14.4. Стрелки листания - обе одинаковые, серые.
Павел: «сейчас в этом блоке левая кнопка синяя, левая стрелка, правая
серая».
Откуда разнобой (замер до правки). Правой стрелке цвет задаёт чужое
правило .next{color:var(--muted)} из dvizhok.css - она серая #63676C.
Левой не задаёт никто, и она берёт цвет кнопки от браузера: в Chrome
это чёрный, в Safari на iPhone - системный синий. Отсюда и «левая
синяя, правая серая». Переменная --cvet-plusa (#1646e8) к этим кнопкам
отношения не имеет: перебор всех правил страницы показал, что ни одно
правило с этой переменной на них не срабатывает. Поэтому её и не
перебиваем - она общая и нужна другим блокам.
Лечим прямо: обеим кнопкам явный серый #63676C - тот же, что уже был у
правой. Цвет задан и на самой кнопке, и в наведении с фокусом, чтобы
системный синий не всплыл ни в одном состоянии.
Откат: удалить оба правила - левая снова окажется цвета «по
умолчанию» (чёрная в Chrome, синяя в Safari).
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .carbtn[data-b].prev,
body.mob #perevodchiki[data-b] .carbtn[data-b].next {
color: #63676C;
}
body.mob #perevodchiki[data-b] .carbtn[data-b].prev:hover,
body.mob #perevodchiki[data-b] .carbtn[data-b].prev:focus,
body.mob #perevodchiki[data-b] .carbtn[data-b].next:hover,
body.mob #perevodchiki[data-b] .carbtn[data-b].next:focus {
color: #63676C;
}
/* ───────────────────────────────────────────────────────────────────────
14.5. Анкета уже, стоит ровно посередине, тень видна с трёх сторон.
Павел: «сама страничка размещена не посредине: слева видно границу,
справа видно границу. Сделать анкету уже, чтобы она открывалась ровно
посередине... чтобы сверху, слева и справа тень тоже была видна».
Что было (замер, телефон 375). Карточка занимала всю ширину ленты -
flex: 0 0 100%, это 349,4px. Своей боковой тени не видно вовсе: она
рисуется за краем видимой части ленты и обрезается. Промежуток между
карточками 20px, а кнопки листания двигают ленту на «ширина карточки
плюс 11» - это шаг эталонного сценария interactive.js. Разница в 9px
копится: карточка приезжает мимо середины (замер после серии нажатий -
слева 8,4px, справа 17,2px, перекос 8,8px). Это и есть «Иван нормально
открывается, а дальше может туда-сюда ходить».
Что стало:
1. Ширина карточки - на 20px меньше ленты, по 10px воздуха с каждой
стороны. В этом воздухе и видна боковая тень.
2. Промежуток между карточками 20px -> 11px. Число не случайное: ровно
столько прибавляет к ширине карточки шаг эталонного сценария
(getBoundingClientRect().width + 11). При таком промежутке шаг
кнопки в точности равен ходу карусели, разнице копиться не из чего,
и карточка встаёт ровно посередине на любой анкете. Соседняя при
этом остаётся за краем экрана на 1px - её «границы», о которой
говорит Павел, не видно.
3. Тень сверху. Тень карточки задана со смещением вниз
(0 10px 20px rgba(21,72,137,.08)) - сверху её нет по построению, и
даже будь она, лента обрезала бы её: у ленты overflow-x: auto, а
значит и по вертикали содержимое обрезается. Поэтому на телефоне у
анкеты смещение уменьшено до 4px (тень выходит наверх на 6px), а
ленте добавлено поле сверху 8px. Нижнее поле ленты 24px -> 16px
(нижний край тени - 14px, запас есть), это же и «расстояния
поменьше».
Отрицательный отступ -8px, которым это поле сначала было
скомпенсировано, снят в тот же день - разбор ниже, в разделе 16.
Общая переменная --tenj-bloka не тронута: она держит все карточки
сайта, а правка Павла - только про анкету на телефоне.
Проверено на всех четырёх анкетах подряд, по пять нажатий в каждую
сторону: шаг одинаковый, перекос не больше 0,5px.
Откат: удалить три правила - вернутся карточка во всю ширину,
промежуток 20px и тень со смещением 10px.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .strip[data-b].anketi {
gap: 11px; /* было 20px - под шаг эталонного сценария */
padding-top: 8px; /* место для верхнего края тени, см. раздел 16 */
padding-bottom: 16px; /* было 24px */
}
body.mob #perevodchiki[data-b] .strip[data-b].anketi > .anketa[data-b] {
flex: 0 0 calc(100% - 20px); /* было 100% */
}
body.mob #perevodchiki[data-b] .anketa[data-b] {
box-shadow: 0 4px 20px 0 rgba(21, 72, 137, .10);
}
/* ───────────────────────────────────────────────────────────────────────
15. Стрелки листания на компьютере - тот же серый, что и на телефоне.
Правка 18.08.2026, дочистка после контроля.
Что нашёл контроль. Раздел 14.4 вылечил разнобой стрелок только на
телефоне: оба его правила начинаются с body.mob. В компьютерной ветке
осталось как было - у .next серый rgb(99,103,108) от чужого правила
.next{color:var(--muted)} из dvizhok.css, а у .prev цвет не задан
вообще, и замер даёт color: rgb(0,0,0). Это не наш чёрный #1B1B1B, а
«цвет не назначен»: Chrome рисует чёрным, Safari на iPhone - системным
голубым #007AFF.
Само собой это сейчас не видно: на компьютере обе стрелки скрыты
(эталон: .carbtn{display:none}, показывает их только body.mob). Но
правило должно быть исправным - иначе стоит когда-нибудь показать
стрелки на компьютере, и левая снова окажется цвета «по умолчанию».
Откат: удалить раздел 15 - на компьютере левая стрелка снова останется
без цвета.
─────────────────────────────────────────────────────────────────────── */
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].prev,
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].next {
color: #63676C;
}
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].prev:hover,
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].prev:focus,
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].next:hover,
body:not(.mob) #perevodchiki[data-b] .carbtn[data-b].next:focus {
color: #63676C;
}
/* ───────────────────────────────────────────────────────────────────────
16. Отступ от заголовка до ленты анкет на телефоне: 27px -> 35px.
Правка 18.08.2026, дочистка после контроля.
Что померил контроль: у блока «В активе более 1500 переводчиков»
расстояние от H2 до содержимого - 27px, тогда как ритм телефонной
версии 35px (переменная --sp-block, glavnaya.css, раздел 30). На
компьютере там 70px, то есть ровно --sp-block, и это верно.
Куда девались 8px. Их съедал margin-top: -8px, который в разделе 14.5
стоял у ленты анкет. Отступ ставился, чтобы поле сверху (padding-top:
8px, место под верхний край тени) не сдвинуло карточку вниз. Но у
обёртки .carwrap нет ни своего поля, ни рамки, ни своего контекста
форматирования, поэтому отрицательный отступ ленты сложился с
отступом обёртки - и наверх уехала вся обёртка целиком:
H2 -> .carwrap 35 - 8 = 27px
H2 -> карточка 27 + 8 = 35px
То есть карточка стояла на своём месте, а вот коробка содержимого - на
8px выше ритма. Контроль меряет именно её, и так же меряются все
остальные блоки страницы: у «Отзывов», «Акций», «Качества» и «Вопросов»
от H2 до первого элемента ровно 35px.
Почему нельзя было получить 35 и там, и там. Карточка лежит внутри
ленты, а лента отбита сверху на 8px - иначе верхний край тени срежется
(у ленты overflow-x: auto, а значит по вертикали содержимое
обрезается). Значит карточка всегда на 8px ниже верха ленты, и выбор
один: либо лента на 35 и карточка на 43, либо лента на 27 и карточка
на 35. Взят первый вариант - он совпадает с остальными блоками
страницы, где карточка тоже стоит не вплотную к верху коробки (у
«Отзывов» коробка на 35px, а сама плашка на 41px).
Что стало: отрицательный отступ снят, всё остальное - поле сверху 8px,
поле снизу 16px, промежуток 11px, ширина карточки, тень - не тронуто.
Замер после правки: H2 -> лента 35px, H2 -> карточка 43px, блок стал
выше на 8px.
Откат: вернуть в раздел 14.5 строку margin-top: -8px - лента снова
встанет на 27px от заголовка.
Правило отдельное, а не строкой в 14.5, чтобы разбор стоял рядом с
правкой; само значение по умолчанию (margin-top: 0) переписывать не
нужно, поэтому здесь только этот комментарий.
─────────────────────────────────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════════════════
Правка 19.08.2026: запас под тень у ленты анкет перестал быть расстоянием
───────────────────────────────────────────────────────────────────────
Диктовка Павла: «фиксировать не границу блока, а границу последнего
видимого элемента… здесь последний видимый элемент это не тень, это
именно вот эта белая табличка, и отсюда должно отсчитываться 35».
У ленты анкет по краям стоит пустое поле под тень карточки
(`0 4px 20px` - ей нужно 12 вверх и 20 вниз): сверху 8 точек на
телефоне, снизу 16 на телефоне и 24 на компьютере. Лента режет
содержимое (`overflow-x: auto`), поэтому поле нужно - без него тень
срежется чертой. Но расстоянием оно быть не должно.
Замер до: от H2 «В активе более 1500 переводчиков» до белого края
анкеты 43 на 375 (положено 35); от анкеты до H2 «Цены на услуги бюро
переводов» 69 на 375 и 94 на 1440 (положено 35 и 70).
Даём ленте отрицательные внешние отступы той же величины: коробка
садится на белый край карточки, поле под тень остаётся на месте.
Общее правило - 00_obshchee.css, раздел 5.
Замер после: 35 на 375 сверху; 35 и 70 снизу.
ЗАМЕЧАНИЕ НА БУДУЩЕЕ (правкой не закрыто, Павел про это не говорил).
На телефоне четыре анкеты разной высоты: одна из четырёх на 18 точек
выше остальных, лента их не тянет до общей высоты. Низ блока считается
по самой высокой, поэтому у трёх остальных расстояние до заголовка цен
читается на 18 точек больше. Лечится выравниванием карточек по высоте -
это отдельная правка и отдельное решение Павла.
Откат: удалить раздел - вернутся 43, 69 и 94.
═══════════════════════════════════════════════════════════════════════ */
/* display: flow-root у обёртки .carwrap обязателен: без него
отрицательные отступы ленты «протекают» наружу и складываются с
отступами соседних разделов по правилу схлопывания. Сейчас результат
всё равно выходит верный, но держится на совпадении чисел: стоит
соседу поменять свой отступ - и расстояние молча поедет. С flow-root
коробка блока садится ровно на белый край анкеты, и ритм считается
напрямую. Откат: удалить строку. */
#perevodchiki[data-b] .carwrap[data-b] {
display: flow-root;
}
#perevodchiki[data-b] .strip[data-b].anketi {
margin-bottom: -24px; /* столько же, сколько поле снизу */
}
/* Заодно поле доведено до того, что тени реально нужно. Тень анкеты на
телефоне - `0 4px 20px`: при охвате размытия 16 точек ей нужно 20 вниз
и 12 вверх, а стояло 16 и 8. Замер пикселей под карточкой до правки:
на 16-й точке ещё 252,252,253, семнадцатая уже 255,255,255 - ступенька
3 единицы. После: тень доходит до 254,254,254 и ступеньки нет.
Прибавка в счёт расстояния не идёт - её снимают те же отрицательные
отступы. Откат: вернуть 8px и 16px (раздел 14 выше). */
body.mob #perevodchiki[data-b] .strip[data-b].anketi {
padding-top: 12px; /* было 8 - тень вылезает над карточкой на 12 */
padding-bottom: 20px; /* было 16 - тени нужно 20 */
margin-top: -12px; /* запас есть, а расстоянием не считается */
margin-bottom: -20px;
}
/* ───────────────────────────────────────────────────────────────────────
Продолжение правки 19.08.2026: анкеты на телефоне выровнены по высоте.
Без этого равенство отступов у блока цен не получалось. Из четырёх
анкет одна («Иван») на 18 точек выше остальных - у неё язык переносится
на вторую строку. Высоту ленты задаёт самая высокая карточка, поэтому
низ блока стоял на её краю, а под тремя остальными оставалось лишних
18 точек пустоты. Замер: до заголовка «Цены на услуги бюро переводов»
выходило 53 вместо 35, и число «плавало» в зависимости от того, какая
анкета сейчас на экране.
Почему карточки не тянулись сами: guide.css задаёт анкете `height:
100%`, а растягивание (align-items: stretch у ленты) работает только у
карточек с высотой auto. Возвращаем auto и просим растянуть явно.
Внутри карточки стоит `align-content: start` (раздел 2 этого файла),
поэтому содержимое остаётся прижатым к верху, а лишние точки уходят
вниз - строки анкеты не разъезжаются.
Замер после: все анкеты 340,9; до заголовка цен 35 на любой карточке.
Компьютер не задет: там лента - сетка из четырёх колонок, карточки и
так одной высоты (замер 1440: все четыре 515).
Откат: удалить правило - вернётся разнобой 322,9/340,9 и «плавающие»
53 точки до заголовка цен.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .strip[data-b].anketi > .anketa[data-b] {
height: auto;
align-self: stretch;
}
/* ── Кегль 13: переводчики (диктовка Павла 20.08.2026) ────────────────────
Правки из книги замера «ШРИФТЫ_МОБИЛЬНЫЕ применить на стр. О компании».
Число кегля - переменная --kegl-melkij, задана в
C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\bloki\00_obshchee.css
1. Образование, проект и итог по проектам: было 10,8px, стало 13px.
Селекторы те же, что в разделах выше по файлу, - перебивают порядком.
2. «Стаж» - с большой буквы. Павел: «Стаж - везде в этих блоках с
большой буквы».
Само слово приходит из справочника переводчиков кабинета и общее со
всеми страницами, поэтому правится не текст, а первая буква строки:
::first-letter поднимает регистр. Кегль строки (16px) не трогаем -
Павел его не правил.
Конкурента у text-transform здесь нет, !important не нужен.
Откат: удалить раздел.
─────────────────────────────────────────────────────────────────────── */
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-obrazovanie,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-proekt,
body.mob #perevodchiki[data-b] .anketa[data-b] > p.af[data-b].anketa-itogo {
font-size: var(--kegl-melkij);
}
body.mob #perevodchiki[data-b] .anketa[data-b] > .anketa-staj[data-b]::first-letter {
text-transform: uppercase;
}
/* ═══════════════════════════════════════════════════════════════════════
П-Л. Лента анкет: браузерное прилипание снято
═══════════════════════════════════════════════════════════════════════
ОТКУДА ПРИЕХАЛО. 21.08.2026 Павел принял вид страницы «О компании» как
окончательный и велел перенести всё на главную. Правила переехали сюда
из примерочного слоя
C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\css\site\test_o_kompanii_lenty.css
(раздел 3; слой удалён). Приставка «body.stranica-o-kompanii.mob»
заменена на «body.mob».
Эталон ставит `body.mob .strip.anketi { scroll-snap-type: x mandatory }`.
Прилипание означает, что в покое лента ОБЯЗАНА стоять ровно на анкете, и
любое промежуточное положение браузер тут же подтягивает к ближайшей
карточке. Пока оно включено:
· медленного хода не бывает в принципе - лента скачет через анкету.
Замер на 414x896 до правки: ряд положений 2905, 2541, 2176 - разница
ровно 364-365, то есть ширина анкеты;
· нажатие кнопки на величину меньше половины анкеты возвращается на ту
же анкету - отсюда «кнопки не работают».
Ровное положение при этом никуда не делось: его держит своя доводка в
сценарии
C:\Users\Павел\Claude\Projects\SEO\pilot\wagtail_pilot\pilotsite\home\static\js\site\lenty.js
- и у анкет, и у обеих лент отзывов, и на компьютере тоже, где
браузерного прилипания не было вовсе. Своя доводка ровняет ЦЕЛЬ хода и
доводит ленту после руки, но не запрещает промежуточные положения на
дороге - поэтому медленный ход с ней уживается.
Откат: удалить П-Л - вернётся прилипание и скачки через анкету. */
body.mob #perevodchiki .strip.anketi {
scroll-snap-type: none;
}
body.mob #perevodchiki .strip.anketi .anketa {
scroll-snap-align: none;
}