@charset "utf-8";
/* CSS Document */
/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

html {
	font-family: var(--tc-font-primary);
}

body {
	font-family: var(--tc-font-primary);
	font-size: var(--tc-text-base);
	font-weight: var(--tc-fw-regular);
	line-height: var(--tc-leading-normal);
	color: var(--tc-gray-800);
	background: var(--tc-white);
}

/* Headings */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--tc-font-heading);
	font-weight: var(--tc-fw-bold);
	line-height: var(--tc-leading-tight);
	color: var(--tc-black);
	margin-bottom: 1rem;
}

h1 {
	font-size: clamp(2.5rem, 5vw, 4rem);
}

h2 {
	font-size: clamp(2rem, 4vw, 3rem);
}

h3 {
	font-size: clamp(1.5rem, 3vw, 2.25rem);
}

h4 {
	font-size: 1.5rem;
}

h5 {
	font-size: 1.25rem;
}

h6 {
	font-size: 1.125rem;
}

/* Paragraphs */

p {
	margin-bottom: 1.5rem;
	line-height: 1.8;
	color: var(--tc-gray-700);
}

/* Links */

a {
	transition:
		color var(--tc-transition),
		opacity var(--tc-transition);
}

a:hover {
	color: var(--tc-primary);
}

/* Strong */

strong,
b {
	font-weight: var(--tc-fw-bold);
}

/* Small */

small {
	font-size: var(--tc-text-sm);
}

/* Blockquote */

blockquote {
	margin: 2rem 0;
	padding-left: 1.5rem;
	border-left: 4px solid var(--tc-primary);
	font-style: italic;
	color: var(--tc-gray-600);
}

/* Code */

code,
pre {
	font-family:
		ui-monospace,
		SFMono-Regular,
		Menlo,
		Consolas,
		monospace;
}
