Image overlap with button alignment

Site URL: https://parakeet-alligator-y4sy.squarespace.com/

Hi everyone, I have four overlap images in columns with buttons at the bottom and I'd like the buttons to bottom align even if there is different lengths of text. Any thoughts?

Site password is TrishSullivan

Add to Design > Custom CSS

/* Align learn more */
@media screen and (min-width:992px) {
div#block-0caf5e05260673fe8ff6+.row {
    display: flex;
}
div#block-0caf5e05260673fe8ff6+.row .span-3 {
    position: relative;
    flex: 1;
	padding-bottom: 50px;
}
div#block-0caf5e05260673fe8ff6+.row .span-3 .image-button-wrapper a {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    text-align: center;
    white-space: nowrap;
}
div#block-0caf5e05260673fe8ff6+.row figcaption, div#block-0caf5e05260673fe8ff6+.row .image-block, div#block-0caf5e05260673fe8ff6+.row figure {
    position: static !important;
	transform: unset !important;
}
}

Thank you!