//----------------------------------------------------------------------------------------------------------------------
// HEADLINES
//----------------------------------------------------------------------------------------------------------------------
////
/// @group typography
////

/// Headline styles. Font size and line height will be set simultaneously when generating `.font-size-[n]` helper classes.
/// @see .font-size-[n]
h1, h2, h3, h4, h5, h6 {
	@include headline;
	margin-bottom: rhythm(2);

	&:not(:first-child) {
		margin-top: rhythm(5);
	}
}

//----------------------------------------------------------------------------------------------------------------------
// FONT SIZES
//----------------------------------------------------------------------------------------------------------------------

@for $n from 1 through 6 {
/// Sets font sizes and line heights for headlines.
/// Font size helper classes from `font-size-1` to `font-size-6`. Numbers represent size of corresponding headline level.
/// @name .font-size-[n]
/// @example markup
///   <span class="font-size-3">Text that is as large as a <h3> would normally be.</span>
	h#{$n}, .font-size-#{$n} {
		@include adaptive-font-size(6 - $n);
	}
}

//----------------------------------------------------------------------------------------------------------------------
// BODY TEXT
//----------------------------------------------------------------------------------------------------------------------

/// Text paragraphs.
p {
	&:not(:first-child) {
		margin-top: rhythm(2);
	}

	&:not(:last-child) {
		margin-bottom: rhythm(2);
	}
}

//----------------------------------------------------------------------------------------------------------------------
// INLINE ELEMENTS
//----------------------------------------------------------------------------------------------------------------------

/// Link styling.
a {
	color: $link-color;

	&:hover {
		color: $link-color-hover;
	}
}

/// Strong/bold text.
/// @example markup
///   <strong>Bold text.</strong>
///   <span class="b">Also bold.</span>
strong, b, .b {
	font-weight: $font-weight-bold;
}

/// Emphasis/italic
/// @example markup
///   <em>Italic (emphasized) text.</em>
///   <span class="i">Also italic.</span>
em, i, .i, dfn {
	font-style: italic;
}

/// Underlined text.
/// @example markup
///   <span class="u">Underlined.</span>
u, .u, abbr {
	text-decoration: underline;
}

/// Small text.
/// @example markup
///   <span class="small">Small text.</span>
small, .small {
	font-size: $font-size-small;
}

/// Text with line-through.
s {
	text-decoration: line-through;
}

/// Helper class to disable text wrap on white space.
.no-wrap {
	white-space: nowrap;
}

//----------------------------------------------------------------------------------------------------------------------
// QUOTATIONS
//----------------------------------------------------------------------------------------------------------------------

/// Inline quotes
q {
	font-style: italic;
}

/// Block quotes
blockquote {
	@extend p;
}

/// Citation reference
cite {
	font-style: italic;
}