You have rule like font-family: ‘albra’ !important;
However, browser have no information where to get this font and you have no fall-back fonts listed, so browser uses default font to show this element. Default font may differ between browsers and OSes, so nothing unexpected here.
Now, in your assets/custom.css you have some code to define the Albra font-face, but it was not rendered as you’ve expected. You can see that liquid code is still there unprocessed:
You should rename this file to be custom.css.liquid for liquid code to be processed. This, however, is not recommended for a number of reasons, that’s why modern themes render font-face rules as part of the layouts/theme.liquid
Also, your font file names are missing their extensions?