Почему не применяется свойство max-width: 300px; к flex элементу?

.box {
  display: flex;
  background-color: #28282A;
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px 0;
}

.item {
  background-color: #FFBB24;
  text-decoration: none;
  color: red;
  display: block;
  max-width: 300px;
  text-align: center;
  padding: 10px 0;
}

<div class="box">
  <a href="#" class="item">Ссылка</a>
  <a href="#" class="item">Ссылка</a>
</div>