/* /market featured 대표 상품 그리드 전용 스코프 CSS — subpages-a.css/theme.css 는 건드리지 않는다.
   목적: (1) 썸네일 유무와 무관하게 카드 높이를 통일(고정 비율 썸네일 영역 + 그리드 행 stretch)
        (2) 가격 뱃지 위치를 모든 카드 동일하게 썸네일 우상단으로 고정
        (3) 대표 상품 4개를 2x2로 정렬해 데스크탑에서 남는 셀 없이 균형 잡히게 함
        (4) 외부 마켓으로 나가는 카드(EOND Admin 등)에 외부 링크 어포던스(↗) 추가
   전부 .pa-market 조상 셀렉터로 스코프해 다른 페이지에는 영향이 없다. */

.pa-market .mkt-feat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.pa-market .mkt-feat-card {
  display: flex;
  flex-direction: column;
}

.pa-market .mkt-feat-thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-bottom: 20px;
  border-radius: 8px;
  background: var(--pa-paper-2, #eeefec);
}

.pa-market .mkt-feat-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pa-market .mkt-feat-thumb-symbol {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: var(--pa-white, #fff);
  background: var(--pa-ink, #15171c);
  font-size: 34px;
  font-weight: 900;
}

.pa-market .mkt-feat-card:nth-child(2) .mkt-feat-thumb-symbol { background: var(--pa-orange, #ff6034); }
.pa-market .mkt-feat-card:nth-child(3) .mkt-feat-thumb-symbol { background: var(--pa-purple, #5d4bd9); }
.pa-market .mkt-feat-card:nth-child(4) .mkt-feat-thumb-symbol { background: var(--pa-green, #117551); }

.pa-market .mkt-feat-price {
  position: absolute;
  top: 12px;
  right: 12px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .18);
}

.pa-market .mkt-feat-ext-pill {
  color: var(--pa-muted, #626975);
}

/* 외부 링크 카드: text-link 기본 화살표(→)를 ↗로 바꿔 새 창/외부 이동임을 알린다. */
.pa-market .mkt-feat-link-external::after {
  content: "\2197";
}

@media (max-width: 720px) {
  .pa-market .mkt-feat-grid { grid-template-columns: 1fr; }
}