/***
 * Visual Rhythm
 *
 * Variables to maintain a standard visual rhythm both vertically and horizontally.
 *
 * Also, there's a function for returning the next multiple of vertical rhythm
 * above a given number.
 *
 * @param {Number} $base - number to find next multiple above.
 * @param {optional, Number} $rhythm - number that's multiplied until it's larger than `$base`. Equal to `$vr` if omitted.
 *
 * scss:
 *   line-height: multipleAbove(30, 14); // 3;
 */

// vertical rhythm
$vr: pxToRem(16) !default;
$wr: $vr !default;

// base grid width
$max-width: pxToRem(1020);
@function n-col-width ($cols) {
  @return (($max-width / 12 - $wr) * $cols + $wr * ($cols - 1));
}

// useful for line heights
@function multipleAbove ($base, $rhythm: $vr) {
  @return $rhythm * ceil($base / $rhythm);
}