class_list​

<div class="product-detail__info {{block.settings.layout | class_list()}}">
  ...
</div>
<div class="product-card {{block.settings | class_list()}}">
  ...
</div>
{{#schema}}
{
  "name": "Demo",
  "tag": "",
  "settings": [
    {
      "type": "style.layout",
      "id": "layout",
      "default": {
        "flex-wrap": "nowrap",
        "flex-direction": "column",
        "row-gap": "20px",
        "column-gap": "20px"
      }
    },
    {
      "type": "style.spacing",
      "id": "spacing",
      "default": {
        "padding-top": "40px",
        "padding-right": "0px",
        "padding-bottom": "40px",
        "padding-left": "0px",
        "@media (--mobile)": {
          "padding-top": "0px",
          "padding-bottom": "0px"
        }
      }
    }
  ]
}