/* Wrapper */
.iwsg-wrap { --gap: 14px; --cols: 3; }

/* breakpoint: il numero di colonne max si adatta alla classe iwsg-cols-N */
.iwsg-wrap.iwsg-cols-1 { --cols: 1; }
.iwsg-wrap.iwsg-cols-2 { --cols: 2; }
.iwsg-wrap.iwsg-cols-3 { --cols: 3; }
.iwsg-wrap.iwsg-cols-4 { --cols: 4; }
.iwsg-wrap.iwsg-cols-5 { --cols: 5; }
.iwsg-wrap.iwsg-cols-6 { --cols: 6; }

/* Masonry con CSS Grid + auto-rows + JS per lo span */
.iwsg-grid {
  display: grid;
  grid-auto-rows: 8px; /* unità di base per calcolare lo span */
  grid-template-columns: repeat(var(--cols), 1fr);
  gap: var(--gap);
}

/* item base */
.iwsg-item { overflow: hidden; background: #f5f5f5; }
.iwsg-item img { display: block; width: 100%; height: auto; }

/* Responsiveness */
@media (max-width: 1024px) {
  .iwsg-wrap { --cols: 2; }
}
@media (max-width: 640px) {
  .iwsg-wrap { --cols: 1; }
}

/* opzionale: effetto hover leggero */
.iwsg-item a { display:block; }
.iwsg-item a:hover img { filter: brightness(.95); }