/* Перенесённые страницы: только читаемость, без своего оформления. Дизайн этих страниц - отдельный этап после приёмки переноса. */ .pblk { max-width: var(--shirina-sajta, 1172px); /* значение - shapka.css, раздел 27 */ margin: 0 auto 28px; padding: 0 16px; } .pblk h1 { font-size: 32px; line-height: 1.2; margin: 0 0 16px; } .pblk h2 { font-size: 26px; line-height: 1.25; margin: 28px 0 12px; } .pblk h3 { font-size: 21px; line-height: 1.3; margin: 22px 0 10px; } .pblk h4, .pblk h5, .pblk h6 { font-size: 18px; margin: 18px 0 8px; } .pblk p, .pblk li { font-size: 16px; line-height: 1.55; } .pblk ul, .pblk ol { padding-left: 22px; } .pblk img { max-width: 100%; height: auto; } .pblk table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 15px; } .pblk th, .pblk td { border: 1px solid #d7d7d7; padding: 8px 10px; text-align: left; vertical-align: top; } .pblk th { background: #f4f4f4; font-weight: 600; } /* Широкая таблица прокручивается внутри себя, страница по горизонтали - нет. */ .pblk table { display: block; overflow-x: auto; } /* Слишком длинное «слово» переносится, а не распирает страницу (правка 24.08.2026, найдено при сверке шрифта Inter). ЧТО НАШЛОСЬ. На публичной оферте есть абзац бланка: «г. ________________ « » _________________ 20__г. ____________ в лице _________________________________________, с одной стороны, ...» Подряд идущие подчёркивания браузер считает ОДНИМ словом и переносить его не имеет права. Абзац шириной 494 не влезал в колонку 262,4, и страница ехала вбок. Замер на телефоне, переполнение документа в точках: ширина было (системный) стало (Inter) после правки 320 157 202 0 375 103 147 0 414 63 108 0 Дефект не наш и старше правки шрифта: подчёркивания не влезали и системным шрифтом. Но у Inter знак подчёркивания шире, и вылет вырос на 45 точек на каждой ширине, поэтому чинится здесь же. ЧТО ДЕЛАЕТ ПРАВИЛО. «overflow-wrap: break-word» разрешает разорвать слово ТОЛЬКО тогда, когда оно не помещается в строку целиком. Обычный текст, где всё влезает, оно не трогает вовсе - поэтому на остальных страницах не меняется ни одна строка (сверка слепков это подтвердила). Откат: удалить это правило. Вернётся горизонтальная прокрутка на оферте и на любой странице с длинной чертой из подчёркиваний. */ .pblk p, .pblk li, .pblk td, .pblk th, .pblk dd { overflow-wrap: break-word; } .pblk details { margin: 10px 0; } .pblk summary { cursor: pointer; font-weight: 600; } /* ── Телефон: H1 такой же, как на остальном сайте ───────────────────── Правка Павла 07.09.2026: «у статей стали разные H1 - где-то совпадают, где-то совершенно огромные. H1 должен быть один везде, как по канону, сейчас идёт разброс». ЧТО БЫЛО (замер 07.09.2026 на ширине 375). Главная и все страницы услуг - 24 / 28,8. Статьи блога, «О компании», «Контакты» и прочие перенесённые страницы - 32 / 38,4. Разница видна сразу при переходе со статьи на услугу, и на узком экране длинный заголовок статьи занимал по пять строк. Правило стоит здесь, а не в типографике текстовых страниц: этот файл подключают ВСЕ перенесённые страницы, а tekstovaya_stranica.css - только блог и вакансии. Иначе часть страниц осталась бы с прежним размером. Компьютер не тронут: там у текстовой страницы 32 / 38,4, у страницы услуги 40 / 46 - это разные первые экраны, и про компьютер речи не было. Числа Hero телефона (24 / 28,8) взяты из канона, раздел 2. Откат: удалить раздел - заголовки статей вернутся к 32 / 38,4. */ @media (max-width: 900px) { .pblk h1 { font-size: 24px; line-height: 28.8px; } } /* ── 3.34. Карта сайта: ссылки корпоративным красным ──────────────────── Пункт 3.34 сводного пакета (К2-42), диктовка Павла 08.09.2026: «Сейчас все ссылки указаны синим. Нужно, чтобы они были нашим корпоративным красным». Замер на стенде 08.09.2026: на /sitemap/ 135 ссылок цвета rgb(0, 0, 238) - это браузерный синий по умолчанию. Своего правила у перечня страниц не было вовсе: ссылки перенесены голыми, без класса. Красим по месту - перечень внутри страницы карты, - а не все ссылки сайта: у крошек, подвала и кнопок свои цвета, и трогать их нельзя. Подчёркивание оставляем: перечень длинный, ссылки стоят подряд, и без подчёркивания красный текст читался бы просто как выделение. Откат: удалить раздел - ссылки снова станут синими. */ body.stranica-sitemap main ul a, body.stranica-sitemap main ol a, body.stranica-sitemap main li a { color: var(--cvet-bordo, #8c1821); } @media (hover: hover) and (pointer: fine) { body.stranica-sitemap main li a:hover { color: #a01c26; } } /* ── 3.31. «Способы оплаты»: три блока в ряд ─────────────────────────── Диктовка Павла 08.09.2026 (пункт 3.31, К2-39): «Страница до сих пор не оформлена. Оформить аккуратно, как сделано на сайте: три отдельных блока, три блока в ряду; визуалы - слева калькулятор, посередине СБП, справа дензнаки; заголовки блоков - жирным или тем каноном, который делается для кнопочек; текст "Для подготовки счёта..." - обычным текстом; три кнопки: "Запросить счёт", "Оплатить онлайн", "Схема проезда"; мобильная версия: то же самое в один столбец, три блока один над другим». Замер стенда 09.09.2026 до правки: страница показывала сырой перенос - картинки и абзацы подряд, две кнопки с пустым адресом. Сама карточка (белый лист, скругление, тень, поля) приходит от общего компонента `.card3` сетки главной - своих правил на это не заводим (канон, раздел 5г). Здесь только то, чего у компонента нет: значок сверху, кнопка внизу и один столбец на телефоне. Откат: удалить раздел. */ /* Три блока в ряд. Своя раскладка, а не модификатор «kart3» карточек главной: с ним приезжает вид «значок сбоку», и значок ужимается до 46 точек правилом с «!important». */ body.stranica-sposoby-oplaty .cards3.opl-ryad { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; } body.stranica-sposoby-oplaty .opl-ryad .card3 { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; height: 100%; } /* Значок способа оплаты: тот же размер, что у карточек главной. */ /* Значок способа оплаты. Важность - потому что общий слой карточек задаёт значку 70 или 44 точки своим правилом с «!important» (замер стенда 09.09.2026: выходило 44x44, значок терялся). Павел назвал визуалы отдельным пунктом задания, поэтому они должны читаться. */ body.stranica-sposoby-oplaty .opl-ryad .card3 .cardimg, body.stranica-sposoby-oplaty .opl-ryad .card3[data-b] .cardimg { height: 84px !important; width: auto !important; max-width: 100%; object-fit: contain; } body.stranica-sposoby-oplaty .opl-nazvanie { margin: 0; font-size: 16px; font-weight: 650; line-height: 1.3; } body.stranica-sposoby-oplaty .opl-tekst { margin: 0; font-size: 13px; line-height: 17.55px; color: #3d4247; } /* Кнопка прижата к низу карточки: у блоков текст разной длины, иначе кнопки идут лесенкой. */ body.stranica-sposoby-oplaty .opl-ryad .card3 .tp-knopka { margin-top: auto; } /* Телефон: три блока один над другим, значок виден, кнопка по колонке. Замеры стенда 09.09.2026, две попытки: · без приставки `body.mob` правило сетки проиграло мобильному слою карточек (`body.mob .cards3` в guide.css и glavnaya-b.css) - сетка осталась в два столбца по 166 точек, карточка выросла до 1941; · там же значок прятался правилом свёрнутой карточки (`display: none`): у наших блоков свёртки нет, значок обязан быть виден - Павел назвал визуалы отдельным пунктом; · кнопка «Запросить счёт» не влезала в колонку 166 и уезжала за край: документ становился 532 точки при экране 375, страницу таскало вбок. Кнопке нужен потолок по колонке. Правила без `@media`: признак `body.mob` сам по себе означает телефон, а лишняя обёртка только запутывает каскад. */ /* «!important» здесь не украшение: мобильный слой карточек в guide.css задаёт `body.mob .cards3 { grid-template-columns: repeat(2, ...) !important }`. Обычная декларация ему проигрывает при любой специфичности - это выяснил замер стенда 09.09.2026, третья попытка. Файл guide.css общий для всего сайта, трогать его правило ради одной страницы нельзя. */ body.mob.stranica-sposoby-oplaty .cards3.opl-ryad, body.mob.stranica-sposoby-oplaty .cards3[data-b].opl-ryad { grid-template-columns: minmax(0, 1fr) !important; } /* На телефоне значок задаётся ШИРИНОЙ, а высота считается сама. При заданной высоте общий слой всё равно ужимал ширину, и снимок 95x81 выходил 46x84 - растянутым по вертикали (замер стенда 09.09.2026). */ body.mob.stranica-sposoby-oplaty .opl-ryad .card3 .cardimg, body.mob.stranica-sposoby-oplaty .opl-ryad .card3[data-b] .cardimg { display: block; width: 84px !important; height: auto !important; } /* Кнопка не шире своей карточки - на любом экране. */ body.stranica-sposoby-oplaty .opl-ryad .card3 .tp-knopka { max-width: 100%; box-sizing: border-box; } /* Внутренняя раскладка карточки на телефоне. Замер стенда 09.09.2026, четвёртая попытка: карточка приходила сеткой мобильного слоя - `grid-template-columns: 303px 0px` и область «risunok» под значок слева (вид карточек главной, где значок стоит сбоку от текста). Название и кнопка попадали во ВТОРУЮ колонку нулевой ширины: их левый край оказывался на 346 точке при экране 375, кнопка растягивалась до 532 и таскала страницу вбок. Здесь карточка - обычный столбец: значок, название, текст, кнопка. Важность по той же причине, что у сетки выше: правило мобильного слоя объявлено с «!important». */ body.mob.stranica-sposoby-oplaty .opl-ryad .card3, body.mob.stranica-sposoby-oplaty .opl-ryad .card3[data-b] { display: flex !important; flex-direction: column !important; align-items: center !important; grid-template-columns: none !important; text-align: center; } body.mob.stranica-sposoby-oplaty .opl-ryad .card3 > * { grid-area: auto !important; max-width: 100%; } body.mob.stranica-sposoby-oplaty .opl-ryad .card3 .tp-knopka { min-width: 0; } /* ── Пункт 25 мобильного задания 09.09.2026: на телефоне встроенных ──── форм на странице оплаты нет Дословно: «в мобильной версии страницы сделать исключение: встроенных форм заявки и оплаты в конце страницы быть не должно. Оставить три основные плашки… отдельную встроенную форму "Оплата заказа" убрать из мобильного содержимого страницы… встроенную форму "Запросить счёт на оплату" также убрать из нижней части мобильной страницы. Запрос счёта должен открываться всплывающим окном, как уже сделано в начале страницы». Блоки остаются в разметке и на компьютере видны как прежде: Павел назвал исключение именно для мобильной версии. На телефоне они скрыты, а кнопки плашек открывают те же формы всплывающим окном (js/site/overlay.js). Откат: удалить раздел - формы снова появятся внизу мобильной страницы. */ body.mob.stranica-sposoby-oplaty #oplata, body.mob.stranica-sposoby-oplaty #zayavka { display: none; }