Menu Font CSS problem

Site URL: https://fundacion42.org

Hi!
I am using a custom font named 'Space Grotesk'. I have succesfully uploaded this font by CSS code into the site, and it is working for headers, paragraphs and buttos. But I haven't been able to make it work for the navegation menu. I will paste the CSS code I am using:
 

@font-face {

    font-family: 'Space Grotesk';

       src: url('https://static1.squarespace.com/static/57bb1b5e59cc68374d95e818/t/6080799bbb54e72b94e23c28/1619032475894/SpaceGrotesk-VariableFont_wght.ttf');

  }

h1 {font-family: 'Space Grotesk';}
h2 {font-family: 'Space Grotesk';}
h3 {font-family: 'Space Grotesk';}
p {font-family: 'Space Grotesk';}


/* navigation */
.header-nav *, nav.header-menu-nav-list * {
    font-family: 'Space Grotesk';
}
/* button */
.sqs-block-button-element {
    font-family: 'Space Grotesk' !important;
}

I also tired this code for the navigation

/* navigation */
nav#mainNavigation span {
    font-family: 'Space Grotesk' !important;
}

If any of you have an idea to fix this, I would be very grateful 

:D

Nav has this CSS

ul.cf * {
    font-family: 'Space Grotesk' !important;
}

I'm having the same issue. I tried inputting the above code but it still isn't working for me... Has anyone else had success with this?

19 hours ago, bshevlin said:

I'm having the same issue. I tried inputting the above code but it still isn't working for me... Has anyone else had success with this?

Can you share link to your site?

Having the same issue, would love to hear how others have tackled this.

9 hours ago, AlishaK said:

Having the same issue, would love to hear how others have tackled this.

Can you share link to your site? We can help easier