/* Blog Article Styles - Matching Sanctify Journal Layout */
.art-layout{display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:start}
@media(max-width:991px){.art-layout{grid-template-columns:1fr;}.toc{display:none}}

/* Table of Contents Sidebar */
.toc{position:sticky;top:100px;padding:20px 0;border-right:2px solid #f0f0f0}
.toc-title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#999;margin-bottom:15px;padding-left:15px}
.toc ol{list-style:none;padding:0;margin:0;counter-reset:toc-counter}
.toc ol li{counter-increment:toc-counter;margin-bottom:8px}
.toc ol li a{display:block;padding:8px 15px;font-size:14px;font-weight:500;color:#666;text-decoration:none;border-left:3px solid transparent;transition:all .2s ease}
.toc ol li a:hover,.toc ol li a.active{color:#446142;border-left-color:#f90;background:rgba(255,153,0,0.05)}
.toc ol li a::before{content:counter(toc-counter) ". ";font-weight:700;color:#f90}

/* Article Body */
.art-body{max-width:780px}
.art-body h2{font-size:26px;font-weight:700;margin:45px 0 20px;padding-top:20px;border-top:1px solid #eee;color:#222;line-height:1.3}
.art-body h2:first-of-type{border-top:none;margin-top:0;padding-top:0}
.art-body h2 .num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:#446142;color:#fff;border-radius:50%;font-size:14px;font-weight:700;margin-right:10px}
.art-body h3{font-size:20px;font-weight:600;margin:30px 0 15px;color:#333}
.art-body p{font-size:17px;line-height:1.8;color:#444;margin-bottom:18px}
.art-body ul,.art-body ol{margin-bottom:20px;padding-left:20px}
.art-body li{font-size:16px;line-height:1.7;margin-bottom:8px;color:#444}
.art-body img{width:100%;border-radius:8px;margin:25px 0;box-shadow:0 4px 20px rgba(0,0,0,0.1)}
.art-body a{color:#446142;font-weight:500;text-decoration:underline;text-decoration-color:rgba(68,97,66,0.3);text-underline-offset:3px}
.art-body a:hover{color:#f90;text-decoration-color:#f90}

/* Key Takeaways Box */
.takeaways{background:linear-gradient(135deg,#f8fdf8,#f0f9f0);border:1px solid #d4e8d4;border-left:4px solid #446142;border-radius:8px;padding:25px 30px;margin-bottom:35px}
.takeaways h4{font-size:15px;font-weight:700;color:#446142;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.takeaways ul{margin:0;padding-left:18px}
.takeaways li{font-size:15px;line-height:1.6;margin-bottom:6px;color:#333}

/* Stat Cards */
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:15px;margin:25px 0}
.stat-card{background:#fff;border:1px solid #eee;border-radius:8px;padding:20px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,0.04)}
.stat-card .sn{font-size:28px;font-weight:800;color:#446142;line-height:1}
.stat-card .sl{font-size:13px;color:#666;margin-top:5px}

/* Callout Box */
.callout{background:#fff9e6;border:1px solid #ffe0a3;border-radius:8px;padding:20px 25px;margin:25px 0;display:flex;align-items:flex-start;gap:15px}
.callout .ci{flex-shrink:0;color:#f90}
.callout p{margin:0;font-size:15px;line-height:1.6;font-style:italic}

/* FAQ Section */
.faqwrap{margin:20px 0}
.faq{border:1px solid #eee;border-radius:8px;margin-bottom:10px;overflow:hidden}
.faq summary{padding:18px 20px;font-size:16px;font-weight:600;cursor:pointer;background:#fafafa;list-style:none;display:flex;align-items:center;gap:10px}
.faq summary::before{content:"+";font-size:20px;font-weight:700;color:#f90;width:24px;flex-shrink:0}
.faq[open] summary::before{content:"-"}
.faq summary::-webkit-details-marker{display:none}
.faq .b{padding:15px 20px 20px;font-size:15px;line-height:1.7;color:#555;border-top:1px solid #eee}

/* Lead Magnet Box */
.lead-magnet{background:linear-gradient(135deg,#222,#333);border-radius:12px;padding:35px 40px;margin:40px 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px}
.lead-magnet .lm-body{flex:1;min-width:250px}
.lead-magnet .lm-ey{display:inline-block;background:rgba(255,153,0,0.15);color:#f90;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:4px 10px;border-radius:4px;margin-bottom:10px}
.lead-magnet h3{color:#fff;font-size:22px;margin:0 0 8px}
.lead-magnet p{color:#bbb;font-size:15px;margin:0}
.lead-magnet .btn-lm{display:inline-block;background:#f90;color:#222;font-weight:700;font-size:15px;padding:12px 28px;border-radius:6px;text-decoration:none;transition:all .2s}
.lead-magnet .btn-lm:hover{background:#ffaa33;transform:translateY(-2px)}

/* Author Card */
.author-card{display:flex;align-items:center;gap:15px;padding:25px 0;border-top:1px solid #eee;margin-top:30px}
.author-card .aav{width:50px;height:50px;background:#446142;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;flex-shrink:0}
.author-card .an{font-size:16px;font-weight:700;color:#222}
.author-card .ab{font-size:14px;color:#666;margin-top:3px}

/* Share Bar */
.share-bar{display:flex;align-items:center;gap:12px;padding:20px 0;border-top:1px solid #eee}
.share-bar span{font-size:14px;font-weight:600;color:#666}
.share-bar a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#f4f5f8;border-radius:50%;color:#666;transition:all .2s}
.share-bar a:hover{background:#446142;color:#fff}
.share-bar a svg{width:18px;height:18px}

/* Blog Hero */
.art-hero{margin-bottom:20px}
.art-hero .art-cat{display:inline-block;background:#446142;color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:5px 12px;border-radius:4px;margin-bottom:15px}
.art-hero h1{font-size:36px;line-height:1.2;font-weight:800;color:#222;margin:0 0 15px}
@media(max-width:767px){.art-hero h1{font-size:26px}}
.art-byline{display:flex;align-items:center;gap:10px;font-size:14px;color:#666;flex-wrap:wrap}
.art-byline .av{width:30px;height:30px;background:#446142;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.art-byline b{color:#222}
.art-byline .dot{width:4px;height:4px;background:#ccc;border-radius:50%}
.art-hero-img{margin-bottom:30px}
.art-hero-img img{width:100%;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,0.12)}

/* Blockquote */
.art-body blockquote{border-left:4px solid #f90;background:#fff9e6;padding:20px 25px;margin:25px 0;border-radius:0 8px 8px 0;font-size:17px;font-style:italic;color:#555}

/* Table Styles in Articles */
.art-body .table-responsive{margin:25px 0}
.art-body table{width:100%;border-collapse:collapse}
.art-body table th{background:#222;color:#fff;padding:12px 15px;font-size:14px;font-weight:600}
.art-body table td{padding:10px 15px;font-size:14px;border-bottom:1px solid #eee}
.art-body table tr:hover td{background:#f8fdf8}

/* Breadcrumb for blog */
.blog-crumbs{padding:15px 0;font-size:14px;color:#666}
.blog-crumbs a{color:#446142;text-decoration:none}
.blog-crumbs a:hover{color:#f90}
