.foo {
  font-size: calc(1em + 2 * ((100vw - 20em) / 25));
  --font-size: calc(1em + 2 * ((100vw - 20em) / 25));
}
@media screen and (min-width: 45em) {
  .foo {
    font-size: 3em;
    --font-size: 3em;
  }
}
@media screen and (max-width: 20em) {
  .foo {
    font-size: 1em;
    --font-size: 1em;
  }
}