Why is there no difference between the Roboto 500 and 400 weight fonts?

Question

css

I read that the matter is in local fonts and you need to rename the font and connect it without local. And so he did.
I connect via @font-face. The name was given differently. removed local. But still there is no difference between 400 and 500.
Tell me what's wrong?

@font-face {
  font-family: 'Robotof';
  font-weight: 700;
  src: url('./fonts/roboto/roboto-bold-webfont.woff2') format('woff2'),
    url('./fonts/roboto/roboto-bold-webfont.woff') format('woff');

  font-style: normal;
}

@font-face {
  font-family: 'Robotof';
  font-weight: 500;
  src: url('./fonts/roboto/roboto-medium-webfont.woff2') format('woff2'),
    url('./fonts/roboto/roboto-medium-webfont.woff') format('woff');

  font-style: normal;
}

@font-face {
  font-family: 'Robotof';
  font-weight: 400;
  src: url('./fonts/roboto/roboto-regular-webfont.woff2') format('woff2'),
    url('./fonts/roboto/roboto-regular-webfont.woff') format('woff');

  font-style: normal;
}

html {
  font-family: 'Robotof', sans-serif;
  font-size: 16px;
}

Answer 1

The reason was that when I converted the fonts to woff, I did not check the cyrillic checkbox. Well, because of this, everything went in one place