/* ============================================================ ПМК — страница «Оборудование под льготную ставку» (/oborudovanie/) ------------------------------------------------------------ Свёрстана 16.09.2026 по ТЗ «ТЗ страниц/oborudovanie.md». Семь листов из восьми собраны из словаря base.css без единого нового решения. Новое решение одно и названо в ТЗ — БЛОК ПОИСКА по реестру (лист 03): существующего компонента под «человек вводит, страница отвечает» на сайте нет, форма отдаёт заявку, аккордеон и вкладки переключают готовое, подсказка .punkt показывает одну строку. Всё, что удалось, поиск берёт готовым: поле — .pole/.pole__vvod из формы, кнопка — .knopka, рама — белая панель с рамкой и полем, как .tabl-rama. Компонент, переехавший в base.css 16.09.2026 (правило «компонент второй страницы — в общий файл»): .spisok--dvakol, он понадобился перечню реестра на листе 06, а стоял в glavnaya.css. Фоны листов (смежные не совпадают): 01 fon-2 — 02 белый — 03 sinij-fon — 04 белый — 05 fon-2 — 06 белый — 07 fon-2 — 08 белый — подвал тёмный. Тёмных зон нет: своих снимков у страницы пока нет, а тёмное на сайте даёт только фотография (ДИЗАЙН-СИСТЕМА 2.4). Акценты листов (1–2 на лист): 01 полоса фактов — 02 красная карточка запрета — 03 поле поиска — 04 таблица порогов и строка-вывод — 05 четыре карточки — 06 весь реестр списком и врезка «8 млн ₽» — 07 строка-вывод — 08 крупная кнопка. Красного на странице два места: верхняя линия и число карточки запрета (лист 02) и знак «нельзя» у найденного кода (лист 03). Оба — «нельзя», разрешённое применение (ДИЗАЙН-СИСТЕМА 2.3); доля площади заметно меньше 2 %. Адаптив — по лестнице base.css, блок медиазапросов в конце файла. Общие компоненты несут свой адаптив из base.css. ============================================================ */ /* ================= ЛИСТ 01 — Первый экран ================= Герой .geroy--foto целиком живёт в base.css, включая полосу фактов и адаптив. Одно правило страницы — растушёвка снимка, и оно ВРЕМЕННОЕ. Кадры героя на сайте сняты под эту раскладку: 2.3:1, сюжет справа, слева намеренно пустое поле под текст. У страницы своего кадра пока нет, стоит снимок 3:2 из набора программ главной, и сюжет в нём доходит до середины: с базовыми долями лид ложится прямо на него. Поэтому чистое поле шире, а низ гасится раньше — полоса фактов должна читаться на ровном фоне. Меняются те же переменные, что у .geroy--kompaktnyj (base.css), новых значений нет. СО СВОИМ КАДРОМ ЭТОТ БЛОК СНЯТЬ. */ .geroy--foto .geroy__foto{--rastushevka-levo:46%;--rastushevka-levo-konec:88%; --rastushevka-niz:26%;--rastushevka-niz-konec:52%} /* ================= ЛИСТ 02 — Три риска ================= Карточки-показатели base.css. Страница добавляет две вещи. 1. Карточка запрета: верхняя линия и число красные. Это «нельзя» — разрешённое применение --krasnyj. Селектор с двумя классами (0,2,0) — ровно как у базового «.kartochka .kartochka__znachenie»: одноклассовый проиграл бы ему при любом порядке файлов (грабля «класс + тег бьёт класс», здесь её родня). 2. Значение словом, а не числом: кегль на ступень меньше числового — приём .fakt--slovo полосы фактов. Тот же расчёт специфичности. */ .kartochka--zapret{border-top-color:var(--krasnyj)} .kartochka.kartochka--zapret .kartochka__znachenie{color:var(--krasnyj)} .kartochka .kartochka__znachenie--slovo{font-size:28px;line-height:1.15} /* Источник в карточке прижат к низу (.ssylka-punkt в base.css уже имеет margin-top:auto), но у карточек риска ссылки разной длины — верхнее поле держит строку от текста. */ .riski .ssylka-punkt{padding-top:18px} /* ================= ЛИСТ 03 — Поиск по реестру ================= ЕДИНСТВЕННОЕ НОВОЕ РЕШЕНИЕ СТРАНИЦЫ. Без JavaScript блок не показывается вовсе (требование ТЗ: мёртвое поле ввода читается как поломка). Гейт — класс .js на , он ставится встроенной строкой в , до отрисовки: иначе блок мигает пустым местом. Вместо блока без скриптов остаётся noscript с текстом и кнопкой. Индекс (470 КБ) грузится по первому обращению к полю, не вместе со страницей — это правило живёт в oborudovanie.js, здесь только состояния выдачи. */ .poisk{display:none} .js .poisk{display:block} /* Рама поиска — та же панель, что у таблицы: белый фон, рамка 1px --linia, поле 28/32. Подложка не липнет к фону листа (правка заказчика 14.09.2026). */ .poisk__rama{background:#fff;border:1px solid var(--linia);padding:28px 32px} .poisk__forma{display:flex;align-items:flex-end;gap:16px} .poisk__pole{flex:1 1 auto;min-width:0} /* Кнопку сжимать нельзя — давление уйдёт в поле ввода (грабля web-grabli про flex и шапку). */ .poisk__knopka{flex:0 0 auto} /* Примеры запросов: слово с пунктиром, как .ssylka-punkt — опознавательный знак сайта. Это кнопки, а не ссылки: они меняют содержимое страницы, а не ведут на адрес; клавиатура и тач получают их бесплатно. */ .poisk__primery{margin-top:14px;font-family:var(--text);font-size:13px;line-height:1.45;color:var(--seryj-2);display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px} .poisk__primer{background:none;border:0;padding:0;cursor:pointer;font-family:var(--text);font-size:13px;line-height:1.45;color:var(--seryj);border-bottom:1px dotted var(--seryj-2);transition:color .12s,border-bottom-color .12s} .poisk__primer:hover{color:var(--chernila);border-bottom:1px solid var(--seryj)} .poisk__otvet{margin-top:24px;border-top:1px solid var(--linia-2);padding-top:22px} .poisk__podskazka,.poisk__sostoyanie{font-size:15px;line-height:1.6;color:var(--seryj)} /* Счёт найденного — числовой слой, как заголовки колонок. */ .poisk__schet{font-family:var(--sans);font-size:13px;font-weight:500;color:var(--seryj-2);margin-bottom:18px} /* Найденный код: строка выдачи. Код числовым слоем, название текстом, под ними числа реестра и знаки условий. Строки разделены волосяной линией — приём перечня из словаря. */ .nahodki{display:grid} .nahodka{padding:18px 0;border-top:1px solid var(--linia-2)} .nahodka:first-child{border-top-color:transparent;padding-top:0} .nahodka__shapka{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px} .nahodka__kod{font-family:var(--sans);font-size:20px;font-weight:500;line-height:1.2;color:var(--sinij);font-variant-numeric:tabular-nums} .nahodka__imya{font-size:16px;line-height:1.5;color:var(--chernila);min-width:0} .nahodka__cifry{display:flex;flex-wrap:wrap;gap:6px 32px;margin-top:10px} .nahodka__chislo{font-size:14px;line-height:1.45;color:var(--seryj)} .nahodka__chislo b{font-family:var(--sans);font-size:28px;font-weight:300;line-height:1.1;color:var(--sinij);font-variant-numeric:tabular-nums;display:block} /* Знак условия: боковая линия-указатель 3px. Синяя — про порог, красная — про запрет. Красный здесь именно «нельзя». */ .nahodka__znak{margin-top:12px;border-left:3px solid var(--sinij);padding-left:16px;font-size:15px;line-height:1.55;color:var(--chernila)} .nahodka__znak b{font-family:var(--sans);font-size:13px;font-weight:500;color:var(--sinij);display:block;margin-bottom:2px} /* Модификатор идёт ПОСЛЕ общего правила: специфичность у них одинаковая (0,1,1), и порядок решает. Переставленный выше, он молча проигрывал бы — заголовок знака «нельзя» рисовался бы синим. */ .nahodka__znak--zapret{border-left-color:var(--krasnyj)} .nahodka__znak--zapret b{color:var(--krasnyj)} /* Ничего не нашлось — спроектированное состояние, а не тупик. */ .poisk__pusto{font-size:16px;line-height:1.6;color:var(--chernila);max-width:68ch} .poisk__deystvie{margin-top:20px} .poisk__ogovorka{margin-top:28px} .poisk__ogovorka+.ssylka-punkt{margin-top:18px} /* ================= ЛИСТ 04 — Пороги ================= Таблица редакции 3 в раме (base.css). Колонка порога — числовая (.chislo): tabular-nums, вправо, неразрывно. Ось слева шире содержимого: в ней длинные названия условий, и без ширины они рвутся на четыре строки. */ .tabl--porogi{table-layout:fixed} .tabl--porogi th:first-child{width:38%} .tabl--porogi .chislo{width:18%} .tabl--porogi td:last-child{color:var(--seryj)} .porogi__istochnik{margin-top:16px} /* ================= ЛИСТ 05 — Четыре выхода ================= Сетка карточек base.css, но в два столбца, а не в четыре: четыре в ряд дают 266px на карточку даже на 1440, а на 1025–1180 — 220–260px, и текст рвётся на две-три слова в строке (грабля web-grabli). Раскладка 2×2 заодно отличает лист от ряда из трёх карточек листа 02. Своя ступень на ≤768 нужна потому, что правило страницы перебивает медиазапрос base.css: файл грузится позже, специфичность та же. */ .vyhody{grid-template-columns:repeat(2,minmax(0,1fr))} .vyhody__deystvie{margin-top:36px} /* ================= ЛИСТ 06 — Реестр промышленного дизайна ================= Весь реестр целиком: три группы, в каждой перечень в две колонки (.spisok--dvakol, base.css). Номер регистрации — подпись под названием: числовой слой, Geologica 13/500. */ .reestr__gruppa+.reestr__gruppa{margin-top:36px} .reestr__gruppa .zag-kolonki{margin-bottom:16px} .reestr .spisok li{font-size:16px;line-height:1.5} .reestr__nomer{display:block;font-family:var(--sans);font-size:13px;font-weight:500;line-height:1.3;color:var(--seryj-2);font-variant-numeric:tabular-nums;margin-top:2px} .promdizajn__schet{margin-top:44px;margin-bottom:0} .promdizajn__schet+.ssylka-punkt{margin-top:16px} /* ================= ЛИСТ 07 — Срок записи ================= Лист намеренно скромный: страница для заёмщика, производителю отдан один короткий блок без нажима. Кнопка контурная — действие второстепенное относительно заявки листа 08. */ .zapis__deystvie{margin-top:28px} /* ================= ЛИСТ 08 — Форма ================= Раскладка формы и обёртка .zayavka__forma живут в base.css. */ /* ================= АДАПТИВ ================= Лестница брейкпоинтов base.css. Здесь только то, что принадлежит листам этой страницы. */ @media (max-width:1024px){ .poisk__rama{padding:22px} .tabl--porogi{table-layout:auto} .tabl--porogi th:first-child,.tabl--porogi .chislo{width:auto} } @media (max-width:768px){ /* Карточки выходов в один столбец — ступень base.css, повторённая для правила страницы. */ .vyhody{grid-template-columns:1fr} } @media (max-width:767px){ /* Поле и кнопка в столбец: на узком экране кнопка с nowrap давит на поле ввода и оставляет от него полоску. */ .poisk__forma{flex-direction:column;align-items:stretch;gap:14px} .poisk__knopka{width:100%;text-align:center} .poisk__rama{padding:20px 16px} .nahodka__cifry{gap:6px 24px} /* Число в карточке риска на узком экране не должно занимать две строки вместе со словом. */ .kartochka .kartochka__znachenie--slovo{font-size:24px} } @media (max-width:479px){ .nahodka__kod{font-size:18px} .nahodka__chislo b{font-size:24px} } /* ================= ПЕЧАТЬ ================= Выдача поиска печатается в том виде, в каком она на экране: это результат запроса читателя, а не скрытое содержимое. Блок поиска без JavaScript не существует, поэтому на бумаге у него нет промежуточных состояний, которые надо доводить. */ @media print{ .poisk__primery,.poisk__deystvie,.vyhody__deystvie,.zapis__deystvie{display:none} }