I know the name of the class in question is "slds-page-header".
As an example, I've edited my own page to get rid of the header by changing the css specific to that class (this first picture is the "before"):

And after editing the style by adding "display: none" for that class (slds-page-header):

And now the header is gone from my page. How do I add this css style change to the lightning app page? This question says to upload the css as a static resource and call the resource in the lightning web component. I'm not sure how to do that. Anyone?
Update:
A much more restrictive change to the css would look like this:
header.flexipageHeader.slds-page-header.uiBlock.oneAnchorHeader {
display: none;
}
Update #2:
Ameer Awad's answer seems to apply only to aura components whereas I am using lightning web components. However, his answer pointed me in the right direction. I uploaded a static resource as he suggested, and then in the .js for my component, I added these imports:
import HideLightningHeader from '@salesforce/resourceUrl/HideLightningHeader';
import { loadStyle, loadScript } from 'lightning/platformResourceLoader';
And then in the connectedCallBack() method:
connectedCallback() {
loadStyle(this, HideLightningHeader)
}
No more header in my lightning app! Cool!!