.blog-hero,.blog-post-hero{position: relative;padding: 180px 0 100px;text-align: center;background: #f8f9fa;overflow: hidden}.blog-hero .particles-container,.blog-hero #particles-background{position: absolute !important;top: 0 !important;left: 0 !important;width: 100% !important;height: 100% !important;z-index: 0 !important;pointer-events: none !important}.blog-hero .particles-container canvas,.blog-hero #particles-background canvas{width: 100% !important;height: 100% !important}.blog-hero .container{position: relative;z-index: 1}.main-blog-content{position: relative;z-index: 2;background: #ffffff}.blog-hero-content,.blog-post-hero-content{position: relative;z-index: 2;max-width: 800px;margin: 0 auto;padding: 0 24px}.blog-hero-content h1,.blog-post-hero-content h1{font-size: 2.8rem;font-weight: 700;line-height: 1.2;margin-bottom: 20px;color: #1a1a2e}.blog-hero-content p,.blog-post-hero-content p{font-size: 1.2rem;color: #6c757d;max-width: 600px;margin: 0 auto;line-height: 1.6}.blog-post-content{padding: 80px 0;background: #ffffff}.blog-post-content .container{max-width: 800px;margin: 0 auto;padding: 0 24px}.post-header{margin-bottom: 40px;padding-bottom: 40px;border-bottom: 1px solid #e9ecef}.post-meta{display: flex;align-items: center;gap: 16px;margin-bottom: 24px}.post-category{display: inline-block;background: linear-gradient(135deg, #4361ee 0%, #7209b7 100%);color: #ffffff;padding: 6px 16px;border-radius: 20px;font-size: 0.8rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.5px}.post-date{color: #6c757d;font-size: 0.9rem}.post-header .author-info{display: flex;align-items: center;gap: 20px;padding: 24px 28px;background: linear-gradient(135deg, #f8f9ff 0%, #f8f9fa 100%);border-radius: 20px;border: 1px solid rgba(67, 97, 238, 0.08)}.post-header .author-info img{width: 70px;height: 70px;border-radius: 50%;object-fit: cover;border: 3px solid #ffffff;box-shadow: 0 6px 20px rgba(67, 97, 238, 0.15)}.post-header .author-info div{flex: 1}.post-header .author-info h3{font-size: 1.1rem;font-weight: 700;color: #1a1a2e;margin-bottom: 4px;display: flex;align-items: center;gap: 8px}.post-header .author-info h3::after{content: '✓';display: inline-flex;align-items: center;justify-content: center;width: 18px;height: 18px;background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;font-size: 0.6rem;border-radius: 50%;font-weight: bold}.post-header .author-info p{font-size: 0.9rem;color: #6c757d;margin: 0}.post-body{line-height: 1.8}.post-body p{font-size: 1.1rem;line-height: 1.8;color: #444;margin-bottom: 24px}.post-body p:first-of-type{font-size: 1.2rem;color: #333;line-height: 1.7}.post-body h2{font-size: 1.8rem;font-weight: 700;margin-top: 48px;margin-bottom: 20px;color: #1a1a2e;position: relative;padding-bottom: 12px}.post-body h2::after{content: '';position: absolute;bottom: 0;left: 0;width: 50px;height: 3px;background: linear-gradient(90deg, #4361ee, #7209b7);border-radius: 2px}.post-body h3{font-size: 1.4rem;font-weight: 600;margin-top: 36px;margin-bottom: 16px;color: #1a1a2e}.post-body h4{font-size: 1.2rem;font-weight: 600;margin-top: 28px;margin-bottom: 12px;color: #1a1a2e}.post-body ul,.post-body ol{margin-bottom: 24px;padding-left: 24px}.post-body li{font-size: 1.1rem;line-height: 1.8;color: #444;margin-bottom: 12px}.post-body ul li{list-style: disc}.post-body ol li{list-style: decimal}.post-body a{color: #4361ee;text-decoration: none;border-bottom: 1px solid transparent;transition: border-color 0.2s}.post-body a:hover{border-bottom-color: #4361ee}.post-body blockquote{margin: 32px 0;padding: 24px 28px;background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);border-left: 4px solid #4361ee;border-radius: 0 12px 12px 0;font-style: italic;color: #555}.post-body blockquote p{margin-bottom: 0}.post-body img{max-width: 100%;height: auto;border-radius: 16px;margin: 32px 0;box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1)}.post-body pre{background: #1e1e2e;color: #cdd6f4;padding: 24px;border-radius: 12px;overflow-x: auto;margin: 24px 0;font-size: 0.95rem;line-height: 1.6}.post-body code{font-family: 'JetBrains Mono', 'Fira Code', monospace;background: #f1f5f9;padding: 2px 8px;border-radius: 4px;font-size: 0.9em;color: #4361ee}.post-body pre code{background: none;padding: 0;color: inherit}.info-box{padding: 24px;border-radius: 12px;margin: 32px 0}.info-box.tip{background: #e8f5e9;border-left: 4px solid #4caf50}.info-box.warning{background: #fff3e0;border-left: 4px solid #ff9800}.info-box.info{background: #e3f2fd;border-left: 4px solid #2196f3}.table-of-contents{background: #f8f9fa;border-radius: 16px;padding: 28px;margin-bottom: 40px}.table-of-contents h2{font-size: 1.3rem;font-weight: 700;color: #1a1a2e;margin-bottom: 16px}.table-of-contents ul{list-style: none;padding: 0;margin: 0}.table-of-contents li{margin-bottom: 10px}.table-of-contents a{color: #4361ee;text-decoration: none;font-size: 1rem;transition: color 0.2s}.table-of-contents a:hover{color: #7209b7}.framework-box,.highlight-box{background: linear-gradient(135deg, #f8f9ff 0%, #eef1ff 100%);border-radius: 16px;padding: 32px;margin: 32px 0;border: 1px solid rgba(67, 97, 238, 0.1)}.framework-box h3,.highlight-box h3{font-size: 1.4rem;color: #1a1a2e;margin-bottom: 8px}.framework-box p,.highlight-box p{color: #6c757d;margin-bottom: 0}.author-box{display: flex;gap: 24px;padding: 32px;background: #f8f9fa;border-radius: 16px;margin-top: 48px;align-items: center}.author-avatar{width: 80px;height: 80px;border-radius: 50%;overflow: hidden;flex-shrink: 0;box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1)}.author-avatar img{width: 100%;height: 100%;object-fit: cover}.author-box .author-info h4{font-size: 1.2rem;font-weight: 600;color: #1a1a2e;margin-bottom: 4px}.author-box .author-info p{font-size: 0.95rem;color: #6c757d;margin-bottom: 12px}.author-social{display: flex;gap: 12px}.author-social a{color: #6c757d;font-size: 1.1rem;transition: color 0.2s}.author-social a:hover{color: #4361ee}.share-buttons{display: flex;align-items: center;gap: 16px;margin-top: 40px;padding-top: 32px;border-top: 1px solid #e9ecef}.share-buttons span{font-weight: 600;color: #1a1a2e}.share-btn{display: inline-flex;align-items: center;justify-content: center;width: 42px;height: 42px;border-radius: 50%;background: #f8f9fa;color: #6c757d;text-decoration: none;transition: all 0.3s ease}.share-btn:hover{background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;transform: translateY(-2px)}.related-posts{padding: 80px 0;background: #f8f9fa}.related-posts .container{max-width: 1100px;margin: 0 auto;padding: 0 24px}.related-posts h2{text-align: center;font-size: 2rem;font-weight: 700;color: #1a1a2e;margin-bottom: 40px}.related-posts-grid{display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px}@media (max-width: 992px){.related-posts-grid{grid-template-columns: repeat(2, 1fr)}}@media (max-width: 768px){.blog-hero, .blog-post-hero{padding: 140px 0 70px} .blog-hero-content h1, .blog-post-hero-content h1{font-size: 2rem} .blog-post-content{padding: 60px 0} .post-header .author-info{flex-direction: column;text-align: center} .post-body h2{font-size: 1.5rem} .post-body h3{font-size: 1.25rem} .post-body p, .post-body li{font-size: 1rem} .author-box{flex-direction: column;text-align: center} .author-social{justify-content: center} .share-buttons{flex-wrap: wrap;justify-content: center} .related-posts-grid{grid-template-columns: 1fr} .table-of-contents{padding: 20px}}@media (max-width: 500px){.blog-hero-content h1, .blog-post-hero-content h1{font-size: 1.75rem} .post-meta{flex-direction: column;align-items: flex-start;gap: 10px}}.main-blog-content{padding: 80px 0;background: #ffffff}.main-blog-content .container{max-width: 900px;margin: 0 auto;padding: 0 24px}.post-featured-image{margin: 40px 0;border-radius: 20px;overflow: hidden;box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1)}.post-featured-image img{width: 100%;height: auto;display: block}.post-content{line-height: 1.8}.post-content p{font-size: 1.1rem;line-height: 1.8;color: #444;margin-bottom: 24px}.post-content h2{font-size: 1.8rem;font-weight: 700;margin-top: 48px;margin-bottom: 20px;color: #1a1a2e;position: relative;padding-bottom: 12px}.post-content h2::after{content: '';position: absolute;bottom: 0;left: 0;width: 50px;height: 3px;background: linear-gradient(90deg, #4361ee, #7209b7);border-radius: 2px}.post-content h3{font-size: 1.4rem;font-weight: 600;margin-top: 36px;margin-bottom: 16px;color: #1a1a2e}.post-content ul,.post-content ol{margin-bottom: 24px;padding-left: 24px}.post-content li{font-size: 1.05rem;line-height: 1.8;color: #444;margin-bottom: 12px}.post-content a{color: #4361ee;text-decoration: none}.post-content a:hover{text-decoration: underline}.post-section{margin-bottom: 48px}.principle-card{display: flex;gap: 24px;padding: 28px;background: #f8f9fa;border-radius: 16px;margin-bottom: 20px;border: 1px solid rgba(67, 97, 238, 0.06);transition: all 0.3s ease}.principle-card:hover{box-shadow: 0 10px 30px rgba(67, 97, 238, 0.1);transform: translateY(-2px)}.principle-icon{width: 60px;height: 60px;background: linear-gradient(135deg, #4361ee 0%, #7209b7 100%);border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0;box-shadow: 0 8px 20px rgba(67, 97, 238, 0.25)}.principle-icon i{font-size: 1.4rem;color: #ffffff}.principle-content h3{font-size: 1.2rem;font-weight: 600;color: #1a1a2e;margin-bottom: 10px;margin-top: 0}.principle-content p{font-size: 1rem;color: #6c757d;margin-bottom: 0;line-height: 1.7}.case-study-box{background: linear-gradient(135deg, #f8f9ff 0%, #eef1ff 100%);border-radius: 16px;padding: 32px;margin: 32px 0;border-left: 4px solid #4361ee}.case-study-box h3{font-size: 1.3rem;color: #1a1a2e;margin-bottom: 16px;margin-top: 0}.case-study-box p{margin-bottom: 16px}.case-study-box ul{margin-bottom: 16px}.post-tags{display: flex;align-items: center;flex-wrap: wrap;gap: 12px;padding: 32px 0;border-top: 1px solid #e9ecef;margin-top: 48px}.post-tags span{font-weight: 600;color: #1a1a2e}.post-tags a{display: inline-block;padding: 8px 16px;background: #f8f9fa;color: #4361ee;border-radius: 20px;font-size: 0.9rem;text-decoration: none;transition: all 0.2s ease}.post-tags a:hover{background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff}.post-share{display: flex;align-items: center;gap: 16px;padding: 24px 0;border-top: 1px solid #e9ecef}.post-share span{font-weight: 600;color: #1a1a2e}.social-share{display: flex;gap: 12px}.social-share a{display: inline-flex;align-items: center;justify-content: center;width: 42px;height: 42px;border-radius: 50%;background: #f8f9fa;color: #6c757d;text-decoration: none;transition: all 0.3s ease}.social-share a:hover{background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;transform: translateY(-2px)}.author-bio{display: flex;gap: 32px;padding: 40px;background: linear-gradient(135deg, #f8f9ff 0%, #ffffff 100%);border-radius: 24px;margin: 60px 0;align-items: center;border: 1px solid rgba(67, 97, 238, 0.1);box-shadow: 0 10px 40px rgba(67, 97, 238, 0.06)}.author-image{width: 110px;height: 110px;border-radius: 50%;overflow: hidden;flex-shrink: 0;background: linear-gradient(135deg, #4361ee, #7209b7);padding: 4px;box-shadow: 0 10px 30px rgba(67, 97, 238, 0.25)}.author-image img{width: 100%;height: 100%;object-fit: cover;border-radius: 50%}.author-details h3{font-size: 0.85rem;color: #4361ee;font-weight: 600;margin-bottom: 6px;text-transform: uppercase;letter-spacing: 1px}.author-details h4{font-size: 1.4rem;font-weight: 700;color: #1a1a2e;margin-bottom: 14px;display: flex;align-items: center;gap: 10px}.author-details h4::after{content: '✓';display: inline-flex;align-items: center;justify-content: center;width: 20px;height: 20px;background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;font-size: 0.7rem;border-radius: 50%;font-weight: bold}.author-details p{font-size: 1rem;color: #6c757d;line-height: 1.75;margin: 0}.main-blog-content .related-posts{padding: 60px 0 0;background: transparent}.main-blog-content .related-posts h2{font-size: 1.6rem;font-weight: 700;color: #1a1a2e;margin-bottom: 32px;display: flex;align-items: center;gap: 12px}.main-blog-content .related-posts h2::before{content: '';width: 4px;height: 28px;background: linear-gradient(180deg, #4361ee, #7209b7);border-radius: 2px;text-align: left}.main-blog-content .related-posts-grid{display: grid;grid-template-columns: repeat(2, 1fr);gap: 24px}.main-blog-content .related-posts-grid .blog-card{background: #ffffff;border-radius: 16px;overflow: hidden;box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);transition: all 0.3s ease;display: flex;flex-direction: column;height: 100%}.main-blog-content .related-posts-grid .blog-card:hover{transform: translateY(-5px);box-shadow: 0 8px 30px rgba(67, 97, 238, 0.15)}.main-blog-content .related-posts-grid .blog-card .blog-image{width: 100%;height: 200px;overflow: hidden;background: #f8f9fa}.main-blog-content .related-posts-grid .blog-card .blog-image img{width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s ease}.main-blog-content .related-posts-grid .blog-card:hover .blog-image img{transform: scale(1.05)}.main-blog-content .related-posts-grid .blog-card .blog-content{padding: 24px;display: flex;flex-direction: column;flex: 1}.main-blog-content .related-posts-grid .blog-card .post-category{display: inline-block;background: linear-gradient(135deg, #4361ee 0%, #7209b7 100%);color: #ffffff;padding: 6px 14px;border-radius: 20px;font-size: 0.75rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.5px;margin-bottom: 12px;width: fit-content}.main-blog-content .related-posts-grid .blog-card .blog-content h3{font-size: 1.25rem;font-weight: 700;color: #1a1a2e;margin-bottom: 12px;line-height: 1.4;min-height: 70px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.main-blog-content .related-posts-grid .blog-card .post-meta{font-size: 0.85rem;color: #6c757d;margin-bottom: 12px}.main-blog-content .related-posts-grid .blog-card .post-meta .author{color: #4361ee;font-weight: 500}.main-blog-content .related-posts-grid .blog-card .blog-content>p:not(.post-meta){font-size: 0.9rem;color: #6c757d;line-height: 1.6;margin-bottom: 16px;flex: 1;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden}.main-blog-content .related-posts-grid .blog-card .read-more{display: inline-flex;align-items: center;gap: 8px;color: #4361ee;font-weight: 600;font-size: 0.9rem;text-decoration: none;transition: all 0.3s ease;margin-top: auto}.main-blog-content .related-posts-grid .blog-card .read-more:hover{color: #7209b7;gap: 12px}.main-blog-content .related-posts-grid .blog-card .read-more i{font-size: 0.8rem;transition: transform 0.3s ease}.main-blog-content .related-posts-grid .blog-card .read-more:hover i{transform: translateX(4px)}.related-post{background: #f8f9fa;border-radius: 16px;overflow: hidden;transition: all 0.3s ease}.related-post:hover{box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);transform: translateY(-4px)}.related-post img{width: 100%;height: 160px;object-fit: cover}.related-post h3{font-size: 1.1rem;font-weight: 600;color: #1a1a2e;padding: 16px 20px 8px;margin: 0}.related-post a{display: inline-flex;align-items: center;gap: 8px;padding: 8px 20px 20px;color: #4361ee;font-size: 0.95rem;font-weight: 500;text-decoration: none}.related-post a:hover{color: #7209b7}.comments-section{padding: 60px 0;border-top: 1px solid #e9ecef;margin-top: 60px}.comments-section>h2{font-size: 1.6rem;font-weight: 700;color: #1a1a2e;margin-bottom: 36px;display: flex;align-items: center;gap: 12px}.comments-section>h2::before{content: '';width: 4px;height: 28px;background: linear-gradient(180deg, #4361ee, #7209b7);border-radius: 2px}.comment{display: flex;gap: 20px;padding: 28px;background: #ffffff;border-radius: 20px;margin-bottom: 20px;border: 1px solid #e9ecef;transition: all 0.3s ease}.comment:hover{box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);border-color: rgba(67, 97, 238, 0.15)}.comment.reply{margin-left: 70px;background: linear-gradient(135deg, #f8f9ff 0%, #ffffff 100%);border-left: 3px solid #4361ee}.comment-avatar{width: 56px;height: 56px;border-radius: 50%;overflow: hidden;flex-shrink: 0;background: linear-gradient(135deg, #e9ecef, #dee2e6);display: flex;align-items: center;justify-content: center;font-size: 1.2rem;color: #6c757d;font-weight: 600;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08)}.comment.reply .comment-avatar{background: linear-gradient(135deg, #4361ee 0%, #7209b7 100%);color: #ffffff;box-shadow: 0 6px 20px rgba(67, 97, 238, 0.3)}.comment-avatar img{width: 100%;height: 100%;object-fit: cover}.comment-content{flex: 1}.comment-header{display: flex;align-items: center;gap: 14px;margin-bottom: 12px}.comment-header h4{font-size: 1.05rem;font-weight: 700;color: #1a1a2e;margin: 0}.comment.reply .comment-header h4::after{content: '✓';display: inline-flex;align-items: center;justify-content: center;width: 18px;height: 18px;background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;font-size: 0.65rem;border-radius: 50%;margin-left: 8px;font-weight: bold}.comment-header span{font-size: 0.85rem;color: #6c757d;padding: 4px 10px;background: #f8f9fa;border-radius: 12px}.comment-content>p{font-size: 1rem;color: #444;line-height: 1.75;margin-bottom: 16px}.comment-actions{display: flex;gap: 20px}.comment-actions a{font-size: 0.9rem;color: #6c757d;text-decoration: none;font-weight: 500;transition: all 0.2s ease}.comment-actions a:hover{color: #4361ee}.comment-form{margin-top: 48px;padding: 40px;background: linear-gradient(135deg, #f8f9ff 0%, #f8f9fa 100%);border-radius: 24px;border: 1px solid rgba(67, 97, 238, 0.08)}.comment-form h3{font-size: 1.4rem;font-weight: 700;color: #1a1a2e;margin-bottom: 28px;display: flex;align-items: center;gap: 12px}.comment-form h3::before{content: '💬';font-size: 1.2rem}.comment-form .form-group{margin-bottom: 20px}.comment-form label{display: block;font-weight: 500;color: #1a1a2e;margin-bottom: 8px}.comment-form input,.comment-form textarea{width: 100%;padding: 14px 18px;border: 2px solid #e9ecef;border-radius: 12px;font-size: 1rem;transition: all 0.2s ease;font-family: inherit}.comment-form input:focus,.comment-form textarea:focus{outline: none;border-color: #4361ee;box-shadow: 0 0 0 4px rgba(67, 97, 238, 0.1)}.comment-form textarea{resize: vertical;min-height: 120px}.comment-form button{padding: 14px 32px;background: linear-gradient(135deg, #4361ee, #7209b7);color: #ffffff;border: none;border-radius: 12px;font-size: 1rem;font-weight: 600;cursor: pointer;transition: all 0.3s ease}.comment-form button:hover{transform: translateY(-2px);box-shadow: 0 8px 25px rgba(67, 97, 238, 0.3)}.newsletter{padding: 80px 0;background: linear-gradient(135deg, #4361ee 0%, #7209b7 100%);text-align: center}.newsletter .container{max-width: 700px;margin: 0 auto;padding: 0 24px}.newsletter-content h2{font-size: 2rem;font-weight: 700;color: #ffffff;margin-bottom: 16px}.newsletter-content p{font-size: 1.1rem;color: rgba(255, 255, 255, 0.9);margin-bottom: 32px}.newsletter-form{display: flex;gap: 12px;max-width: 500px;margin: 0 auto}.newsletter-form input{flex: 1;padding: 16px 20px;border: none;border-radius: 12px;font-size: 1rem}.newsletter-form input:focus{outline: none;box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.2)}.newsletter-form button{padding: 16px 28px;background: #ffffff;color: #4361ee;border: none;border-radius: 12px;font-size: 1rem;font-weight: 600;cursor: pointer;transition: all 0.3s ease}.newsletter-form button:hover{transform: translateY(-2px);box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2)}.privacy-note{font-size: 0.85rem;color: rgba(255, 255, 255, 0.7);margin-top: 16px}@media (max-width: 768px){.main-blog-content{padding: 60px 0} .principle-card{flex-direction: column;text-align: center;align-items: center} .main-blog-content .related-posts-grid{grid-template-columns: 1fr} .comment.reply{margin-left: 20px} .author-bio{flex-direction: column;text-align: center;align-items: center} .newsletter-form{flex-direction: column} .newsletter-form input, .newsletter-form button{width: 100%} .post-share{flex-direction: column;align-items: flex-start}}@media (max-width: 500px){.post-tags{flex-direction: column;align-items: flex-start} .comment{flex-direction: column} .comment-avatar{width: 40px;height: 40px}}