/* blog.css - blog listing and blog article page styles */
.article-body { min-width: 0; max-width: 100%; overflow-wrap: break-word; word-break: break-word; }
.article-body p, .article-body li, .article-body td, .article-body th, .article-body blockquote, .article-body h2, .article-body h3 { word-break: break-word; overflow-wrap: break-word; }
.article-body p { font-size: 16.5px; color: #434346; line-height: 1.78; margin-bottom: 18px; }
.article-body a { color: #684CCE; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(104,76,206,.42); text-decoration-thickness: 1.5px; text-underline-offset: 3px; transition: color .15s, text-decoration-color .15s; }
.article-body a:hover { color: #E84A1D; text-decoration-color: #E84A1D; }
.article-body h2 { font-size: clamp(20px, 5.5vw, 25px); font-weight: 800; color: #1C1B22; margin: 30px 0 14px; letter-spacing: -.01em; }
.article-body h3 { font-size: 20px; font-weight: 800; color: #1C1B22; margin: 24px 0 12px; letter-spacing: -.01em; }
.article-body blockquote { margin: 26px 0; padding: 20px 26px; border-left: 4px solid #FF5C35; background: #fff; border-radius: 0 12px 12px 0; font-size: 18px; font-weight: 600; color: #1C1B22; line-height: 1.6; }
.article-body ul, .article-body ol { margin: 0 0 18px; padding-left: 26px; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li { font-size: 16.5px; color: #434346; line-height: 1.65; margin: 7px 0; }
.article-body li > ul, .article-body li > ol { margin: 7px 0 0; }
.article-callout { margin: 24px 0; padding: 16px 20px; border-radius: 10px; border: 1px solid #F4D7CB; background: #FFF6F2; color: #434346; line-height: 1.65; }
.blog-table-wrapper { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:24px 0; border:1.5px solid #E9E5F2; border-radius:10px; background:#fff; }
.article-body table { width: 100% !important; min-width: 480px; border-collapse: collapse; margin:0; font-size: 14.5px; background: #fff; }
.article-body caption { padding: 15px 16px; border-bottom: 1px solid #E9E5F2; color: #1C1B22; font-size: 17px; font-weight: 800; text-align: left; caption-side: top; }
.article-body th, .article-body td { padding: 13px 16px; border: 1px solid #E9E5F2; text-align: left; vertical-align:top; }
.article-body th > p, .article-body td > p { margin: 0; }
.article-body th { background: #F8FAFC; font-weight: 700; color: #1C1B22; }
.article-body .blog-table-section-row th { background: #F3EEFF; color: #4E35A8; text-align: center; }
.article-body tbody tr:nth-child(even) { background:#FCFBFE; }.article-body tbody tr:hover { background:#F7F3FF; }
.article-body pre { overflow-x: auto; white-space: pre-wrap; word-break: break-word; max-width: 100%; }
.article-body code { word-break: break-all; }
.blog-inline-component { margin: 24px 0; }
.blog-inline-component--cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px; }
.blog-inline-card { display:flex; flex-direction:column; gap:7px; padding:16px; border:1px solid #E9E5F2; border-radius:10px; color:#1C1B22; background:#fff; text-decoration:none; }.blog-inline-card strong { font-size:16px; }.blog-inline-card span { color:#64626D; font-size:14px; line-height:1.5; }.blog-inline-card small { color:#746B94; }.blog-inline-card b { color:#E84A1D; font-size:13px; margin-top:auto; }
.blog-inline-component--buttons { display:flex; flex-wrap:wrap; gap:8px; }.blog-inline-component--buttons a { padding:9px 12px; border-radius:999px; background:#F3EEFF; color:#5E42C7; font-size:14px; font-weight:700; text-decoration:none; }
.blog-inline-component--compact-list { display:flex; flex-direction:column; gap:8px; }.blog-inline-component--compact-list a { color:#5E42C7; font-weight:700; text-decoration:none; padding:8px 0; border-bottom:1px solid #E9E5F2; }.blog-inline-component--cards { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }.blog-inline-component--cards a { display:block; padding:14px; border:1px solid #E9E5F2; border-radius:10px; color:#1C1B22; font-weight:700; text-decoration:none; }
.blog-inline-component--cta { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px; border-radius:10px; background:#684CCE; color:#fff; }.blog-inline-component--cta a { color:#fff; font-weight:800; }
.blog-card { transition: box-shadow .18s; }
.table-scroll-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; background: linear-gradient(to right,#fff 30%,rgba(255,255,255,0)), linear-gradient(to left,#fff 30%,rgba(255,255,255,0)) 100% 0, radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.08),transparent), radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.08),transparent) 100% 0; background-repeat: no-repeat; background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%; background-attachment: local, local, scroll, scroll; margin: 24px 0; border-radius: 10px; }
.table-scroll-wrap table { margin: 0 !important; width: 100%; min-width: 480px; }
.hero-excerpt-clamped { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hero-excerpt-clamped.expanded { display: block; overflow: visible; }
.excerpt-toggle { background: none; border: none; color: #F3C77C; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 700; cursor: pointer; padding: 8px 0 0; display: flex; align-items: center; gap: 4px; letter-spacing: .02em; }
.excerpt-toggle svg { transition: transform .22s ease; flex-shrink: 0; }
.excerpt-toggle.expanded svg { transform: rotate(180deg); }
@media (min-width: 769px) { .excerpt-toggle { display: none !important; } .hero-excerpt-clamped { display: block; overflow: visible; } }
@media (max-width: 860px) { .cta-newsletter-band { flex-direction: column !important; align-items: flex-start !important; } }
@media (max-width: 768px) {
  .hero-container img, .hero-container div[style*="height:340px"] { height: 220px !important; min-height: 220px !important; }
  .layout-grid { padding: 24px 14px 10px !important; }
  .layout-grid aside > div { position: static !important; top: auto !important; }
  .article-body p { font-size: 15px; line-height: 1.72; margin-bottom: 14px; }
  .article-body h2 { font-size: clamp(16px, 4.8vw, 21px); margin: 20px 0 10px; }
  .article-body h3 { font-size: clamp(14px, 4.2vw, 17px); margin: 16px 0 8px; }
  .article-body blockquote { font-size: 15px; padding: 14px 16px; margin: 16px 0; }
  .article-body ul li { font-size: 15px; }
}
@media (max-width: 640px) {
  .newsletter-wrap { flex-direction: column !important; width: 100% !important; gap: 12px !important; }
  .newsletter-wrap input, .newsletter-wrap a { width: 100% !important; text-align: center !important; min-height: 48px !important; min-width: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
}
@media (max-width: 420px) { .article-body p { font-size: 14.5px; line-height: 1.7; } .hero-meta { flex-wrap: wrap; } .toc-link { font-size: 12.5px !important; } }
