/* ── Shop page specific styles ───────────────────────────────────────────── */

/* Stats bar */
.stats-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--border);
  overflow: hidden;
}
.stat-item {
  background: var(--surface);
  padding: 20px 24px;
  text-align: center;
}
.stat-num {
  font-size: 22px;
  font-weight: 700;
  font-family: var(--font-mono);
  letter-spacing: -1px;
}
.stat-label {
  font-size: 13px;
  color: var(--ink-3);
  margin-top: 2px;
}

/* Filter label */
.filter-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--ink-3);
  text-transform: uppercase;
  margin-bottom: 10px;
}

/* Category pills (mobile scroll) */
.cat-pills {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.cat-pills::-webkit-scrollbar { display: none; }
.cat-pill {
  padding: 7px 16px;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  background: var(--surface);
  border: 1.5px solid var(--border);
  color: var(--ink-2);
  transition: all 0.15s;
  flex-shrink: 0;
}
.cat-pill:hover  { border-color: var(--ink-2); color: var(--ink); }
.cat-pill.active { background: var(--ink); border-color: var(--ink); color: #fff; }

/* Responsive sidebar hide */
@media(max-width: 800px) {
  aside { display: none !important; }
}

/* Responsive stats */
@media(max-width: 700px) {
  .stats-bar { grid-template-columns: repeat(2, 1fr); }
}
@media(max-width: 400px) {
  .stats-bar { grid-template-columns: 1fr 1fr; }
  .stat-num  { font-size: 18px; }
}