How to make a line increase smoothly when scrolling?

Question

css

Hello, there is such a line
, here is its svg code

<svg width="1340" height="200" viewBox="0 0 1340 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1379.4 199.527C1358.02 59.0626 1039.53 63.6007 794.527 73.6007C550.623 83.556 45 103 1.5271 0.600692" stroke="#574E56" stroke-width="2" stroke-linejoin="round"/>
</svg>

The question is, what properties to do so that it would not be visible initially, and when adding a class, it would be smoothly drawn

Answer 1

https://ru.stackoverflow.com/a/1075230/308951 - I answered ruSO what's the problem?