Article header or footer got unwanted under space when using <h> or <p>

[clementgineste]

Describe the issue

Current Behavior

When using <h1> to <h6> in a <header> section inside an <article> extra space is displayed under the heading. Like a <br>. Same behavior with <p> and may be others

Example:

Expected Behavior

No extra space under the heading. Example

Example:

Reproduction URL

None.

Code HTML

      <article>
        <header>
          <h3>Gestion des utilisateurs</h3>
        </header>
        <form role="search" onSubmit={handleSearch}>
          <input
            type="search"
            placeholder="Rechercher par email"
            value={email}
            onChange={(e) => setEmail(e.target.value)}
          />
          <button
            type="submit"
            disabled={loading}
            aria-busy={loading}
          >
            {loading ? 'Recherche en cours...' : 'Rechercher'}
          </button>
        </form>
        <footer>
          Article's footer
        </footer>
      </article>

Environment

Client: Fedora 41, Chrome 129. Tested as well under Firefox. Server: PicoCSS 2.0.6