/* catalog.css — страница категории */

.catalog { padding-top: 32px; padding-bottom: 80px; }

.catalog__crumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 32px;
}
.catalog__crumbs a { color: var(--muted); }
.catalog__crumbs a:hover { color: var(--ink); }
.catalog__crumbs .sep { opacity: .4; }

.catalog__title {
  font-family: var(--font-head);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: .02em;
  margin: 0 0 40px;
}

.catalog__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px 16px;
}

/* Product card */
.pcard {
  display: block;
  text-decoration: none;
  color: var(--ink);
}
.pcard__img-wrap {
  aspect-ratio: 3/4;
  background: var(--soft);
  overflow: hidden;
  margin-bottom: 12px;
}
.pcard__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.pcard:hover .pcard__img { transform: scale(1.04); }

.pcard__info { padding: 0 2px; }
.pcard__name {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  margin: 0 0 4px;
}
.pcard__color {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 6px;
}
.pcard__price {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}

/* Color swatches on grouped cards */
.pcard__swatches{display:flex;gap:6px;margin-bottom:6px;flex-wrap:wrap}
.pcard__swatch{display:block;width:16px;height:16px;border-radius:50%;border:1.5px solid rgba(0,0,0,.12);flex-shrink:0;transition:transform .15s}
.pcard__swatch:hover{transform:scale(1.2)}

@media (max-width: 1024px) {
  .catalog__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .catalog__grid { grid-template-columns: repeat(2, 1fr); gap: 16px 12px; }
  .catalog__title { font-size: 24px; }
}
@media (max-width: 480px) {
  .catalog__grid { gap: 12px 8px; }
}
