Movimento indesejado do <footer>

Basicamente estou com um problema em que, após passar o cursor por cima do botão e ele realizar a transformação desejada, o meu footer acaba descendo um pouco mais e eu queria saber se posso deixar isso estático.

Parte do código em HTML e CSS (Se precisarem de mais do que isso para me ajudarem, basta pedir que mando por completo)

                <input type="submit" value="Enviar formulário" class="enviar">

            </form>
        </main>

        <footer>
            <img src="assets/logo-branco.png" alt="Logo Barbearia Alura">
            <p class="Copyright"> © Copyright - Barbearia Alura 2021</p>
        </footer>

.enviar {
    margin: 5px 0;
    width: 50%;
    padding: 10px 0;
    font-weight: bold;
    background: orange;
    border: none;
    border-radius: 10px;
    transition: 1s background;
    cursor: pointer;
}

.enviar:hover {
    border: 1px solid black;
    background: darkorange;
}

footer {
    display: block;
    text-align: center;
    padding: 20px 0;
    background: url(assets/bg.jpg);
}