/* Плитки вариантов = плитки срока pcsoft-term, вариант C2 / макет 64 B4.
   Значения скопированы один в один из term.v013.css: на карточках без сроков
   стили pcsoft-term не подключаются, поэтому держим свою копию. Правила
   продублированы намеренно — вид плиток на сайте один. */

.pcpc { margin-top: 22px; container-type: inline-size; }
.pcpc-lbl { margin-bottom: 10px; font-size: 12.5px; color: #667085; font-weight: 600; }

.pcpc-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; align-items: stretch; padding: 10px 0 12px; }
.pcpc-tiles--many { grid-template-columns: 1fr 1fr 1fr; }

.pcpc-tile {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 0;
  border: 1px solid #e6e8ee; border-radius: 12px; padding: 11px 13px; background: #fff;
  font: inherit; color: #101828; text-align: left; text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
}
a.pcpc-tile:hover { border-color: #2456f0; }
.pcpc-tile.is-current { border-color: #2456f0; box-shadow: inset 0 0 0 1px #2456f0; background: #f5f8ff; cursor: default; }

.pcpc-tile b { font-weight: 600; font-size: 13px; line-height: 1.25; }
.pcpc-p { font-weight: 600; font-size: 17px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.pcpc-m { font-size: 11.5px; color: #667085; }

.pcpc-tiles--many .pcpc-tile { padding: 11px 9px 10px; }
.pcpc-tiles--many .pcpc-tile b { font-size: 11.5px; font-weight: 600; line-height: 1.25; }
.pcpc-tiles--many .pcpc-p { font-size: 16px; font-weight: 600; line-height: 1.2; margin-top: 4px; }
.pcpc-m { font-size: 10.5px; margin-top: 2px; line-height: 1.2; }

/* Все варианты в одну строку, когда панель позволяет — как у плиток срока. */
@container (min-width: 500px) { .pcpc-tiles--many { grid-template-columns: repeat(var(--pcpc-count, 3), 1fr); } }
@container (min-width: 400px) and (max-width: 499px) { .pcpc-tiles--many { grid-template-columns: repeat(3, 1fr); } }
@container (max-width: 399px) { .pcpc-tiles--many { grid-template-columns: 1fr 1fr; } }

/* Пять вариантов в один ряд. Цены пятизначные, поэтому у такой группы
   плитка компактнее: боковые отступы 8, цена 15, зазор 6. Цена не переносится —
   «19 990 ₽» должен читаться одной строкой. */
@container (min-width: 380px) {
  .pcpc-tiles[data-n="5"] { grid-template-columns: repeat(5, 1fr); gap: 6px; }
  .pcpc-tiles[data-n="5"] .pcpc-tile { padding: 11px 8px 10px; }
  .pcpc-tiles[data-n="5"] .pcpc-p { font-size: 15px; white-space: nowrap; }
  .pcpc-tiles[data-n="5"] .pcpc-tile b { font-size: 11.5px; white-space: nowrap; }
  .pcpc-tiles[data-n="5"] .pcpc-m { white-space: nowrap; }
}
@container (max-width: 379px) {
  .pcpc-tiles[data-n="5"] { grid-template-columns: 1fr 1fr; }
}