/* COMPLETE BUTTON FIX - Add this to the END of styles.css */

/* Remove all previous project-link styles and use this clean version */
a.project-link,
.project-link {
    /* Display & Layout */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.8rem !important;
    
    /* Size */
    padding: 1.2rem 2.5rem !important;
    min-width: 200px !important;
    min-height: 50px !important;
    
    /* Colors */
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    background-color: #6366f1 !important;
    color: #ffffff !important;
    
    /* Border & Shape */
    border: none !important;
    border-radius: 12px !important;
    
    /* Text */
    font-family: 'Rajdhani', sans-serif !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    letter-spacing: 0.5px !important;
    
    /* Effects */
    box-shadow: 0 8px 25px rgba(99, 102, 241, 0.4) !important;
    cursor: pointer !important;
    
    /* Animation */
    transition: all 0.3s ease !important;
    
    /* Visibility */
    opacity: 1 !important;
    visibility: visible !important;
    
    /* Position */
    position: relative !important;
    z-index: 10 !important;
}

/* Button Text */
a.project-link span,
.project-link span {
    color: #ffffff !important;
    font-weight: 700 !important;
    z-index: 2 !important;
    position: relative !important;
}

/* Button Icon */
a.project-link i,
.project-link i {
    color: #ffffff !important;
    font-size: 1rem !important;
    z-index: 2 !important;
    position: relative !important;
    transition: transform 0.3s ease !important;
}

/* Hover Effect */
a.project-link:hover,
.project-link:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 15px 40px rgba(99, 102, 241, 0.6) !important;
    background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%) !important;
    background-color: #7c3aed !important;
}

a.project-link:hover i,
.project-link:hover i {
    transform: translateX(5px) !important;
}

/* Active/Click Effect */
a.project-link:active,
.project-link:active {
    transform: translateY(-1px) !important;
}

/* Make sure parent container doesn't hide it */
.project-details {
    display: flex !important;
    flex-direction: column !important;
    gap: 2rem !important;
    width: 100% !important;
    position: relative !important;
    z-index: 5 !important;
}


/* Extra force for visibility */
section#tour .project-link,
section#tour a.project-link {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}