#services .card-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

#services .card {
    padding: 2.2rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 10px 30px rgba(10, 102, 255, .08);
    transition: transform .35s ease, box-shadow .35s ease;
}

#services .card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(10, 102, 255, .16);
}

#services .card h3 {
    margin-bottom: .6rem;
    color: var(--dark);
    font-size: 1.2rem;
}

#services .card p {
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.6;
}