Как сделать адаптивный шрифт css?
Для адаптивных сайтов необходимо использовать meta-тег:<meta name="viewport" content="width=device-width, initial-scale=1.0">
Дальше задавать нужные размеры в соответствующих интервалах медиа условий.
Но нужно понимать, что, вероятно, придется переделать не только размер шрифта.
Задавать размеры текста, различных отступов, которые должны уменьшаться при уменьшении разрешения, с помощью единиц em и rem, в media-queries сделать несколько брекпоинтов, где уменьшать font-size у html в зависимости от разрешения. Нескольким элементам лучше задавать фиксированные размеры, в px. Например, параграфам. Иначе, как у вас, происходит чрезмерное уменьшение шрифтов. В своих сайтах обычно перед началом разработки уже выставляю p { font-size: 16px; } - тогда текст одинаково хорошо читается на любых устройствах. Некоторый не столь важный текст, показывающий, например, дополнительную информацию и тому подобное, можно делать меньше, например 12-14 px.