.board-gallery{
  display:grid;
  gap:var(--gap-sm);
}

.board-gallery__item{
  display:block;
  border:1px solid var(--c-line);
  border-radius:var(--radius);
  overflow:hidden;
  transition:var(--tr);
}
.board-gallery__item:hover{
  border-color:var(--c-primary);
  box-shadow:var(--shadow);
  transform:translateY(-3px);
}

.board-gallery__thumb{
  aspect-ratio:4/3;
  background:var(--c-bg-alt);
  overflow:hidden;
}
.board-gallery__thumb img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .5s ease;
}
.board-gallery__item:hover .board-gallery__thumb img{transform:scale(1.04)}

.board-gallery__body{padding:18px 20px 20px}

.board-gallery__title{
  font-size:var(--fs-h3);
  font-weight:700;
  line-height:1.4;
  letter-spacing:-.02em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.board-gallery__desc{
  margin-top:8px;
  font-size:var(--fs-sm);
  color:var(--c-text-sub);
  line-height:1.6;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.board-gallery__date{
  display:block;
  margin-top:14px;
  font-size:13px;
  color:var(--c-text-mute);
}

/* --a  3열 (기본) */
.board-gallery--a{grid-template-columns:repeat(3,1fr)}

/* --b  4열 */
.board-gallery--b{grid-template-columns:repeat(4,1fr)}
.board-gallery--b .board-gallery__title{font-size:16px}
.board-gallery--b .board-gallery__body{padding:14px 16px 16px}

/* --c  와이드 2열 */
.board-gallery--c{grid-template-columns:repeat(2,1fr)}
.board-gallery--c .board-gallery__thumb{aspect-ratio:16/9}

/* 카드 라벨 — 「주제」 축. 링크 없는 단순 정보 */
.board-gallery__tags{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin:14px 0 16px;
}

.board-gallery__tag{
    display:inline-block;
    padding:4px 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:600;
    line-height:1.5;
    white-space:nowrap;
    color:var(--tag-fg,#555);
    background:var(--tag-bg,#f2f4f7);
}

/* 팔레트 — slug 해시로 배정. 항목이 늘어도 자동으로 돈다 */
.board-gallery__tag--c1{--tag-bg:#eaf1fb;--tag-fg:#1b4d8f}
.board-gallery__tag--c2{--tag-bg:#fdf0dd;--tag-fg:#a86a06}
.board-gallery__tag--c3{--tag-bg:#e8f5ec;--tag-fg:#1f7a45}
.board-gallery__tag--c4{--tag-bg:#f3ecfb;--tag-fg:#6b3fa0}
.board-gallery__tag--c5{--tag-bg:#fdecef;--tag-fg:#b3243c}
.board-gallery__tag--c6{--tag-bg:#e6f4f6;--tag-fg:#0f6b78}

@media (max-width:1024px){
  .board-gallery--a,
  .board-gallery--b{grid-template-columns:repeat(2,1fr)}
  .board-gallery__body{padding:14px 16px 16px}
  .board-gallery__title{font-size:16px}
  .board-gallery__date{margin-top:10px}
}

@media (max-width:768px){
  .board-gallery--a,
  .board-gallery--b,
  .board-gallery--c{grid-template-columns:1fr}
  .board-gallery--c .board-gallery__thumb{aspect-ratio:4/3}
}
/* --d  카드형 3열 — 테두리 없음·둥근 사진·호버 시 「자세히 보기」 (아티스트 목록과 같은 결) */
.board-gallery--d{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 24px}   /* minmax(0,…) — 큰 원본 사진이 칸을 밀어내지 않게 */
.board-gallery--d .board-gallery__item,
.board-gallery--d .board-gallery__item:hover{border:0;border-radius:0;overflow:visible;box-shadow:none;transform:none}
.board-gallery--d .board-gallery__thumb{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;isolation:isolate}
.board-gallery--d .board-gallery__thumb img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.board-gallery--d .board-gallery__item:hover .board-gallery__thumb img{transform:scale(1.05)}
.board-gallery--d .board-gallery__thumb::after{
  content:'자세히 보기 →';
  position:absolute;inset:auto 0 0;z-index:1;
  padding:40px 18px 14px;
  font-size:13px;font-weight:700;color:#fff;
  background:linear-gradient(180deg,transparent,rgba(10,18,36,.72));
  opacity:0;transform:translateY(6px);
  transition:opacity .35s ease,transform .35s ease;
}
.board-gallery--d .board-gallery__item:hover .board-gallery__thumb::after{opacity:1;transform:none}
.board-gallery--d .board-gallery__body{padding:16px 2px 0}
.board-gallery--d .board-gallery__title{font-size:18px;font-weight:800;letter-spacing:-.03em;transition:color .2s ease}
.board-gallery--d .board-gallery__item:hover .board-gallery__title{color:var(--c-primary)}
.board-gallery--d .board-gallery__date{margin-top:8px;font-size:12px}

@media (max-width:1024px){
  .board-gallery--d{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 18px}
}
@media (max-width:640px){
  .board-gallery--d{grid-template-columns:minmax(0,1fr)}
  .board-gallery--d .board-gallery__thumb::after{display:none}
}