@charset "UTF-8";
/**
 * Тарифы: блок сравнения — строка «Стоимость» на телефоне и фон выделенной
 * колонки «Комплексный сервис». Решения Павла 20.10.2026.
 *
 * 1. Мобильная строка стоимости.
 * Замер 20.10: на ≤640 таблица превращается в карточки, подпись из `::before`
 * имеет flex-shrink: 0. У столбца «Комплексный сервис + Финансовый контроль»
 * подпись длинная — занимала всю ширину, и цена сжималась: на 320 и 390
 * «от 30 000 ₽/мес.» рвалось на пять строк шириной 17–32px (ячейка 149px).
 * Правка: значение цены всегда одной строкой, подпись уступает и переносится.
 *
 * 2. Фон колонки «Комплексный сервис» — вариант B (выбор Павла).
 * Было: шапка с градиентом, а тело колонки белое; градиент стоял только
 * в ячейке стоимости, поэтому колонка не читалась как выделенная. Теперь
 * тело колонки залито тем же градиентом в тот же угол (-71deg), но почти
 * прозрачным, плюс тонкие границы столбца. Шапка не меняется.
 * Контраст: графит #393939 на заливке 10,4:1, красная цена #9F0208 — 7,5:1.
 *
 * blocks.css не тронут (запертый слайс), styles загружаются последними.
 */

/* ============================================================
   1. Вариант B: светлый градиент колонки (табличный вид)
   ============================================================ */
@media (min-width: 641px) {
  .compare-block .compare-table tbody td:nth-child(3) {
    background: linear-gradient(-71deg, rgba(159, 2, 8, .055), rgba(209, 90, 90, .10));
    /* Границы столбца — вставной тенью, чтобы не сдвинуть раскладку таблицы. */
    box-shadow: inset 1px 0 0 rgba(159, 2, 8, .14),
                inset -1px 0 0 rgba(159, 2, 8, .14);
  }

  /* Ячейка стоимости: тот же градиент чуть плотнее и красная цена. */
  .compare-block .compare-table tbody tr:last-child td.price-highlight {
    background: linear-gradient(-71deg, rgba(159, 2, 8, .07), rgba(209, 90, 90, .13));
    color: #9F0208;
  }
}

/* ============================================================
   2. Телефон: строка стоимости в карточке
   ============================================================ */
@media (max-width: 640px) {
  body.page-id-25 .compare-block .compare-table tbody tr:last-child td {
    gap: 10px;
    /* Цена — одной строкой: перенос значения на узком экране и был дефектом. */
    white-space: nowrap;
  }

  body.page-id-25 .compare-block .compare-table tbody tr:last-child td::before {
    /* Подпись уступает место цене и переносится сама. */
    flex: 0 1 auto;
    min-width: 0;
    margin-right: 0;
    white-space: normal;
  }

  /* В карточке колонки нет: выделение — та же светлая заливка с красной ценой.
     Подпись остаётся графитом (на светлом фоне белая была бы не видна). */
  body.page-id-25 .compare-block .compare-table tbody tr:last-child td.price-highlight {
    background: linear-gradient(-71deg, rgba(159, 2, 8, .07), rgba(209, 90, 90, .13));
    color: #9F0208;
  }
}