Нужен совет при изучении верстки. Когда стоит переходить к SCSS/SASS - на каком этапе? И когда лучше приступать к JavaScript?

Много зависит от ваших задач(если работаете один) или кодстайлов внутри команды. Сейчас поясню. 

Если с кодстайлом внутри команды все понятно, то есть, если надо то надо и чем быстрее, тем лучше, то с поставленной задачей не так все однозначно.

К примеру, многие используют препроцессоры для того, чтобы добавить переменные в CSS. Сейчас в этом нет необходимости, эта функциональность уже очень хорошо поддерживается браузерами. 

Если нужно использовать миксины, то тут тоже можно попробовать делать классы-хэлперы, узкоспециализированные, которые выполняют определенную, микро-задачу, но со временем такой подход начинает превращать код в кучу мусора. Вот пример, как получается мусор.

.p-t-100 { padding-top: 100px; }
.p-t-112 { padding-top: 112px; }
.p-t-112-per { padding-top: 112%; }

Тогда на помощь приходит более высокоуровневое решение, типа Bootstrap или Tailwind CSS. Причем, Tailwind не только инкапсулирует в себя эти "мусорные" хэлперы, но еще и во время сборки включает только нужное. 

Сам Tailwind пропагандирует делать проект без использования CSS вообще. Это очень заманчивое предложение, однако, в массах профессиональных разработчиков старой и новой школы вызывает серьезные споры. От себя скажу, что я раньше был за старую школу,  которая противились количеству классов у элемента, и всегда оставался приверженцем  БЭМ-методологии. Но два этих подхода противоречат друг другу. Позже, я для себя открыл директиву @apply и теперь совмещаю чистый БЭМ подход с удобством хэлперов. Пример

.my-btn {
    @apply bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded;

    &--active {
        @apply bg-blue-700;
    }
}
<button class="my-btn my-btn--active" type="button">test</button>

Хочу отметить, что сами разработчики Tailwind не очень одобряют такой подход, но не запрещают. По мне - это золотая середина - чистой верстка без лишних классов и широкие возможности и скорость использования хэлперов. Было бы здорово увидеть мнения от других разработчиков в комментариях по такому использованию. Я пока минусов не увидел, но может я просто еще на наступил на эти грабли.

К чему я это? К тому что, попробуйте понять, в вашем следующем проекте, можно ли обойтись средствами TailWind? Если да, то можно не спешить с обучением SASS/SCSS, но как показывает практика, изучать все равно придется, даже если используете TailWind, но немного отсрочить попробовать можно.

Что касается JavaScript, тут все тоже понятно и однозначно. Учить надо и лучше делать это раньше, потому что это большой пласт знаний, который вы быстро не освоите, скорее всего. Вероятно придется сделать даже несколько подходов, отложить, потом вернуться, чтобы не "перегореть". 

Это займет много времени, потому что  JavaScript уже полноценный язык программирования а не таблицы стилей или гипертекстовая разметка. Он может выступать как серверный язык так и клиентский и вариантов его использования масса. Есть решения, которые позволяют писать и десктопные и мобильные и веб-приложения. Поэтому начинайте прямо сейчас! Удачи в изучении)