/* =====================================================================
   АКС - components.css (r3, 10.10.2026): дополнения к site.css для единых шаблонов.
   Подключать после site.css и unify.css. Только токены tokens.css. Заменяет инлайн-стили,
   которые сейчас стоят в разметке (style="gap:48px…", style="margin-top:…", тёмная карточка .feat).
   ===================================================================== */
/* C1. Секции: одинаковый ритм. Две секции одного фона подряд не встречаются (чередование в view),
   но на всякий случай - вторую секцию того же фона «склеиваем» без двойного отступа. */
.section:not(.section-alt):not(.page-head) + .section:not(.section-alt):not(.page-head){padding-top:0}

/* C2. Hero без фото - одна колонка (услуги без своего фото) */
.hero .wrap.hero-solo{grid-template-columns:minmax(0,1fr)}
.hero .wrap.hero-solo .lead{max-width:72ch}

/* C3. Текст + фото справа (≥992), фото под текстом (<992) */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:var(--s-7);align-items:start}
.split > .prose{max-width:var(--measure,60ch)}
.split-media{display:grid;gap:var(--s-4)}
.split-media img{width:100%;height:auto;border-radius:var(--r-lg);aspect-ratio:4/3;object-fit:cover}
.split-media figcaption{margin-top:var(--s-2);font-size:var(--fs-caption,13px);color:var(--c-muted)}
@media (max-width:991px){.split{grid-template-columns:minmax(0,1fr);gap:var(--s-5)}}

/* C4. Сетки фото (ICS «сравнение технологий»), видео */
.photo-grid{margin-top:var(--s-5)} .photo-grid figure{margin:0} .photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-md)}
.videos{align-items:start}

/* C5. Тёмная карточка-ссылка в преимуществах (вместо style="background:var(--c-dark)…") */
.feat-dark{background:var(--c-dark);border-color:var(--c-dark);color:#fff;text-decoration:none}
.feat-dark .ico-box{background:#3a3f47;color:#fff} .feat-dark h3{color:#fff} .feat-dark p{color:var(--c-on-dark-2)}
.feat-dark:hover{box-shadow:var(--sh-md);color:#fff}

/* C6. Секция заявки: две колонки (вместо style="gap:48px;align-items:start") */
.lead-grid{gap:var(--s-7);align-items:start}

/* C7. Шапка прайса: ссылка на услугу, полоса условий, чипы */
.page-head-link{margin:0 0 var(--s-5)}
.page-head .band{margin-top:var(--s-5)}
.section-prices{padding-top:0}

/* C8. Отступы, которые сейчас заданы инлайном */
.price-hub,.services-grid{margin-top:var(--s-6)}
.case-layout{margin-top:var(--s-6)}
.case-cta-title{display:block;font-size:var(--fs-h4);margin-bottom:var(--s-2)}
.case-cta-text{margin:0 0 var(--s-4);color:var(--c-ink-2)}
.case-cta-phone{margin-top:var(--s-3)}
.case-cta-links{margin:var(--s-4) 0 0}

/* C9. Вакансии */
.vacancy{margin-top:var(--s-6)}
.vacancy .grid{margin-top:var(--s-4)}
.vacancy .card h3{font-size:18px;margin:0 0 var(--s-3)}
.vacancy .card ul{margin:0;padding-left:18px;color:var(--c-ink-2)}
.vacancy .card li{margin-bottom:var(--s-2)}

/* C10. R01: белая полоса между последней секцией и подвалом (47 страниц).
   Причина - правило unify.css v3 «main > :last-child{padding-bottom:var(--section-y)}» срабатывает на обёртке div.site-*,
   внутри которой последняя - уже полноценная .section со своим padding. Исправление: обнулить, если последний ребёнок обёртки - секция.
   (Лучше - убрать обёртки div.site-* из view и выводить секции прямо в <main>.) */
main > :last-child:has(> .section:last-child, > section:last-child){padding-bottom:0}

/* C11. R02: две секции одного фона подряд (как «Отзывы» + «Заявка» на /services/diamond) - чередование задаёт view;
   страховка на случай ручной вёрстки: тонкая граница между соседними серыми секциями. */
.section-alt + .section-alt{border-top:1px solid var(--c-line)}

/* C12. Лид кейса портфолио: строка ≤ 72 символов (сейчас 131 символ на 1440 px) */
.case-lead{max-width:72ch}

/* QA r4. Подключаются последними: components.css идёт после site.css. */

/* I2. Стрелка в плашке услуги не сжимается */
.card-svc .arrow{flex:none;display:grid;place-items:center;width:20px;height:20px}
.card-svc .arrow .ico{width:20px;height:20px;max-width:none}
.ico{max-width:none;flex-shrink:0}

/* I3. Плашки услуг: красные иконки Lucide, как .adv/.feat */
.card-svc{align-items:flex-start}
.card-svc .ico-box{flex:none;width:48px;height:48px;border-radius:var(--r-md);display:grid;place-items:center;background:#fdecef;color:var(--c-brand)}
.card-svc .ico-box .ico{width:24px;height:24px}
.card-svc>div{flex:1;min-width:0}
.card-svc .arrow{align-self:center}
.card-svc img{display:none}

/* I5. Отзывы: соседние карточки на одном уровне */
@supports (grid-template-rows:subgrid){
  .grid > article.review{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0}
  .grid > article.review > a:first-child{grid-row:1}
  .review .body{grid-row:2 / span 4;display:grid;grid-template-rows:subgrid;row-gap:0}
  .review .body > *{margin-top:0}
  .review .review-head{margin-bottom:8px}
  .review .review-head h3{margin:0 0 2px}
  .review .review-head .caption{margin:0}
  .review .body > p{margin-bottom:12px}
  .review .body > blockquote{margin:0 0 12px;align-self:start}
  .review .body > a:last-child{align-self:end}
}
@supports not (grid-template-rows:subgrid){
  .grid > article.review{display:flex;flex-direction:column}
  .review .body{display:flex;flex-direction:column;flex:1}
  .review .body > p{min-height:3.2em}
  .review .body > a:last-child{margin-top:auto}
}

/* I6. Подменю из двух уровней */
.sub{min-width:360px}
.sub > li > a{font-size:15px;font-weight:var(--fw-semibold);color:var(--c-ink);text-transform:none;letter-spacing:0}
.sub > li + li{border-top:1px solid var(--c-line);margin-top:4px;padding-top:4px}
.sub .sub-l2{list-style:none;margin:0 0 4px;padding:0}
.sub .sub-l2 a{min-height:40px;padding:6px 12px 6px 24px;font-weight:400;color:var(--c-ink-2)}
.sub .sub-l2 a:hover{color:var(--c-ink)}
.sub a[aria-current]{color:var(--c-brand)}
@media (max-width:1199px){
  .sub{min-width:0}
  .sub > li > a{font-size:16px}
  .sub > li + li{border-top:0;margin-top:0;padding-top:0}
  .sub .sub-l2 a{min-height:44px;padding-left:28px}
}

/* I4. Иконка ВКонтакте в списке контактов */
.contact-list .ico-box svg[role=img]{width:20px;height:20px;fill:currentColor}

/* S03. Карточка работы на узком экране без внутреннего отступа */
@media (max-width:767px){
  .card.card-photo{padding:0}
  .card-photo .body{padding:12px 14px}
  .card-photo .title{overflow-wrap:anywhere;hyphens:auto}
}
@media (max-width:359px){.card.card-photo{padding:0!important}}

/* S04. «от …» отдельной строкой */
.card-svc .from{display:block;margin-top:6px;font-weight:var(--fw-semibold);color:var(--c-ink)}

/* S08. Низ секции прайса не складывает margin последнего блока с padding */
.section-prices .wrap > :last-child,
.price-block > :last-child{margin-bottom:0}

/* S09. «Условия» тем же стилем, что заголовки таблиц */
.price-block h2.h4{font-weight:var(--fw-black);line-height:1.25;margin:0 0 11px}

/* S12. Крошки и H1 в hero по верху колонки, не по центру фото */
.hero .wrap{align-items:start}