.site-blog { color: var(--_color---text-color--heading-color); }
.site-blog .container { max-width: 1200px; }
.site-blog :is(.blog-section, .blog-details-section) { padding: 156px 0 80px; }
.site-blog .section-common-title { font-size: clamp(2rem, 4.5vw, 3.5rem); line-height: 1.16; overflow-wrap: anywhere; }
.site-blog .hero-title { margin-bottom: 32px; }
.site-blog .blog-excerpt { font-size: 1.125rem; line-height: 1.7; max-width: 840px; margin: 24px auto 0; }
.site-blog .blog-breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.site-blog a:not(.primary-btn, .blog-card-img-wrap) { color: inherit; text-underline-offset: .2em; }
.site-blog .blog-category-tab-menu { display: flex; flex-wrap: wrap; justify-content: flex-start; width: auto; gap: 12px; margin: 32px 0; }
.site-blog .blog-catagory-tab-link { padding: 12px 24px; border: 1px solid var(--_color---accent-color--accent-1); border-radius: 25px; text-decoration: none; }
.site-blog .blog-catagory-tab-link.w--current { background: var(--_color---accent-color--accent-6); color: var(--_color---text-color--heading-color); }
.site-blog .blog-featured-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; margin: 32px 0; }
.site-blog .blog-card-img-wrap { height: auto; width: 100%; border-radius: 20px; overflow: hidden; }
.site-blog .blog-card-img { width: 100%; height: auto; aspect-ratio: 2800 / 1300; object-fit: contain; }
.site-blog .blog-card-copy { min-width: 0; }
.site-blog .hm-blog-title { font-size: 1.75rem; line-height: 1.3; margin: 16px 0; }
.site-blog .hm-blog-title a { text-decoration: none; }
.site-blog .blog-card-copy p { line-height: 1.7; margin: 0 0 24px; }
.site-blog .blog-category-label { font-weight: 600; }
.site-blog .blog-details-main-img-wrap { height: auto; margin: 36px 0; border-radius: 24px; }
.site-blog .blog-details-main-img { display: block; width: 100%; height: auto; aspect-ratio: 2800 / 1300; object-fit: contain; }
.blog-reading-column { max-width: 820px; margin: 0 auto; min-width: 0; }
.blog-article-content { font-size: 1.125rem; line-height: 1.8; }
.site-blog .blog-article-content :is(p, li) { font-size: inherit; line-height: inherit; }
.site-blog .blog-article-content :is(h2, h3) { line-height: 1.3; scroll-margin-top: 128px; overflow-wrap: anywhere; }
.site-blog .blog-article-content h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin: 48px 0 20px; }
.site-blog .blog-article-content h3 { font-size: 1.25rem; margin: 32px 0 12px; }
.site-blog .blog-article-content p { margin: 0 0 24px; }
.site-blog .blog-article-content :is(ul, ol) { padding-left: 24px; margin: 0 0 24px; }
.site-blog .blog-article-content li { margin-bottom: 12px; }
.site-blog .blog-article-content a { color: var(--_color---accent-color--accent-1); overflow-wrap: anywhere; }
.blog-toc { padding: 20px 24px; border: 1px solid var(--_color---accent-color--accent-3); border-radius: 16px; margin: 0 0 32px; }
.blog-toc summary { cursor: pointer; font-weight: 600; }
.blog-toc ol { padding-left: 24px; margin-top: 20px; }
.blog-toc li { margin-bottom: 12px; }
.blog-table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--_color---accent-color--accent-3); border-radius: 12px; margin: 28px 0; }
.blog-table-wrap table { border-collapse: collapse; min-width: 580px; width: 100%; font-size: 1rem; line-height: 1.6; }
.blog-table-wrap :is(th, td) { text-align: left; vertical-align: top; padding: 14px 16px; border-bottom: 1px solid var(--_color---accent-color--accent-3); }
.blog-table-wrap th { background: var(--_color---accent-color--accent-6); font-weight: 600; }
.blog-table-wrap .blog-number { text-align: right; white-space: nowrap; }
.site-blog .blog-formula { padding: 20px 24px; border-left: 3px solid var(--_color---accent-color--accent-1); background: var(--_color---accent-color--accent-6); border-radius: 0 12px 12px 0; }
.blog-tool-panel { padding: 28px; border-radius: 20px; background: var(--_color---accent-color--accent-6); margin: 40px 0; }
.blog-tool-panel h2 { font-size: 1.5rem; line-height: 1.35; margin: 0 0 16px; }
.blog-tool-panel p { line-height: 1.7; margin-bottom: 24px; }
.site-blog .static-blog-navigation { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; margin-top: 40px; }
.site-blog :is(a, summary, .blog-table-wrap):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 991px) {
  .site-blog .blog-featured-card { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .site-blog :is(.blog-section, .blog-details-section) { padding-top: 120px; }
  .site-blog .blog-excerpt, .blog-article-content { font-size: 1rem; }
  .blog-tool-panel, .blog-toc { padding: 20px; }
  .site-blog .blog-details-main-img-wrap { border-radius: 16px; }
}

.site-blog .blog-text-card { grid-template-columns: minmax(0, 1fr); }
