/* Патч к template/css/article.css - блоки с фотографиями в статьях.
   Собран 30.08.2026 из инлайнового <style>, который Кодекс положил в тело статьи
   all-on-4-ili-all-on-6-komu-podhodit. В теле статьи <style> быть не должно:
   визуальный редактор MODX может его вырезать, и 3,4 КБ CSS дублируются в каждой статье.

   Проверить после добавления: пять чужих статей подрядчика на том же шаблоне не изменились
   (селекторы привязаны к нашим классам dd-*, глобальных правил здесь нет). */

/* Меню разделов слева и обложку справа рисует сам шаблон: скрипт темы собирает пункты
   из `.body h2` в блок #scrollLinks. Ничего не переопределяем - иначе меню пропадает
   (так и случилось на пилоте 30.08.2026: колонка с меню была скрыта под свой hero). */

.dd-article-main{grid-column:1/-1;grid-row:4;min-width:0;margin-top:34px}
.dd-media-split{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,54px);align-items:flex-start;margin:30px 0 46px}
.dd-media-copy,.dd-media{flex:1 1 380px;min-width:0}
.dd-media{margin:0}
.dd-media-frame{aspect-ratio:4/3;overflow:hidden;border-radius:18px;background:#edf2f2}
.dd-media-frame img{display:block;width:100%;height:100%;object-fit:cover}
.dd-media-frame--portrait img{object-position:center 23%}
.dd-media figcaption,.dd-infographic figcaption{margin-top:12px;color:#71808a;font-size:15px;line-height:1.45}
.dd-infographic{margin:34px 0 42px}
.dd-infographic img{display:block;width:100%;height:auto;border-radius:28px}
.dd-infographic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.dd-infographic-panel{aspect-ratio:2.2/1;overflow:hidden;border-radius:18px;background:#edf2f2}
.dd-infographic-panel img{width:100%;height:200%;object-fit:cover;border-radius:0}
.dd-infographic-panel--top img{object-position:center top}
.dd-infographic-panel--bottom img{object-position:center bottom}
.dd-figure-img{border-radius:18px}
.dd-faq{border-top:1px solid #d9e1e3}
.dd-faq:last-of-type{border-bottom:1px solid #d9e1e3}
.dd-faq-summary{position:relative;cursor:pointer;list-style:none;padding:22px 54px 22px 0;font-weight:600;color:#21475a}
.dd-faq-summary::-webkit-details-marker{display:none}
.dd-faq-summary:after{content:"+";position:absolute;right:8px;top:50%;width:32px;height:32px;margin-top:-16px;border-radius:50%;background:#e9f2f2;color:#21475a;text-align:center;line-height:30px;font-size:24px;font-weight:400}
.dd-faq[open]>.dd-faq-summary:after{content:"-"}
.dd-faq>p{margin:0;padding:0 54px 22px 0}

/* --- добавлено 30.08.2026 при разборе пилота: классы, которые использовались в теле,
   но не были описаны ни в article.css, ни в инлайновом стиле --- */

/* панель FAQ: вопрос-ответ карточкой (используется вместе с .dd-faq на details) */
.dd-faq-panel{margin:12px 0}
.dd-faq-panel>.dd-faq{margin:0}

/* зеркальный вариант блока «текст + фото»: картинка слева */
.dd-media-split--image-left{direction:rtl}
.dd-media-split--image-left>*{direction:ltr}

/* списки и источники, которые ставит конвертер seo_publish_build.py */
.dd-list{margin:18px 0;padding-left:22px}
.dd-list li{margin-bottom:10px}
.dd-sources{margin:18px 0;padding-left:22px;font-size:16px;line-height:1.5;color:#4C6472}

/* --- 30.08.2026, по факту публикации: тема сайта добавляет свой маркер каждому <li> внутри
   .text-block (правило `.text-block ul li::before`, иконка 16px). В карточке «Коротко о главном»
   он накладывался на наш круглый маркер dd-short-dot - получалась клякса из двух значков.
   Внутри наших блоков маркер темы выключаем, свой оставляем. --- */
.dd-short-list li::before{content:none !important}
.dd-short-item{list-style:none}

/* --- Блоки в конце статьи: похожие статьи и примеры работ (30.08.2026, запрос владельца) --- */
.dd-related{margin:40px 0 0}
.dd-related-title{margin:0 0 18px;font-size:22px;font-weight:bold;color:#2B4A5A}
.dd-related-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:0 0 4px;padding:0;list-style:none}
.dd-related-list li{margin:0}
.dd-related-list li::before{content:none !important}
.dd-related-card{display:block;height:100%;box-sizing:border-box;padding:20px 22px;background:#FFFFFF;border:1px solid #DCE7EC;border-radius:18px;color:#2B4A5A;text-decoration:none}
.dd-related-card:hover{border-color:#06AEEF}
.dd-related-card-kicker{display:block;margin-bottom:8px;font-size:14px;color:#6E7681}
.dd-related-card-title{display:block;font-size:17px;font-weight:bold;line-height:1.35;color:#0A87BC}
.dd-works{margin:40px 0 0}
.dd-works .dd-related-title{margin-bottom:8px}
.dd-works-intro{margin:0 0 18px;color:#4C6472}
.dd-works-all{display:block;margin-top:18px;font-weight:bold;color:#0A87BC}
.dd-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.dd-case-card{display:flex;min-width:0;overflow:hidden;flex-direction:column;background:#fff;border:1px solid #DCE7EC;border-radius:18px}
.dd-case-media{display:block;aspect-ratio:410/199;overflow:hidden;background:#edf2f2}
.dd-case-media img{display:block;width:100%;height:100%;object-fit:cover}
.dd-case-pad{display:flex;flex:1;flex-direction:column;padding:20px 22px 22px}
.dd-case-kicker{margin-bottom:8px;font-size:14px;color:#6E7681}
.dd-case-title{margin:0;font-size:19px;line-height:1.35;color:#2B4A5A}
.dd-case-title a{color:inherit;text-decoration:none}
.dd-case-desc{margin:12px 0 20px;color:#6E7681;font-size:15px;line-height:1.45}
.dd-case-more{margin-top:auto;font-weight:bold;color:#0A87BC;text-decoration:none}
.dd-author-details{margin-top:32px}
.dd-author-details p{margin:0 0 16px}
@media (max-width:767px){.dd-related-list,.dd-case-grid,.dd-infographic-grid{grid-template-columns:1fr}.dd-infographic-grid{gap:16px}}


/* 2026-08-30: типовая типографика, корректные схемы и три кейса */
.dd-lead{font-size:18px;line-height:1.17}
.dd-infographic-panel img{position:static;width:100%;height:auto;object-fit:contain;object-position:center;transform:none}
.dd-case-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.text-block__colr:has(.dd-article-main) .div_share{display:none!important}
@media (max-width:767px){.dd-case-grid{grid-template-columns:1fr}}

body:has(.dd-article-main) .div_share{display:none!important}

/* Компактный FAQ для удобной навигации */
#anchor10{max-width:960px;margin-left:auto;margin-right:auto}
.dd-faq{max-width:960px;margin-left:auto;margin-right:auto}
@media (max-width:767px){#anchor10,.dd-faq{max-width:100%}}