The reason for this is that the MathJax fonts do not include glyphs for the accented characters, and so when you use one, it has to fall back on system fonts to obtain the needed characters. These don't always match the MathJax fonts very well, as you have seen, and that result can depend on the surrounding font.
There are several approaches to the problem. First, the CommonHTML output handles this better than the HTML-CSS output, so you could try that instead. Second, you can set the mtextFontInherit option to true, so the all the characters in <mtext> elements will be taken from the surrounding font (not just the ones MathJax doesn't have internally). See
for details of how to set that in your configuration.
Third, you could set the unknownFamily option to include a font that works better, but it already includes serif, so that may not help.
I think your best bet is mtextFontInherit:true.
Davide