Typography refactor

# Typography Refactor

## Key Points:

- Font settings to define key variables upfront;
- Non-hierarchical (temporarily named after Greek mythological characters) font size variable names;
- Simplified mixins for controlling font-size, font-weight and line-height;
- A base-heading-style to zero all top margins and set a uniform line-height of 1 to prevent awkward wrapping;
- A base-font-style that responds to set a desktop size of 18px;
- A base-button-style with font-smoothing;
- Simpler heading classes that can be applied to HTML or extended.
I considered most of the conventional options however most of them are hierarchical and from experience we need non-hierarchical variable names (for when a size is inserted in between xl and xxl).

As for dad's army characters versus mythical creatures - that's up for debate! I just plonked these in so I didn't spend all of Saturday thinking about naming... ;)