/* =========================================
   [Custom Cursor] 블렌드 모드 & 손가락 제거 (Updated)
   ========================================= */

@media (hover: hover) and (pointer: fine) {

    /* 1. 기본 커서 숨기기 */
    html,
    body {
        cursor: none !important;
    }

    /* 클릭 가능한 모든 요소에서 기본 커서(손가락) 숨기기 */
    a,
    button,
    input,
    textarea,
    label,
    select,
    
    /* 기존 요소들 */
    .btn-hero,
    .btn-clean,
    .btn-glitch-box,
    .btn-submit,
    .gallery-item,
    .service-card,
    .info-card,
    .cat-btn,
    .cat-btn span,
    .modal-close,
    
    /* 팝업 관련 */
    .pc-dot,
    .ctl-btn,
    .btn-popup-close,
    .pop-today,
    .pop-btn,

    /* [NEW] 리뉴얼된 포트폴리오 & 모달 섹션 추가 */
    .pf-card,           /* 포트폴리오 카드 */
    .filter-btn,        /* 필터 버튼 */
    .btn-more-view,     /* 더보기 버튼 */
    .modal-close-fixed, /* 모달 닫기 버튼 */
    .modal-inquiry-btn, /* 모달 문의하기 버튼 */
    .pf-item            /* (혹시 모를 이전 버전 호환) */
    {
        cursor: none !important;
    }

    /* 2. 커스텀 커서 디자인 */
    .custom-cursor {
        position: fixed;
        top: 0;
        left: 0;
        width: 20px;
        height: 20px;
        background-color: #fff;
        border-radius: 50%;
        pointer-events: none; /* 클릭 통과 */
        z-index: 99999;

        mix-blend-mode: difference;
        transform: translate(-50%, -50%);

        transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease;
    }

    /* 3. 호버 상태 (커짐) */
    .custom-cursor.hovered {
        width: 60px;
        height: 60px;
        background-color: #fff;
    }
}