/* ========================================================= */
/* Typography */
/* ========================================================= */

html {
  color: var(--gray4);
  font-family: var(--serif);
  font-size: 100%; /* 16px w/o font scaling */
  height: 100%;
}
@media (min-width: 90em) {
  html { font-size: 112.5%; } /* 18px w/o font scaling */
}

body { font-size: var(--fs1); line-height: var(--lh-body); }
button, input, select, textarea { font-family: inherit; }

/* Heading 1 */
h1, .h1, .sm-h1, .md-h1, .lg-h1, .xl-h1 {
  font-family: var(--sans-serif);
  font-size: var(--fs6);
  line-height: var(--lh-heading-big);
	font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-rendering: optimizeLegibility;
  text-transform: none;
  letter-spacing: var(--lh-condensed);
}

/* Heading 2 */
h2, .h2, .sm-h2, .md-h2, .lg-h2, .xl-h2 {
  font-family: var(--sans-serif);
  font-size: var(--fs5);
  line-height: var(--lh-heading-big);
  font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-rendering: optimizeLegibility;
  text-transform: none;
  letter-spacing: var(--lh-condensed);
}

/* Heading 3 */
h3, .h3, .sm-h3, .md-h3, .lg-h3, .xl-h3 {
  font-family: var(--sans-serif);
  font-size: var(--fs4);
  line-height: var(--lh-heading-med);
  font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-rendering: optimizeLegibility;
  text-transform: none;
  letter-spacing: var(--lh-condensed);
}

/* Heading 4 */
h4, .h4, .sm-h4, .md-h4, .lg-h4, .xl-h4 {
  font-family: var(--sans-serif);
  font-size: var(--fs3);
  line-height: var(--lh-heading-med);
  font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-rendering: optimizeLegibility;
  text-transform: none;
}

/* Heading 5 */
h5, .h5, .sm-h5, .md-h5, .lg-h5, .xl-h5 {
  font-family: var(--sans-serif);
  font-size: var(--fs2);
  line-height: var(--lh-heading-med);
  font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-transform: none;
}

/* Heading 6 */
h6, .h6, .sm-h6, .md-h6, .lg-h6, .xl-h6 {
  font-family: var(--sans-serif);
  font-size: var(--fs1);
  line-height: var(--lh-heading-med);
  font-weight: 400;
  margin-top: 0;
  margin-bottom: var(--s4);
  text-transform: none;
}

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child { margin-bottom: 0; }

/* Paragraphs */
p {
  margin: 0 0 var(--s4) 0;
  hanging-punctuation: first allow-end; /*Safari only*/
}
p + p { margin-top: calc(0rem - var(--s3)); }
p:last-child { margin-bottom: 0; }
p:empty { display: none; }

/* Links */
a {
  color: var(--gray4);
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  -webkit-tap-highlight-color: transparent;
  text-decoration: underline;
  text-decoration-color: var(--gray1);
  text-underline-offset: 2px;
}
a:hover {
  color: var(--black);
}

.greige1 a, a.greige1 {
  color: var(--greige1);
}
.greige1 a:hover, a.greige1:hover {
  color: var(--greige4);
}

.greige2 a, a.greige2 {
  color: var(--greige2);
}
.greige2 a:hover, a.greige2:hover {
  color: var(--greige5);
}

/* Link underlines */
.red1Underline a:not(.button):not(.linkReset), a.red1Underline {
  text-decoration-color: var(--red1);
}
.greige2Underline a:not(.button):not(.linkReset), a.greige2Underline {
  text-decoration-color: var(--greige2);
}

/* Link resets */
.linkReset, .linkReset:hover, .linkReset:focus {
  text-decoration: none;
}

footer a { color: var(--greige2); }
footer a:hover { color: var(--greige4); }




/* Font styling */
em, .italic { font-style: italic; }
strong { font-weight: 800; }
abbr[title] { text-decoration: none; }
.small { font-size: var(--fs0); }
small { font-size: var(--fs0); }
.medium { font-size: var(--fs2); }
.big { font-size: var(--fs3); }
.futura { font-family: var(--sans-serif); }
.caps { text-transform: uppercase; letter-spacing: var(--lh-extended); }
.small.caps { font-weight: 700; }
.lhSingle { line-height: var(--lh-single); }
.lhHeadingMed { line-height: var(--lh-heading-med); }
.lhHeadingBig { line-height: var(--lh-heading-big); }
.lhBody { line-height: var(--lh-body); }
.lhDouble { line-height: var(--lh-double); }
.measure { max-width: 58ch; }
.antialias { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Blockquote */
blockquote {
  border-left: 8px solid var(--greige3);
  margin: 0 0 var(--s4) 0;
  padding-left: var(--s4);
}
blockquote p {
  font-size: var(--fs3);
  margin-bottom: 0;
  margin-top: var(--s3);
}
blockquote p:first-child {
  margin-top: 0;
}
blockquote p.attribution {
  font-size: var(--fs1);
  font-family: var(--sans-serif);
  color: var(--gray4);
  margin-top: var(--s1);
}

/* Lists */
ul {
  margin-top: 0;
  margin-bottom: var(--s4);
  list-style-position: outside;
  padding-left: var(--s3);
  margin-left: 0.25em;
}
ol {
  margin-top: 0;
  margin-bottom: var(--s4);
  padding-left: var(--s4);
  list-style-position: outside;
  list-style: none;
  counter-reset: li;
}
ul:not(.columns):last-child, ol:not(.columns):last-child { margin-bottom: 0; }
ol li {
  counter-increment: li;
  display: flex;
}
ol li:before {
  content: counter(li)'.';
  display: inline-block;
  width: var(--s4);
  margin-left: calc(0rem - var(--s4));
}
li { margin-bottom: var(--s2); }
li:not([class^="col"]):last-child { margin-bottom: 0; }
.listReset { list-style: none; }
li:empty { display: none; }

figure { margin: 0; }

.noWrap { white-space: nowrap; }
.trunclipse {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vaBottom {
  vertical-align: bottom;
}
.vaMiddle {
  vertical-align: middle;
}

/* Text alignments */

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
@media (min-width: 30em) {
  .sm-left { text-align: left; }
  .sm-right { text-align: right; }
  .sm-center { text-align: center; }
}
@media (min-width: 48em) {
  .md-left { text-align: left; }
  .md-right { text-align: right; }
  .md-center { text-align: center; }
}
@media (min-width: 64em) {
  .lg-left { text-align: left; }
  .lg-right { text-align: right; }
  .lg-center { text-align: center; }
}
@media (min-width: 90em) {
  .xl-left { text-align: left; }
  .xl-right { text-align: right; }
  .xl-center { text-align: center; }
}