meu gradiente não esta batendo do mapa com o beneficios

o CSS .mapa{ padding: 3em 0; background: linear-gradient(#FEFEFE,#888888)

o HTML

<section class="mapa">
           <h3 class="titulo-principal">Nosso Estabelecimento</h3>
            <p>Nosso estabelecimento esta localizado no coração da cidade.</p>
            <div class="mapa-conteudo">
                <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3656.449840474891!2d-46.63452058595546!3d-23.58819478466955!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x94ce5a2b2ed7f3a1%3A0xab35da2f5ca62674!2sCaelum%20-%20Escola%20de%20Tecnologia!5e0!3m2!1spt-BR!2sbr!4v1644861236566!5m2!1spt-BR!2sbr" width="100%" height="300" style="border:0;" allowfullscreen="" loading="lazy"></iframe> 
            </div>

Encontrei o erro tem uma divisao entre o video e o rodapé mas não sei como acertar isso. quando uso o background no mapa ele vai ate a parte de baixo do video no limite do footer.