h1 {
  margin: 0;
  font-family: var(--h1-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h1-size, var(--heading-size, 48px));
  font-weight: var(--h1-weight, var(--heading-weight, 700));
  font-style: var(--h1-italic, var(--heading-italic, normal));
  line-height: var(--h1-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h1-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h1-underline, var(--heading-underline, none));
  color: var(--h1-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h1-opacity, 100) / 100);
}

h2 {
  margin: 0;
  font-family: var(--h2-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h2-size, var(--heading-size, 40px));
  font-weight: var(--h2-weight, var(--heading-weight, 700));
  font-style: var(--h2-italic, var(--heading-italic, normal));
  line-height: var(--h2-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h2-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h2-underline, var(--heading-underline, none));
  color: var(--h2-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h2-opacity, 100) / 100);
}

h3 {
  margin: 0;
  font-family: var(--h3-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h3-size, var(--heading-size, 32px));
  font-weight: var(--h3-weight, var(--heading-weight, 700));
  font-style: var(--h3-italic, var(--heading-italic, normal));
  line-height: var(--h3-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h3-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h3-underline, var(--heading-underline, none));
  color: var(--h3-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h3-opacity, 100) / 100);
}

h4 {
  margin: 0;
  font-family: var(--h4-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h4-size, var(--heading-size, 24px));
  font-weight: var(--h4-weight, var(--heading-weight, 700));
  font-style: var(--h4-italic, var(--heading-italic, normal));
  line-height: var(--h4-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h4-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h4-underline, var(--heading-underline, none));
  color: var(--h4-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h4-opacity, 100) / 100);
}

h5 {
  margin: 0;
  font-family: var(--h5-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h5-size, var(--heading-size, 20px));
  font-weight: var(--h5-weight, var(--heading-weight, 700));
  font-style: var(--h5-italic, var(--heading-italic, normal));
  line-height: var(--h5-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h5-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h5-underline, var(--heading-underline, none));
  color: var(--h5-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h5-opacity, 100) / 100);
}

h6 {
  margin: 0;
  font-family: var(--h6-font, var(--heading-font, "Inter", sans-serif));
  font-size: var(--h6-size, var(--heading-size, 18px));
  font-weight: var(--h6-weight, var(--heading-weight, 700));
  font-style: var(--h6-italic, var(--heading-italic, normal));
  line-height: var(--h6-line-height, var(--heading-line-height, 1.2));
  letter-spacing: var(--h6-spacing, var(--heading-spacing, 0));
  text-decoration: var(--h6-underline, var(--heading-underline, none));
  color: var(--h6-color, var(--heading-color, #1c1f25));
  opacity: calc(var(--h6-opacity, 100) / 100);
}

/* ===== RESPONSIVE MEDIA QUERIES ===== */
@media screen and (max-width: 1024px) {
  h1 {
    font-size: var(--h1-size, var(--heading-size, 40px));
  }
  h2 {
    font-size: var(--h2-size, var(--heading-size, 32px));
  }
  h3 {
    font-size: var(--h3-size, var(--heading-size, 28px));
  }
  h4 {
    font-size: var(--h4-size, var(--heading-size, 20px));
  }
  h5 {
    font-size: var(--h5-size, var(--heading-size, 18px));
  }
  h6 {
    font-size: var(--h6-size, var(--heading-size, 16px));
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: var(--h1-size, var(--heading-size, 32px));
  }
  h2 {
    font-size: var(--h2-size, var(--heading-size, 28px));
  }
  h3 {
    font-size: var(--h3-size, var(--heading-size, 24px));
  }
  h4 {
    font-size: var(--h4-size, var(--heading-size, 18px));
  }
  h5 {
    font-size: var(--h5-size, var(--heading-size, 16px));
  }
  h6 {
    font-size: var(--h6-size, var(--heading-size, 14px));
  }
}