/* ===========================
   GRID SYSTEMS
   =========================== */

/* Unidades de Negocio Grid */
.units-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: clamp(2rem, 5vw, 3rem);
  width: 100%;
  max-width: 100%;
}

/* Value Section Grid */
.value-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: clamp(2.5rem, 6vw, 4rem);
  width: 100%;
  max-width: 100%;
}

/* ===========================
   RESPONSIVE GRIDS
   =========================== */

@media (min-width: 1024px) and (max-width: 1366px) {
  .units-grid {
    gap: clamp(1.5rem, 3.5vw, 2rem);
  }

  .value-grid {
    gap: clamp(1.75rem, 3.5vw, 2.5rem);
  }
}

@media (max-width: 1024px) {
  .units-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: clamp(1.75rem, 4vw, 2.5rem);
  }

  .value-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: clamp(2rem, 5vw, 3rem);
  }
}

@media (max-width: 768px) {
  .units-grid,
  .value-grid {
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 4vw, 2rem);
  }
}
