Как добавить кнопку при наведении в блок FR304 в Тильда

<script>

(function () { 
    const linkList = [
        'https://yandex.ru',
        'https://google.ru',
        'https://mail.ru',
    ];
    
    const imageBox = document.querySelectorAll('.uc-tab-button .t908__box-img');
    
    imageBox.forEach(function (el, index) {
        const imageBoxHtml = el.outerHTML;
        const imageBoxWrapper = `<a target="_blank" href="${linkList[index]}">${imageBoxHtml}</a>`;
        el.outerHTML = imageBoxWrapper;
    });

})();
   
</script>


<style>
.t908__box-img:before { 
    transition: all ease-in-out .25s
}
.t908__img{ 
    transition: all ease-in-out .85s
}  
.t908__box-img {
    position: relative;
    overflow: hidden;
}
.t908__box-img_active {
    display: flex;
}
.t908__box-img:before {
    content: "Learn More \279C";
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Bebas Neue',Arial,sans-serif;
    font-size: 18px;
    color: #000;
    padding: 12px 30px;
    background-color: #fff;
    border-radius: 7px;
    opacity:0;
    z-index:99;
}
.t908__box-img:hover .t908__img { 
    filter: brightness(0.7);
    transform: scale(1.07);
}
.t908__box-img:hover:before {
    top: 50%;
    opacity:1;
    
}
@media screen and (max-width:980px){
.t908__box-img:before {
    top: 50%;
    opacity:0.6;
}
.t908__img { 
    filter: brightness(0.7)
}
.t908__box-img:hover .t908__img { 
    transform: none;
}
}
</style>