Safari giving precedence to installed font - css

Question

Some of the designers working at my workplace noticed that on Safari the font of our website appeared to be the one installed on their machine and not the one we are serving.
We noticed it in two different occasions and with two different fonts: Montserrat and Open Sans.
The first time (with Montserrat) the user had a newer version of the font, and she saw the newest only on Safari, because she had installed it on her local machine (this wasn't happening on Chrome).
The second time (with Open Sans) we saw a bolder font only on a particular machine: we then discovered that on that machine the user had installed a bolder weight (700) than the one we were serving (600). And the rule was
font-weight: bold;
so I suppose that the browser picked up the boldest (700) from the installed fonts.
I did some research but didn't find any evidence of this. Does anyone know if there is any evidence/documentation on Safari giving precedence to installed fonts instead of the ones you are serving?
We are not using Google Fonts from Google's CDN, as we decided to download them and serve them from our own server.
EDIT: I'm adding the code we use to load the font (generated using Google Webfonts Helper):
#font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: url("font/opensans/open-sans-latin_cyrillic-400.eot");
src: local("Open Sans"), local("OpenSans"), url("font/opensans/open-sans-latin_cyrillic-400.eot?#iefix") format("embedded-opentype"), url("font/opensans/open-sans-latin_cyrillic-400.woff2") format("woff2"), url("font/opensans/open-sans-latin_cyrillic-400.woff") format("woff"), url("font/opensans/open-sans-latin_cyrillic-400.ttf") format("truetype"), url("font/opensans/open-sans-latin_cyrillic-400.svg#OpenSans") format("svg");
}
#font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 600;
src: url("font/opensans/open-sans-latin_cyrillic-600.eot");
src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url("font/opensans/open-sans-latin_cyrillic-600.eot?#iefix") format("embedded-opentype"), url("font/opensans/open-sans-latin_cyrillic-600.woff2") format("woff2"), url("font/opensans/open-sans-latin_cyrillic-600.woff") format("woff"), url("font/opensans/open-sans-latin_cyrillic-600.ttf") format("truetype"), url("font/opensans/open-sans-latin_cyrillic-600.svg#OpenSans") format("svg");
}
#font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url("font/montserrat/montserrat-latin-regular.eot");
src: local("Montserrat-Regular"), url("font/montserrat/montserrat-latin-regular.eot?#iefix") format("embedded-opentype"), url("font/montserrat/montserrat-latin-regular.woff2") format("woff2"), url("font/montserrat/montserrat-latin-regular.woff") format("woff"), url("font/montserrat/montserrat-latin-regular.ttf") format("truetype"), url("font/montserrat/montserrat-latin-regular.svg#Montserrat") format("svg");
}
#font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
src: url("font/montserrat/montserrat-latin-700.eot");
src: local("Montserrat-Bold"), url("font/montserrat/montserrat-latin-700.eot?#iefix") format("embedded-opentype"), url("font/montserrat/montserrat-latin-700.woff2") format("woff2"), url("font/montserrat/montserrat-latin-700.woff") format("woff"), url("font/montserrat/montserrat-latin-700.ttf") format("truetype"), url("font/montserrat/montserrat-latin-700.svg#Montserrat") format("svg");
}
And the relevant code to give a different font-face to different parts of the pages.
body{
font-family: "Open Sans", Helvetica, Arial, sans-serif;
font-size: 14px;
}
h6, h5, h4, h3, h2, h1{
font-family: inherit; // inheriting from body
font-weight: bold;
}
.view{
font-family: 'Montserrat', sans-serif;
}

Answer 1

Based on the code you show the solution is kind of obvious: if you don't want local fonts to interfere, don't tell the browser to try local() first. Or at all, really.
It's 2017, and in today's browser landscape you only want src: url(woff font version) format("woff"), nothing else: no other formats, no local-first, just explicitly the font your content should use. In the current browser landscape eot and svg don't even exist as valid formats anymore, and woff are ttf/otf, but with compression, and marked explicitly as intended "for the web" so that some normally required data can be left off, yielding an even smaller font payload. The only other format you might add is WOFF2, which uses a newer compression algorithm and allows "slicing" up a single font into several subsets so that the browser only loads the slices it needs to style your content instead of an entire font in one go.
Whatever generated this CSS for you appears to still be stuck in "how webfonts worked in 2012".

Answer 2

Eventually I used what #Mike'Pomax'Kamermans suggested in one of the last comments to his own answer, I'm posting it here just for clarity.
We removed every local specification and every src apart from the .eot file and the .woff2 file.
Then we added this declaration to tell Safari that our bold font should render with the 600 weight, otherwise Safari would look into the installed copy of the font (which included the 700 weight).
#font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: bold;
src: url('font/open-sans-latin_cyrillic_latin-ext-600.eot'); /* IE9 Compat Modes */
src: url('font/open-sans-latin_cyrillic_latin-ext-600.woff2') format('woff2'); /* Super Modern Browsers */
}