Как выравнять на одной строке все элементы?

Question

Арман Браунов @armanq

я такой

Как выравнять на одной строке все элементы?

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Beauty</title>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/main.css">

</head>
<body>
    <header class="header__top">
        <div class="container">
            <div class="navigation">
                <ul class="navigation_item">
                    <li class="navigation_li">
                        <a class="navigation_link" href="#">Доставка</a>
                    </li>
                    <li class="navigation_li">
                        <a class="navigation_link" href="#">Оплата</a>
                    </li>
                    <li class="navigation_li">
                        <a class="navigation_link" href="#">Отзывы</a>
                    </li>
                    <li class="navigation_li">
                        <a class="navigation_link" href="#">Вопрос - ответ</a>
                    </li>
                    <li class="navigation_li">
                        <a class="navigation_link" href="#">Контакты</a>
                    </li>
                </ul>
            </div>
        </div>
    </header>

    <section class="manage">
        <div class="container">
            <div class="main"></div>
           <div class="logo">
               <img src="img/logo.png" alt="Логотип">
               <h1>Beauty</h1>
           </div>
           <div class="input">
               <input type="text">
           </div>
           <div class="number">
            <h2>8 (812) 123-45-67</h2>
            <a href="tel:+78121234567" class="button" >Обратный звонок</a>
           </div>
            </div>
        </div>
        
    </section>
    
</body>
</html>

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
::before, ::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

html {
box-sizing: border-box;
-ms-overflow-style: scrollbar;
}

*,
*::before,
*::after {
outline: none;
box-sizing: inherit;
}
[type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner, button::-moz-focus-inner {
padding: 0;
border-style: none;
}
button {
cursor:pointer;
}
textarea:focus, input:focus{
outline: none;
}
input:required, textarea:required {
box-shadow:none;
}
img {
max-width: 100%;
}

input, textarea {
height: 40px;
border: 1px solid #bdbfc0;
font-size: 16px;
padding-left: 20px;
padding-right: 20px;
color: #000;
border-radius: 2px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
textarea {
height: auto;
padding:20px;
}
label {
display: block;
max-width: 100%;
margin-bottom: 5px;
font-weight: 500;
}

html {
overflow-x: hidden;
font-size: 18px;
}
body {
background:#fff;
font-family: 'Roboto', sans-serif;
font-size: 18px;
color: #1f1f1f;
font-weight: 400;
line-height: 1.3;
overflow-x: hidden;;
}

body {
    font-family: 'Roboto', sans-serif;
}
.container {
    max-width: 1110px;
    margin: 0 auto;
}
.header__top {
    background: #E5E5E5;
    height: 50px;
}
.navigation_li  {
    display: inline-block;
   
}

.navigation_li + .navigation_li {
    margin-left: 30px;
}
.navigation_link {
    text-decoration: none;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #333333;
  
}
.navigation {
    display: flex;
    justify-content: center;
    padding-top: 15px;
    
}

.button {
    border: 2px solid wheat;
    text-decoration: none;
    color: #000000;
    border-radius: 40px;
    background: #FFFFFF;
    padding: 12px 26px 13px 27px;
    border-color: #F13C6E;
    
}

.logo h1 {
    font-weight: bold;
    font-size: 36px;
    line-height: 42px;
    color: #F13C6E;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding-left: 20px;
}

.number h2 {

    font-size: 16px;
    line-height: 19px;
    color: #000;
    margin-right: 40px;
}

.input input {
background: url(../img/lupa.png) no-repeat 8.333% 50%, #EFEFEF;
border-radius: 40px;
width: 250px;
height: 40px;
border: none;
}


.input input:focus {
    background: #EFEFEF;
}

.main {
   display: flex;
  
   
   
   
}
/* !!!! высота секции
.manage {
    width: 120px;  
}

*/

.logo {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding-top: 20px;
    
}

.input {
    display: flex; 
    justify-content: center;
    
    
}

    .number {
    display: flex;
    justify-content: flex-end;
}