/*
  검색 결과 상품 그리드 — 모바일 2열 + 좌우 여백 보정 (see ProductListView 검색 분기 / FP-U-PR).

  목업 product.css 는 검색 결과에 두 가지가 카테고리와 다르다:
   1) 그리드를 repeat(4)(4열) 로 둠(4864행) — 카테고리·메인은 모바일 2열.
   2) 검색 컨테이너(.search-result-page main .product_list .tabcont_wrap)에 좌우 패딩이 없음
      (4749·4782행: padding-top 만 있고 좌우 0) — 카테고리는 .tab_cont 에 padding:0 20px(4363행).
  그래서 폰에서 검색만 4열로 좁아지고 카드가 화면 가장자리에 붙어 타이트해 깨져 보였다.
  카드 내부 규칙은 카테고리와 100% 동일(diff 0).

  목업과 같은 선택자(특이성)를 그대로 써 app CSS 가 뒤에 로드돼 이긴다. 모바일에서만 보정한다.
  → 컬럼을 카테고리와 같은 2열로, 좌우 여백도 카테고리와 같은 20px 로 맞춘다.
*/
@media (max-width: 768px) {
  .search-result-page main .product_list .tabcont_wrap .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* 카테고리(.tab_cont)와 같은 좌우 20px 여백 — 검색 컨테이너엔 없어 카드가 가장자리에 붙는다 */
  .search-result-page main .product_list .tabcont_wrap {
    padding-left: 20px;
    padding-right: 20px;
  }
}
