/* ===== BLOG POST DESIGN SYSTEM ===== */
.bp2{font-family:'DM Sans',sans-serif;color:#374151;font-feature-settings:"kern" 1,"liga" 1}
.bp2 h1,.bp2 h2,.bp2 h3,.bp2 h4{font-family:'Plus Jakarta Sans',sans-serif;color:#0f172a}
.bp2 h1{font-size:40px;font-weight:800;line-height:1.15;text-wrap:balance}
.bp2 h2{font-size:30px;font-weight:700;line-height:1.25;margin-top:56px;margin-bottom:20px;position:relative;padding-top:28px}
.bp2 h2::before{content:'';position:absolute;top:0;left:0;width:32px;height:3px;background:var(--color-accent-primary);border-radius:2px}
.bp2 h3{font-size:22px;font-weight:600;line-height:1.3;margin-top:36px;margin-bottom:12px}
.bp2 h4{font-size:18px;font-weight:600;line-height:1.3;margin-top:24px;margin-bottom:8px}
.bp2 p{font-size:18px;line-height:1.85;color:#374151;margin-bottom:28px}
.bp2 strong{font-weight:700;color:#0f172a}
.bp2 a:not(.bp2-btn){color:#2563eb;text-decoration:none;background-image:linear-gradient(#2563eb,#2563eb);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .3s}
.bp2 a:not(.bp2-btn):hover{background-size:100% 1px}

/* Layout */
.bp2 .bp2-container{max-width:1400px;margin:0 auto;padding:0 40px}
.bp2 .bp2-layout{display:flex;gap:40px;align-items:flex-start}
.bp2 .bp2-main{flex:1;min-width:0}
.bp2 .bp2-sidebar{width:300px;flex-shrink:0;position:sticky;top:100px;max-height:calc(100vh - 120px);overflow-y:auto}

/* Breadcrumb */
.bp2 .bp2-breadcrumb{font-size:15px;font-weight:500;color:#64748b;margin-bottom:28px;display:flex;align-items:center;gap:10px}
.bp2 .bp2-breadcrumb a{color:#64748b;text-decoration:none;background:none!important}
.bp2 .bp2-breadcrumb a:hover{color:var(--color-accent-primary)}

/* Category pill */
.bp2 .bp2-category{display:inline-block;background:#eff6ff;color:#2563eb;font-size:12px;font-weight:600;text-transform:uppercase;padding:5px 14px;border-radius:50px;letter-spacing:.04em}

/* Meta line */
.bp2 .bp2-meta{display:flex;align-items:center;gap:16px;margin-top:20px;flex-wrap:wrap}
.bp2 .bp2-meta-avatar{width:40px;height:40px;border-radius:50%;border:2px solid #e2e8f0;object-fit:cover;background:#e2e8f0}
.bp2 .bp2-meta-author{font-size:16px;font-weight:600;color:#0f172a}
.bp2 .bp2-meta-dot{color:#cbd5e1}
.bp2 .bp2-meta-date,.bp2 .bp2-meta-read{font-size:16px;color:#64748b}

/* Featured image */
.bp2 .bp2-featured-img{width:100%;border-radius:16px;overflow:hidden;margin-bottom:40px;position:relative;aspect-ratio:2/1;background:#e2e8f0;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:14px}
.bp2 .bp2-featured-img::after{content:'';position:absolute;bottom:0;left:0;right:0;height:60px;background:linear-gradient(transparent,rgba(0,0,0,.03))}
.bp2 .bp2-featured-img img{width:100%;height:100%;object-fit:cover}

/* Callout box */
.bp2 .bp2-callout{background:#eff6ff;border-left:4px solid #2563eb;border-radius:0 12px 12px 0;padding:24px 28px;margin-bottom:40px}
.bp2 .bp2-callout-title{font-weight:700;font-size:18px;color:#0f172a;margin-bottom:14px}
.bp2 .bp2-callout ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.bp2 .bp2-callout li{font-size:16px;color:#475569;line-height:1.7;padding-left:20px;position:relative}
.bp2 .bp2-callout li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:#2563eb}

/* Lists */
.bp2 ul:not(.bp2-callout ul):not(.bp2-toc-list):not(.bp2-sidebar-list){list-style:none;padding:0 0 0 24px;margin:0 0 24px}
.bp2 ul:not(.bp2-callout ul):not(.bp2-toc-list):not(.bp2-sidebar-list) li{font-size:17px;line-height:1.8;color:#374151;margin-bottom:10px;position:relative;padding-left:20px}
.bp2 ul:not(.bp2-callout ul):not(.bp2-toc-list):not(.bp2-sidebar-list) li::before{content:'';position:absolute;left:0;top:12px;width:7px;height:7px;border-radius:50%;background:#2563eb}
.bp2 ol{padding:0 0 0 28px;margin:0 0 28px}
.bp2 ol li{font-size:17px;line-height:1.8;color:#374151;margin-bottom:14px}
.bp2 ol li::marker{font-weight:700;color:#2563eb}

/* Tables */
.bp2 .bp2-table-wrap{border-radius:12px;border:1px solid #e2e8f0;overflow:hidden;margin:32px 0;overflow-x:auto}
.bp2 .bp2-table-wrap table{width:100%;border-collapse:collapse;font-size:16px}
.bp2 .bp2-table-wrap thead{background:#0f172a;color:#fff}
.bp2 .bp2-table-wrap th{padding:16px 20px;font-weight:600;font-size:15px;text-align:left}
.bp2 .bp2-table-wrap td{padding:16px 20px}
.bp2 .bp2-table-wrap tbody tr:nth-child(even){background:#f7f8fa}
.bp2 .bp2-table-wrap tbody tr{border-bottom:1px solid #f1f5f9}
.bp2 table{width:100%;border-collapse:collapse;font-size:16px;margin:32px 0;border-radius:12px;overflow:hidden;border:1px solid #e2e8f0}
.bp2 table thead{background:#0f172a;color:#fff}
.bp2 table th{padding:16px 20px;font-weight:600;font-size:15px;text-align:left}
.bp2 table td{padding:16px 20px;border-bottom:1px solid #f1f5f9}
.bp2 table tbody tr:nth-child(even){background:#f7f8fa}

/* Blockquote */
.bp2 blockquote{background:#f7f8fa;border-left:4px solid #2563eb;border-radius:0 12px 12px 0;padding:24px 28px;margin:32px 0;font-style:italic;font-size:18px;color:#475569}

/* Images inside article body */
.bp2 .bp2-main img{max-width:100%;height:auto;border-radius:12px;margin:24px 0;display:block}

/* Inline CTA */
.bp2 .bp2-inline-cta{border-radius:16px;padding:32px;margin:48px 0;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.bp2 .bp2-inline-cta.light{background:#f0f7ff;border:1px solid #dbeafe}
.bp2 .bp2-inline-cta.dark{background:#0f172a;color:#fff}
.bp2 .bp2-inline-cta.dark h4{color:#fff}
.bp2 .bp2-inline-cta.dark p{color:#94a3b8}
.bp2 .bp2-inline-cta h4{font-size:22px;margin:0 0 10px}
.bp2 .bp2-inline-cta p{font-size:16px;margin:0;color:#475569;line-height:1.6}
.bp2 .bp2-btn{display:inline-block;background:var(--color-accent-primary);color:#fff;padding:12px 28px;border-radius:50px;font-weight:600;font-size:15px;text-decoration:none;border:none;transition:all .3s;cursor:pointer;white-space:nowrap;background-image:none!important}
.bp2 .bp2-btn:hover{background:var(--color-accent-primary-hover);transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,99,235,.3)}

/* FAQ */
.bp2 .bp2-faq-item{background:#fff;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:12px;overflow:hidden}
.bp2 .bp2-faq-q{padding:22px 24px;font-weight:600;font-size:17px;color:#0f172a;cursor:pointer;display:flex;justify-content:space-between;align-items:center;background:none;border:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif}
.bp2 .bp2-faq-q:hover{color:var(--color-accent-primary)}
.bp2 .bp2-faq-chevron{transition:transform .3s;flex-shrink:0;margin-left:16px}
.bp2 .bp2-faq-item.open .bp2-faq-chevron{transform:rotate(180deg)}
.bp2 .bp2-faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease}
.bp2 .bp2-faq-a-inner{padding:0 24px 22px;font-size:16px;color:#475569;line-height:1.8}

/* Author bio */
.bp2 .bp2-author-bio{background:#f7f8fa;border-radius:16px;padding:32px;display:flex;gap:20px;align-items:flex-start;margin:48px 0}
.bp2 .bp2-author-bio-avatar{width:64px;height:64px;border-radius:50%;background:#e2e8f0;flex-shrink:0;object-fit:cover;border:2px solid #e2e8f0}
.bp2 .bp2-author-bio-name{font-size:18px;font-weight:700;color:#0f172a;margin-bottom:4px}
.bp2 .bp2-author-bio-text{font-size:16px;color:#475569;line-height:1.7;margin-bottom:10px}

/* Related articles */
.bp2 .bp2-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.bp2 .bp2-related-card{background:#fff;border-radius:16px;border:1px solid #e2e8f0;overflow:hidden;transition:all .4s cubic-bezier(.22,1,.36,1);text-decoration:none!important;display:block;background-image:none!important}
.bp2 .bp2-related-card:hover{transform:translateY(-4px);box-shadow:0 12px 36px rgba(0,0,0,.1)}
.bp2 .bp2-related-card-img{height:200px;background:#e2e8f0;overflow:hidden}
.bp2 .bp2-related-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.bp2 .bp2-related-card:hover .bp2-related-card-img img{transform:scale(1.03)}
.bp2 .bp2-related-card-body{padding:20px}
.bp2 .bp2-related-card-title{font-size:18px;font-weight:700;color:#0f172a;margin:8px 0 8px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bp2 .bp2-related-card-excerpt{font-size:14px;color:#475569;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}

/* Sidebar */
.bp2 .bp2-toc-title{font-size:15px;text-transform:uppercase;font-weight:700;color:#64748b;letter-spacing:.05em;margin-bottom:20px}
.bp2 .bp2-toc-list{list-style:none;padding:0;margin:0}
.bp2 .bp2-toc-list li{border-left:2px solid transparent;transition:all .2s}
.bp2 .bp2-toc-list li.active{border-left-color:#2563eb}
.bp2 .bp2-toc-list a{display:block;padding:10px 16px;font-size:15px;color:#475569;text-decoration:none;transition:color .2s;background:none!important}
.bp2 .bp2-toc-list li.active a{color:#2563eb;font-weight:600}
.bp2 .bp2-toc-list a:hover{color:#2563eb}

.bp2 .bp2-sidebar-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:32px;margin-top:32px}
.bp2 .bp2-sidebar-card h4{font-size:20px;font-weight:700;margin-bottom:20px}
.bp2 .bp2-sidebar-list{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:12px}
.bp2 .bp2-sidebar-list li{font-size:15px;color:#374151;display:flex;align-items:center;gap:10px}
.bp2 .bp2-sidebar-list li svg{flex-shrink:0}

.bp2 .bp2-share-title{font-size:15px;text-transform:uppercase;font-weight:700;color:#64748b;letter-spacing:.05em;margin-bottom:14px;margin-top:28px}
.bp2 .bp2-share-row{display:flex;gap:12px}
.bp2 .bp2-share-row a{width:36px;height:36px;border-radius:50%;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center;color:#64748b;text-decoration:none;transition:all .2s;background:none!important}
.bp2 .bp2-share-row a:hover{color:#2563eb;border-color:#2563eb}

/* Scroll progress */
.bp2 .bp2-scroll-progress{position:fixed;top:0;left:0;height:3px;background:var(--color-accent-primary);z-index:1001;width:0;transition:width .1s linear}

/* Mobile ToC */
.bp2 .bp2-mobile-toc{display:none;background:#f7f8fa;border-radius:12px;padding:16px 20px;margin-bottom:32px;cursor:pointer}
.bp2 .bp2-mobile-toc-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:17px;color:#0f172a}
.bp2 .bp2-mobile-toc-list{max-height:0;overflow:hidden;transition:max-height .4s ease}
.bp2 .bp2-mobile-toc.open .bp2-mobile-toc-list{max-height:600px}
.bp2 .bp2-mobile-toc.open .bp2-mobile-toc-chevron{transform:rotate(180deg)}
.bp2 .bp2-mobile-toc-chevron{transition:transform .3s}

/* Mobile share bar */
.bp2 .bp2-mobile-share{display:none;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e2e8f0;padding:10px 24px;z-index:998;justify-content:center;gap:16px;transform:translateY(100%);transition:transform .3s}
.bp2 .bp2-mobile-share.visible{transform:translateY(0)}
.bp2 .bp2-mobile-share a{width:40px;height:40px;border-radius:50%;background:#f7f8fa;display:flex;align-items:center;justify-content:center;color:#64748b;text-decoration:none;background-image:none!important}

/* Responsive */
@media(max-width:1023px){
  .bp2 h1{font-size:28px}
  .bp2 h2{font-size:24px}
  .bp2 h3{font-size:19px}
  .bp2 .bp2-layout{flex-direction:column}
  .bp2 .bp2-main{max-width:100%}
  .bp2 .bp2-sidebar{display:none}
  .bp2 .bp2-mobile-toc{display:block}
  .bp2 .bp2-mobile-share{display:flex}
  .bp2 .bp2-related-grid{grid-template-columns:1fr}
  .bp2 .bp2-inline-cta{flex-direction:column;text-align:center}
}
@media(prefers-reduced-motion:reduce){.bp2 *{animation:none!important;transition:none!important}}