Meu background do header não ficou gradiente

styles.scss

body { margin: 0; padding: 0; box-sizing: border-box; } header { background: linear-gradient(180deg, #E8F5C8 0%, #FFFFFF 96.87%); padding: 2rem; }

index html

    <header>
        <nav>
            <img src="./assets/logo.png" alt="logo">
            <span class="linha"></span>
            <ul>
                <li><a href="#nosso-espaco">Nosso espaço</a></li>
                <li><a href="#servico">Servicos</a></li>
                <li><a href="#contatos">Contato</a></li>
            </ul>
        </nav>
        <section id="home">

            <div class="textos-home">
                <h1>Boas-vindas ao seu refúgio de <span> paz e bem-estar</span></h1>
                <button class="btn-main">Quero relaxar</button>
            </div>
            <div class="img-home">
                <img src="/assets/home-image.png" alt="Mulher de bruços recebendo massagem nas costas">
            </div>

        </section>
    </header>