/* =========================================================================
   Home "Igiene Globale" - regole responsive.
   Le celle delle righe del builder vanno già a capo sotto i 768px (widgets.css);
   qui adattiamo le GRIGLIE custom (.ig-*) e le spaziature.
   ========================================================================= */

@media (max-width: 1024px) {
  .ig-cat-dyn ul.products { grid-template-columns: repeat(3, 1fr); }
  .ig-hero-img { min-height: 300px; }
}

@media (max-width: 782px) {
  .ig-hero > .gjs-row-inner,
  .ig-problems > .gjs-row-inner,
  .ig-kits > .gjs-row-inner,
  .ig-exp > .gjs-row-inner,
  .ig-products > .gjs-row-inner { padding-block: 44px; }

  /* Feature bar: da riga a griglia 2x2, senza i separatori verticali. */
  .ig-features > .gjs-row-inner { flex-wrap: wrap; }
  .ig-feature { flex: 1 1 44%; border-left: 0; padding: 10px 12px; }

  .ig-cat-dyn ul.products { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .ig-kit-dyn ul.products { grid-template-columns: 1fr; }
  .ig-prod-dyn ul.products { grid-template-columns: 1fr; }

  .ig-btn-row { max-width: 100%; }

  .ig-cta-inner { flex-direction: column; align-items: flex-start; }
  .ig-cta-inner .ig-btn { width: 100%; }
}

@media (max-width: 460px) {
  .ig-cat-dyn ul.products { grid-template-columns: 1fr; }
}