Let´s say you have a file structure like this:

build
-script
--default.min.js
-styles
--default.min.css
js
-default.js
sass
_head.scss
_body.scss
_footer.scss
default.css

On every scss change grunt(should work with gulp as well)will generate a new default.min.css file in your build/styles folder without reloading the browser in connection the old file is updated or replaced.The trick is,that browsersync doesn´t trigger on css but on scss file extensions.So the only thing you have to do is to generate the default.min.css twice for example as default-reload.scss inside the build/styles folder and browsersync will trigger at the right time.

So if you are using the grunt-contrib-cssmin plugin add another task like this:

cssmin:{
...

default:{

files:{

'build/styles/default.min.css':'sass/default.css'

},

},

syncTrigger:{

files:{

'build/styles/default-reload.scss':'sass/default.css'

},

},

},