[Help needed] Custom CSS not working/showing

Hi,

I'm having some issues with custom CSS.

• Fonts: I uploaded a custom font for headings - it shows up in the editor but none of them shows up on the live site.
• Other CSS: The CSS I wrote for the yellow nav bar also does not appear on the live site even though it works in the editor.

I was troubleshooting but couldn't get this resolved. The live site is https://www.saymycheese.com/simply-sage - would appreciate some help, thanks in advance!

@font-face {
  font-family: 'Jost';
  src: url('https://static1.squarespace.com/static/627b2b8d29670e0040a5311f/t/6530c8f1a2891e484b1cad0f/1697695985126/Jost-SemiBold.ttf');
}

.header {
  font-family: 'Jost' !important;
}

.case_header {
  font-family: 'Jost' !important;
  font-size: 2.5em;
}

.case_info {
  font-family: 'Jost' !important;
  font-size: 1.5em;
}

.case_section {
  font-family: 'Jost' !important;
  font-size: 2em;
}

#block-yui_3_17_2_1_1697821516021_9785{
  position: fixed;
  top: 0;
}

Thank you so much! The code works.

I resolved the _9785 block code - to make the nav bar sticky or fixed, the code should be in a separate section, and I make the whole section sticky.