:root{
  --off-white:#F5F6F3; --off-white-alt:#ECEEEA; --white:#FFFFFF;
  --steel-light:#8FADC6; --steel:#33587A; --steel-deep:#152534;
  --spark:#F5A623; --spark-deep:#E85D04;
  --graphite:#22262A; --graphite-soft:#5B6368; --line:#DADDD6;
  --radius:16px; --maxw:760px; --maxw-wide:1180px;
}
.blog-article-body *{box-sizing:border-box;}
.blog-article-body{background:var(--off-white); color:var(--graphite); font-family:'Barlow',sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased;}
.blog-article-body h1,.blog-article-body h2,.blog-article-body h3{font-family:'Barlow Condensed',sans-serif !important; font-weight:700 !important; line-height:1.15;}
.blog-article-body .article-head h1{color:var(--steel-deep) !important;}
.blog-article-body article h2{color:var(--steel-deep) !important;}
.blog-article-body .related h2{color:var(--steel-deep) !important;}
.blog-article-body p, .blog-article-body li{font-family:'Barlow',sans-serif !important;}
.blog-article-body a{color:inherit !important; text-decoration:none;}
.blog-article-body img{max-width:100%; display:block;}
.blog-article-body .wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.blog-article-body .wrap-wide{max-width:var(--maxw-wide); margin:0 auto; padding:0 24px;}
.blog-article-body .eyebrow{font-weight:600; font-size:12.5px; letter-spacing:2.2px; text-transform:uppercase; color:var(--steel);}
.blog-article-body .mono{font-family:'JetBrains Mono', monospace;}
.blog-article-body .chip{position:relative; display:inline-flex; align-items:center; gap:6px; padding:5px 14px; border-radius:6px; font-size:11.5px; font-weight:600; letter-spacing:.8px; text-transform:uppercase; background:rgba(51,88,122,.1); color:var(--steel-deep);}
.blog-article-body .chip::before, .blog-article-body .chip::after{content:""; position:absolute; top:50%; width:6px; height:2px; background:currentColor; opacity:.6; transform:translateY(-50%);}
.blog-article-body .chip::before{left:-6px;} .blog-article-body .chip::after{right:-6px;}
.blog-article-body .breadcrumb{padding:20px 0 0; font-size:13px; color:var(--graphite-soft);}
.blog-article-body .breadcrumb a{color:var(--steel) !important;}
.blog-article-body .breadcrumb span{margin:0 6px; opacity:.5;}
.blog-article-body .article-head{padding:28px 0 32px; text-align:center;}
.blog-article-body .article-head h1{font-size:clamp(30px,5vw,46px); color:var(--steel-deep); margin:16px 0;}
.blog-article-body .article-head .meta{display:flex; justify-content:center; gap:18px; font-size:13.5px; color:var(--graphite-soft); flex-wrap:wrap;}
.blog-article-body .article-head .meta span{display:flex; align-items:center; gap:6px;}
.blog-article-body .cover{max-width:var(--maxw-wide); margin:0 auto 8px; padding:0 24px;}
.blog-article-body .cover-img{aspect-ratio:16/7; border-radius:20px; overflow:hidden; border:1px solid var(--line);}
.blog-article-body .cover-img img{width:100%; height:100%; object-fit:cover;}
.blog-article-body .trace{width:100%; height:34px; display:block;}
.blog-article-body .trace path{fill:none; stroke:url(#traceGrad); stroke-width:2;}
.blog-article-body .trace circle{fill:var(--spark-deep);}
.blog-article-body article{padding:44px 0;}
.blog-article-body article p{color:var(--graphite); font-size:17px; margin-bottom:20px;}
.blog-article-body article h2{font-size:26px; color:var(--steel-deep); margin:36px 0 14px;}
.blog-article-body article h2 .idx{font-family:'JetBrains Mono',monospace; font-size:14px; color:var(--spark-deep); margin-right:10px;}
.blog-article-body article ul{margin:0 0 20px 20px; color:var(--graphite);}
.blog-article-body article li{margin-bottom:8px; font-size:16px;}
.blog-article-body article table{width:100%; border-collapse:collapse; margin:20px 0 28px; font-size:15px;}
.blog-article-body article th, .blog-article-body article td{border:1px solid var(--line); padding:10px 12px; text-align:left;}
.blog-article-body article th{background:var(--off-white-alt); color:var(--steel-deep); font-family:'Barlow Condensed'; font-weight:700;}
.blog-article-body .pull-quote{position:relative; margin:32px 0; padding:26px 28px 26px 60px; background:var(--off-white-alt); border-left:3px solid var(--spark); border-radius:0 var(--radius) var(--radius) 0; font-family:'Barlow Condensed'; font-size:22px; color:var(--steel-deep); font-weight:600;}
.blog-article-body .pull-quote .bolt{position:absolute; left:20px; top:24px; font-size:22px; color:var(--spark-deep);}
.blog-article-body .inline-img{margin:32px 0; border-radius:var(--radius); overflow:hidden; aspect-ratio:16/9; border:1px solid var(--line);}
.blog-article-body .inline-img img{width:100%; height:100%; object-fit:cover;}
.blog-article-body .inline-img .caption{display:block; text-align:center; font-size:12.5px; color:var(--graphite-soft); margin-top:8px;}
.blog-article-body .inline-cta{margin:36px 0; padding:26px 28px; border-radius:var(--radius); background:linear-gradient(155deg, var(--steel-deep), #0E1B26); color:var(--off-white); display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.blog-article-body .inline-cta p{color:var(--off-white); font-size:15.5px; font-weight:600; margin:0; max-width:38ch;}
.blog-article-body .btn{position:relative; display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:9px; font-weight:600; font-size:14.5px; color:var(--steel-deep) !important; background:linear-gradient(155deg, var(--spark) 0%, var(--spark-deep) 100%); box-shadow:0 6px 16px rgba(232,93,4,.3); border:none; overflow:hidden; white-space:nowrap;}
.blog-article-body .btn::before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);}
.blog-article-body .article-foot{display:flex; justify-content:space-between; align-items:center; margin-top:40px; padding-top:24px; border-top:1px solid var(--line); flex-wrap:wrap; gap:16px;}
.blog-article-body .tags{display:flex; gap:8px; flex-wrap:wrap;}
.blog-article-body .author-box{max-width:var(--maxw-wide); margin:0 auto; padding:0 24px 8px;}
.blog-article-body .author-card{display:flex; gap:18px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:22px 26px;}
.blog-article-body .author-avatar{width:56px; height:56px; border-radius:50%; background:linear-gradient(155deg,var(--steel-light),var(--steel-deep)); flex-shrink:0;}
.blog-article-body .author-card h3{font-size:17px; color:var(--steel-deep);}
.blog-article-body .author-card p{font-size:14px; color:var(--graphite-soft); margin-top:4px;}
.blog-article-body .related{padding:56px 0;}
.blog-article-body .related .section-head{max-width:640px; margin-bottom:28px;}
.blog-article-body .related h2{font-size:clamp(22px,3vw,30px); color:var(--steel-deep); margin-top:8px;}
.blog-article-body .related-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
@media (max-width:820px){ .blog-article-body .related-grid{grid-template-columns:1fr;} }
.blog-article-body .related-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;}
.blog-article-body .related-thumb{aspect-ratio:16/10; background:linear-gradient(160deg, rgba(51,88,122,.14), rgba(21,37,52,.04)), repeating-linear-gradient(115deg, rgba(51,88,122,.06) 0 2px, transparent 2px 24px);}
.blog-article-body .related-body{padding:18px 20px;}
.blog-article-body .related-body h3{font-size:17px; color:var(--steel-deep); font-weight:600; line-height:1.25;}
.blog-article-body .faq-item{margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--line);}
.blog-article-body .faq-item:last-child{border-bottom:none;}
.blog-article-body .faq-item h3{font-size:18px; color:var(--steel-deep); margin-bottom:8px;}
.blog-article-body .faq-item p{font-size:15.5px; color:var(--graphite); margin-bottom:0;}

/* Remove the theme's default duplicate page title and the default WP comment form/section on single posts */
body.single-post .page-header{display:none !important;}
body.single-post .comments-area{display:none !important;}

/* The theme applies position:sticky to any <header> tag (meant for the site nav) — override it for the article's own header block, which also uses the <header> tag per the client-supplied layout. */
.blog-article-body .article-head{position:static !important; top:auto !important;}