/*
 * AC Hub 홈 대메뉴 카드 사진 배경 (DESIGN.md 9절) — src/components/composite/AchubMenuCards.tsx
 * 메뉴마다 실사 사진 한 장(960×536 webp), 이름이 없는 메뉴는 어두운 면(카드 bg-gray-800).
 * 사진은 AI 로 생성한 실사풍 이미지 — 출처·프롬프트는 CREDITS.md.
 * 새 메뉴 사진을 더할 때: webp 를 이 폴더에 두고 아래에 `.achub-menu-photo--<이름>` 한 줄, 레이아웃 item 의 photo 에 그 이름.
 */

.achub-menu-photo {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.achub-menu-photo--dining { background-image: url('./dining.webp'); }
.achub-menu-photo--golf { background-image: url('./golf.webp'); }
.achub-menu-photo--discussions { background-image: url('./discussions.webp'); }
.achub-menu-photo--clubs { background-image: url('./clubs.webp'); }
.achub-menu-photo--hotels { background-image: url('./hotels.webp'); }
.achub-menu-photo--bnb { background-image: url('./bnb.webp'); }
.achub-menu-photo--rentacar { background-image: url('./rentacar.webp'); }
.achub-menu-photo--market { background-image: url('./market.webp'); }
.achub-menu-photo--mall { background-image: url('./mall.webp'); }
.achub-menu-photo--rentals { background-image: url('./rentals.webp'); }

/* 사진 위 글자 — 흰 글자에 검은 외곽선(8방향 1.5px) + 흐린 그림자. 사진이 밝아도 읽힌다 (게시판 카드와 같은 처리) */
.achub-menu-photo__title {
  color: #fff;
  text-shadow:
    -1.5px -1.5px 0 rgba(0, 0, 0, 0.85), 0 -1.5px 0 rgba(0, 0, 0, 0.85), 1.5px -1.5px 0 rgba(0, 0, 0, 0.85),
    -1.5px 0 0 rgba(0, 0, 0, 0.85), 1.5px 0 0 rgba(0, 0, 0, 0.85),
    -1.5px 1.5px 0 rgba(0, 0, 0, 0.85), 0 1.5px 0 rgba(0, 0, 0, 0.85), 1.5px 1.5px 0 rgba(0, 0, 0, 0.85),
    0 2px 6px rgba(0, 0, 0, 0.6);
}

/* 마우스를 올리면 어둠을 조금 걷어 사진이 밝아진다(사진 확대는 카드 쪽 group-hover) */
.achub-menu-photo__shade { transition: opacity 0.2s ease; }
a:hover > .achub-menu-photo__shade { opacity: 0.75; }

@media (prefers-reduced-motion: reduce) {
  .achub-menu-photo__shade { transition: none; }
}