.blog-main { background: transparent; }
.blog-shell { max-width:1180px; margin:0 auto; }
.blog-hero { border-radius:26px; padding:36px; color:#fff; background:linear-gradient(125deg,#4e38e9 0%,#8e4df3 54%,#d470ed 100%); box-shadow:0 18px 38px rgba(92,61,218,.24); position:relative; overflow:hidden; }
.blog-hero:after { content:""; position:absolute; width:320px; height:320px; right:-100px; top:-150px; border-radius:50%; background:rgba(255,255,255,.13); }
.blog-hero h1 { margin:0 0 10px; font-size:32px; letter-spacing:-.03em; position:relative; z-index:1; }
.blog-hero p { max-width:680px; margin:0; color:#eeeaff; line-height:1.65; font-size:14px; position:relative; z-index:1; }
.blog-hero .blog-pill { display:inline-flex; margin-top:18px; padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.16); color:#fff; font-size:11px; font-weight:800; position:relative; z-index:1; }
.blog-toolbar { display:flex; align-items:center; gap:10px; margin:22px 0 16px; flex-wrap:wrap; }
.blog-search { flex:1; min-width:230px; border:1px solid #e4e1f4; border-radius:999px; padding:12px 16px; background:#fff; font:inherit; outline:none; }
.blog-search:focus { border-color:#7c6aec; box-shadow:0 0 0 3px rgba(124,106,236,.12); }
.blog-filter { border:1px solid #e5e1fb; background:#faf9ff; color:#7166db; padding:10px 13px; border-radius:999px; font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.blog-filter.active { background:#715cf0; color:#fff; border-color:#715cf0; }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.article-card { background:#fff; border:1px solid #ebe8f8; border-radius:18px; overflow:hidden; box-shadow:0 8px 20px rgba(76,61,156,.06); transition:transform .2s,box-shadow .2s; }
.article-card:hover { transform:translateY(-3px); box-shadow:0 14px 28px rgba(76,61,156,.12); }
.article-cover { height:130px; padding:16px; display:flex; align-items:flex-end; justify-content:space-between; color:#fff; background:linear-gradient(135deg,#5b4ae8,#af62f0); }
.article-cover.green { background:linear-gradient(135deg,#0e9f9c,#5fd6bb); }
.article-cover.orange { background:linear-gradient(135deg,#f08c43,#ffc95d); }
.article-cover.blue { background:linear-gradient(135deg,#3d65cf,#71c6ff); }
.article-cover.pink { background:linear-gradient(135deg,#db477f,#ff9dbd); }
.article-cover strong { font-size:30px; line-height:1; }
.article-category { background:#ffffff28; border:1px solid #ffffff4d; border-radius:8px; padding:5px 8px; font-size:10px; font-weight:800; }
.article-body { padding:17px; }
.article-body h2 { font-size:16px; line-height:1.35; margin:0 0 8px; color:#2e2a49; }
.article-body p { margin:0 0 13px; color:#827d99; font-size:12px; line-height:1.55; }
.article-meta { display:flex; justify-content:space-between; gap:8px; align-items:center; color:#a39db8; font-size:11px; }
.article-link { color:#6856e6; text-decoration:none; font-weight:800; }
.blog-section-title { font-size:20px; margin:26px 0 13px; color:#302b49; }
.blog-note { margin-top:20px; padding:15px 17px; background:#f7f5ff; border:1px solid #e5e1ff; border-radius:14px; color:#716c8c; font-size:12px; line-height:1.6; }
.article-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; align-items:start; }
.article-paper { background:#fff; border:1px solid #ebe8f8; border-radius:22px; padding:34px 38px; box-shadow:0 10px 28px rgba(76,61,156,.07); }
.article-paper .article-kicker { color:#725ee9; font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:800; }
.article-paper h1 { margin:9px 0 11px; color:#27233f; font-size:30px; line-height:1.2; letter-spacing:-.03em; }
.article-paper .article-lead { margin:0 0 20px; color:#78738f; font-size:15px; line-height:1.65; }
.article-paper .article-byline { color:#a09bb2; font-size:11px; padding-bottom:17px; border-bottom:1px dashed #e4e0f1; }
.article-paper h2 { margin:25px 0 9px; color:#3b3656; font-size:19px; }
.article-paper h3 { margin:19px 0 8px; color:#443d63; font-size:15px; }
.article-paper p,.article-paper li { color:#5f5a76; font-size:14px; line-height:1.72; }
.article-paper ul { padding-left:20px; }
.article-paper li { margin:6px 0; }
.article-cta { display:flex; gap:10px; align-items:center; margin-top:24px; padding-top:19px; border-top:1px dashed #e4e0f1; }
.article-cta a { color:#fff; background:linear-gradient(135deg,#a469f4,#5e4bea); border-radius:10px; padding:11px 15px; font-size:12px; font-weight:800; text-decoration:none; }
.article-sidebar { display:grid; gap:14px; }
.article-sidebar .secondary-card { padding:18px; }
.article-sidebar h2 { color:#3c365b; font-size:16px; margin:0 0 12px; }
.related-list { display:grid; gap:9px; }
.related-list a { color:#5d54b9; text-decoration:none; font-size:12px; line-height:1.4; font-weight:700; padding-bottom:9px; border-bottom:1px dotted #e6e1f4; }
.related-list a:last-child { border-bottom:0; padding-bottom:0; }
@media (max-width:1023px){.blog-main{padding:0 16px 100px!important}.blog-hero{padding:26px 22px}.blog-hero h1{font-size:26px}.blog-grid{grid-template-columns:1fr}.article-layout{grid-template-columns:1fr}.article-paper{padding:24px 20px}.article-paper h1{font-size:25px}.article-sidebar{order:2}}
