/* ============================================================
   СПБ Переезд — prices
   Блок «prices». Подключается только там, где блок выведен.
   ============================================================ */

/* --- quick price cards --- */
.sp-pcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:16px;margin-bottom:26px}

.sp-pcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;
  box-shadow:var(--sh);text-decoration:none;display:block;transition:.16s}

.sp-sec--light .sp-pcard{background:var(--bg-2);box-shadow:none}

.sp-pcard:hover{border-color:var(--brand);transform:translateY(-2px)}

.sp-pcard .sp-pcard__type{font-size:12px;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase;font-weight:700}

.sp-pcard .sp-pcard__price{font-family:var(--f-display);font-weight:700;font-size:31px;color:var(--brand-dk);
  margin:9px 0 10px;letter-spacing:-.02em;line-height:1}

.sp-pcard .sp-pcard__price small{font-size:14px;color:var(--ink-3);font-weight:600}

.sp-pcard p{margin:0;font-size:13.5px;color:var(--ink-2)}

.sp-table td.sp-table__price{font-family:var(--f-display);font-weight:700;font-size:18px;color:var(--brand-dk);white-space:nowrap;letter-spacing:-.01em}

.sp-table td.sp-table__muted{color:var(--ink-3);font-size:13.5px}

.sp-table tr.is-hot td{background:rgba(31,95,240,.06)}

.sp-table tr.is-hot td:first-child{box-shadow:inset 3px 0 0 var(--brand)}

.sp-tag{display:inline-block;margin-left:9px;font-size:10px;font-weight:700;color:#fff;
  background:var(--brand);border-radius:5px;padding:3px 8px;letter-spacing:.05em;vertical-align:2px}

.sp-table-note{font-size:13px;color:var(--ink-3);margin-top:14px}

/* ============================================================
   Дизайн по референсу: фото в карточках + миниатюры в таблице
   ============================================================ */

/* --- карточки: фото слева, текст справа --- */
.sp-pcard{display:flex;gap:0;padding:0;overflow:hidden;align-items:stretch}
.sp-pcard__img{flex:0 0 40%;min-height:150px;background-size:cover;background-position:center;
  background-repeat:no-repeat}
.sp-pcard__img--ph{background:linear-gradient(135deg,var(--brand-soft),#dbe6ff);
  display:flex;align-items:center;justify-content:center;position:relative}
.sp-pcard__img--ph::after{content:"";width:38px;height:38px;opacity:.4;
  background:no-repeat center/contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%231f5ff0" stroke-width="1.6"><path d="M3 8l9-5 9 5v8l-9 5-9-5z"/><path d="M3 8l9 5 9-5"/></svg>')}
.sp-pcard__body{flex:1;padding:20px 22px;display:flex;flex-direction:column;justify-content:center}
.sp-pcard .sp-pcard__price{margin:6px 0 10px}

/* --- таблица с миниатюрами --- */
.sp-table--thumbs th:first-child{padding-left:18px}
.sp-table__thumb-cell{width:72px;padding-left:18px!important;padding-right:0!important}
.sp-table__thumb{display:block;width:52px;height:44px;border-radius:8px;background-size:cover;
  background-position:center;background-repeat:no-repeat}
.sp-table__thumb--ph{background:linear-gradient(135deg,var(--brand-soft),#e4ecff)}
.sp-table--thumbs .sp-table__arrow{width:40px;text-align:right;color:var(--brand)}
.sp-table--thumbs .sp-table__arrow svg{width:20px;height:20px}
.sp-table--thumbs tr:hover .sp-table__arrow{transform:translateX(3px)}
.sp-table--thumbs td{transition:transform var(--dur) var(--ease)}

/* --- нижние заметки с иконками --- */
.sp-price-notes{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.sp-price-note{display:flex;align-items:center;gap:14px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:16px 20px}
.sp-sec--light .sp-price-note{background:var(--card)}
.sp-price-note__ic{flex:none;width:44px;height:44px;border-radius:10px;background:var(--brand);
  display:flex;align-items:center;justify-content:center}
.sp-price-note__ic svg{width:22px;height:22px;stroke:#fff}
.sp-price-note__txt{font-size:14px;color:var(--ink-2);line-height:1.5}
.sp-price-note__txt a{color:var(--brand);font-weight:600;text-decoration:none}
.sp-price-note__txt a:hover{text-decoration:underline}

/* --- таблица во всю ширину контейнера --- */
.sp-table-wrap{overflow:visible}
.sp-table--thumbs{width:100%}

/* ============================================================
   Мобильная адаптивность: строки-карточки вместо скролла
   ============================================================ */
@media(max-width:760px){
  .sp-pcard{flex-direction:column}
  .sp-pcard__img{flex:none;min-height:0;width:100%;aspect-ratio:16/9}
  .sp-price-notes{grid-template-columns:1fr}

  /* прячем шапку таблицы */
  .sp-table--thumbs thead{display:none}
  .sp-table--thumbs,.sp-table--thumbs tbody,.sp-table--thumbs tr,.sp-table--thumbs td{display:block;width:auto}
  .sp-table--thumbs{border:0;background:none}

  /* каждая строка — карточка */
  .sp-table--thumbs tr{position:relative;background:var(--card);border:1px solid var(--line);
    border-radius:var(--r);padding:16px;margin-bottom:12px}
  /* место под миниатюру резервируем, только если она есть */
  .sp-table--thumbs tr:has(.sp-table__thumb){padding-left:84px;min-height:76px}
  /* популярная строка: только рамка вокруг карточки.
     Гасим десктопные фон/полосу у ячеек — они ломали отступы. */
  .sp-table--thumbs tr.is-hot{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
  .sp-table--thumbs tr.is-hot td,
  .sp-table--thumbs tr.is-hot td:first-child{background:none!important;
    box-shadow:none!important;border-left:none!important}

  /* миниатюра — абсолютом слева */
  .sp-table__thumb-cell{position:absolute;left:16px;top:16px;padding:0!important;width:auto}
  .sp-table__thumb{width:52px;height:52px}

  /* объём — крупный заголовок карточки */
  .sp-table--thumbs td:nth-child(2){padding:0;font-size:16px;margin-bottom:8px}
  .sp-table--thumbs td:nth-child(2) b{font-size:16px}

  /* остальные ячейки — с подписями через ::before */
  .sp-table--thumbs td.sp-table__muted,
  .sp-table--thumbs td.sp-table__price{padding:3px 0;font-size:14px;text-align:left}
  .sp-table--thumbs td.sp-table__muted::before{content:attr(data-label)": ";color:var(--ink-3);font-size:12px}
  .sp-table--thumbs td.sp-table__price{margin-top:6px;font-size:20px}
  .sp-table--thumbs td.sp-table__price::before{content:"Цена от: ";font-family:var(--f-text);
    font-size:12px;font-weight:400;color:var(--ink-3)}

  /* стрелку прячем на мобильном */
  .sp-table--thumbs .sp-table__arrow{display:none}
}

/* стрелка-кнопка в строке открывает попап */
.sp-table__arrow button{background:none;border:none;cursor:pointer;color:var(--brand);
  padding:6px;border-radius:8px;display:inline-flex;transition:var(--dur) var(--ease)}
.sp-table__arrow button:hover{background:var(--brand-soft);transform:translateX(2px)}
