custom font not working on mobile

Site URL: https://steddlestonefarms.com

Hi - I've read several threads and tried a few different things and nothing seems to be solving for my issue. On desktop across all browsers, my custom font -Royal Signage- is visible but it's not on mobile. I have this font as the site header, the titles for some sections and all headers (h1-3 are the only ones I'm using). Any help is much appreciated!

@font-face {

    font-family: 'RoyalSignage-Rg';

       src: url('https://wolverine-kazoo-8rdx.squarespace.com/config/design/undefined');

  }
.user-items-list-item-container .list-item-content__title {
  font-family: RoyalSignage-Rg;
}
div.list-section-title p {
    font-family: 'RoyalSignage-Rg' !important;
}

h1 {font-family: 'RoyalSignage-Rg';}
h2 {font-family: 'RoyalSignage-Rg';}
h3 {font-family: 'RoyalSignage-Rg';}
#site-title {font-family: 'RoyalSignage-Rg'; src:url(https://wolverine-kazoo-8rdx.squarespace.com/config/design/undefined)}

I'm not sure how this is working anywhere, the source needs to be an uploaded font file, not your website URL. Upload the font file in the Custom CSS and insert that location after SRC:

It is uploaded as file; and it's how its visible on desktop. I however through other research discovered I needed another file type other than an .oft. I've solved my own issue. Thanks!

Glad you've fixed it, if it stops working this this as the URL in this line is wrong:

src: url('https://wolverine-kazoo-8rdx.squarespace.com/config/design/undefined');

It's a link to your website backend, it should be the location of your uploaded font. 

Go to Custom CSS delete that URL, and leave the cursor between the "", at the bottom click on manage custom files, then upload you font, then click on it. That will insert the file location URL, use that for both instances.