/* [[[ Base Typography ]]] */

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

h1, .h1 {
  font-size: 56px;
  line-height: 1.1;
  margin: 0 0 24px;
}

h2, .h2 {
  font-size: 56px;
  margin: 36px 0 24px;
}

h3, .h3 {
  font-size: 36px;
  margin: 28px 0 20px;
}

h4, .h4 {
  font-size: 18px;
  margin: 16px 0;
}

h5, .h5 {
  font-size: 15px;
  margin: 16px 0 12px;
}

h6, .h6 {
  font-size: 13px;
  margin: 16px 0 12px;
}

@media (max-width: 991px) {
  h1, .h1 { font-size: 56px; }
  h2, .h2 { font-size: 48px; }
}

@media (max-width: 767px) {
  h1, .h1 { font-size: 56px; }
  h2, .h2 { font-size: 36px; }
  h3, .h3 { font-size: 32px; }
}

p {
  margin-bottom: 12px;
}



/* [[[ Utility ]]] */

.text--xl { font-size: var(--body-text-xl); }
.text--lg { font-size: var(--body-text-lg); }
.text--md { font-size: var(--body-text-md); }
.text--sm { font-size: var(--body-text-sm); }

.text--default { color: var(--text-default); }
.text--light   { color: var(--text-light); }