[Task]: How can we stop sticky nav overlapping H2s when anchored down

### Context

A common problem with sticky navs that use hashed anchor links is the heading sits at the top of the viewport and is therefore covered by the navigation:

—One option is to use a scrollTo function instead of the anchor links and offset the top value. This would mean a refactor of this component
—Another, using just css, is to apply a positive padding-top and negative margin-top. Like this https://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header

Maybe there is another way...

cc @JamieB-gu @paperboyo

### Priority

_No response_