.catalog-hero { padding: 50px 0 20px; }
.catalog-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 30px;
  padding-bottom: 100px;
  align-items: start;
}

/* ---- Фильтры ---- */
.filters-panel {
  position: sticky; top: calc(var(--header-h) + 20px);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 22px;
}
.filters-panel h4 { margin: 0 0 14px; font-size: 14px; }
.filter-group { margin-bottom: 26px; }
.filter-group:last-child { margin-bottom: 0; }
.cat-check-list { display: flex; flex-direction: column; gap: 10px; }
.cat-check {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  padding: 8px 10px; border-radius: var(--radius-sm); transition: background .2s;
  font-size: 14px;
}
.cat-check:hover { background: var(--surface-2); }
.cat-check input { accent-color: var(--accent); width: 16px; height: 16px; }
.cat-check.active { background: var(--surface-2); color: var(--accent); }

.price-range-inputs { display: flex; gap: 10px; }
.price-range-inputs input { width: 100%; }

.brand-chip-list { display: flex; flex-wrap: wrap; gap: 8px; }
.brand-chip {
  padding: 6px 12px; border-radius: 999px; border: 1px solid var(--border);
  font-size: 12.5px; color: var(--text-muted); transition: all .2s;
}
.brand-chip.active, .brand-chip:hover { border-color: var(--accent); color: var(--accent); }

/* ---- Верх каталога: поиск + сортировка ---- */
.catalog-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 22px; gap: 16px; flex-wrap: wrap;
}
.search-input-wrap { position: relative; flex: 1; max-width: 380px; }
.search-input-wrap input { width: 100%; padding-left: 42px; }
.search-input-wrap svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); opacity: .5; }
.sort-select { min-width: 200px; }
.results-count { color: var(--text-muted); font-size: 14px; }

/* ---- Сетка товаров каталога ---- */
.catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.catalog-card {
  padding: 20px; display: flex; flex-direction: column; opacity: 0; transform: translateY(16px);
  animation: card-in .5s ease forwards;
}
@keyframes card-in { to { opacity: 1; transform: translateY(0); } }
.catalog-card .img-wrap {
  height: 160px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
  position: relative;
}
.catalog-card .img-wrap img { max-height: 130px; transition: transform .35s ease; }
.catalog-card:hover .img-wrap img { transform: scale(1.1) translateY(-4px); }
.catalog-card .rating {
  position: absolute; top: 0; right: 0; font-size: 12px; color: var(--warning);
  display: flex; align-items: center; gap: 4px;
}
.catalog-card .cat-label { color: var(--text-muted); font-size: 12px; text-transform: uppercase; }
.catalog-card h3 { font-size: 15.5px; margin: 8px 0; min-height: 42px; }
.catalog-card .specs-mini { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.specs-mini span { background: var(--surface-2); font-size: 11px; padding: 4px 8px; border-radius: 6px; color: var(--text-muted); }
.catalog-card .bottom-row { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.catalog-card .price { font-size: 19px; font-weight: 800; }

.empty-state { text-align: center; padding: 80px 20px; color: var(--text-muted); grid-column: 1/-1; }

@media (max-width: 1000px) {
  .catalog-layout { grid-template-columns: 1fr; }
  .catalog-grid { grid-template-columns: repeat(2, 1fr); }
  .filters-panel { position: static; }
}