Bootstrap, why doesn't row-cols- work?

Why does this work with Bootstrap's row-cols-2:

 <div class="container">        <div class="row row-cols-2">          <div class="col">Column</div>          <div class="col">Column</div>          <div class="col">Column</div>          <div class="col">Column</div>        </div>      </div>

But not this one? He doesn't accept the two elements here, what am I missing?

 <div class="container">        <div class="row g-3 row-cols-2">            <div class="card" style="width: 18rem;">                <div class="card-body">                  <h5 class="card-title">Card title</h5>                  <h6 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h6>                  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>                  <a href="#" class="card-link">Card link</a>                  <a href="#" class="card-link">Another link</a>                </div>            </div>            <div class="card" style="width: 18rem;">                <div class="card-body">                  <h5 class="card-title">Card title</h5>                  <h6 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h6>                  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>                  <a href="#" class="card-link">Card link</a>                  <a href="#" class="card-link">Another link</a>                </div>            </div>            <div class="card" style="width: 18rem;">                <div class="card-body">                  <h5 class="card-title">Card title</h5>                  <h6 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h6>                  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>                  <a href="#" class="card-link">Card link</a>                  <a href="#" class="card-link">Another link</a>                </div>            </div>            <div class="card" style="width: 18rem;">                <div class="card-body">                  <h5 class="card-title">Card title</h5>                  <h6 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h6>                  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>                  <a href="#" class="card-link">Card link</a>                  <a href="#" class="card-link">Another link</a>                </div>            </div>            <div class="card" style="width: 18rem;">                <div class="card-body">                  <h5 class="card-title">Card title</h5>                  <h6 class="card-subtitle mb-2 text-body-secondary">Card subtitle</h6>                  <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>                  <a href="#" class="card-link">Card link</a>                  <a href="#" class="card-link">Another link</a>                </div>            </div>        </div>    </div>