divが横に広がるのをやめたいが、divの中の要素を横ならびにしたいとき

Question

ヘッダー部分のdiv class="name0"が、div class="header-link"の直前まで横に広がっていて、この広がりをなくしたいです。同時に、div class="name0"の中のa class="name"とdiv class="logo"を横並びにしておきたいです。よろしくお願いいたします。

 <header>
        <div class="name0">
        <a  class="name" href="index.html">
               
            <div style="line-height:1;">
               <p>株式会社</p><br><h2>サンプル</h2>
            </div>
            
        </a> 
       
        <div class="logo"><a href="index.html"><img src="img/logo.jpg"></a></div>
    </div>
    <div class="header-link">
      <a href="concept.html">concept<br>（初めての方へ）</a>
      <a href="consulting menu.html">consulting menu<br>（コンサルメニュー）</a>
      <a href="company.html">company<br>（会社案内）</a>
      <a href="contact.html">contact<br>（お問い合わせ）</a> 
    </div>
        </header>

.name0{
  display:flex;
  
}
.name{
    display:inline-block;
    width:350px;
    color:whitesmoke;
    padding-left:30px;
    font-family:serif;
}
.logo{
    width:10%;
    
}
header img{
  width:100%;
}
header{
    background-color:#7b6b7f;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:12;
    display:flex;
    justify-content:space-between;
    padding:10px 0 5px 0;
    font-family:Century Gothic; 
    
}
.header-link{
    display:flex;
    justify-content:space-around;
    text-align:center;
}
.header-link a{
    width:200px;
    color:white;
}
header a{
    text-decoration:none;
    display:inline-block;
}

Answer 1

.name0{
display:flex;
width:30%;　←追記

}

これで解決しました。ありがとうございました。