vw - Viewport Width
vh - Viewport Height
если задать 100vw, то это будет равняться 100% ширине экрана ( адаптируется при изменении размеров экрана ) тоже самое и с высотой
1vw - 1% ширины экрана
1vh - 1% высоты экрана
1. Нельзя просто так взять и перевести в vw, потому что везде 1vw или 1vh будет равняться разной цифре. Поэтому, просто используй @media в css или scss, и задавай фиксированные значения
2. Если задашь тексту размер например 15vw, это будет адаптивный текст, который будет автоматически подстраиваться под размеры экрана, таким образом всегда размер будет разный, и перевести в px нельзя. А вообще это используют на маленьких размерах экрана, типа если меньше 500px размер экрана, то можно задать в vw размер текста, и можно забить на более маленький размер экранов.
Использовать на постоянке для текста, лучше не надо, ведь нельзя задать фиксированный размер (у тебя в макете 48px) если задашь в vw, то постоянно будет изменяться при изменении размеров экрана, таким образом размер уже не будет равняться 48px.
Надеюсь понятно объяснил)
