/* Long-form article template: standard headings, paragraphs, lists and tables. */
.guide-hero-band { background: #f4f7f1; border-bottom: 1px solid var(--border); padding-top: 24px; }
.blog-detail-page .guide-breadcrumb { margin: 0 0 24px; font-size: .875rem; }
.guide-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding-bottom: 36px; }
.guide-heading h1 { color: #174c3c; font-size: clamp(1.875rem,3.1vw,2.625rem); line-height: 1.24; margin-bottom: 24px; }
.guide-heading .eyebrow { font-size: .8125rem; margin-bottom: 16px; }
.guide-heading .article-meta { font-size: .875rem; margin: 0; flex-wrap: wrap; }
.guide-cover { border-radius: 8px; overflow: hidden; }
.guide-cover img { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; }
.blog-detail-page .article-layout { grid-template-columns: minmax(0,1fr) 260px; grid-template-areas: "body toc"; gap: 64px; padding-top: 36px; }
.blog-detail-page .article-layout > aside { grid-area: toc; min-width: 0; }
.blog-detail-page .article-layout > .article-body { grid-area: body; }
.blog-detail-page .article-toc { padding-left: 20px; max-height: calc(100dvh - 140px); overflow-y: auto; }
.blog-detail-page .article-toc h2 { font-size: 1rem; }
.blog-detail-page .article-body { max-width: none; }
.blog-detail-page .article-layout.no-toc { display: block; }
.blog-detail-page .article-layout.no-toc > .article-body { max-width: 900px; margin-inline: auto; }
.blog-detail-page .guide-hero.is-no-cover { grid-template-columns: minmax(0,760px); }
.blog-detail-page .article-body > :first-child { margin-top: 0; }
.blog-detail-page .article-body > :last-child { margin-bottom: 0; }
.blog-detail-page .article-body h2 { font-size: 1.875rem; line-height: 1.3; margin-bottom: 18px; }
.blog-detail-page .article-body h3 { font-size: 1.375rem; line-height: 1.4; color: #34463e; margin: 28px 0 12px; }
.blog-detail-page .article-body :is(h2,h3,h4,h5,h6) { scroll-margin-top: 120px; overflow-wrap: anywhere; }
.blog-detail-page .article-body h2 { margin-top: 42px; color: #174c3c; }
.blog-detail-page .article-body h3 { margin-top: 32px; }
.blog-detail-page .article-body h4 { margin: 26px 0 10px; color: #34463e; font-size: 1.125rem; line-height: 1.45; }
.blog-detail-page .article-body h5,
.blog-detail-page .article-body h6 { margin: 22px 0 8px; color: #34463e; font-size: 1rem; line-height: 1.5; }
.blog-detail-page .article-body p,
.blog-detail-page .article-body li { font-size: 1rem; line-height: 1.7; color: #59695f; }
.blog-detail-page .article-body p { margin-bottom: 16px; }
.blog-detail-page .article-body :is(ul,ol) { padding-left: 24px; margin: 0 0 18px; }
.blog-detail-page .article-body :is(ul,ol) :is(ul,ol) { margin: 8px 0 4px; }
.blog-detail-page .article-body li { padding-left: 3px; margin-bottom: 5px; }
.blog-detail-page .article-body li::marker { color: #2f6b4f; }
.blog-detail-page .article-body a:not(.button):not(.wp-block-button__link) { color: #174c3c; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.blog-detail-page .article-body a:not(.button):not(.wp-block-button__link):hover { color: #0f382c; text-decoration-thickness: 2px; }
.blog-detail-page .article-body a:focus-visible,
.blog-detail-page .article-toc a:focus-visible { outline: 2px solid #2f6b4f; outline-offset: 4px; }
.blog-detail-page .article-body :is(strong,b) { color: #34463e; font-weight: 650; }
.blog-detail-page .article-body blockquote,
.blog-detail-page .article-body .wp-block-quote { margin: 26px 0; padding: 20px 24px; border: 0; border-left: 4px solid #2f6b4f; background: #f4f7f1; color: #34463e; }
.blog-detail-page .article-body blockquote > :last-child { margin-bottom: 0; }
.blog-detail-page .article-body blockquote cite { display: block; margin-top: 12px; color: #68736d; font-size: .875rem; font-style: normal; }
.blog-detail-page .article-body hr,
.blog-detail-page .article-body .wp-block-separator { width: 100%; max-width: none; margin: 36px 0; border: 0; border-top: 1px solid #d8e0d9; }
.blog-detail-page .article-body :is(figure,.wp-block-image,.wp-block-gallery,.wp-block-embed) { max-width: 100%; margin: 26px 0; }
.blog-detail-page .article-body :is(img,video) { display: block; max-width: 100%; height: auto; border-radius: 6px; }
.blog-detail-page .article-body figcaption,
.blog-detail-page .article-body .wp-element-caption { margin-top: 9px; color: #68736d; font-size: .8125rem; line-height: 1.55; text-align: center; }
.blog-detail-page .article-body .alignleft { float: left; max-width: 48%; margin: 6px 24px 18px 0; }
.blog-detail-page .article-body .alignright { float: right; max-width: 48%; margin: 6px 0 18px 24px; }
.blog-detail-page .article-body .aligncenter { margin-inline: auto; }
.blog-detail-page .article-body .wp-block-gallery { display: grid; gap: 12px; }
.blog-detail-page .article-body .wp-block-gallery img { width: 100%; height: 100%; object-fit: cover; }
.blog-detail-page .article-body .wp-block-columns { display: flex; gap: 24px; margin: 26px 0; }
.blog-detail-page .article-body .wp-block-column { min-width: 0; flex: 1 1 0; }
.blog-detail-page .article-body .wp-block-table,
.blog-detail-page .article-body > table { width: 100%; max-width: 100%; margin: 24px 0; border: 1px solid var(--border); border-radius: 5px; }
.blog-detail-page .article-body .wp-block-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.blog-detail-page .article-body .wp-block-table table,
.blog-detail-page .article-body > table { width: 100%; border-spacing: 0; border-collapse: collapse; table-layout: fixed; text-align: left; }
.blog-detail-page .article-body .wp-block-table table { margin: 0; }
.blog-detail-page .article-body table :is(th,td) { width: auto !important; min-width: 0; padding: 15px 18px; border: 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); vertical-align: top; color: #59695f; font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere; }
.blog-detail-page .article-body table tr > :first-child { width: 34% !important; color: #34463e; }
.blog-detail-page .article-body table th { background: #f4f7f1; color: #174c3c; font-weight: 600; }
.blog-detail-page .article-body table > tbody:first-child > tr:first-child > td { background: #f4f7f1; color: #174c3c; font-weight: 600; }
.blog-detail-page .article-body table tr > :last-child { border-right: 0; }
.blog-detail-page .article-body table tr:last-child > :is(th,td) { border-bottom: 0; }
.blog-detail-page .article-body table caption { padding: 0 0 10px; color: #34463e; font-weight: 600; text-align: left; }
.blog-detail-page .article-body :is(pre,.wp-block-code) { max-width: 100%; margin: 24px 0; padding: 20px; overflow-x: auto; border: 1px solid #d8e0d9; border-radius: 5px; background: #f4f7f1; color: #233a31; font-size: .875rem; line-height: 1.65; white-space: pre; }
.blog-detail-page .article-body :not(pre) > code { padding: 2px 5px; border-radius: 3px; background: #eef2ed; color: #174c3c; font-size: .9em; }
.blog-detail-page .article-body details { margin: 0; border-bottom: 1px solid #d8e0d9; }
.blog-detail-page .article-body details:first-of-type { border-top: 1px solid #d8e0d9; }
.blog-detail-page .article-body summary { position: relative; padding: 18px 34px 18px 0; color: #174c3c; font-weight: 600; line-height: 1.5; cursor: pointer; list-style: none; }
.blog-detail-page .article-body summary::-webkit-details-marker { display: none; }
.blog-detail-page .article-body summary::after { content: '+'; position: absolute; top: 14px; right: 4px; font-size: 1.4rem; font-weight: 400; }
.blog-detail-page .article-body details[open] summary::after { content: '\2212'; }
.blog-detail-page .article-body summary :is(h2,h3,h4,h5,h6) { margin: 0; }
.blog-detail-page .article-body details > :not(summary) { margin-left: 0; margin-right: 0; }
.blog-detail-page .article-body details > :last-child { margin-bottom: 18px; }
.blog-detail-page .article-body :is(iframe,embed,object) { display: block; max-width: 100%; }
.blog-detail-page .article-body .wp-block-embed__wrapper { position: relative; width: 100%; }
.blog-detail-page .article-body .wp-block-embed__wrapper iframe { width: 100%; aspect-ratio: 16/9; height: auto; }
.blog-detail-page .article-body .wp-block-button { margin: 22px 0; }
.blog-detail-page .article-body .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 20px; border-radius: 5px; background: #174c3c; color: #fff; font-size: .9375rem; font-weight: 600; text-decoration: none; }
.blog-detail-page .article-body::after { display: block; clear: both; content: ''; }
.blog-detail-page .article-section { margin-bottom: 36px; }
.guide-introduction { margin-bottom: 28px; }
.guide-answer { background: #f4f7f1; border-left: 3px solid #2f6b4f; padding: 24px 28px; margin-bottom: 36px; }
.blog-detail-page .guide-answer h2 { font-size: 1.375rem; margin-bottom: 12px; }
.guide-answer > :last-child { margin-bottom: 0 !important; }
.guide-table { width: 100%; overflow-x: auto; margin: 20px 0 0; border: 1px solid var(--border); border-radius: 5px; }
.guide-table:focus-visible { outline: 2px solid #2f6b4f; outline-offset: 4px; }
.guide-table table { width: 100%; border-collapse: collapse; text-align: left; font-size: 1rem; line-height: 1.65; }
.guide-table th,.guide-table td { padding: 15px 18px; vertical-align: top; border-bottom: 1px solid var(--border); }
.guide-table th + th,.guide-table td { border-left: 1px solid var(--border); }
.guide-table thead th { background: #f4f7f1; color: #174c3c; font-weight: 600; }
.guide-table tbody th { width: 34%; color: #34463e; font-weight: 500; }
.guide-table td { color: #59695f; }
.guide-table tr:last-child > :is(th,td) { border-bottom: 0; }
.guide-table thead tr:last-child th { border-bottom: 1px solid var(--border); }
.guide-faq { padding-top: 4px; }
.guide-faq > h2 { text-align: center; }
.guide-faq-box { border: 2px solid #2f6b4f; border-radius: 10px; padding: 0 24px; }
.guide-faq details:last-child { border-bottom: 0; }
.guide-faq summary { padding: 22px 34px 22px 0; }
.blog-detail-page .guide-faq summary h3 { margin: 0; color: #174c3c; font-size: 1.375rem; }
.guide-faq summary::after { top: 20px; font-size: 24px; }
.blog-detail-page .guide-faq details > p { margin: 0; padding-bottom: 22px; font-size: 1rem; }
.blog-detail-page .guide-faq .faq-answer > :last-child { margin-bottom: 0; }
.blog-detail-page .article-cta h2 { margin-top: 0; font-size: 1.5rem; }
.blog-detail-page .article-cta p { margin-bottom: 20px; }
.blog-detail-page .article-navigation { margin-top: 36px; }
@media(max-width:1000px) {
  .guide-hero { gap: 32px; }
  .blog-detail-page .article-layout { grid-template-columns: minmax(0,1fr) 210px; gap: 32px; }
}
@media(max-width:760px) {
  .guide-hero { grid-template-columns: 1fr; gap: 24px; padding-bottom: 28px; }
  .guide-heading h1 { max-width: 620px; margin-bottom: 16px; }
  .guide-cover { max-height: 360px; }
  .guide-cover img { height: 100%; max-height: 360px; }
  .blog-detail-page .article-layout { grid-template-columns: 1fr; grid-template-areas: "toc" "body"; gap: 28px; padding-top: 28px; }
  .blog-detail-page .article-toc { position: static; max-height: none; }
  .blog-detail-page .article-toc a { margin-bottom: 10px; }
  .blog-detail-page .article-body h2 { font-size: 1.5rem; }
  .blog-detail-page .article-body h3 { font-size: 1.25rem; }
  .blog-detail-page .article-body .wp-block-columns { flex-direction: column; gap: 12px; }
  .blog-detail-page .article-body :is(.alignleft,.alignright) { float: none; max-width: 100%; margin: 22px 0; }
  .blog-detail-page .article-body > table { display: block; overflow-x: auto; table-layout: auto; -webkit-overflow-scrolling: touch; }
  .blog-detail-page .article-body table :is(th,td) { min-width: 150px; padding: 12px; }
  .blog-detail-page .article-body table tr > :first-child { min-width: 180px; }
  .guide-answer { padding: 20px; }
  .guide-table th,.guide-table td { padding: 12px; overflow-wrap: anywhere; }
  .guide-faq-box { padding: 0 18px; }
  .blog-detail-page .guide-faq summary h3 { font-size: 1.125rem; }
}
