@import "../../../styles/colors";
.person-card{
    text-decoration: none;
    text-align: center;
    max-width: 280px;
    display: block;
    margin: 0 auto;

    &:hover{
       img{
        transform: scale(1.01);
        box-shadow: -1px 0px 25px 0px rgba(0,0,0,0.1);
       }
       .text{
        opacity: 1;
        .title{
            color: $black;
        }
       }
    }
    img{
        height: 320px;
        width: 100%;
        object-fit: cover;
        object-position: top;
        border-bottom-right-radius: 35px;
        border-top-left-radius: 35px;
        margin-bottom: 1.5rem;
        transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    }
    .text{
        opacity: 0.9;
        .title{
            color: $dark-gray-primary;
            font-weight: 600;
        }
        .description{
            color: $blue-primary;
            font-weight: 500;
        }
    }
}