Как работают медиазапросы, почему не работает?
max-width означает "до" (включительно)
min-width означает "от" (включительно)
т.е. у вас стили применяются на ширине браузера до 992px включительно
Начиная с 993 эти стили отключаются.
max-device-width: 1400px
означает "размер дисплея до 1400". Дисплея (устройства), не браузера.
@media screen and (max-width: 992px)
Нет одного и единственного решения при выстраивании адаптива. Всё зависит от дизайн-конструкции.
Данный запрос никак не относится к устройству, а лишь к разрешению экрана устройства. 992px - это примерно стандартное разрешение Laptop(Нетбук), а не Notebook(Ноутбук).
Вы должны отталкиваться от удобства просматривания контента на определенных разрешениях, а не устройствах. DevTool в хроме позволяет просматривать контент на любом девайсе(применяя разрешения экрана данного устройства).