/*
Image fix */
.hp-listing--view-block .hp-listing__image img {
width: 100%;
height: 250px;
object-fit: cover;
border-radius: 8px;
}
/*
Listing Card - Flex column */
.hp-listing--view-block.hp-listing {
display: flex;
flex-direction: column;
height: 100%;
}
/*
Content grows, pushes footer down */
.hp-listing--view-block .hp-listing__content {
flex-grow: 1;
display: flex;
flex-direction: column;
}
/*
Footer always at bottom */
.hp-listing--view-block .hp-listing__footer {
margin-top: auto;
}
After conducting extensive research, I created the code above. You can use the code above to adjust the image and block size to match. you can use in CSS