/* 이미지 호버 시 스케일 효과 (마스크 내에서만) */
.thumb {
    overflow: hidden; /* 마스크 효과 - 이미지가 컨테이너 밖으로 나가지 않도록 */
    position: relative;
}

.thumb img {
    transition: transform 0.4s ease, filter 0.4s ease;
    transform: scale(1);
    width: 100%;
    height: auto;
    display: block;
}

/* 호버 시 이미지 확대 + 블러 효과 */
.thumb:hover img {
    transform: scale(1.05); /* 이미지 5% 확대 */
    filter: blur(2px); /* 기존 블러 효과 유지 */
}

/* 호버 텍스트는 기존 효과 유지 */
.hover-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 0.4s ease;
    text-align: center;
    color: white;
    z-index: 2;
}

.thumb:hover .hover-text {
    opacity: 1;
}

/* 더 부드러운 애니메이션을 위한 추가 설정 */
.grid-item {
    transition: transform 0.3s ease;
}

/* 전체 그리드 아이템 호버 시 약간의 리프트 효과 (선택사항) */
.grid-item:hover {
    transform: translateY(-2px);
}