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

/* 1. Иконки из данных (соцсети подвала — колонка icon набора st_socials; знаки логотипов клиентов — колонка
   mark набора st_clients): значения строк MIGX экранируются, SVG туда нельзя. В разметке — <i class="ico
   ico--<ключ>"> с классами <svg> icon() макета, форма — маской .ico--<ключ>{--ic:url("data:image/svg+xml,…")}
   из того же SVG (маски дописывает сид страниц), цвет — currentColor обёртки (.footer-social__list a —
   var(--muted), .client-logo — наследует цвет и глушится filter:grayscale), как stroke="currentColor" у SVG
   макета. display:block — как у svg в сбросе style.css. Правило только для <i>: у настоящих <svg> макета
   те же классы, и маска бы их сломала */
i.ico{display:block;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() (лид шапки, надпись секции, абзацы вступлений, подпись фото-полосы, строка под фильтром кейсов,
   анонс и дата карточки, значение строки «ключ — значение», должность руководителя) */
.label:empty,.lead:empty,.text:empty,.meta:empty,.manifest-large:empty,
.visual-band__title:empty,.visual-band__sub:empty,.person__role:empty,
.card__label:empty,.card__meta:empty,.stack-row__val:empty,.contacts-details__val:empty,
.service-hero > .container > p:empty{display:none}

/* 3. Наборы без строк: у макета списки всегда заполнены, поэтому пустого состояния он не рисует. Пустая
   сетка .cells — это две чёрные линии подряд, пустая .cases — чёрная полоса: прячем и сам список, и секцию
   вокруг него, чтобы не осталась висеть одна шапка секции */
.cells:empty,.cases:empty,.tags:empty,.brief-links:empty,.photo-row:empty,.clients__row:empty,
.acc:empty,.person__links:empty,.contacts-details:empty,.footer-col__list:empty,.footer-social__list:empty,
.service-cell__list:empty,.std-col > ul:empty,.fit ul:empty,.cta__channels:empty,.grid-text:empty{display:none}
.section:has(> .cells:empty),
.section:has(> .container > .tags:empty),
.section:has(> .container > .brief-links:empty),
.section:has(> .container:empty),
.clients:has(> .container > .clients__row:empty),
.footer-social:has(.footer-social__list:empty),
.footer-top:has(.footer-top__label:empty){display:none}

/* 4. «Текст» страницы ([[*content]] — перенос с живого сайта и воркфлоу генерации). Пустой — секции нет.
   Правило привязано к id секции «Текста» (ch_sec_text), а не к .text вообще: .text есть и у абзацев внутри
   других секций — по ним секцию прятать нельзя. У «О студии» «Текст» стоит в двух колонках шапки: там прячется
   только он сам (.grid-text:empty выше), шапку держит H1 */
.section:has(> .container > #page-text:empty){display:none}
/* лента без материалов: пустая сетка — виден только текст «материалов ещё нет»; есть материалы — текста нет;
   нет ни того ни другого — секции нет */
#feed-grid:not(:empty) + .text{display:none}
.section:has(> .container > #feed-grid:empty + .text:empty){display:none}
/* «Читайте также» у записи: соседей по разделу нет — секции нет (у макета блок был бы под if) */
.section:has(#article-related:empty){display:none}
/* пустое состояние подборки кейсов: абзац «В этой подборке пока пусто» стоит в разметке всегда и скрыт,
   когда сетка не пуста (у макета это была ветка if/else на сервере) */
#portfolio-cases:not(:empty) + .section{display:none}

/* 5. Текст из админки в колонке .text: у макета там только абзацы, а в «Тексте» бывают подзаголовки, списки,
   цитаты, таблицы, картинки и врезки. Вид — той же монохромной системы: заголовки шрифтом --font-display,
   маркер и линия цитаты чёрной волосяной линией макета, ритм — как у .stack-md */
.text > * + *{margin-top:18px}
.text > :is(p,ul,ol,blockquote,table,figure) + :is(h2,h3){margin-top:36px}
.text > h2{font-family:var(--font-display);font-weight:700;font-size:var(--fs-h2);line-height:1.1;letter-spacing:var(--ls-h2);text-transform:uppercase}
.text > h3{font-family:var(--font-display);font-weight:700;font-size:var(--fs-h3);line-height:1.15}
.text :is(ul,ol){display:flex;flex-direction:column;gap:10px;max-width:var(--measure)}
.text ul > li{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:start}
.text ul > li::before{content:"";width:6px;height:1px;margin-top:11px;background:var(--ink-pure)}
.text ol{counter-reset:prose-counter}
.text ol > li{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start;counter-increment:prose-counter}
.text ol > li::before{content:counter(prose-counter,decimal-leading-zero);font-family:var(--font-ui);font-weight:600;font-size:var(--fs-meta);letter-spacing:var(--ls-ui);color:var(--muted)}
.text blockquote{border-left:var(--hair);padding-left:20px;font-size:var(--fs-lead);line-height:var(--lh-lead);font-family:var(--font-ui)}
.text a{border-bottom:1px solid var(--ink)}
.text table{font-size:var(--fs-small);display:block;overflow-x:auto}
.text :is(th,td){padding:12px 16px;text-align:left;vertical-align:top;border-bottom:var(--hair)}
.text thead th{font-family:var(--font-ui);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--ls-label);text-transform:uppercase}
.text img{width:100%;height:auto;background:var(--tile)}
.text iframe{width:100%;height:auto;aspect-ratio:16/9;border:0}

/* 6. Листание ленты — навигация движка на месте страничной разбивки: у макета её роль играли ссылки-«теги»
   «Страница N» (.tag в .tags на portfolio.php), поэтому кнопки движка одеваем в .tag. Инлайн-стили движка
   перебиваем !important */
.pdo-pagenav{gap:8px!important;margin:40px 0 0!important;justify-content:flex-start}
.pdo-pagenav .pdo-pagebtn{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:28px;padding:0 14px!important;border:var(--hair)!important;background:transparent!important;font-family:var(--font-ui);font-weight:600;font-size:var(--fs-ui);letter-spacing:var(--ls-ui);text-transform:uppercase;color:var(--ink)!important;cursor:pointer;transition:background-color var(--t-fast),color var(--t-fast)}
.pdo-pagenav .pdo-pagebtn:hover{background:var(--ink-pure)!important;color:var(--on-dark)!important}
.pdo-pagenav .pdo-pagebtn.active{background:var(--ink-pure)!important;color:var(--on-dark)!important}
.pdo-pagenav .pdo-pagebtn[disabled],.pdo-pagenav .pdo-pagebtn[disabled]:hover{border-color:var(--disabled)!important;background:transparent!important;color:var(--disabled)!important;pointer-events:none}

/* 7. Ответ формы ([[+msg]] движка — последним в форме, на месте блока .form-success макета): у макета после
   отправки форма пряталась и появлялся блок в рамке на светлой плашке; здесь форма остаётся, ответ — тем же
   блоком под кнопкой. Ошибка — жирным, как .field__error. Скрытое состояние держит [hidden] сброса макета */
.cta__form .bf-msg{margin-top:22px;border:var(--hair);padding:24px;background:var(--tile-soft);color:var(--ink);font-size:var(--fs-body);line-height:var(--lh-body)}
.cta__form .bf-msg.bf-err{font-weight:600}

/* 8. Маски иконок .ico--<ключ> (соцсети подвала и знаки логотипов клиентов) по icon() и
   $sectionClientMarks макета — дописывает bin/pbn/websaver_2_pages.php при каждом прогоне.
   Этот файл перезаписывается целиком: правьте статичную часть в bin/pbn/data/websaver/pbn-enhance.css */
.ico--telegram{--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%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22miter%22%3E%3Cpath%20d%3D%22M21%205%203%2011.5l5%201.8L19%207l-8.5%208.2.4%204.3%202.7-3.4%22%2F%3E%3Cpath%20d%3D%22m8%2013.3%201.9%205.8%22%2F%3E%3C%2Fsvg%3E")}
.ico--whatsapp{--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%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22miter%22%3E%3Cpath%20d%3D%22M3.5%2020.5%205%2016.4A8%208%200%201%201%208.2%2019.6z%22%2F%3E%3Cpath%20d%3D%22M9%209.2c.4%202.4%203.4%205.4%205.8%205.8l1-1.4%202%20.9v1.6c-3.5.6-8.4-4.3-7.8-7.8h1.6l.9%202z%22%2F%3E%3C%2Fsvg%3E")}
.ico--vk{--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%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22miter%22%3E%3Cpath%20d%3D%22M3%207.5h3c.4%204%202.2%206.4%203.4%206.4.6%200%20.8-.3.8-1.3V8.2h2.7v4.2c0%20.8.2%201%20.6%201%20.9%200%202.5-2%203.3-5.9H21c-.8%203.9-2.6%206.2-3.9%207.2%201.3%201%202.9%202.6%203.6%204.3h-3c-.7-1.4-1.9-2.7-3.2-3.4v3.4h-1.9C7.9%2019%204.2%2014.2%203%207.5z%22%2F%3E%3C%2Fsvg%3E")}
.ico--mail{--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%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22miter%22%3E%3Cpath%20d%3D%22M3%206h18v12H3z%22%2F%3E%3Cpath%20d%3D%22m3%207%209%206%209-6%22%2F%3E%3C%2Fsvg%3E")}
.ico--phone{--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%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22miter%22%3E%3Cpath%20d%3D%22M4%204h4l2%205-2.5%201.5a12%2012%200%200%200%206%206L15%2014l5%202v4a1%201%200%200%201-1%201C10.7%2021%203%2013.3%203%205a1%201%200%200%201%201-1z%22%2F%3E%3C%2Fsvg%3E")}
.ico--client0{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Crect%20x%3D%221%22%20y%3D%221%22%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3Cpath%20d%3D%22M1%2011h20%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client1{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%229.5%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3Cpath%20d%3D%22M11%201.5v19%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client2{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M2%2020%2011%202l9%2018z%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client3{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Crect%20x%3D%221.5%22%20y%3D%221.5%22%20width%3D%2219%22%20height%3D%2219%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3Cpath%20d%3D%22M1.5%201.5%2020.5%2020.5%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client4{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M2%2011h18M11%202v18%22%20stroke%3D%22%23000%22%2F%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%225%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client5{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Crect%20x%3D%221.5%22%20y%3D%226%22%20width%3D%2219%22%20height%3D%2210%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3Cpath%20d%3D%22M6%206V1.5M16%2016v4.5%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client6{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M2%2018%208%204l3%208%203-8%206%2014%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
.ico--client7{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20stroke-width%3D%221%22%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2211%22%20r%3D%225.5%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2211%22%20r%3D%225.5%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%2F%3E%3C%2Fsvg%3E")}
