@charset "UTF-8"; /* vip.css — видимый HTML на VIP.html (режим v-html). Типографика и контейнер — по образцу academia.html / methodology.css. Подключается ПОСЛЕ template.css и common.css. */ html:has(#vip-heading) body { overflow-x: hidden; } html.legacy-safari body { overflow-x: hidden; } /* Фолбэк для Safari на iPad с "движком" (Version/XX в user agent) < 16 — в т.ч. iPad 3 на iOS 9.3.5 и iPad Air 2 на iPadOS 15.8 (максимум для обоих устройств). Класс legacy-safari ставится через JS (см. VIP.html) по токену "Version/XX" + проверке на тач-экран — начиная с iPadOS 13 Safari на iPad маскируется под десктопный Mac в UA, поэтому определять версию по "iPad"/"CPU OS" в строке бесполезно, а проверять Version/XX без тач-фильтра нельзя — так же может задеть настоящие Mac со старым Safari, где всё и так нормально. На затронутых iPad: 1) правило выше с :has() может не срабатывать (не срабатывает на iOS 9; на iPadOS 15.8 сработало бы само, дублируем ради iOS 9); 2) -webkit-overflow-scrolling:touch на .zone-image-2 в паре с переполнением контента (см. п.3) даёт известный старый баг WebKit — контент "протекает" за границы скроллящегося блока; 3) из-за чуть иной раскладки текста 3 из 4 абзацев не влезают на 1-2 слова, добавляя лишнюю строку, из-за чего блок переполняется и возникает баг №2, а цена/контакты визуально уезжают под vip-motto. Фикс: чуть уменьшаем шрифт, чтобы вернуть текст к исходному количеству строк, и отключаем touch-инерцию скролла (не даёт контенту "протекать" за границы на этих старых движках). */ html.legacy-safari body > .content.page-Filial.v-html .zone-image-2 { -webkit-overflow-scrolling: auto; } /* Жёсткая фиксация переноса строк на мобильных. В template.css есть "*, *:before, *:after{-webkit-text-size-adjust:none}" — это ПРЯМОЕ правило на каждом

/ и т.д., оно не наследуется от и побеждает любые попытки переопределить text-size-adjust выше по дереву. Мобильный Safari/Chrome в узких колонках всё равно автоматически увеличивают шрифт "для читаемости" в обход этого старого значения "none" (в современных версиях WebKit оно ненадёжно) — из-за этого перенос строк на телефоне/планшете отличается от десктопа. Перебиваем то же свойство напрямую на самих текстовых элементах (специфичность класса выше специфичности "*") значением "100%", которое поддерживается надёжнее. */ html body > .content.page-Filial.v-html .zone-image-2, html body > .content.page-Filial.v-html .zone-image-2 *, html body > .content.page-Filial.v-html > .vip-motto, html body > .content.page-Filial.v-html > .vip-motto * { -webkit-text-size-adjust: 100% !important; -moz-text-size-adjust: 100% !important; text-size-adjust: 100% !important; } html body > .content.page-Filial.v-html .zone-image-2 { top: 7.3015873016rem; left: 2.5396825397rem; width: 76.1904761905rem; height: calc(93.5069444444% - 7.3015873016rem); margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 1; font-size: 1rem; line-height: 1.206349rem; white-space: normal; box-sizing: border-box; color: #777777; text-align: justify; } html body > .content.page-Filial.v-html .zone-image-2 .title, html body > .content.page-Filial.v-html .zone-image-2 h2, html body > .content.page-Filial.v-html .zone-image-2 .vip-line { white-space: normal; overflow-wrap: break-word; } html body > .content.page-Filial.v-html .zone-image-2 .title { text-align: center; margin-bottom: 0; } html body > .content.page-Filial.v-html .zone-image-2 h2.title { font-size: 1.1587rem; padding-top: 0.57rem; margin: 0.8888888889rem 0; line-height: normal; } html body > .content.page-Filial.v-html .zone-image-2 .vip-main { display: block; width: 100%; margin: 0.8888888889rem 0 0; padding: 0; } /* Сетка строк: фиксированная высота строки 1.206349rem — как в academia.css/training.css. Перенос строк не зависит от браузера или устройства: текст разбит на строки вручную, по факту desktop- раскладки, а не пересчитывается движком заново на каждом экране. */ html body > .content.page-Filial.v-html .zone-image-2 .vip-line:not(.vip-line-end) { display: block; width: 100%; height: 1.206349rem; overflow: hidden; line-height: 1.206349rem; margin: 0; padding: 0; word-spacing: normal; white-space: normal; text-align: justify; text-align-last: justify; } html body > .content.page-Filial.v-html .zone-image-2 .vip-line.vip-line-gap { margin-top: 1rem; } /* Последняя строка каждого абзаца — влево, без justify */ html body > .content.page-Filial.v-html .zone-image-2 .vip-line.vip-line-end { display: block; width: 100%; height: 1.206349rem; overflow: hidden; line-height: 1.206349rem; margin: 0; padding: 0; text-align: left; text-align-last: left; } html body > .content.page-Filial.v-html .zone-image-2 .vip-line:not(.vip-line-end)::after { content: ''; display: inline-block; width: 100%; } html body > .content.page-Filial.v-html .zone-image-2 .vip-line * { line-height: 1.206349rem; } /* Цены и контакты — те же однострочные .vip-line, но без justify: строки короткие и не должны растягиваться на всю ширину. Выравнивание наследуется от родителя (.vip-pricing — влево, .vip-contact — вправо). */ html body > .content.page-Filial.v-html .zone-image-2 .vip-pricing .vip-line, html body > .content.page-Filial.v-html .zone-image-2 .vip-contact .vip-line { display: block; height: 1.206349rem; line-height: 1.206349rem; overflow: hidden; margin: 0; padding: 0; white-space: normal; overflow-wrap: break-word; text-align: inherit; text-align-last: auto; } html body > .content.page-Filial.v-html .zone-image-2 .vip-pricing .vip-line::after, html body > .content.page-Filial.v-html .zone-image-2 .vip-contact .vip-line::after { content: none; } /* Цены и контакты: 1rem + 145px; +7px компенсация подъёма абзацев; −1 строка */ html body > .content.page-Filial.v-html .zone-image-2 .vip-bottom { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-top: 2.2063494127rem; /* было 3.4126984127rem (−1.206349rem) */ } html body > .content.page-Filial.v-html .zone-image-2 .vip-pricing { flex: 1 1 auto; margin: 0; } html body > .content.page-Filial.v-html .zone-image-2 .vip-contact { flex: 0 0 auto; margin: 0; text-align: right; line-height: 1.206349rem; } html body > .content.page-Filial.v-html .zone-image-2 .color-gray-dark, html body > .content.page-Filial.v-html .zone-image-2 strong.color-gray-dark { color: #555; } html body > .content.page-Filial.v-html .zone-image-2 .vip-contact a { color: inherit; text-decoration: none; } html body > .content.page-Filial.v-html > .vip-motto { white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; overflow: hidden; } html body > .content.page-Filial.v-html > .vip-motto .vip-motto-line { display: inline-block; white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; } @media screen and (max-width: 1400px) { html body > .content.page-Filial.v-html > .vip-motto { font-size: 1.02rem; } html body > .content.page-Filial.v-html > .vip-motto .vip-motto-line { letter-spacing: -0.01em; } } html[data-theme="dark"] body > .content.page-Filial.v-html .zone-image-2 .color-gray, html[data-theme="dark"] body > .content.page-Filial.v-html .zone-image-2 .color-gray .vip-line { color: #7e7e7e; } html[data-theme="dark"] body > .content.page-Filial.v-html .zone-image-2 h2.title.color-gold { color: #f2ce88; } html[data-theme="dark"] body > .content.page-Filial.v-html .zone-image-2 .color-gray-dark { color: #bdbdbd; } @supports (-webkit-appearance: none) { html body > .content.page-Filial.v-html .zone-image-2, html body > .content.page-Filial.v-html .zone-image-2 .vip-line, html body > .content.page-Filial.v-html .zone-image-2 .vip-line *, html body > .content.page-Filial.v-html .zone-image-2 .vip-pricing, html body > .content.page-Filial.v-html .zone-image-2 .vip-contact { line-height: 1.206349rem; -webkit-font-smoothing: antialiased; } html body > .content.page-Filial.v-html .zone-image-2 h2.title { line-height: normal; -webkit-font-smoothing: antialiased; } }