Hello Mauricio,
custom css works rather simple. In your case as I understandfrom the image you want to change the background color of the card. As it is now white (#fff) let's say you want to change it to yellow (#ffff00). In that case the --bs-card-bg:#fff; should be replaced by --bs-card-bg:#ffff00;
you can do that by using
.card {--bs-card-bg:#ffff00;}
Note: sometimes you need to add an important-element to make it work, in which case you have to use
.card {--bs-card-bg:#ffff00 !important;}
The important-element sort of forces the change you want to make. So in this case let's use
.card {--bs-card-bg:#ffff00 !important;}
This line of code has to be added to your css, as it is needed to change the white background into a yellow one.
Login to the wp-admin of your site and find 'Appearance'. Click it and now select 'Customise'. Now the screen changes and you will see a new columnon the left of the screen and the homepage of your site on the right.
In the column click 'Additional CSS'.
If you never put anything there it show some text you can remove, and as soon as the column is clean you paste the code
.card {--bs-card-bg:#ffff00 !important;}
into that column and save it.
As soon as you have saved it the change to the website is made.
Please note: when you add codes to this section in many cases you need to flush the cache of your site in order to see the changes. Inside the cache your website is as it were 'remembered' by your browser and as long as you don't flush the cache you may not see the changes.
Also note that some changes are only visible once you log out as an admin and view he site.
Important note:
Prior to changing CSS you can also test the result. If you use 'inspect element' in your case you saw
--bs-card-bg:#fff;
If where you see what you want to change which in this case is the #fff and put the cursor on it, click it and change the fff into in this example ffff00 in most cases you will see the change live on your screen. This playing around is sometimes great tool to see if changes work or not.
