Running "less:compile" (less) task >> assets/less/company.less: [L421:C2] .box-shadows is undefined

Running "less:compile" (less) task
>> assets/less/company.less: [L421:C2] .box-shadows is undefined

But the top of cool-startup.less does contains correctly utils.less which defines .box-shadows

@import "utils.less";
@import "buttons.less";
@import "formElements.less";
@import "slider.less";
@import "graph.less";

(...)

.heading-gradient {
  .box-shadows(rgba(0, 0, 0, 0.25), rgba(128, 128, 128, 0.1));
  height: 28px;
  line-height: 28px;
  padding: 10px 20px;
  .background-gradient(rgb(65, 65, 65), 0%, rgb(45, 45, 45), 100%);
}

The problem & solution resides in the grunt.js file

Wrong:

    less: {
      compile: {
        options: {
          paths: [
            "backbone/assets/less"
          ]
        },
        files: ""
      }
    },

Good:

    less: {
      compile: {
        options: {
          paths: [
            "assets/less"
          ]
        },
        files: ""
      }
    },

Basically you have to know the actual directory that the less task runs from and if you reference

as being in the same directory, it is not sufficient that it is in the same directory as the file that imports it, it must be in one of the path indicated by the less: { compile: { options: { paths: ["here"] } } } array.

* Names in this post have been change to preserve code anonymity 😉