/* ============================================================
   RELATED GRID — GLOBAL OVERRIDE (SEMUA SITUS, tanpa terkecuali)
   Semua grid "Terkait" diarahkan ke satu suara:
      DESKTOP 4 kolom, MOBILE 2 kolom
   Yang dicakup:
     - Produk Terkait (halaman PRODUK)  : .product-related-section .featured-scroll
     - Produk Terkait (halaman ARTIKEL) : .artikel-products-grid
     - Artikel Terkait (halaman ARTIKEL): .artikel-related-grid
   Selector diberi specificity TINGGI + !important agar menang
   atas semua override tema/situs (termasuk himover, zatra-shop,
   market-architect yang memaksa horizontal-scroll pada mobile).
   ============================================================ */

/* ---------- DESKTOP : 4 kolom ---------- */
body.page-product-detail[data-site-id] .product-related-section .featured-scroll {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: none !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    grid-auto-rows: auto !important;
    overflow: visible !important;
    overflow-x: visible !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    scroll-snap-type: none !important;
    overscroll-behavior-inline: auto !important;
    -webkit-overflow-scrolling: auto !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    scrollbar-width: auto !important;
}

body.page-artikel-detail[data-site-id] .artikel-products-grid,
body.page-artikel-detail[data-site-id] .artikel-related-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

/* ---------- MOBILE (<= 767px) : 2 kolom ---------- */
@media (max-width: 767px) {
    body.page-product-detail[data-site-id] .product-related-section .featured-scroll,
    body.page-artikel-detail[data-site-id] .artikel-products-grid,
    body.page-artikel-detail[data-site-id] .artikel-related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .75rem !important;
    }
}
