/*------------------------------------------*/
/*  SINGLE POST ARTICLE TYPOGRAPHY
/*  Alignment + rhythm for long-form blog content.
/*  Loaded last so it settles specificity against style.css.
/*------------------------------------------*/

/* Comfortable reading measure, left aligned. */
.single-post .single-post-txt .entry-content {
  max-width: 780px;
  text-align: left;
}

.single-post .single-post-txt .entry-content > * {
  max-width: 100%;
}

/*------------------------------------------*/
/*  HEADINGS
/*------------------------------------------*/

.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4 {
  font-family: 'Noto Sans TC', sans-serif;
  color: #1c1c1c;
  text-align: left;
  line-height: 1.3;
}

/* Section heading — the main structural break. */
.single-post .entry-content h2 {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 55px 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e5e5;
}

/* Subsection heading inside a section. */
.single-post .entry-content h3 {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 38px 0 14px;
}

.single-post .entry-content h4 {
  font-size: 1.0625rem;
  font-weight: 600;
  margin: 30px 0 12px;
}

/* No runaway gap when a heading opens the article or follows another heading. */
.single-post .entry-content > *:first-child {
  margin-top: 0;
}

.single-post .entry-content h2 + h3,
.single-post .entry-content h3 + h4 {
  margin-top: 22px;
}

/*------------------------------------------*/
/*  BODY COPY
/*------------------------------------------*/

.single-post .entry-content p {
  font-size: 1.0625rem;
  line-height: 1.75;
  color: #4c4c4c;
  margin-bottom: 22px;
  text-align: left;
}

/* Standfirst / lead paragraph. Overrides the theme's italic treatment. */
.single-post .entry-content > p.has-medium-font-size:first-child {
  font-size: 1.25rem;
  line-height: 1.6;
  font-style: normal;
  font-weight: 500;
  color: #1c1c1c;
  margin-bottom: 34px;
  padding-left: 18px;
  border-left: 3px solid #16a2e0;
}

/*------------------------------------------*/
/*  LISTS
/*------------------------------------------*/

.single-post .entry-content ul,
.single-post .entry-content ol {
  margin: 0 0 26px;
  padding-left: 22px;
  list-style-position: outside;
}

.single-post .entry-content ul {
  list-style-type: disc;
}

.single-post .entry-content ol {
  list-style-type: decimal;
}

.single-post .entry-content li {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: #4c4c4c;
  margin-bottom: 10px;
  padding-left: 4px;
}

.single-post .entry-content li::marker {
  color: #16a2e0;
}

.single-post .entry-content li:last-child {
  margin-bottom: 0;
}

.single-post .entry-content li > strong {
  color: #1c1c1c;
  font-weight: 600;
}

/* Nested lists sit tighter than their parent. */
.single-post .entry-content li > ul,
.single-post .entry-content li > ol {
  margin: 10px 0 0;
}

/* Checkmark list — used for "Key Takeaways". */
.single-post .entry-content ul.ubas-checklist {
  list-style: none;
  padding-left: 0;
}

.single-post .entry-content ul.ubas-checklist li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 14px;
}

.single-post .entry-content ul.ubas-checklist li::before {
  content: "\2714";
  position: absolute;
  left: 0;
  top: 0;
  color: #16a2e0;
  font-weight: 700;
}

/*------------------------------------------*/
/*  MISC BLOCKS
/*------------------------------------------*/

.single-post .entry-content blockquote {
  margin: 34px 0;
  padding: 4px 0 4px 24px;
  border-left: 3px solid #16a2e0;
  font-size: 1.125rem;
  font-style: italic;
  color: #1c1c1c;
}

.single-post .entry-content blockquote p:last-child {
  margin-bottom: 0;
}

.single-post .entry-content hr,
.single-post .entry-content .wp-block-separator {
  margin: 50px 0;
  border: 0;
  border-top: 1px solid #e5e5e5;
  height: 0;
}

.single-post .entry-content img,
.single-post .entry-content figure {
  max-width: 100%;
  height: auto;
}

.single-post .entry-content figure {
  margin: 34px 0;
}

.single-post .entry-content figcaption {
  font-size: 0.9rem;
  color: #888;
  margin-top: 10px;
  text-align: left;
}

.single-post .entry-content table {
  width: 100%;
  margin-bottom: 26px;
  border-collapse: collapse;
}

.single-post .entry-content th,
.single-post .entry-content td {
  border: 1px solid #e5e5e5;
  padding: 10px 12px;
  text-align: left;
}

/*------------------------------------------*/
/*  POST META BAR (author / category / date)
/*------------------------------------------*/

.single-post .single-post-data .post-meta {
  margin-bottom: 6px;
}

.single-post .single-post-data .post-meta a {
  color: #16a2e0;
}

/*------------------------------------------*/
/*  RESPONSIVE
/*------------------------------------------*/

@media (max-width: 767.98px) {
  .single-post .entry-content h2 {
    font-size: 1.4375rem;
    margin: 40px 0 16px;
  }

  .single-post .entry-content h3 {
    font-size: 1.125rem;
    margin: 30px 0 12px;
  }

  .single-post .entry-content p,
  .single-post .entry-content li {
    font-size: 1rem;
    line-height: 1.7;
  }

  .single-post .entry-content > p.has-medium-font-size:first-child {
    font-size: 1.125rem;
    padding-left: 14px;
  }

  .single-post .entry-content hr,
  .single-post .entry-content .wp-block-separator {
    margin: 36px 0;
  }
}