/* ============================================
   urunler.css — Ürün listeleme sayfaları
   (urunlerimiz.html, 12-sinif.html, 12-sinif-konu-anlatimli.html)
   ============================================ */

/* ===== ÜRÜN LİSTELEME WRAPPER ===== */
.product-listing-section {
    padding: 56px 0 64px;
    background: var(--go-white);
}

/* ===== KATEGORİ CHIP FİLTRE ===== */
.kategori-filter-bar {
    display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
    margin: 24px 0 36px;
}
.kategori-chip {
    background: var(--go-bg-warm);
    color: var(--go-black);
    border: 1px solid rgba(0,0,0,0.06);
    padding: 10px 20px;
    border-radius: 100px;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.88rem;
    cursor: pointer;
    transition: all 0.25s;
    display: inline-flex; align-items: center; gap: 6px;
    text-decoration: none;
}
.kategori-chip:hover {
    background: rgba(242,169,0,0.12);
    color: var(--go-black);
    border-color: rgba(242,169,0,0.3);
}
.kategori-chip.active {
    background: var(--go-gold);
    color: var(--go-black);
    border-color: var(--go-gold);
    box-shadow: var(--go-shadow-gold);
}
.kategori-chip .count {
    background: rgba(0,0,0,0.08);
    color: var(--go-black);
    font-size: 0.72rem;
    padding: 2px 8px;
    border-radius: 100px;
    margin-left: 4px;
}
.kategori-chip.active .count {
    background: rgba(0,0,0,0.15);
}

/* Boş durum (.product-listing-empty) → style.css'e taşındı (anasayfa Ürünlerimiz global kullanır) */

/* ===== RESPONSIVE (urunler) ===== */
@media (max-width: 991px) {
    .product-listing-section { padding: 40px 0 56px; }
}
@media (max-width: 767px) {
    .kategori-filter-bar { gap: 6px; margin: 18px 0 24px; }
    .kategori-chip { padding: 8px 14px; font-size: 0.78rem; }
}