Используйте классы для управления состоянием. И классы меняйте кодом.
.menu {
opacity: 0; /* по умолчанию скрыто */
}
.menu-opened {
opacity: 1; /* при добавлении класса - открыто */
}
@media (min-width: 992px) {
.menu {
opacity: 1; /* на больших экранах – всегда открыто */
}
}
//...
burger.classList.toggle('open');
burger.classList == 'open'
? menu.classList.add('menu-opened')
: menu.classList.remove('menu-opened');
Кстати, что это такое:
burger.classList == 'open'?
Проверку так делают:
burger.classList.contains('open'); 
