.card{width:300px;height:400px;background-size:cover;background-image:url(https://i.pinimg.com/736x/8f/25/28/8f252885748bc324b7dcbbb56c67bdaf.jpg);background-position:50%;border-radius:32px;padding:3px;position:relative;box-shadow:0 70px 30px -50px #604b4a30;transition:all .5s ease-in-out}.card .profile-pic{position:absolute;width:calc(100% - 6px);height:calc(100% - 6px);top:3px;left:3px;border-radius:29px;z-index:1;overflow:hidden;transition:all .5s ease-in-out .2s,z-index .5s ease-in-out .2s}.card .profile-pic img{object-fit:cover;width:100%;height:100%;transition:all .5s ease-in-out 0s}.card .bottom{position:absolute;bottom:3px;left:3px;right:3px;background:#e7e1a6;min-height:28%;height:auto;border-radius:29px;z-index:2;box-shadow:inset 0 5px 5px 0 rgba(96,75,74,.19);overflow:hidden;transition:all .5s cubic-bezier(.645,.045,.355,1) 0s;display:flex;justify-content:center;align-items:flex-end;padding-bottom:15px}.card .bottom .content{position:relative;width:100%;text-align:center}.card .bottom .content .name{display:block;font-size:1.3rem;color:#333;font-weight:700;margin-bottom:5px}.card .bottom .content .about-me{display:block;font-size:1.1rem;color:#555}.card:hover{border-top-left-radius:55px;transform:translateY(-5px);box-shadow:0 80px 40px -50px #604b4a50}.card:hover .bottom{top:auto;height:auto;min-height:50%;border-radius:90px 90px 29px 29px;transition:all .5s cubic-bezier(.645,.045,.355,1) .2s;padding-top:100px}.card:hover .profile-pic{width:260px;height:260px;top:20px;left:50%;transform:translateX(-50%);border-radius:50%;z-index:3;border:7px solid #fff59d;box-shadow:0 8px 15px 0 rgba(96,75,74,.3);transition:all .5s ease-in-out,z-index .5s ease-in-out .1s}.card:hover .profile-pic img{width:100%;height:140%;object-fit:cover;transition:all .5s ease-in-out .5s}.card:hover .profile-pic:hover{transform:translateX(-50%) scale(1.05);overflow:hidden}.card:hover .profile-pic:hover img{transform:scale(1.1);transition:transform .3s ease-in-out}