Wordpress font not loading in Safari

Question

In my Wordpress website I have set up the Klavika font as followed:

@font-face {
  font-family: 'klavika';
  font-weight: 400;
  font-style: normal;
  src: url('path/fonts/KlavikaCH-Regular.otf'),
      url('path/fonts/KlavikaCH-Regular.woff2') format("woff2"),
      url('path/fonts/KlavikaCH-Regular.woff') format("woff"),
      url('path/fonts/KlavikaCH-Regular.ttf') format("truetype");

When I open the website on the mobile in Google Chrome, the font shows, but when I open it in Safari, the font doesn't show. Why is this the case?

I added the formatting lines, but they didn't seem to help at all.

I added the formatting lines, but they didn't seem to help.