.feature-card {
    padding:2rem 1.5rem;
    background: var(--app-color-glass);
    backdrop-filter: blur(20px);
    border:1px solid var(--app-color-glass-border);
    text-align:center;
    transition: background .3s, border-color .3s, transform .3s;
    position:relative; 
    overflow:hidden;
    display: block;
}

.feature-card::after {
    content:''; 
    position:absolute; 
    bottom:0; 
    left:0; 
    right:0;
    height:2px; 
    background: linear-gradient(90deg, transparent, var(--app-color-accent), transparent);
    transform:scaleX(0); 
    transition: transform .4s ease;
}

.feature-card:hover { 
    background: var(--app-color-accent-soft); 
    border-color: var(--app-color-accent-light); 
    transform:translateY(-4px); 
}
.feature-card:hover::after { 
    transform:scaleX(1); 
}

.feature-name {
    font-family: var(--app-font-primary);
    font-size:1.15rem; 
    font-weight:600;
    color:var(--app-color-text); 
}

.feature-card:hover .feature-name,
.feature-card:hover svg { 
    color:var(--app-color-accent); 
}

.feature-card svg {
    width: 75px;
    height: 75px;
    fill: currentColor;
    color: var(--app-color-text);
}