.social-share{margin:3rem 0;padding:2rem;background:linear-gradient(135deg,#6366f10d,#a855f70d);border-radius:16px;border:1px solid rgba(99,102,241,.1)}.social-share-title{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem;color:var(--text-primary);text-align:center}.social-share-buttons{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.social-share-btn{display:flex;align-items:center;gap:.45rem;padding:.6rem 1rem;border-radius:11px;font-size:.85rem;font-weight:500;text-decoration:none;border:none;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.social-share-btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#ffffff1a,#fff0);opacity:0;transition:opacity .3s ease}.social-share-btn:hover:before{opacity:1}.social-share-btn svg{flex-shrink:0}.social-share-btn.twitter{background:#1da1f2;color:#fff}.social-share-btn.twitter:hover{background:#1a8cd8;transform:translateY(-2px);box-shadow:0 8px 16px #1da1f24d}.social-share-btn.linkedin{background:#0077b5;color:#fff}.social-share-btn.linkedin:hover{background:#006399;transform:translateY(-2px);box-shadow:0 8px 16px #0077b54d}.social-share-btn.facebook{background:#1877f2;color:#fff}.social-share-btn.facebook:hover{background:#1565d8;transform:translateY(-2px);box-shadow:0 8px 16px #1877f24d}.social-share-btn.whatsapp{background:#25d366;color:#fff}.social-share-btn.whatsapp:hover{background:#20ba5a;transform:translateY(-2px);box-shadow:0 8px 16px #25d3664d}.social-share-btn.copy{background:linear-gradient(135deg,#6366f1,#a855f7);color:#fff}.social-share-btn.copy:hover{transform:translateY(-2px);box-shadow:0 8px 16px #6366f14d}.social-share-btn.copy.copied{background:linear-gradient(135deg,#10b981,#059669)}@media(max-width:768px){.social-share{padding:1.5rem;margin:2rem 0}.social-share-title{font-size:1.1rem;margin-bottom:1rem}.social-share-buttons{gap:.65rem}.social-share-btn{padding:.585rem 1.125rem;font-size:.81rem}.social-share-btn span{display:none}.social-share-btn svg{margin:0}}@media(max-width:480px){.social-share-btn{padding:.54rem .9rem}}.blog-detail-page{background:var(--color-bg-primary);min-height:100vh}.blog-detail-hero{position:relative;padding:100px 0 6rem;overflow:hidden}.hero-bg-container{position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none}.blog-detail-hero .container{position:relative;z-index:1}.detail-nav{margin-bottom:2rem}.detail-nav-actions{display:flex;justify-content:space-between;align-items:center;width:100%}.back-link{display:flex;align-items:center;gap:.75rem;color:var(--color-text-secondary);text-decoration:none;font-size:.875rem;transition:color .3s ease;margin-bottom:0}.back-link:hover{color:var(--color-text-primary)}.category-badge{padding:.25rem .75rem;background:var(--color-accent-primary);color:#fff;border-radius:999px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-left:auto}[data-theme=light] .category-badge{background:var(--color-accent-primary);color:#fff;box-shadow:0 4px 12px #3d9aff33}.blog-header-layout{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;margin-bottom:0}.blog-title-section{width:100%}.blog-meta-header{display:none;align-items:center;gap:.75rem;font-size:.9rem;color:var(--color-text-secondary);margin-bottom:1rem;font-weight:500}.meta-dot{color:var(--color-text-muted)}.blog-title-large{font-size:3rem;line-height:1.1;font-weight:400;color:var(--color-text-primary);margin-bottom:1rem}.large-desc{font-size:1.125rem;line-height:1.6;color:var(--color-text-secondary);margin:0 0 1rem;max-width:90%}.author-info{display:flex;align-items:center;gap:1rem;margin-top:0}.author-avatar{width:48px;height:48px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,.1)}.author-avatar img{width:100%;height:100%;object-fit:cover}.author-text{display:flex;flex-direction:column;align-items:flex-start}.author-name{font-size:1rem;font-weight:600;color:var(--color-text-primary)}.author-role{font-size:.8rem;color:var(--color-text-muted)}.author-row{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin-top:1.5rem}.ai-summary-tools{display:flex;align-items:center;gap:1rem}.ai-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);font-weight:600}.ai-icons-grid{display:flex;align-items:center;gap:.75rem}.ai-icon-link{display:flex;align-items:center;justify-content:center;width:38px;height:38px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.ai-icon-link img{width:100%;height:30px;object-fit:contain;transition:transform .3s ease}.chatgpt-dark-icon{display:block}.chatgpt-light-icon,[data-theme=light] .chatgpt-dark-icon{display:none}[data-theme=light] .chatgpt-light-icon{display:block}.ai-icon-link:hover img{transform:rotate(15deg) scale(1)}.ai-icon-link:after{content:"";position:absolute;right:-.375rem;top:25%;height:50%;width:1px;background:#ffffff1a}.ai-icon-link:last-child:after{display:none}@media(max-width:600px){.author-row{flex-direction:column;align-items:flex-start;gap:1.5rem}.ai-summary-tools{width:100%;justify-content:space-between}}.blog-hero-image-wrapper{width:100%;border-radius:24px;overflow:hidden;background:var(--color-bg-tertiary);aspect-ratio:16/10}.hero-image{width:100%;height:100%;object-fit:cover;display:block}.blog-content-grid{display:flex;gap:4rem}.blog-main-col{flex:1;min-width:0}.blog-sidebar-col{flex:0 0 370px}.blog-sidebar-col::-webkit-scrollbar{display:none}.blog-content-section{padding-bottom:6rem;overflow:visible}.blog-detail-container{overflow:visible}.blog-article-content{font-size:1.125rem;line-height:1.8;color:var(--color-text-secondary);margin-bottom:0rem;margin-left:0}.blog-article-content p{margin-bottom:1rem}.blog-article-content h2{font-size:2rem;line-height:1.3;font-weight:400;color:var(--color-text-primary);margin-bottom:1rem}.blog-article-content h3{font-size:1.5rem;line-height:1.3;color:var(--color-text-primary);margin-top:1.5rem;margin-bottom:.5rem;font-weight:600;scroll-margin-top:140px}.blog-article-content h3:first-child{margin-top:0}.blog-article-content code{background:#3d9aff1a;padding:.2rem .4rem;border-radius:4px;font-family:JetBrains Mono,Fira Code,monospace;font-size:.85em;color:var(--color-accent-primary);border:1px solid rgba(61,154,255,.2);vertical-align:middle}.code-block-wrapper{position:relative;margin:2rem 0 2.5rem}.blog-article-content pre{background:#0d1117;padding:1.25rem 1.5rem;border-radius:12px;overflow-x:auto;margin:0;border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px -10px #00000080;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent}.blog-article-content pre::-webkit-scrollbar{height:4px}.blog-article-content pre::-webkit-scrollbar-track{background:transparent}.blog-article-content pre::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}.blog-article-content pre::-webkit-scrollbar-thumb:hover{background:var(--color-accent-primary)}.cd-key{color:#ff7b72;font-weight:600}.cd-str{color:#a5d6ff}.cd-cmt{color:#8b949e;font-style:italic}.cd-bool{color:#79c0ff}.cd-num{color:#d2a8ff}[data-theme=light] .blog-article-content pre{background:#1a1e26}.blog-article-content pre code{background:none;padding:0;border:none;color:#e6edf3;font-size:.9rem;line-height:1.6;font-family:JetBrains Mono,Fira Code,monospace;display:block;white-space:pre}.copy-code-btn{position:absolute;top:10px;right:10px;display:flex;align-items:center;gap:6px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#fff9;padding:5px 10px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);opacity:0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:5}.code-block-wrapper:hover .copy-code-btn{opacity:1}.copy-code-btn:hover{background:#ffffff1a;color:#fff;border-color:#fff3}.copy-code-btn.copied{color:#4ecd8a;background:#4ecd8a1a;border-color:#4ecd8a4d}.copy-code-btn svg{flex-shrink:0}.copy-code-btn .check-icon{color:#4ecd8a}@media(max-width:768px){.copy-code-btn{opacity:1;top:6px;right:6px;padding:4px 8px}}.blog-article-content blockquote{border-left:4px solid var(--color-accent-primary);padding:1.5rem 2rem;margin:3rem 0;background:#3d9aff08;border-top-right-radius:12px;border-bottom-right-radius:12px;font-style:italic;color:var(--color-text-primary);font-size:1.25rem;line-height:1.6}.blog-article-content ul,.blog-article-content ol{margin-bottom:2.5rem;padding-left:1.5rem}.blog-article-content li{margin-bottom:1rem;color:var(--color-text-secondary)}.blog-article-content li strong,.blog-article-content strong,.blog-article-content b{color:var(--color-text-primary);font-weight:600}.blog-content-image{width:100%;height:auto;border-radius:20px;margin:3rem 0;border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 40px #0006;display:block}.blog-content-image[src*=react],.blog-content-image[src*=stats],.blog-content-image[src*=diagram]{border-color:#3d9aff33;box-shadow:0 20px 40px #0006,0 0 20px #3d9aff0d}.blog-toc-wrapper{background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:16px;width:100%;z-index:10}.sticky-sidebar-container{position:sticky;top:100px;display:flex;flex-direction:column;gap:2rem}.toc-title{font-size:1rem;font-weight:600;color:var(--color-text-primary);margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1);text-transform:uppercase;letter-spacing:.05em}.toc-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;max-height:216px;overflow-y:auto;overflow-x:hidden;padding-right:.5rem}.toc-list::-webkit-scrollbar{width:4px}.toc-list::-webkit-scrollbar-track{background:transparent}.toc-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.toc-list::-webkit-scrollbar-thumb:hover{background:#fff3}.toc-list li a{color:var(--color-text-secondary);text-decoration:none;font-size:14px;transition:all .2s ease;display:flex;align-items:flex-start;gap:.5rem;line-height:1.5;font-weight:400}.toc-item-h2 a{font-weight:600;color:var(--color-text-primary);padding-top:.5rem}.toc-item-h2:first-child a{padding-top:0}.toc-item-h2 a:before{display:none}.toc-item-h3{padding-left:1.25rem}.toc-item-h3 a{font-size:.85rem}.toc-list li a:before{content:"→";color:var(--color-text-muted);font-size:.9em;transition:transform .2s ease;flex-shrink:0;margin-top:2px}.toc-list li a:hover,.toc-list li a.active{color:var(--color-accent-primary);padding-left:.25rem}.toc-list li a:hover:before,.toc-list li a.active:before{color:var(--color-accent-primary);transform:translate(2px)}.blog-tags-wrapper{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:0;border-top:1px solid rgba(255,255,255,.1);padding-top:1rem;padding-bottom:1rem;width:100%}.blog-tag{font-size:.9rem;color:var(--color-text-secondary);background:var(--color-bg-tertiary);padding:.3rem .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.05)}.blog-faqs-section{margin-top:4rem;padding:3rem 0;border-top:1px solid var(--color-bg-tertiary)}.related-posts-bottom{margin-top:4rem;padding-top:3rem;border-top:1px solid var(--color-bg-tertiary)}.blog-faqs-section h2,.related-posts-bottom h3{font-size:2rem;font-weight:700;margin-bottom:2rem!important;background:linear-gradient(135deg,var(--color-text-primary) 0%,var(--color-text-secondary) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.blog-faqs-section .accordion-container{background:#ffffff05;border-radius:1.5rem;padding:1.5rem;border:1px solid rgba(255,255,255,.05)}.blog-navigation{display:flex;justify-content:space-between;gap:2rem;border-top:1px solid rgba(255,255,255,.1);padding-top:3rem}.prev-blog-link,.next-blog-link{display:flex;align-items:center;gap:1.5rem;text-decoration:none;max-width:48%;transition:all .3s ease;background:#ffffff05;border:1px solid rgba(255,255,255,.05);padding:1rem 2rem;border-radius:16px}.prev-blog-link:hover,.next-blog-link:hover{background:#ffffff0d;border-color:var(--color-accent-primary);box-shadow:0 0 20px #3d9aff1a}.nav-label{display:flex;flex-direction:column}.prev-blog-link .nav-label{align-items:flex-end;text-align:right}.next-blog-link .nav-label{align-items:flex-start;text-align:left}.label-text{font-size:.75rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}.nav-blog-title{font-size:1.1rem;font-weight:600;color:var(--color-text-primary);margin:0;line-height:1.3}.prev-blog-link svg,.next-blog-link svg{color:var(--color-text-muted);transition:color .3s ease,transform .3s ease}.prev-blog-link:hover svg{color:var(--color-accent-primary);transform:translate(-4px)}.next-blog-link:hover svg{color:var(--color-accent-primary);transform:translate(4px)}.prev-blog-link:hover .nav-blog-title,.next-blog-link:hover .nav-blog-title{color:var(--color-accent-primary)}.accordion-title{text-align:left}@media(max-width:991px){.blog-faqs-section .accordion-container{padding:10px}.blog-header-layout{grid-template-columns:1fr;gap:3rem;margin-bottom:0rem}.blog-hero-image-wrapper{order:1}.blog-content-grid{flex-direction:column;gap:3rem}.blog-sidebar-col{position:static;top:auto;order:-1;margin-bottom:2rem}.sticky-sidebar-container{position:static;top:auto}}@media(max-width:768px){.blog-detail-hero{padding-top:2.5rem;padding-bottom:2.5rem}.blog-faqs-section{margin-top:2rem;padding:2rem 0}.blog-title-large{font-size:2.25rem}.blog-navigation{flex-direction:column;gap:1.5rem}.prev-blog-link,.next-blog-link{max-width:100%;justify-content:space-between}.prev-blog-link{flex-direction:row-reverse}.prev-blog-link .nav-label{align-items:flex-start;text-align:left}.blog-content-section{padding-bottom:3rem}.blog-sidebar-col{display:none}.blog-article-content{font-size:1rem;margin-bottom:2rem}.blog-article-content h3{font-size:1.375rem;margin-top:2rem}.blog-article-content p{margin-bottom:1.25rem}}@media(max-width:768px){.related-posts-grid{grid-template-columns:1fr;gap:2rem}}.sidebar-related-widget{background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:2rem;width:100%;margin-top:2rem}.sidebar-related-list{display:flex;flex-direction:column;gap:1.5rem}.sidebar-related-card{display:flex;flex-direction:column;gap:1rem;background:var(--color-bg-tertiary);padding:1.25rem;border-radius:16px;border:1px solid var(--color-bg-secondary);text-decoration:none;transition:all .3s ease}.sidebar-related-card:hover{transform:translate(4px)}.sidebar-card-image{width:100%;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#ffffff0d}.sidebar-card-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}.sidebar-related-card:hover .sidebar-card-image img{transform:scale(1.1)}.sidebar-card-content{display:flex;flex-direction:column;gap:.25rem}.sidebar-card-title{font-size:1.15rem;font-weight:600;line-height:1.4;color:var(--color-text-primary);margin-bottom:.5rem;transition:color .2s ease;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sidebar-related-card:hover .sidebar-card-title{color:var(--color-accent-primary)}.sidebar-card-date{font-size:.75rem;color:var(--color-text-muted)}.blog-table-wrapper{width:100%;overflow-x:auto;margin:2.5rem 0;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#ffffff05;box-shadow:0 10px 30px -10px #00000080}.blog-table-wrapper table{width:100%;border-collapse:collapse;text-align:left;min-width:600px}.blog-table-wrapper th,.blog-table-wrapper td{padding:1.25rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.05);line-height:1.5}.blog-table-wrapper th{background:#ffffff08;color:var(--color-text-primary);font-weight:600;font-size:.95rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid rgba(255,255,255,.1)}.blog-table-wrapper td{color:var(--color-text-secondary);font-size:1rem;vertical-align:middle}.blog-table-wrapper tbody tr{transition:background-color .2s ease}.blog-table-wrapper tbody tr:hover td{background:#ffffff08;color:var(--color-text-primary)}.blog-table-wrapper tr:last-child td{border-bottom:none}[data-theme=light] .blog-table-wrapper{border-color:#0000001a;background:#fff;box-shadow:0 4px 15px #00000008}[data-theme=light] .blog-table-wrapper th,[data-theme=light] .blog-table-wrapper td{border-bottom-color:#0000000d}[data-theme=light] .blog-table-wrapper th{background:#f8fafc;color:var(--color-text-primary);border-bottom-color:#0000001a}[data-theme=light] .blog-table-wrapper td{color:var(--color-text-secondary)}[data-theme=light] .blog-table-wrapper tbody tr:hover td{background:#f1f5f9;color:var(--color-text-primary)}[data-theme=light] .blog-faqs-section,[data-theme=light] .blog-navigation,[data-theme=light] .blog-tags-wrapper,[data-theme=light] .toc-title{border-color:#0000001a}[data-theme=light] .blog-faqs-section .accordion-container,[data-theme=light] .prev-blog-link,[data-theme=light] .next-blog-link,[data-theme=light] .blog-toc-wrapper,[data-theme=light] .blog-tag,[data-theme=light] .sidebar-related-widget,[data-theme=light] .sidebar-related-card,[data-theme=light] .sidebar-card-image{background:#f8fafc;border-color:#00000014}[data-theme=light] .prev-blog-link:hover,[data-theme=light] .next-blog-link:hover,[data-theme=light] .sidebar-related-card:hover{background:#f1f5f9;border-color:var(--color-accent-primary)}[data-theme=light] .blog-article-content code{background:#3d9aff1a}[data-theme=light] .blog-article-content blockquote{background:#3d9aff0d}[data-theme=light] .infographic-item{background:#f8fafc;border-color:#0000000d}[data-theme=light] .infographic-item:hover{background:#f1f5f9}.blog-article-content hr{margin:1rem 0;border:0;height:.5px;background:linear-gradient(to right,transparent,rgba(255,255,255,1),transparent)}[data-theme=light] .blog-article-content hr{background:linear-gradient(to right,transparent,rgba(0,0,0,1),transparent)}.blog-infographic-wrapper{background:var(--color-bg-tertiary);border:1px solid rgba(255,255,255,.05);border-radius:24px;padding:2.5rem;margin:3rem 0;box-shadow:0 20px 40px #0000004d;overflow:hidden;position:relative}[data-theme=light] .blog-infographic-wrapper{background:#fff;border:1px solid rgba(0,0,0,.05);box-shadow:0 10px 30px #0000000d}.infographic-header{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-bottom:2.5rem;position:relative;z-index:1}.infographic-badge{padding:.75rem 1.5rem;border-radius:12px;font-weight:700;font-size:1rem;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 10px 20px #0003}.infographic-badge.wordpress{background:#21759b;color:#fff}.infographic-badge.webflow{background:#4353ff;color:#fff}.infographic-vs{font-weight:800;font-size:1.25rem;color:var(--color-text-muted);font-family:var(--font-display);opacity:.6}.infographic-grid{display:flex;flex-direction:column;gap:1rem;position:relative;z-index:1}.infographic-item{display:grid;grid-template-columns:150px 1fr 1fr;gap:1.5rem;align-items:center;padding:1rem 1.5rem;background:#ffffff05;border:1px solid rgba(255,255,255,.03);border-radius:16px;transition:all .3s ease}[data-theme=light] .infographic-item{background:#00000005;border:1px solid rgba(0,0,0,.03)}.infographic-item:hover{background:#ffffff0d;border-color:#3d9aff1a;transform:translate(4px)}[data-theme=light] .infographic-item:hover{background:#0000000d}.infographic-item .label{font-size:.85rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.wp-val,.wf-val{font-size:1rem;font-weight:500;color:var(--color-text-primary)}.wp-val{padding-left:1rem;border-left:3px solid #21759b}.wf-val{padding-left:1rem;border-left:3px solid #4353ff}@media(max-width:768px){.blog-infographic-wrapper{padding:1.5rem;margin:2rem 0;border-radius:20px}.infographic-header{gap:1rem;margin-bottom:1.5rem}.infographic-badge{padding:.5rem 1rem;font-size:.85rem}.infographic-vs{font-size:1rem}.infographic-item{grid-template-columns:1fr;gap:.75rem;padding:1.25rem}.infographic-item .label{font-size:.75rem;margin-bottom:.25rem;display:block}.wp-val,.wf-val{font-size:.95rem}}