/* Features section styles */

.features {

    background-color: white;

    position: relative;

}



.features::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: linear-gradient(45deg, var(--background-light-color) 0%, transparent 70%);

    opacity: 0.5;

}



.features-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));

    gap: 2.5rem;

    position: relative;

}



.feature-card {

    background: white;

    border-radius: var(--border-radius);

    padding: 2rem;

    box-shadow: var(--shadow-md);

    transition: all var(--transition-speed) ease;

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

}



.feature-card:hover {

    transform: translateY(-10px);

    /*box-shadow: var(--shadow-lg);*/

}



.feature-icon {

    width: 80px;

    height: 80px;

    background: var(--background-light-color);

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 1.5rem;

}



.feature-icon i {

    font-size: 2rem;

    color: var(--primary-color);

    transition: transform var(--transition-speed) ease;

}



.feature-card:hover .feature-icon i {

    transform: scale(1.2);

}