.blog-page{max-width:1200px;margin:0 auto;padding:0 var(--space-md);padding-bottom:var(--space-3xl)}.blog-header{text-align:center;padding:var(--space-2xl) 0 var(--space-xl)}.blog-header h1{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:700;letter-spacing:-.03em;margin-bottom:var(--space-xs);background:linear-gradient(135deg,#a855f7,#6366f1,#3b82f6 70%,#06b6d4);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=light] .blog-header h1{background:linear-gradient(135deg,#9333ea,#4f46e5,#2563eb 70%,#0891b2);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.blog-tagline{font-size:var(--text-base);color:var(--color-text-muted);max-width:600px;margin:0 auto}.back-link{display:inline-flex;align-items:center;gap:var(--space-xs);color:var(--color-text-muted);text-decoration:none;font-size:var(--text-sm);margin-bottom:var(--space-md);transition:color .2s}.back-link:hover{color:var(--color-text-primary)}.blog-section{margin-bottom:var(--space-2xl)}.blog-section h2{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-lg);color:var(--color-text-primary);display:flex;align-items:center;gap:var(--space-sm)}.articles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-md)}.articles-grid.featured{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--space-lg)}@media(max-width:640px){.articles-grid,.articles-grid.featured{grid-template-columns:1fr}}.article-card{display:flex;flex-direction:column;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.article-card:hover{border-color:var(--color-border-hover);transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}.article-card a{display:flex;flex-direction:column;padding:var(--space-lg);text-decoration:none;color:inherit;height:100%;gap:var(--space-sm)}.article-card[data-category=privacy]:hover{border-color:#22c55e80}.article-card[data-category=technology]:hover{border-color:#3b82f680}.article-card[data-category=tutorials]:hover{border-color:#f59e0b80}.article-card[data-category=video]:hover{border-color:#8b5cf680}.article-meta{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}.article-category{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:4px 10px;border-radius:var(--radius-full);background:var(--color-bg-tertiary);color:var(--color-text-secondary)}.article-category.privacy{background:#22c55e26;color:#22c55e}.article-category.technology{background:#3b82f626;color:#3b82f6}.article-category.tutorials{background:#f59e0b26;color:#f59e0b}.article-category.video{background:#8b5cf626;color:#8b5cf6}.article-category.comparisons{background:#ec489926;color:#ec4899}.article-read-time{font-size:var(--text-xs);color:var(--color-text-muted)}.article-card h3{font-size:var(--text-lg);font-weight:600;line-height:1.3;color:var(--color-text-primary);margin:var(--space-xs) 0}.article-card p{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:1.6;flex:1}.article-page{max-width:800px;margin:0 auto;padding:var(--space-lg);padding-bottom:var(--space-3xl)}.article-header{margin-bottom:var(--space-xl);padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}.article-meta-header{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap;margin-bottom:var(--space-md)}.article-date{font-size:var(--text-xs);color:var(--color-text-muted)}.article-header h1{font-size:clamp(1.75rem,4vw,2.25rem);font-weight:700;letter-spacing:-.02em;line-height:1.2;margin-bottom:var(--space-sm);color:var(--color-text-primary)}.article-description{font-size:var(--text-base);color:var(--color-text-secondary);line-height:1.6}.article-author{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-lg);padding-top:var(--space-md);border-top:1px solid var(--color-border)}.author-label{font-size:var(--text-sm);color:var(--color-text-muted)}.author-name{font-size:var(--text-sm);font-weight:600;color:var(--color-text-secondary)}.toc{background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--space-lg);margin-bottom:var(--space-xl)}.toc h4{font-size:var(--text-sm);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);margin:0 0 var(--space-md);display:flex;align-items:center;gap:var(--space-xs)}.toc ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-xs)}.toc li a{display:block;padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--color-text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:all .2s ease}.toc li a:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.article-content{font-size:var(--text-base);line-height:1.8;color:var(--color-text-secondary)}.markdown-content h2{font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary);margin:var(--space-2xl) 0 var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border)}.markdown-content h2:first-child{margin-top:0;padding-top:0;border-top:none}.markdown-content h3{font-size:var(--text-lg);font-weight:600;color:var(--color-text-primary);margin:var(--space-xl) 0 var(--space-sm)}.markdown-content p{margin-bottom:var(--space-md)}.markdown-content strong{color:var(--color-text-primary);font-weight:600}.markdown-content a{color:var(--color-cta-primary);text-decoration:underline;text-underline-offset:2px}.markdown-content a:hover{color:var(--color-cta-hover)}.markdown-content ul,.markdown-content ol{margin:var(--space-md) 0;padding-left:var(--space-lg)}.markdown-content li{margin-bottom:var(--space-sm)}.callout{display:flex;gap:var(--space-md);padding:var(--space-lg);margin:var(--space-lg) 0;border-radius:var(--radius-lg);background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border)}.callout-icon{font-size:1.25rem;flex-shrink:0}.callout-content{flex:1}.callout-content strong{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.03em}.callout-content p{margin:0;font-size:var(--text-sm);line-height:1.6}.callout-note{border-left:3px solid #3b82f6}.callout-note .callout-icon,.callout-note strong{color:#3b82f6}.callout-tip{border-left:3px solid #22c55e}.callout-tip .callout-icon,.callout-tip strong{color:#22c55e}.callout-warning{border-left:3px solid #f59e0b}.callout-warning .callout-icon,.callout-warning strong{color:#f59e0b}.callout-important{border-left:3px solid #8b5cf6}.callout-important .callout-icon,.callout-important strong{color:#8b5cf6}.callout-caution{border-left:3px solid #ef4444}.callout-caution .callout-icon,.callout-caution strong{color:#ef4444}.markdown-table{width:100%;border-collapse:collapse;margin:var(--space-lg) 0;font-size:var(--text-sm);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border)}.markdown-table th,.markdown-table td{padding:var(--space-md);text-align:left;border-bottom:1px solid var(--color-border)}.markdown-table th{background:var(--color-bg-tertiary);font-weight:600;color:var(--color-text-primary);text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.03em}.markdown-table tr:last-child td{border-bottom:none}.markdown-table tr:hover td{background:var(--color-bg-hover)}.tool-cta-inline{display:inline-block;margin:var(--space-md) 0}.tool-cta-link{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);background:linear-gradient(135deg,#6366f126,#8b5cf626);border:1px solid rgba(99,102,241,.3);border-radius:var(--radius-lg);text-decoration:none;color:var(--color-text-primary);font-weight:500;font-size:var(--text-sm);transition:all .3s cubic-bezier(.4,0,.2,1)}.tool-cta-link:hover{background:linear-gradient(135deg,#6366f140,#8b5cf640);border-color:#6366f180;transform:translateY(-2px);box-shadow:0 8px 24px #6366f133}.tool-cta-icon{font-size:1.1em}.tool-cta-text{text-transform:capitalize}.related-tools{margin:var(--space-2xl) 0;padding:var(--space-xl);background:var(--color-bg-secondary);border-radius:var(--radius-xl);border:1px solid var(--color-border)}.related-tools h3{font-size:var(--text-lg);font-weight:600;margin:0 0 var(--space-lg);color:var(--color-text-primary)}.related-tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--space-md)}.related-tool-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-lg);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);text-decoration:none;color:var(--color-text-primary);transition:all .3s cubic-bezier(.4,0,.2,1)}.related-tool-card:hover{border-color:var(--color-cta-primary);transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}.related-tool-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;background:linear-gradient(145deg,#6366f126,#8b5cf640);border-radius:var(--radius-md)}.related-tool-name{font-size:var(--text-xs);font-weight:500;text-align:center;text-transform:capitalize}.code-block{background:var(--color-bg-tertiary);padding:var(--space-lg);border-radius:var(--radius-lg);overflow-x:auto;margin:var(--space-lg) 0;border:1px solid var(--color-border)}.code-block code{font-family:var(--font-mono);font-size:.9em;color:var(--color-text-primary);background:none;padding:0}.inline-code{font-family:var(--font-mono);font-size:.9em;background:var(--color-bg-tertiary);padding:2px 8px;border-radius:var(--radius-sm);color:var(--color-text-primary)}.article-cta{margin:var(--space-2xl) 0;padding:var(--space-xl);background:linear-gradient(135deg,#6366f114,#8b5cf614);border:1px solid rgba(99,102,241,.2);border-radius:var(--radius-xl);text-align:center}.article-cta h3{font-size:var(--text-lg);font-weight:600;margin:0 0 var(--space-sm);color:var(--color-text-primary)}.article-cta p{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0 0 var(--space-lg)}.cta-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md) var(--space-xl);background:var(--color-cta-primary);color:#fff;font-weight:600;font-size:var(--text-base);border-radius:var(--radius-lg);text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.cta-button:hover{background:var(--color-cta-hover);transform:translateY(-2px);box-shadow:0 8px 24px #6366f14d;color:#fff}.blog-footer{text-align:center;padding:var(--space-xl);margin-top:var(--space-xl);border-top:1px solid var(--color-border)}.blog-footer p{font-size:var(--text-sm);color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;gap:var(--space-sm)}.loading-state,.error-state{text-align:center;padding:var(--space-3xl)}.error-state h1{font-size:var(--text-xl);margin-bottom:var(--space-md)}.error-state p{color:var(--color-text-secondary);margin-bottom:var(--space-lg)}.error-state button{padding:var(--space-md) var(--space-xl);background:var(--color-accent-primary);color:var(--color-accent-text);border:none;border-radius:var(--radius-lg);font-weight:600;cursor:pointer;transition:all .2s ease}.error-state button:hover{background:var(--color-accent-hover)}@media(max-width:768px){.blog-page{padding:0 var(--space-sm)}.article-page{padding:var(--space-md)}.blog-header{padding:var(--space-xl) 0 var(--space-lg)}.article-header h1{font-size:1.5rem}.toc{padding:var(--space-md)}.callout{padding:var(--space-md);gap:var(--space-sm)}.related-tools-grid{grid-template-columns:repeat(2,1fr)}.markdown-table{font-size:var(--text-xs)}.markdown-table th,.markdown-table td{padding:var(--space-sm)}}@media(max-width:480px){.articles-grid{gap:var(--space-sm)}.article-card a{padding:var(--space-md)}.article-card h3{font-size:var(--text-base)}.article-meta-header{gap:var(--space-sm)}.markdown-content h2{font-size:var(--text-lg)}.article-cta{padding:var(--space-lg)}}