Fix spacing around figure component

⚠️ This repo is Continuously Deployed: make sure you follow the guidance ⚠️

What / why

This fixes the spacing around the government-frontend figure component, specifically on mobile.

on mobile, if a figure had a caption there was no space between it and the following content
however if there was no caption, there was a space, because the empty figcaption element was still being rendered, which included spacing at the top (to prevent it from being too close to the image)
this change fixes this problem and refactors the styling of the component in the following ways
document the undocumented feature of an image credit beneath the caption
only show the figcaption element if there is a caption or a credit
add spacing between caption and credit when present (haven't found any live examples of this, but can be passed on case study pages)
stop using the responsive mixin for component margin, as confusing and unnecessary
instead explicitly set margin bottom on the component to be the same for all screen sizes (it's a big space on desktop, looks fine everywhere else too)
retain the margin 0 for the component, as by default browsers give figure elements margin all around
increase the font size of the caption and credit using the govuk-font mixin (it was 14 on desktop, which is too small - it's still 14px on mobile, but this will automatically be increased to 16 when govuk-frontend v5 is rolled out)

Before (desktop)	After (desktop)

Before (mobile)	After (mobile)