/* Yookey · дополнения к rating.css для рейтингов на конфиге направления (rating.next.js).
   Подключается через [[!+rt.css]] в ny.head, только если в конфиге направления есть css (или ?rtjs=next). */

/* показатель «чем меньше, тем лучше» (стоимость обращения, ДРР): снижение — хорошо, стрелка вниз, цвет как у роста */
.rt-result__growth--down::before { margin-top: 2px; transform: rotate(180deg); }

/* запуск с нуля: без стрелки, нейтральный фон */
.rt-result__growth--new::before { display: none; }
.rt-result__growth--new { background: var(--rt-paper, #f4f4f2); color: var(--rt-ink, #131415); font-weight: 600; }

/* итог проекта словами — когда нет пары «было → стало» */
.rt-result--text { align-content: start; }
.rt-result--text .rt-result__say { font-size: 14px; font-weight: 600; line-height: 18px; color: var(--rt-ink, #131415); }
.rt-result--text .rt-result__metric { font-size: 12px; line-height: 16px; color: var(--rt-steel, #5f6571); }

/* шорт-лист всех направлений (этап 6): вкладки направлений над сравнением — rating.next.js, если в шорт-листе агентства разных направлений */
.rt-compare__dirs { max-width: 520px; margin: 0 0 12px; }
.rt-compare__dirs [role="tab"]:last-child small { color: var(--rt-steel); }
.rt-compare__dirs [role="tab"] { text-decoration: none; }

/* «Сколько стоит» с четырьмя ценовыми сегментами (контекст): четыре колонки «лесенкой», до 1180px — две, на телефоне — лента, как у трёх */
.rt-tiers--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rt-tiers--4 > .rt-tiers__item { padding: 24px; }
.rt-tiers--4 > .rt-tiers__item:nth-child(1) { min-height: 300px; }
.rt-tiers--4 > .rt-tiers__item:nth-child(2) { min-height: 340px; }
.rt-tiers--4 > .rt-tiers__item:nth-child(3) { min-height: 380px; }
.rt-tiers--4 > .rt-tiers__item:nth-child(4) { min-height: 420px; }
@media (max-width: 1180px) { .rt-tiers--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rt-tiers--4 > .rt-tiers__item:nth-child(n) { min-height: 0; } }

/* ===== Оформление блоков, 13.10.2026: легче читать длинные заголовки и лиды (оба рейтинга) ===== */
/* A. заголовки — строки одинаковой длины, без «висячего» последнего слова; лиды — свободнее интерлиньяж, без висячих слов */
.rt :is(.rt-section__title, .rt-insights__title, .rt-cases__title, .rt-faq__title, .rt-catalog__title) { text-wrap: balance; }
.rt :is(.rt-section__lead, .rt-faq__lead, .rt-catalog__lead) { max-width: 640px; line-height: 1.6; text-wrap: pretty; }
.rt :is(.rt-flow__text, .rt-read__text, .rt-factors > li > p, .rt-chapter__text p, .rt-faq__answer) { text-wrap: pretty; }

/* B. шапка блока: заголовок сверху, до ~65% ширины, перенос по смыслу; лид под ним.
   Длинный лид rating.next.js делит на две части по границе предложений (rt-lead--split):
   компьютер — две колонки, телефон — два абзаца с отступом (без сплошной «стены» текста) */
.rt .rt-section__lead.rt-lead--split { max-width: none; }
.rt .rt-lead__part { display: block; }
.rt .rt-lead__part + .rt-lead__part { margin-top: 12px; }
.rt .rt-lead__go { display: flex; width: max-content; margin-top: 12px; }   /* «Методология» — под второй частью лида (переносит скрипт) */
@media (min-width: 1000px) {
  .rt :is(.rt-section__title, .rt-insights__title, .rt-cases__title) { max-width: 65%; }
  .rt .rt-section__head .rt-section__lead, .rt .rt-insights > .rt-section__lead, .rt .rt-cases__head > .rt-section__lead { margin-top: 12px; }
  .rt .rt-section__lead.rt-lead--split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; align-items: start; }
  .rt .rt-lead__part + .rt-lead__part { margin-top: 0; }
}

/* подсказки с «i» («Кейс показывает…», «Совет», примечание к ценам) — не на всю ширину;
   #main и двойной класс — сильнее правила rt-main.css «section:has(#rtCost) .rt-tip { max-width: none }» */
#main .rt-tip.rt-tip { max-width: 760px; }

/* C. карточки с длинным текстом — без «лесенки»: одна высота, выровнены по верху (лесенка остаётся у цен) */
.rt .rt-flow > li:nth-child(even), .rt .rt-factors > li:nth-child(even) { translate: none; }
.rt .rt-flow { margin-top: 0; }
.rt .rt-price-factors .rt-factors { margin-top: 20px; }           /* «От чего зависит цена» — отступ от подзаголовка */

/* D. длинная карточка — абзацами: первое предложение акцентом, между абзацами отступ */
.rt :is(.rt-flow__text, .rt-factors > li > p) b { font-weight: 500; color: var(--rt-ink); }
.rt .rt-flow__text + .rt-flow__text, .rt .rt-factors > li > p + p { margin-top: 12px; }

/* E. «… в цифрах» без плитки, по которой нет данных (скрипт ставит rt-bento--two) */
@media (min-width: 701px) {
  .rt .rt-bento--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rt .rt-bento--two .rt-bento__text { max-width: 420px; }
}

/* руководство: «… главное» — плашка растёт по тексту (на телефоне заголовок в две строки) */
.rt .rt-guide__summary-title { height: auto; min-height: 28px; padding: 5px 12px; line-height: 18px; border-radius: 14px; }

@media (max-width: 700px) {
  /* кейсы: лид — под заголовком, а не над ним (заголовку задан order: 1) */
  .rt .rt-cases__head:has(> .rt-section__lead) > .rt-cases__title { margin-bottom: 8px; }
  .rt .rt-cases__head > .rt-section__lead { order: 1; margin: 0 0 20px; }
  /* цены в ленте: одна высота у всех карточек (без «лесенки» и без прижатия к низу) */
  .rt .rt-tiers { align-items: stretch; }
  .rt .rt-tiers > .rt-tiers__item:nth-child(n) { min-height: 0; height: auto; }
}