/* pbn-enhance.css — дополнения к style.css макета webmaster30.ru под токен-движок BablO$.
   Статичная часть: сид страниц (bin/pbn/webmaster30_2_pages.php) копирует этот файл в
   public/sites/webmaster30-ru/assets/a/9c364f5e7b7e.css и дописывает в конец маски иконок .ico--<ключ>.
   Только переменные и классы макета; своих классов нет — кроме служебных классов движка
   (.bf-msg, .bf-err, .pdo-pagenav, .pdo-pagebtn, .active). */

/* 1. Иконки из данных (карточки «Типы сайтов» «Создания сайтов» и «Каналы» «Продвижения» — колонка icon строк MIGX):
   значения экранируются, SVG туда нельзя. В разметке — <i class="ico ico--<ключ>"> с классами <svg> icon() макета, форма —
   маской .ico--<ключ>{--ic:url("data:image/svg+xml,…")} из того же SVG (маски дописывает сид страниц), цвет —
   currentColor обёртки (.type__icon, .channel__icon — var(--accent)), как stroke="currentColor" у SVG макета.
   display:block — как у svg в сбросе style.css. Правило — только для <i>: у настоящих <svg> макета те же классы */
i.ico{display:block;flex:0 0 auto;background-color:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
/* ключ не задан — без маски <i> залился бы сплошным квадратом цвета иконки */
i.ico--{display:none}

/* 2. Необязательные строки: пустое значение — строки нет (у макета — if (!empty($heroLead)) или значение всегда задано,
   пустым его делает только админка): лид шапки и героя, подпись справа от вступления направления, текст CTA-полосы,
   текст технологий, текст формы, текст 404, надписи и заголовки секций из TV */
.pagehero__lead:empty,.hero__lead:empty,.sintro__note:empty,.cta__text:empty,.tech__text > p:empty,
.leadform__aside > p:empty,.notfound > p:empty,.section__head > .mono-label:empty,.section__head > h2:empty,
.hero__label:empty{display:none}

/* 3. Наборы без строк (у макета списки всегда заполнены): секции со списком из данных нет, а не одна шапка секции;
   пустые пилюли плитки, пункты тарифа и канала, примечание к ценам и ссылки 404 — без пустых рамок и отступов.
   Списки в разметке записаны вплотную к тегу (<div class="types">[[migx…]]</div>), поэтому :empty срабатывает */
.section:has(> .container > :is(.tiles,.promos,.terms,.values,.numbered,.comps,.types,.channels,.plans,.linelist,.pricecards):empty){display:none}
.tech > .chips:empty,.tile__chips:empty,.plan__list:empty,.channel__list:empty,.pricenote:empty,.notfound__links:empty{display:none}

/* 4. «Текст» страницы ([[*content]]). Секция .prose privacy.php (текстовая страница; «Работы», «Цены», лента и рубрика —
   у макета там свободного текста нет): пустой «Текст» — секции нет. Вступления главной, «Услуг» и «О студии» без текста —
   одна надпись (и заголовок) — секции тоже нет */
.section:has(> .container--narrow > .prose:empty){display:none}
.section:has(> .introtext > :is(.mono-label,h2):last-child),.section:has(> .aboutlead > .mono-label:last-child){display:none}

/* 5. «Текст» во вступлении направления: у макета первый абзац .sintro__text стоит с инлайн-отступом 22px от надписи
   (style="margin-top:22px"); в «Тексте» из админки инлайн-стиля нет — тот же отступ правилом */
.sintro__text > .mono-label + *{margin-top:22px}

/* 6. Текст из админки в колонках текста макета (.introtext, .aboutlead, .sintro__text, .contacts__aside): у макета там
   только абзацы; подзаголовки, списки, цитаты и таблицы сгенерированного текста — видом .prose макета (маркер и номер
   цветом var(--accent), моноширинный номер, линия цитаты), отступы — как у абзацев этих колонок */
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > :is(ul,ol,blockquote,table){margin-top:16px}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > :is(ul,ol,blockquote,table) + p{margin-top:16px}
:is(.introtext,.aboutlead,.sintro__text) > :is(p,ul,ol,blockquote,table) + :is(h2,h3){margin-top:32px}
:is(.aboutlead,.sintro__text) > :is(h2,h3) + *,.introtext > h3 + *{margin-top:16px}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > h3{font-family:var(--font-display);font-weight:400;font-size:1.25rem;line-height:1.3}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > :is(ul,ol){display:flex;flex-direction:column;gap:10px;padding-left:0;color:var(--ink-soft)}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > ul > li{display:grid;grid-template-columns:18px 1fr;gap:12px;align-items:start}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > ul > li::before{content:"";width:6px;height:6px;margin-top:10px;margin-left:4px;border-radius:50%;background:var(--accent)}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > ol{counter-reset:prose-counter}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > ol > li{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start;counter-increment:prose-counter}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > ol > li::before{content:counter(prose-counter, decimal-leading-zero);font-family:var(--font-mono);font-size:.875rem;color:var(--accent);padding-top:3px}
:is(.introtext,.aboutlead,.sintro__text,.contacts__aside) > blockquote{border-left:2px solid var(--accent);padding-left:20px;font-family:var(--font-display);font-size:1.25rem;line-height:1.45;color:var(--ink)}
:is(.introtext,.aboutlead,.sintro__text) > p a,:is(.introtext,.aboutlead,.sintro__text) > ul a{border-bottom:1px solid var(--line)}

/* 7. Таблицы, картинки и видео в .prose (статьи и тексты с живого сайта, сгенерированный текст): у макета в .prose их нет —
   вид таблицы .tablewrap/.ptable макета с прокруткой на узком экране, картинка — со скруглением .prose figure img */
.prose img{border-radius:var(--radius);height:auto}
.prose table{display:block;width:100%;overflow-x:auto;background:var(--white);border-radius:var(--radius);font-size:.9375rem}
.prose th,.prose td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.prose thead th{font-family:var(--font-mono);font-weight:400;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft)}
.prose iframe{width:100%;height:auto;aspect-ratio:16/9;border:0;border-radius:var(--radius)}

/* 8. Пустое состояние сеток: у макета if/else — «Работы по этому направлению скоро появятся в портфолио.» (works-grid.php)
   и «В этой рубрике пока нет статей…» (blog.php) вместо сетки. Здесь абзац стоит перед сеткой всегда и скрыт, если за ним
   сетка есть */
.text-soft:has(+ .grid){display:none}

/* 9. «Читайте также» статьи: related_articles() макета — сначала статьи той же рубрики, потом остальные, всего 3; здесь это
   два списка движка в одной сетке — лишние сверх трёх скрыты; нет ни одной — секции нет (if ($articleRelated)) */
article.section + .section--light .grid--3 > :nth-child(n+4){display:none}
article.section + .section--light:has(.grid--3:empty){display:none}

/* 10. Листание ленты — навигация движка на месте nav.pagination макета («‹ 1 2 ›» после сетки): вид .pagination и
   .pagination__link (у кнопок движка инлайн-стили — поэтому !important), текущая — как .pagination__link.is-active,
   крайние неактивные — как .pagination__link[aria-disabled="true"] */
.pdo-pagenav{justify-content:center!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important;margin:40px 0 0!important}
.pdo-pagenav .pdo-pagebtn{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px!important;border:1px solid transparent!important;border-radius:var(--radius-pill)!important;background:transparent!important;font-family:var(--font-mono);font-size:.875rem;color:var(--ink)!important;cursor:pointer;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease)}
.pdo-pagenav .pdo-pagebtn:hover{border-color:var(--ink)!important}
.pdo-pagenav .pdo-pagebtn.active{background:var(--ink)!important;border-color:var(--ink)!important;color:var(--on-dark)!important}
.pdo-pagenav .pdo-pagebtn[disabled],.pdo-pagenav .pdo-pagebtn[disabled]:hover{border-color:transparent!important;color:var(--line)!important;pointer-events:none}

/* 11. Ответ формы заявки ([[+msg]] движка — последним в форме, на месте .form__success макета): у макета после отправки форма
   пряталась и появлялся белый блок успеха; здесь форма остаётся, ответ — строкой под кнопкой в духе .blognote макета
   (полоса акцентного цвета слева), ошибка — цветом .field__error. Скрытое состояние держит [hidden]{display:none!important} */
.leadform__body .bf-msg{margin:0;padding:14px 18px;border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;background:var(--sand-light);color:var(--ink);font-size:.9375rem;line-height:1.55}
.leadform__body .bf-msg.bf-err{border-left-color:#8C6C67;color:#8C6C67}

/* 12. Маски иконок .ico--<ключ> по icon() макета — дописывает bin/pbn/webmaster30_2_pages.php при каждом прогоне.
   Этот файл перезаписывается целиком: правьте статичную часть в bin/pbn/data/webmaster30/pbn-enhance.css */
.ico--monitor{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224.5%22%20width%3D%2218%22%20height%3D%2212.4%22%20rx%3D%221.8%22%2F%3E%3Cpath%20d%3D%22M9%2020.4h6%22%2F%3E%3Cpath%20d%3D%22M12%2016.9v3.5%22%2F%3E%3C%2Fsvg%3E")}
.ico--doc{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13.4%203.4H6.8a1.6%201.6%200%200%200-1.6%201.6v14a1.6%201.6%200%200%200%201.6%201.6h10.4a1.6%201.6%200%200%200%201.6-1.6V8.6Z%22%2F%3E%3Cpath%20d%3D%22M13.4%203.4v5.2h5.4%22%2F%3E%3Cpath%20d%3D%22M8.6%2013h6.8%22%2F%3E%3Cpath%20d%3D%22M8.6%2016.6h6.8%22%2F%3E%3C%2Fsvg%3E")}
.ico--layers{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203.6%208.4%204.3-8.4%204.3-8.4-4.3Z%22%2F%3E%3Cpath%20d%3D%22m3.6%2012.4%208.4%204.3%208.4-4.3%22%2F%3E%3C%2Fsvg%3E")}
.ico--cart{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229.6%22%20cy%3D%2219.2%22%20r%3D%221.4%22%2F%3E%3Ccircle%20cx%3D%2217.4%22%20cy%3D%2219.2%22%20r%3D%221.4%22%2F%3E%3Cpath%20d%3D%22M3%204h2.4l2.4%2011.2h10.2l1.8-7.6H6.3%22%2F%3E%3C%2Fsvg%3E")}
.ico--search{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2210.8%22%20cy%3D%2210.8%22%20r%3D%226.4%22%2F%3E%3Cpath%20d%3D%22m15.6%2015.6%204%204%22%2F%3E%3C%2Fsvg%3E")}
.ico--chart{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2020h16%22%2F%3E%3Cpath%20d%3D%22M7%2020v-6%22%2F%3E%3Cpath%20d%3D%22M12%2020V7%22%2F%3E%3Cpath%20d%3D%22M17%2020v-9%22%2F%3E%3C%2Fsvg%3E")}
.ico--pin{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021.2s6.6-6%206.6-11a6.6%206.6%200%201%200-13.2%200c0%205%206.6%2011%206.6%2011Z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2210.2%22%20r%3D%222.5%22%2F%3E%3C%2Fsvg%3E")}
.ico--pen{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4.5%2019.5h3.2L19%208.2a1.9%201.9%200%200%200%200-2.7l-.5-.5a1.9%201.9%200%200%200-2.7%200L4.5%2016.3Z%22%2F%3E%3C%2Fsvg%3E")}
