/* Grid produk halaman depan. Kartunya memakai renderer yang sama dengan
   Flash Sale, jadi seluruh gaya kartu diwarisi dari habits-product-card.css —
   berkas ini hanya mengatur kerangkanya. */
.hbt-grid { font-family: var(--hbt-font); }

.hbt-grid__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 20px; margin-bottom: 22px;
}
.hbt-grid__heading { font-size: 22px; font-weight: 600; margin: 0; }

.hbt-grid__items {
  --hbt-grid-cols: 4;
  display: grid;
  grid-template-columns: repeat(var(--hbt-grid-cols), 1fr);
  gap: 22px;
  align-items: stretch;
}

/* Kartu meregang penuh setinggi barisnya supaya baris tetap rata
   walau panjang judulnya berbeda. */
.hbt-grid__items > .hbt-card { height: 100%; }

.hbt-grid__cta { display: flex; justify-content: center; margin-top: 44px; }

.hbt-grid--empty {
  padding: 32px; text-align: center;
  color: var(--hbt-muted); font-size: 13.5px;
  border: 1px dashed var(--hbt-border);
  border-radius: var(--hbt-radius);
}

@media (max-width: 640px) {
  .hbt-grid__items { gap: 12px; }
  .hbt-grid__heading { font-size: 18px; }
}