/* =========================================================
   V14 Single Post Content Readability
   Focus: single-blog-content paragraph spacing, line-height,
   Gutenberg block rhythm, and mobile readability.
   ========================================================= */

/* Give the article body a more comfortable reading rhythm. */
body.ctl-blog-theme .single-blog-content {
  max-width: 1120px !important;
  color: #243f4b !important;
  font-size: 18.5px !important;
  line-height: 1.88 !important;
  font-weight: 520 !important;
  letter-spacing: -0.006em !important;
  text-rendering: optimizeLegibility !important;
}

/* Keep long-form text readable instead of stretching too wide. */
body.ctl-blog-theme .single-blog-content > p,
body.ctl-blog-theme .single-blog-content > ul,
body.ctl-blog-theme .single-blog-content > ol,
body.ctl-blog-theme .single-blog-content > blockquote,
body.ctl-blog-theme .single-blog-content > h2,
body.ctl-blog-theme .single-blog-content > h3,
body.ctl-blog-theme .single-blog-content > h4,
body.ctl-blog-theme .single-blog-content > h5,
body.ctl-blog-theme .single-blog-content > h6,
body.ctl-blog-theme .single-blog-content > .wp-block-heading,
body.ctl-blog-theme .single-blog-content > .wp-block-list,
body.ctl-blog-theme .single-blog-content > .wp-block-quote,
body.ctl-blog-theme .single-blog-content > .wp-block-pullquote {
  width: min(980px, 100%) !important;
  max-width: 980px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Paragraph rhythm */
body.ctl-blog-theme .single-blog-content p,
body.ctl-blog-theme .single-blog-content .wp-block-paragraph {
  margin-top: 0 !important;
  margin-bottom: 22px !important;
  line-height: 1.88 !important;
}

body.ctl-blog-theme .single-blog-content p:last-child {
  margin-bottom: 0 !important;
}

/* Make the first paragraph slightly more readable but not oversized. */
body.ctl-blog-theme .single-blog-content > p:first-of-type {
  margin-top: 0 !important;
  color: #294954 !important;
  font-size: 19px !important;
  line-height: 1.9 !important;
}

/* Headings inside article content */
body.ctl-blog-theme .single-blog-content h2,
body.ctl-blog-theme .single-blog-content .wp-block-heading:is(h2) {
  margin-top: 56px !important;
  margin-bottom: 18px !important;
  color: #16323f !important;
  font-size: clamp(32px, 3.2vw, 46px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.055em !important;
  font-weight: 950 !important;
}

body.ctl-blog-theme .single-blog-content h3,
body.ctl-blog-theme .single-blog-content .wp-block-heading:is(h3) {
  margin-top: 42px !important;
  margin-bottom: 14px !important;
  color: #16323f !important;
  font-size: clamp(25px, 2.4vw, 34px) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.045em !important;
  font-weight: 950 !important;
}

body.ctl-blog-theme .single-blog-content h4,
body.ctl-blog-theme .single-blog-content h5,
body.ctl-blog-theme .single-blog-content h6 {
  margin-top: 34px !important;
  margin-bottom: 12px !important;
  color: #16323f !important;
  line-height: 1.18 !important;
  letter-spacing: -0.03em !important;
  font-weight: 900 !important;
}

/* Lists */
body.ctl-blog-theme .single-blog-content ul,
body.ctl-blog-theme .single-blog-content ol,
body.ctl-blog-theme .single-blog-content .wp-block-list {
  margin-top: 0 !important;
  margin-bottom: 26px !important;
  padding-left: 1.35em !important;
  line-height: 1.82 !important;
}

body.ctl-blog-theme .single-blog-content li {
  margin-bottom: 10px !important;
  padding-left: 4px !important;
}

body.ctl-blog-theme .single-blog-content li:last-child {
  margin-bottom: 0 !important;
}

/* Blockquote */
body.ctl-blog-theme .single-blog-content blockquote,
body.ctl-blog-theme .single-blog-content .wp-block-quote {
  margin-top: 34px !important;
  margin-bottom: 34px !important;
  padding: 26px 30px !important;
  border-left: 5px solid #13b7a5 !important;
  border-radius: 0 24px 24px 0 !important;
  background: rgba(232, 248, 251, .72) !important;
  color: #244551 !important;
  line-height: 1.75 !important;
}

body.ctl-blog-theme .single-blog-content blockquote p {
  margin-bottom: 12px !important;
}

/* Media / Gutenberg blocks */
body.ctl-blog-theme .single-blog-content > figure,
body.ctl-blog-theme .single-blog-content > .wp-block-image,
body.ctl-blog-theme .single-blog-content > .wp-block-gallery,
body.ctl-blog-theme .single-blog-content > .wp-block-cover,
body.ctl-blog-theme .single-blog-content > .wp-block-table,
body.ctl-blog-theme .single-blog-content > .wp-block-embed {
  margin-top: 42px !important;
  margin-bottom: 42px !important;
}

body.ctl-blog-theme .single-blog-content .wp-block-image figcaption,
body.ctl-blog-theme .single-blog-content figcaption {
  margin-top: 12px !important;
  color: #6b8390 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

/* Tables */
body.ctl-blog-theme .single-blog-content table {
  width: 100% !important;
  border-collapse: collapse !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 20px 50px rgba(13, 86, 117, .08) !important;
}

body.ctl-blog-theme .single-blog-content th,
body.ctl-blog-theme .single-blog-content td {
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(8, 120, 164, .10) !important;
  text-align: left !important;
  vertical-align: top !important;
}

body.ctl-blog-theme .single-blog-content th {
  color: #16323f !important;
  background: rgba(232, 248, 251, .80) !important;
  font-weight: 900 !important;
}

/* Prevent awkward overflow from long URLs or English words. */
body.ctl-blog-theme .single-blog-content,
body.ctl-blog-theme .single-blog-content p,
body.ctl-blog-theme .single-blog-content li {
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

/* Better spacing between content and related section. */
body.ctl-blog-theme .related-posts-section {
  margin-top: 92px !important;
}

/* Mobile */
@media (max-width: 760px) {
  body.ctl-blog-theme .single-blog-content {
    font-size: 16.5px !important;
    line-height: 1.78 !important;
  }

  body.ctl-blog-theme .single-blog-content > p,
  body.ctl-blog-theme .single-blog-content > ul,
  body.ctl-blog-theme .single-blog-content > ol,
  body.ctl-blog-theme .single-blog-content > blockquote,
  body.ctl-blog-theme .single-blog-content > h2,
  body.ctl-blog-theme .single-blog-content > h3,
  body.ctl-blog-theme .single-blog-content > h4,
  body.ctl-blog-theme .single-blog-content > h5,
  body.ctl-blog-theme .single-blog-content > h6,
  body.ctl-blog-theme .single-blog-content > .wp-block-heading,
  body.ctl-blog-theme .single-blog-content > .wp-block-list,
  body.ctl-blog-theme .single-blog-content > .wp-block-quote,
  body.ctl-blog-theme .single-blog-content > .wp-block-pullquote {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.ctl-blog-theme .single-blog-content p,
  body.ctl-blog-theme .single-blog-content .wp-block-paragraph {
    margin-bottom: 18px !important;
    line-height: 1.78 !important;
  }

  body.ctl-blog-theme .single-blog-content > p:first-of-type {
    font-size: 17px !important;
    line-height: 1.8 !important;
  }

  body.ctl-blog-theme .single-blog-content h2,
  body.ctl-blog-theme .single-blog-content .wp-block-heading:is(h2) {
    margin-top: 42px !important;
    margin-bottom: 14px !important;
    font-size: 30px !important;
  }

  body.ctl-blog-theme .single-blog-content h3,
  body.ctl-blog-theme .single-blog-content .wp-block-heading:is(h3) {
    margin-top: 34px !important;
    margin-bottom: 12px !important;
    font-size: 24px !important;
  }

  body.ctl-blog-theme .single-blog-content ul,
  body.ctl-blog-theme .single-blog-content ol,
  body.ctl-blog-theme .single-blog-content .wp-block-list {
    margin-bottom: 22px !important;
    padding-left: 1.15em !important;
  }

  body.ctl-blog-theme .single-blog-content > figure,
  body.ctl-blog-theme .single-blog-content > .wp-block-image,
  body.ctl-blog-theme .single-blog-content > .wp-block-gallery,
  body.ctl-blog-theme .single-blog-content > .wp-block-cover,
  body.ctl-blog-theme .single-blog-content > .wp-block-table,
  body.ctl-blog-theme .single-blog-content > .wp-block-embed {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }

  body.ctl-blog-theme .related-posts-section {
    margin-top: 64px !important;
  }
}
