typography-mixin(fontSize, lineHeight) {
  font-size: fontSize;
  line-height: lineHeight;
  font-weight: 300;
  letter-spacing: normal;
  margin 12px;
  font-family: var(--mc-font-family);
}

h1, .h1 {
  typography-mixin(36px, 42px);
  @media (max-width: 800px) {
    typography-mixin(28px, 34px);
  }
}

h2, .h2 {
  typography-mixin(32px, 38px);
  @media (max-width: 800px) {
    typography-mixin(20px, 26px);
  }
}

h3, .h3 {
  typography-mixin(24px, 28px);
  @media (max-width: 800px) {
    typography-mixin(20px, 22px);
  }
}

h4, .h4 {
  typography-mixin(22px, 25px);
}

h5, .h5 {
  typography-mixin(16px, 18px);
  margin: 6px;
}

h6, .h6 {
  typography-mixin(14px, 20px);
  margin: 0;
}

.normal {
  font-weight normal;
}