.team-card {
    background-color: var(--team-background-color);
    padding: 2rem;
    margin: 1rem;
    width: 18%;
    height: 19rem;
    border-radius: 10%;
    cursor: pointer;
    position: relative;

    .card-img {
        border-radius: 50%;
        aspect-ratio: 1/1;
        object-fit: cover;
        width: 60%;
    }

    .card-name {
        font-size: 1.2rem;
        font-weight: bold;
        margin-bottom: 2rem;
    }

    .card-title {
        font-size: 1.2rem;
    }

    .card-socials {
        display: flex;
        justify-content: center;
        position: absolute;
        bottom: 2rem;
        left: 0;
        right: 0;

        a {
            text-decoration: none;
            width: 50%;

            img {
                width: 1.5rem;
                height: 1.5rem;
            }
        }
    }
}

.team-card:hover {
    background-color: var(--team-background-color-hover);
    transition: background-color 0.3s ease;

    .card-img {
        transform: scale(1.1);
        transition: transform 0.3s ease;
    }
}