Custom fonts not importing correctly

Hi, I'm having trouble with a custom font. I have other custom fonts on my site, however this specific one is giving me trouble: Sign-Painter-Semibold (https://freefontsfamily.com/signpainter-housescript-font-free/)

I uploaded the .ttf file to my custom files, and when I add it to the CSS and apply it to one of my headings, it shows as a general serif font instead of the actual font.

This is the code I am using:

@font-face {
font-family: 'Sign-Painter-Semibold';
src: url(https://static1.squarespace.com/static/6377acee19258c4978a8a37b/t/6410f58ef660734f59163a6b/1678833038934/signpainter-housescript-semibold.otf);
  
font-family: 'Flama-Basic';
src: url(https://static1.squarespace.com/static/6377acee19258c4978a8a37b/t/6377afa67f82fd18ba56ef5c/1668788134678/Flama-Basic.otfFontURL);

font-family: 'Flama-Semicondensed-Semibold';
src: url(https://static1.squarespace.com/static/6377acee19258c4978a8a37b/t/6377daaaafd4463ac17ee9e3/1668799146879/FlamaSemicondensed-Semibold.otf);
  }

h1 {font-family: 'Flama-Semicondensed-Semibold'!important;}
h2 {font-family: 'Flama-Semicondensed-Semibold'!important;}
h3 {font-family: 'Flama-Semicondensed-Semibold'!important;}
h4 {font-family: 'Sign-Painter-Semibold'!important;}

Can someone help me troubleshoot? Thanks so much 🙏

Link to site (in trial mode): https://fuchsia-bulldog-7g85.squarespace.com/
Password: dig 

Hi @srdig The link you provided to download the font seems to only give me a TTF file called "SignPainter-HouseScript". I see your custom code you're referencing an OTF file with a variant name of the font. Just curious if you found that version elsewhere. I was able to download the original "SignPainter-HouseScript" in that link  and get it to work on a demo site, but here are 2 things I noticed.

1. When I copy and paste the the SRC URL for Sign Painter font in your code, it doesn't download for me which usually means the URL is incorrect or something needs to be checked there.  Try deleting the font, and re-uploading and copying the URL again into your custom code.

2. Unrelated to your issue but the Flama basic SRC URL has some extra characters at the end. Remove them so it ends in just .otf as below  

font-family: 'Flama-Basic';
src: url(https://static1.squarespace.com/static/6377acee19258c4978a8a37b/t/6377afa67f82fd18ba56ef5c/1668788134678/Flama-Basic.otf);

Hi @HyltonTech - thank you so much for your reply! I appreciate you calling out the extra characters, I removed those. 

I redownloaded the font and linked the .ttf URL, and now I have a new issue. If I add the Sign Painters font first, above the two Flama fonts, the Flama fonts appear on my site but the Sign Painters font appears as the standard serif font. If I switch the order and put the Sign Painters font last, after the Flama fonts, the Sign Painters font appears on my site but the Flama fonts default to the standard serif font. Does the order matter? Do you know if there is something else in my code that could be causing this? Thanks for your help.

@srdig Can you paste your updated custom code and share the site details again?

It looks like the site trial expired so I can't take a live look. The order shouldn't matter as long as !important; is added so i'm guessing something in the custom code block is off or missing something.