/* Gallery Hover Overlay - Pure CSS Solution (No Webflow JS) */

/* ===== Clean up broken structure ===== */

/* Hide ALL orphaned empty and duplicate anchor tags created by build process */
.gallery-item-2 > a.hover-link,
.project-item-2 > a.hover-link,
.project-card-info > a.hover-link,
.project-hover-link-wrapper > a.hover-link,
.hover-link-wrapper > a.hover-link.w-inline-block:not(:only-child) {
    display: none !important;
}

/* ===== Gallery Structure ===== */

.project-item-2,
.project-item-2[style],
div[data-w-id].project-item-2 {
    position: relative !important;
    opacity: 1 !important;
    transform: none !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    overflow: hidden !important;
}

.project-image-2 {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
    overflow: hidden !important;
}

.project-image-2 img {
    transition: transform 0.4s ease !important;
    transform: scale(1) !important;
}

/* Zoom image on hover */
.project-item-2:hover .project-image-2 img {
    transform: scale(1.1) !important;
}

.project-card-info {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    pointer-events: none !important;
}

.project-hover-link-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* ===== Pure CSS Hover Effect ===== */

.hover-link-wrapper.project-view-link.top {
    opacity: 0 !important;
    transform: translateY(10px) !important;
    transition: all 0.3s ease !important;
    pointer-events: none !important;
}

.hover-link-wrapper.project-view-link.top .hover-link {
    pointer-events: all !important;
}

/* Show on hover */
.project-item-2:hover .hover-link-wrapper.project-view-link.top {
    opacity: 1 !important;
    transform: translateY(0) !important;
}
