Change gallery images on hover - 7.0 version

How can I change the gallery image from the existing one to a second one on hover? We're using version 7.0. Site link below, on the home page we would like the images to change for a second image on hover,

https://www.phasetwo.design/

Thanks

@tuanphan Amazing thank you this works perfectly.

Is there a way to also change the title text on hover at the same time? So for the OnPay project change the OnPay title pulled from the gallery to some other text?

23 hours ago, LewisEisenburg said:

@tuanphan Amazing thank you this works perfectly.

Is there a way to also change the title text on hover at the same time? So for the OnPay project change the OnPay title pulled from the gallery to some other text?

Use this CSS code under

article.Index-gallery-item:has(a[href="/onpay"]:hover) h2 {
    visibility: hidden;
}
article.Index-gallery-item:has(a[href="/onpay"]:hover) h2:before {
    content: "new OnPay";
    font-size: 20px;
    visibility: visible;
}