CSS Custom Font not working on Site Title

Hey!

So I added my custom font in CSS using the code at the bottom. Its worked nicely on all the headers, but for some reason it won't work on the site title. I'm using Squarespace 7.1, but according to the font section the site title is under 'headers' so im not sure why its not working, or what else I might need to add. Any thoughts or help would be greatly apprecaited! Thanks!

@font-face {
    font-family: TheGoldsmithVintage;
  src: url(https://static1.squarespace.com/static/5fbc2259745d511ad8845455/t/5fd27dc51f20065b6bfeff1e/1607630279676/The+Goldsmith_Vintage.ttf);
  }
h1 {
font-family: 'TheGoldsmithVintage'!important;
}

h2 {
font-family: 'TheGoldsmithVintage'!important;
}

h3 {
font-family: 'TheGoldsmithVintage'!important;
}

H4 {
font-family: 'TheGoldsmithVintage'!important;
}

Use this CSS for site title

a#site-title {
    font-family: 'TheGoldsmithVintage' !important;
}