Анимация фона svg картинки
Имеется такое задание: После загрузки страницы логотип заполняется черным цветом снизу вверх в начале логотип имеет только контур черного цвета. Не знаю как реализовать. В сети видел разные варианты но так и не получилось переложить на мою картинку. Вот собственно сама картинка в конечном своем варианте:
<svg width="134" height="55" viewBox="0 0 134 55" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M45.5849 7.3218L58.4727 5.7026V38.6283L45.5849 37.0089V7.3218ZM40.0857 3.23859V41.0925L63.9716 44.3309V0L40.0857 3.23859ZM110.03 21.7578V25.839H117.5V36.9894H103.966V7.31783H115.552V13.3875H121.048V3.23686H98.4697V41.0704H122.997V21.7578H110.03ZM17.2927 33.5835L17.3229 33.6843C20.3423 23.4893 23.3516 13.335 26.3458 3.23686H34.5854V41.0702H29.0892V11.5183C29.0087 11.5183 19.9403 41.0893 19.9403 41.0893H14.6451C14.6451 41.0893 5.57666 11.5183 5.49642 11.5183V41.0702H0V3.23686H8.23934C11.2338 13.335 14.2434 23.4893 17.2628 33.6843L17.2747 33.6439L17.2836 33.6136L17.2927 33.5835ZM87.0035 7.31792H70.1256V3.23695H92.9625V7.31792L76.0841 36.9893H92.9625V41.0705H70.1256V36.9893L87.0035 7.31792ZM134 41.0706H128.503V3.23708H134V41.0706ZM48.439 54.9998V54.3724H44.0786V52.4815H47.4595V51.8541H44.0786V50.1626H48.274V49.535H43.1506V54.9998H48.439ZM52.7528 49.5349H53.7323L55.7422 54.2956H56.2579L58.2678 49.5349H59.2267L56.876 54.9999H55.103L52.7528 49.5349ZM69.2725 54.9998V54.3724H64.9121V52.4815H68.2937V51.8541H64.9121V50.1626H69.108V49.535H63.9846V54.9998H69.2725ZM80.339 49.5349V54.9999H78.8752L75.4531 50.4305H75.2257V54.9999H74.3191V49.5349H75.7829L79.205 54.1045H79.4316V49.5349H80.339ZM88.4371 50.1476H90.8495V49.535H85.0766V50.1476H87.5089V55H88.4371V50.1476Z" fill="black"/>
</svg>