/* Typography & Font Styles */

/* HEADINGS */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-natural-black);
  line-height: 1.3;
  margin-bottom: var(--spacing-md);
}

h1 {
  font-size: var(--fs-h1-mobile);
  line-height: var(--lh-h1);
  margin-bottom: var(--spacing-lg);
}

@media (min-width: 1024px) {
  h1 {
    font-size: var(--fs-h1-desktop);
  }
}

h2 {
  font-size: var(--fs-h2-mobile);
  line-height: var(--lh-h2);
}

@media (min-width: 1024px) {
  h2 {
    font-size: var(--fs-h2-desktop);
  }
}

h3 {
  font-size: var(--fs-h3-mobile);
  line-height: var(--lh-h3);
}

@media (min-width: 1024px) {
  h3 {
    font-size: var(--fs-h3-desktop);
  }
}

/* BODY TEXT */
p {
  margin-bottom: var(--spacing-md);
  line-height: var(--lh-body);
}

p:last-child {
  margin-bottom: 0;
}

/* LINKS */
a {
  color: var(--color-forest-green);
  transition: var(--transition-fast);
  text-decoration: none;
}

a:hover {
  color: var(--color-barn-red);
  text-decoration: underline;
}

/* LISTS */
ul, ol {
  margin-left: var(--spacing-lg);
  margin-bottom: var(--spacing-md);
}

li {
  margin-bottom: var(--spacing-sm);
  line-height: var(--lh-body);
}

/* STRONG & EMPHASIS */
strong {
  font-weight: 700;
  color: var(--color-wood-brown);
}

em {
  font-style: italic;
}

/* SMALL TEXT */
small {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  color: var(--color-wood-brown);
}

/* ACCENT TEXT */
.accent {
  font-family: var(--font-accent);
  font-size: var(--fs-accent);
  font-weight: 700;
  color: var(--color-barn-red);
  line-height: var(--lh-accent);
}

/* BLOCKQUOTE */
blockquote {
  font-size: 1.25rem;
  font-style: italic;
  color: var(--color-wood-brown);
  border-left: 4px solid var(--color-barn-red);
  padding-left: var(--spacing-lg);
  margin: var(--spacing-lg) 0;
}

/* HORIZONTAL RULE */
hr {
  border: none;
  border-top: 1px solid var(--color-taupe);
  margin: var(--spacing-2xl) 0;
}

.divider-dashed {
  border: none;
  border-top: 2px dashed var(--color-taupe);
  margin: var(--spacing-3xl) 0;
}
