How do I add extra details into the product cards of a collection

[AlanNguyen1]

Hi, currently I have the following product cards of a collection, it is only displaying the product title and price. Now, I would like to add some extra details above the price, for example the product sizes or strength. I understand it has something to do with "card-product.liquid" but I am a bit unfamiliar with the syntax. What should I do here? Also, if I wish to apply styles to those elements, which css files should I use? 
Thank you in advance for the help, I would greatly appreciate it. 

[exertweb]

@AlanNguyen1 

To use metafields to add custom information like product sizes or strength in your product cards, you can follow these steps:

Create a Metafield in Shopify:

• In your Shopify admin, go to Settings > Custom data.
• Under Products, click Add definition to create a new metafield.
• Define your metafield, such as strength, with a content type like Single line text or Number.
• Save the metafield and add values for each product in the product editor.

Modify card-product.liquid to Display the Metafield:

• In the card-product.liquid file, add Liquid code to display the metafield value. For example:

<div class="product-details">
    <!-- Example: Display custom strength metafield -->
    <p>Strength: {{ product.metafields.custom.strength }}</p>
</div>