如何根据CSS中的元素数量更改元素的排列方式？

当卡片元素的数量为4个或更多时，我想像这样将元素向左或向右对齐：

.section {
  display: flex;
  flex-wrap: wrap;
  background-color: #ffabaf;
  max-width: 80vw;
  /* justify-content: left; OR*/
  justify-content: right;
}

.card {
  width: 90px;
  height: 90px;
  background-color: #afafbb;
  border: 3px solid;
}

  
1
  
2
  
3
  
4
  
5
  
6