/* TUTMED blog: readable long-form typography, accessible links and data tables. */
.blog-single {
  --article-ink: #2d281f;
  --article-muted: #655c4d;
  --article-accent: #7a4700;
  --article-accent-hover: #542f00;
  --article-line: #d9c9ad;
  --article-soft: #f7efdf;
  background: #fffdf8;
}

.blog-single .article-header {
  max-width: 900px;
  padding-top: clamp(50px, 7vw, 88px);
  padding-bottom: 12px;
}

.blog-single .article-header h1 {
  max-width: 18ch;
  margin-bottom: 26px;
  color: #211d17;
  text-wrap: balance;
}

.blog-single .article-header .lede {
  max-width: 720px;
  color: #544a3b;
  font-size: clamp(1.08rem, 1.8vw, 1.28rem);
  line-height: 1.68;
}

.blog-single .article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: #6a4b1c;
}

.blog-single .article-image {
  max-width: 1120px;
  margin-top: clamp(30px, 5vw, 54px);
}

.blog-single .article-image img {
  border-radius: 14px;
  box-shadow: 0 14px 38px rgba(60, 43, 17, .09);
}

.blog-single .prose-page {
  width: min(calc(100% - 40px), 820px);
  max-width: 820px;
  padding-top: clamp(52px, 7vw, 82px);
  padding-bottom: clamp(80px, 10vw, 128px);
  color: var(--article-ink);
}

.blog-single .prose-page p,
.blog-single .prose-page li {
  color: var(--article-ink);
  font-size: clamp(1.02rem, 1.25vw, 1.11rem);
  line-height: 1.82;
}

.blog-single .prose-page p {
  margin: 0 0 1.35em;
}

.blog-single .prose-page h2 {
  margin: 2.25em 0 .75em;
  padding-top: .85em;
  border-top: 1px solid var(--article-line);
  color: #211d17;
  font-size: clamp(1.8rem, 4vw, 2.45rem);
  line-height: 1.2;
  text-wrap: balance;
  scroll-margin-top: 110px;
}

.blog-single .prose-page h2:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.blog-single .prose-page h3 {
  margin: 1.9em 0 .55em;
  color: #30271c;
  font: 600 clamp(1.18rem, 2.4vw, 1.42rem)/1.35 var(--serif);
  scroll-margin-top: 110px;
}

.blog-single .prose-page strong {
  color: #292116;
  font-weight: 750;
}

.blog-single .prose-page a {
  color: var(--article-accent);
  font-weight: 650;
  text-decoration-line: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
  transition: color .18s ease, background-color .18s ease;
}

.blog-single .prose-page a:hover {
  color: var(--article-accent-hover);
  background: #f5e6c7;
}

.blog-single .prose-page a:focus-visible {
  outline-color: #8a5200;
}

.blog-single .prose-page blockquote,
.blog-single .prose-page .wp-block-quote {
  margin: 2rem 0 2.25rem;
  padding: 22px 26px;
  border: 0;
  border-left: 4px solid #b1710b;
  border-radius: 0 10px 10px 0;
  background: var(--article-soft);
}

.blog-single .prose-page blockquote p:last-child {
  margin-bottom: 0;
}

.blog-single .prose-page ul,
.blog-single .prose-page ol {
  margin: 1.2rem 0 1.8rem;
  padding-left: 1.6rem;
}

.blog-single .prose-page li {
  margin-bottom: .65rem;
  padding-left: .28rem;
}

.blog-single .prose-page li::marker {
  color: #925b08;
  font-weight: 800;
}

.blog-single .prose-page sup {
  vertical-align: super;
  line-height: 0;
}

.blog-single .prose-page sup a {
  display: inline-block;
  min-width: 1.55em;
  padding: .12em .3em;
  border: 1px solid #cba967;
  border-radius: 4px;
  background: #fff7e8;
  font-size: .72em;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
}

.blog-single .prose-page figure.wp-block-table {
  max-width: 100%;
  margin: 2.2rem 0 2.6rem;
  overflow-x: auto;
  border: 1px solid #cdbb9c;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(63, 43, 13, .06);
  -webkit-overflow-scrolling: touch;
}

.blog-single .prose-page .wp-block-table table {
  width: 100%;
  min-width: 680px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: #fff;
  font-size: .98rem;
  line-height: 1.55;
}

.blog-single .prose-page .wp-block-table th,
.blog-single .prose-page .wp-block-table td {
  padding: 15px 17px;
  border-right: 1px solid #dfd1ba;
  border-bottom: 1px solid #dfd1ba;
  color: #302a21;
  text-align: left;
  vertical-align: top;
}

.blog-single .prose-page .wp-block-table th:last-child,
.blog-single .prose-page .wp-block-table td:last-child {
  border-right: 0;
}

.blog-single .prose-page .wp-block-table tbody tr:last-child td {
  border-bottom: 0;
}

.blog-single .prose-page .wp-block-table thead th {
  border-bottom: 2px solid #b99a63;
  background: #efe2c9;
  color: #201b14;
  font-size: .86rem;
  font-weight: 800;
  letter-spacing: .02em;
}

.blog-single .prose-page .wp-block-table tbody tr:nth-child(even) td {
  background: #fbf7ef;
}

.blog-single .prose-page .tutmed-sources {
  padding: 20px 20px 20px 44px;
  border: 1px solid var(--article-line);
  border-radius: 10px;
  background: #faf6ee;
}

.blog-single .prose-page .tutmed-sources li {
  font-size: .93rem;
  line-height: 1.65;
  scroll-margin-top: 110px;
}

.post-card h3 a:hover,
.post-card h3 a:focus-visible {
  color: #764600;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.post-card .text-link {
  color: #653c00;
  border-bottom-color: currentColor;
}

@media (max-width: 699px) {
  .blog-single .prose-page {
    width: min(calc(100% - 36px), 820px);
  }

  .blog-single .article-header h1 {
    font-size: clamp(2.25rem, 11vw, 3.4rem);
  }

  .blog-single .prose-page h2 {
    margin-top: 1.8em;
  }

  .blog-single .prose-page blockquote,
  .blog-single .prose-page .wp-block-quote {
    padding: 18px;
  }

  .blog-single .prose-page figure.wp-block-table {
    margin-right: -18px;
    margin-left: -18px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .blog-single .prose-page .wp-block-table table {
    min-width: 620px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .blog-single .prose-page a {
    transition: none;
  }
}