/* ==========================================================================
   Instant InfoSystems - Blog Article Prose Stylesheet (blog.css)
   Exclusively loaded on Blog Post Detail Template
   ========================================================================== */

/* 1. Base Prose Container */
.blog-prose,
.iis-blog-article-column .blog-prose {
  font-family: var(--font-body, "Red Hat Display", sans-serif) !important;
  font-size: 16px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
  color: #1a1a1a !important;
}

/* 2. Headings Shared Typography */
.blog-prose h1,
.blog-prose h2,
.blog-prose h3,
.blog-prose h4,
.blog-prose h5,
.blog-prose h6 {
  font-family: var(--font-heading, "Rosa Sans", sans-serif) !important;
  font-weight: 600 !important;
  color: #2f849e !important;
}

/* 3. Heading 2 (Calibrated Spacing: 16px top, 24px bottom) */
.blog-prose h2 {
  font-size: 20px !important;
  line-height: 24px !important;
  font-weight: 600 !important;
  color: #2f849e !important;
  margin-top: 16px !important;
  margin-bottom: 24px !important;
}

/* 4. Heading 3 (Calibrated Spacing: 16px top, 24px bottom) */
.blog-prose h3 {
  font-size: 18px !important;
  line-height: 1.5rem !important;
  font-weight: 600 !important;
  color: #2f849e !important;
  margin-top: 16px !important;

}

/* 5. Subheading Pairing: Connect h3 when it immediately follows h2 */
.blog-prose h2+h3 {
  margin-top: 8px !important;
}

/* 6. Section First-Child Resets: Zero top margin on the first element of Part 1 & Part 2 */
.blog-prose-part1>*:first-child,
.blog-prose-part1 span>*:first-child,
#blog-rest-content .blog-prose>*:first-child,
#blog-rest-content .blog-prose span>*:first-child,
#blog-rest-content .blog-prose h2:first-of-type {
  margin-top: 0 !important;
}

/* 7. Paragraphs */
.blog-prose p {
  font-family: var(--font-body, "Red Hat Display", sans-serif) !important;
  font-size: 16px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
  color: #1a1a1a !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;
}

/* 8. Lists (Exact Figma Match: Bullets Disabled, Zero Gap Between Items) */
.blog-prose ul {
  font-family: var(--font-body, "Red Hat Display", sans-serif) !important;
  font-size: 16px !important;
  line-height: 24px !important;
  color: #1a1a1a !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;
  padding-left: 0 !important;
  list-style: none !important;
  list-style-type: none !important;
}

.blog-prose ol {
  font-family: var(--font-body, "Red Hat Display", sans-serif) !important;
  font-size: 16px !important;
  line-height: 24px !important;
  color: #1a1a1a !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;
  padding-left: 24px !important;
  list-style: decimal !important;
  list-style-type: decimal !important;
}

.blog-prose li {
  font-family: var(--font-body, "Red Hat Display", sans-serif) !important;
  font-size: 16px !important;
  line-height: 24px !important;
  color: #1a1a1a !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
}

.blog-prose ul li {
  list-style: none !important;
  list-style-type: none !important;
  display: block !important;
  padding-left: 0 !important;
}

.blog-prose ol li {
  list-style: decimal !important;
  list-style-type: decimal !important;
}

.blog-prose ul li::marker {
  display: none !important;
  content: '' !important;
}

.blog-prose ol li::marker {
  color: #2f849e !important;
}

/* 9. Inline Formatting & Links */
.blog-prose strong,
.blog-prose b {
  color: #2f849e !important;
  font-weight: 600 !important;
}

.blog-prose a {
  color: #8ae4eb !important;
  text-decoration: none !important;
}

.blog-prose a:hover {
  text-decoration: underline !important;
}

/* 10. Prevent stray <br> elements from breaking native CSS margin collapse */
.blog-prose br+h2,
.blog-prose br+h3,
.blog-prose h2+br,
.blog-prose h3+br {
  display: none !important;
}

.blog-prose br.block.h-4,
.blog-prose br[class*="h-4"] {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
}

/* 11. Normalize HubSpot Rich Text DOM Wrappers */
.blog-prose span,
.blog-prose div {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

.blog-prose span.hs_cos_wrapper,
.blog-prose div.hs_cos_wrapper {
  display: block !important;
  width: 100% !important;
}