Qualcosa non va nel mio CSS per il titolo

Ciao,

Mi stavo un po' divertendo nell'utilizzo del css per poter abbellire un po' il mio form, ma qualcosa in ciò che ho fatto non torna.

Come potete vedere dall'immagine, la sezione del titolo è scontornate da queste zone bianche, come posso toglierle?

tenente conto che non ho usato l'elemento header, ma bensì paragrafo per facilitarmi l'utilizzo del css e dei tag html

Vi lascio qui anche il mio codice css e il link del mio form.

li#id_324{

  position : relative;

  width : 100%;

  height : 90vh;

  background : linear-gradient(45deg,#8614ce,#ff0057);

  display : flex;

  justify-content : center;

  align-items : center;

}

li#id_324:before {

  content : '';

  position : absolute;

  bottom : 0;

  left : 0;

  width : 100%;

  height : 200px;

  background : #fff;

  clip-path : polygon(100% 50%,0 100%,100% 100%);

}

.content {

  position : relative;

  max-width : 900px;

  text-align:center;

}

.content h2{

  margin : 0;

  padding : 0;

  color : #fff;

  font-size : 4em;

}

.content p{

  color : #fff;

  font-size : 1em;

}

Buongiorno,

Provi ad aggiungere il seguente codice CSS a li#id_324:

margin-top : 0;

margin-right : 0;

margin-left : 0;

e aggiunga anche:

.form-section.page-section {

   padding : 0;

}

Per ulteriori informazioni, non esiti a contattarci.