Современный способ по добавлению и удалению классов - classList API.

document.getElementById('intro_btn').onclick = function() {
  document.getElementById('main').classList.add('main--main-bg');
}

Соответственно, на чистом js каждой кнопке даёте id, и присваиваете нужный класс. Если нужно убрать, то classList.remove('название_класса'), если включить/выключить - то toggle()

Не стоит делать Так

Для подобных вещей лучше всего использовать svg и по ховеру применять к нему filter: shadow.

• Жутко не хватает эффектов ховера на элементах.
  
• На фокусе нужно какое-то изменение поля e-mail.
  
• Слишком медленная анимация на ссылках — такие можно делать только там, где это по какой-то причине необходимо. Здесь же пользователь устанет быстро от такого.