Barra de navegação de inicialização com duas linhas

Estou querendo ter uma barra de navegação do Bootstrap 3 que tenha duas linhas com elementos de navegação e com a marca da barra de navegação abrangendo as duas linhas. Nos tamanhos de tela SM +, ambas as linhas são visíveis. Nos tamanhos de tela XS, a segunda linha entra em colapso e mostra a barra de ícones para abrir.

SM +

+-------------------------------------------------------------------------------+
|               |                                             Nav-A-1  Nav-A-2  |
|  SITE LOGO    |---------------------------------------------------------------+
|               |  Nav-B-1  Nav-B-2 Nav-B-3 Nav-B-4                 Form-Right  |
+-------------------------------------------------------------------------------+

XS

+-------------------------------------------------------------------------------+
|               |                                             Nav-A-1  Nav-A-2  |
|  SITE LOGO    |---------------------------------------------------------------+
|               |  Nav-Collapsed                                     Hamburger  |
+-------------------------------------------------------------------------------+

Como isso pode ser feito com a barra de navegação?

questionAnswers(3)

yourAnswerToTheQuestion