.Heading {
  --this-font-family: var(--x-pp-typography-secondary-fonts);
  --this-line-height: var(--x-pp-global-typography-line-size-default);
  color: inherit;
  font-family: var(--this-font-family);
  line-height: var(--this-line-height);
  text-transform: var(--x-pp-global-typography-letter-case);
  letter-spacing: var(--x-pp-global-typography-kerning);
  font-weight: var(--x-pp-typography-secondary-weight-base);
}

.h1 {
  --this-font-size: var(--x-pp-typography-size-xxlarge);
  --this-font-weight: var(--x-pp-typography-secondary-weight-base);
  font-size: var(--this-font-size);
  font-weight: var(--this-font-weight);
}

.h2 {
  --this-font-size: var(--x-pp-typography-size-large);
  --this-font-weight: var(--x-pp-typography-secondary-weight-base);
  font-size: var(--this-font-size);
  font-weight: var(--this-font-weight);
  color: var(
    --x-pp-default-color-text-emphasized,
    var(--x-pp-default-color-text, inherit)
  );
}

.h3 {
  --this-font-size: var(--x-pp-typography-size-default);
  --this-font-weight: var(--x-pp-typography-secondary-weight-bold);
  font-size: var(--this-font-size);
  font-weight: var(--this-font-weight);
  color: var(
    --x-pp-default-color-text-emphasized,
    var(--x-pp-default-color-text, inherit)
  );
}

.h4,
.h5,
.h6 {
  --this-font-size: var(--x-pp-typography-size-default);
  --this-font-weight: var(--x-pp-typography-secondary-weight-base);
  font-size: var(--this-font-size);
  font-weight: var(--this-font-weight);
  color: var(
    --x-pp-default-color-text-emphasized,
    var(--x-pp-default-color-text, inherit)
  );
}
