/** Shopify CDN: Minification failed

Line 16:0 Unexpected "<"
Line 18:5 Unexpected "{"
Line 18:14 Expected ":"
Line 19:2 Unexpected "<"
Line 22:5 Expected identifier but found "%"
Line 23:6 Unexpected "{"
Line 23:7 Expected identifier but found "%"
Line 24:6 Unexpected "<"
Line 27:13 Expected identifier but found "%"
Line 28:14 Unexpected "{"
... and 21 more hidden warnings

**/
<div class="mubina-grid-container page-width" style="padding: 40px 15px;">
  <h2 style="font-size: 24px; font-weight: 900; margin-bottom: 20px; text-transform: uppercase; border-bottom: 2px solid #eee; padding-bottom: 10px;">
    {{ section.settings.title }}
  </h2>

  <div class="mubina-flex-grid">
    {%- for block in section.blocks -%}
      {%- assign collection = collections[block.settings.collection] -%}
      <div class="mubina-col-card">
        <a href="{{ collection.url }}" style="text-decoration: none; color: inherit;">
          <div class="mubina-card-img">
            {%- if collection.image -%}
              {{ collection.image | image_url: width: 500 | image_tag: loading: 'lazy' }}
            {%- else -%}
              {{ 'collection-1' | placeholder_svg_tag }}
            {%- endif -%}
          </div>
          <div class="mubina-card-body">
            <h3>{{ collection.title }}</h3>
            <span class="mubina-card-link">Explorer →</span>
          </div>
        </a>
      </div>
    {%- endfor -%}
  </div>
</div>

<style>
  .mubina-flex-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
  .mubina-col-card { background: #fff; border: 1px solid #ddd; transition: 0.3s; border-radius: 4px; overflow: hidden; }
  .mubina-col-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.15); border-color: #febd69; }
  .mubina-card-img img { width: 100%; height: 200px; object-fit: cover; transition: 0.4s; }
  .mubina-card-body { padding: 15px; text-align: center; }
  .mubina-card-body h3 { font-size: 18px; font-weight: 800; margin: 0 0 10px; color: #131921; }
  .mubina-card-link { color: #007185; font-weight: bold; font-size: 14px; }
  @media (max-width: 749px) { .mubina-flex-grid { grid-template-columns: 1fr 1fr; gap: 10px; } }
</style>

{% schema %}
{
  "name": "Grille Collections Mubina",
  "settings": [
    { "type": "text", "id": "title", "label": "Titre Section", "default": "Nos Univers" }
  ],
  "blocks": [
    {
      "type": "collection",
      "name": "Collection",
      "settings": [
        { "type": "collection", "id": "collection", "label": "Choisir la collection" }
      ]
    }
  ],
  "presets": [{ "name": "Grille Collections Mubina" }]
}
{% endschema %}