It looks like Firefox can’t really work out how wide that image is because you have not set a size for it explicitly.
I would also apply the natural height and width attributes in the html otherwise the correct space cannot be computed until the resource has loaded and then overlaps or reflows may occur.
<img src="https://www.danieljeffery.co.uk/coffeechoice/images/precisionHeatingLogo.svg" class="logo" alt="Precision Heating Logo" width="1151" height="987">
Browsers always look at the html attributes of the image before they css the css and if present can compute the size properly even if resized later with css.
As @Archibald said above applying padding to an image is a bit weird anyway and you would be better
off with padding on the container or margins on the image.
It also looks like the issue could be fixed if you added box-sizing:content:box to the image. Im guessing that the 1fr grid size is computed on the image’s size but the padding on the image is being added to the image’s width which the browser has now mis-calculated.
There have always been problems with browsers trying to work out the width of containers where the width of the container is dependent on the width of its content whose content is also based on the width of its parent (browsers hate circular references). The spec says that in these cases the layout is undefined.
None of which answers the problem explicitly so I would guess that Firefox’s behaviour is buggy but not unexpected.