Custom CSS code not changing site header

Hello, I am wondering how to change the font in the site header, I have managed to change it for all the other text p, h1-h5...etc but its not changing for the site header, any reasons why? 

@font-face {font-family: Mondwest; src: url(https://static1.squarespace.com/static/6353b495028f9672b92564c0/t/6353e9fa74728610d2871a14/1666443771501/Mondwest-Bold.otf)}
p {font-family: Mondwest!important}
h1 {font-family: Mondwest!important}
h2 {font-family: Mondwest!important}
h3 {font-family: Mondwest!important}
h4 {font-family: Mondwest!important}
sqsrte-large {font-family: Mondwest!important}
sqsrte-small {font-family: Mondwest!important}
.form-block *{font-family: Mondwest!important}

Can you provide your website URL?

gecko-oval-msg6.squarespace.com

you are a genius amongst us mortals.

the problem is that its not changing on the 'mobile version', is there a way to change it?

This should do it:

 .header-menu-nav-item {font-family: Mondwest!important;}

Thank you!!