Adding hover state to logo- Carson Template

Site URL: https://austinhomies.com/

I'm trying to enable a hover state on my logo to change from a static image to a gif. Any suggestions on how to do this?

Thanks!

Add to Home > Design > Custom CSS

.site-branding h1:hover img {
    visibility: hidden;
}
.site-branding h1:hover a {
    background-image: url(https://beaverhero.com/wp-content/uploads/2020/05/artboard-1-.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    display: block;
    height: 100%;
}

Replace with your gif url