I have been using Twitter's Bootstrap for some time now so the addition of Font Awesome into Pagelines isn't a bad thing but the way it's been implemented it conflicts with the naming convention already used by Twitter's Glyphicons which while not vector based are better designed images in many cases. I would therefore like to change the CSS naming convention used for font-awesome. I have identified the location of this file as the icons.less file and changing all the definitions that start with .icon- to .vicon- should allow both icons and vector icons to co-exist but I don't understand your LESS->CSS compilation strategy. I would have expected to see a master LESS file with the import directives to move all the LESS definitions into a single CSS file but that's not there (or I don't see it).

Any help on how to remove this conflict would be greatly appreciated as I currently have hundreds of overlapping images on my site (one for the glyphicon, one for the font awesome icon). Note: this is not visible on production site which is using a much older code base than my development environment.

Great suggestion. In order to have full visibility into what I'm doing is there somewhere I can reference to understand which filters/actions are available from Pagelines? If not in the broader sense I really just want to know about both Bootstrap and FontAwesome as in both cases I'd rather be in control of the versioning of these.

You can override any of these easily in a child theme, simply create a /less/ folder in the child theme and copy the file you want to override. You can even just make it a blank file and the core will load the blank file rather than the parent.