/* Services Section Enhancements */

/* Service Item Hover Effects */
.service-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 0;
    background: linear-gradient(to bottom, var(--color-accent), var(--color-accent-secondary));
    transition: height 0.4s ease;
}

.service-item:hover {
    transform: translateY(-10px) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    border-color: rgba(255, 255, 255, 0.1);
}

.service-item:hover::before {
    height: 100%;
}

/* Service Icon Wrapper Enhancement */
.service-icon-wrapper::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(135deg, var(--color-accent), transparent 70%);
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: 0;
}

.service-item:hover .service-icon-wrapper::after {
    opacity: 0.5;
}

/* Service Icon Color Variations */
.service-item[data-service="shopify"]:hover .service-icon {
    background: linear-gradient(135deg, #7ab55c, #96dd5c);
}

.service-item[data-service="responsive"]:hover .service-icon {
    background: linear-gradient(135deg, #5d3bff, #00f2ea);
}

.service-item[data-service="apps"]:hover .service-icon {
    background: linear-gradient(135deg, #ff3b8d, #ff5b3b);
}

.service-item[data-service="performance"]:hover .service-icon {
    background: linear-gradient(135deg, #ffb13b, #ff3b3b);
}

/* Service Title Animation */
.service-item:hover .service-title {
    transform: translateX(10px);
}

/* Service Link Animation */
.service-item:hover .service-link {
    opacity: 1;
}

.service-item:hover .service-link i {
    transform: translateX(5px);
}