/* =========================================================================
 *  Каталожный листинг (плагин wx1): панель сортировки + карточки.
 *  Все селекторы привязаны к классам wx1, поэтому стиль не задевает остальной сайт.
 * ========================================================================= */

/* Базовая типографика каталога + убираем подчёркивания у ссылок-карточек */
.wx1-catalog{font-family:"Roboto",Helvetica,Arial,sans-serif;color:#1d2430}
.wx1-catalog a,.wx1-catalog a:hover,.wx1-catalog a:focus,.wx1-catalog a:visited{text-decoration:none !important}

/* ----- Панель сортировки ----- */
.wx1-catalog__sort{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:4px 0 26px;
  font-family:"Roboto",Helvetica,Arial,sans-serif;
}
.wx1-catalog__sort > span{
  font-weight:700;color:#687482;font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;margin-right:4px;
}
.wx1-sort-btn{
  display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:999px;
  border:1.5px solid #d3e3f0;background:#fff;color:#1a86c7;font-weight:700;font-size:.86rem;line-height:1;
  text-decoration:none;white-space:nowrap;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;
}
.wx1-sort-btn:hover{border-color:#1a86c7;background:#eef6fc;color:#1a86c7;text-decoration:none;transform:translateY(-1px)}
.wx1-sort-btn:focus-visible{outline:3px solid #9fd0ee;outline-offset:2px}
.wx1-sort-btn.wx1-sort--active,
.wx1-sort-btn.wx1-sort--active:hover,
.wx1-sort-btn.wx1-sort--active:focus,
.wx1-sort-btn.wx1-sort--active:visited{
  background:#1a86c7 !important;border-color:#1a86c7 !important;color:#fff !important;
}

@media (max-width:480px){
  .wx1-catalog__sort{gap:8px}
  .wx1-catalog__sort > span{width:100%;margin-bottom:2px}
  .wx1-sort-btn{padding:8px 13px;font-size:.82rem}
}

/* =========================================================================
 *  Блок «Не нашли, что искали?» (слайдер менеджеров) попадает ячейкой
 *  в каталожный грид .wx1-catalog__grid и поэтому сжимается до размера карточки.
 *  Растягиваем эту ячейку на всю ширину строки — «вынимаем» из сетки.
 *  Ячейку опознаём по вложенному слайдеру менеджеров (.modres-managers-slider).
 * ========================================================================= */
.wx1-catalog__grid > *:has(.modres-managers-slider){
  grid-column:1 / -1;
  width:100%;
}
/* запас на случай вложенной обёртки (грид-ячейка содержит враппер со слайдером) */
.wx1-catalog__grid > *:has(> * .modres-managers-slider){
  grid-column:1 / -1;
  width:100%;
}

/* ----- Карточка товара (.wx1-card) ----- */
.wx1-card{
  display:flex;flex-direction:column;height:100%;
  background:#fff;border:1px solid #e3ecf3;border-radius:16px;overflow:hidden;
  box-shadow:0 8px 24px rgba(5,47,80,.06);color:#1d2430;text-decoration:none;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.wx1-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(5,47,80,.12);border-color:#cfe0ee;text-decoration:none}

.wx1-card__img-wrap{position:relative;aspect-ratio:4/3;background:#eef4f9;overflow:hidden}
.wx1-card__photo,.wx1-card__layout{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.wx1-card__layout{opacity:0;transition:opacity .25s ease}     /* планировка проявляется на hover */
.wx1-card:hover .wx1-card__layout{opacity:1}

.wx1-card__info{padding:16px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.wx1-card__title{font-weight:700;font-size:1.02rem;line-height:1.3;color:#151a21;transition:color .15s ease}
.wx1-card:hover .wx1-card__title{color:#1a86c7}

.wx1-card__params{display:flex;flex-direction:column;gap:5px;margin-top:auto}
.wx1-card__price{font-size:1.18rem;font-weight:700;color:#1a86c7;line-height:1.15}
.wx1-card__price strong{font-weight:800}
.wx1-card__area,.wx1-card__size{font-size:.9rem;color:#1d2430;line-height:1.3}
.wx1-card__area > span,.wx1-card__size > span{
  display:inline-block;min-width:78px;color:#8b97a5;font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;
}
