Wordpress font not loading in Safari

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.