Eu já tinha utilizado o hover na aula anterior por justamente ficar estudando pelo material como o []https://www.w3schools.com/(), vou compartilhar com vocês o progresso:
.caixa__links__shape {
border: 1px;
text-decoration: none;
/* background-color: #FCE408; */
display: flex;
justify-content: center;
gap: 18px;
color: white;
text-align: center;
border: 2px solid #FCE408;
font-size: 21px;
font-weight: 600;
padding: 6px;
padding-top: 12px;
padding-bottom: 12px;
width: 280px;
border-radius: 8px;
font-family: 'Montserrat', sans-serif;
box-shadow: 3px 3px black;
transition: 0.3s;
cursor: pointer;
}
.caixa__links__shape:hover {
border: 1px;
background-color: black;
transition: 0.3s;
color: white;
border: 2px solid white;
}
Agora mostro o efeito do mesmo: