.hero-small{padding:var(--space-16) 0;background:var(--gradient-hero);min-height:auto}.hero-small h1{font-size:var(--text-5xl);margin-bottom:var(--space-4)}.hero-small .hero-subtitle{font-size:var(--text-xl);margin-bottom:0}.blog-section{padding:var(--space-16) 0;background:var(--color-light)}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);margin-bottom:var(--space-12)}@media (max-width:1024px){.blog-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.blog-grid{grid-template-columns:1fr}}.blog-card{background:var(--color-white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.06);transition:all var(--transition-normal);display:flex;flex-direction:column}.blog-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,0.1)}.blog-card-link-wrapper{display:flex;flex-direction:column;text-decoration:none;color:inherit;flex:1}.blog-card-image{aspect-ratio:16/9;overflow:hidden}.blog-card-image img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-normal)}.blog-card:hover .blog-card-image img{transform:scale(1.05)}.blog-card-mockup{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;border-radius:12px 12px 0 0}.blog-card-mockup::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 40px rgba(0,0,0,0.12);border-radius:12px 12px 0 0;pointer-events:none;z-index:1}.blog-card-mockup svg{width:100%;height:100%;display:block;transition:transform var(--transition-normal)}.blog-card:hover .blog-card-mockup svg{transform:scale(1.02)}.blog-content-mockup{margin:var(--space-8) 0;display:flex;justify-content:center}.blog-content-mockup svg{max-width:100%;height:auto;filter:drop-shadow(0 12px 40px rgba(0,0,0,0.12));border-radius:12px}.blog-faq-section{margin:var(--space-8) 0}.blog-faq-section .faq-list{grid-template-columns:1fr}.blog-card-content{padding:var(--space-6);display:flex;flex-direction:column;flex:1}.blog-card-meta{font-size:var(--text-sm);color:var(--color-gray-600);margin-bottom:var(--space-3)}.blog-card-title{font-size:var(--text-lg);font-weight:700;line-height:1.3;margin-bottom:var(--space-3);color:var(--color-dark);transition:color var(--transition-fast)}.blog-card:hover .blog-card-title{color:var(--color-primary)}.blog-card-excerpt{font-size:var(--text-sm);color:var(--color-gray-600);line-height:1.6;margin-bottom:var(--space-4);flex:1}.blog-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-4);border-top:1px solid var(--color-gray-100)}.blog-card-date{font-size:var(--text-sm);color:var(--color-gray-500)}.blog-card-link{font-size:var(--text-sm);font-weight:600;color:var(--color-primary)}.blog-card-cta{font-size:var(--text-sm);font-weight:600;color:var(--color-primary);transition:color var(--transition-fast)}.blog-card:hover .blog-card-cta{color:var(--color-primary-light)}.blog-pagination{display:flex;justify-content:center;align-items:center;gap:var(--space-4);padding-top:var(--space-8)}.blog-pagination a,.blog-pagination span{padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:500;color:var(--color-dark);text-decoration:none;transition:all var(--transition-fast)}.blog-pagination a:hover{color:var(--color-primary)}.blog-pagination-current{background:var(--color-primary);color:var(--color-white)!important;border-radius:var(--radius-sm)}.blog-pagination .disabled{opacity:0.4;pointer-events:none}.blog-pagination-numbers{display:flex;gap:var(--space-1)}.blog-pagination-dots{color:var(--color-gray-400)}.blog-post-main{background:var(--color-white)}.blog-breadcrumb{background:var(--color-light);padding:var(--space-4) 0}.blog-breadcrumb .container{display:flex;justify-content:space-between;align-items:center}.blog-breadcrumb a{font-size:var(--text-sm);color:var(--color-gray-600)}.blog-breadcrumb a:hover{color:var(--color-primary)}.blog-lang-switch{display:flex;gap:var(--space-2)}.blog-lang-switch a{padding:var(--space-1) var(--space-3);font-size:var(--text-sm);font-weight:500;color:var(--color-gray-500);border:1px solid var(--color-gray-200);border-radius:var(--radius-sm)}.blog-lang-switch a.active{background:var(--color-primary);color:var(--color-white);border-color:var(--color-primary)}.blog-header{padding:var(--space-16) 0 var(--space-12);text-align:center}.blog-header .breadcrumb{justify-content:flex-start;margin-bottom:var(--space-6);text-align:left}.blog-header .breadcrumb ol{display:flex;align-items:center;justify-content:flex-start;gap:var(--space-2);list-style:none;padding:0;margin:0;font-size:var(--text-sm)}.blog-header .breadcrumb a{color:rgba(255,255,255,0.7);transition:color var(--transition-fast)}.blog-header .breadcrumb a:hover{color:var(--color-white)}.blog-header .breadcrumb span{color:rgba(255,255,255,0.5)}.blog-header .breadcrumb span[aria-current]{color:rgba(255,255,255,0.9)}.blog-header .page-header-content{max-width:900px;margin:0 auto}.blog-header h1{font-size:var(--text-4xl);font-weight:700;color:var(--color-white);margin-bottom:var(--space-4);animation:fadeInUp 0.6s var(--ease-smooth)}.blog-header .page-header-subtitle{font-size:var(--text-lg);color:rgba(255,255,255,0.8);margin:0;animation:fadeInUp 0.8s var(--ease-smooth)}.blog-header .blog-post-separator{margin:0 var(--space-2)}.blog-header-with-stats{position:relative;padding-bottom:0}.blog-header-with-stats .page-header-content{padding-bottom:var(--space-8)}.blog-header .hero-stats-bar{position:relative;padding:var(--space-5) 0;background:rgba(255,255,255,0.95);backdrop-filter:blur(8px);border-top:1px solid rgba(0,77,67,0.1)}.blog-back-link{margin-bottom:var(--space-8);padding-top:var(--space-4);text-align:right}.blog-back-link .btn{display:inline-flex;align-items:center;gap:var(--space-2);text-decoration:none}.blog-back-link .btn:hover{text-decoration:none}.blog-post-header{padding:var(--space-12) 0 var(--space-8);text-align:center}.blog-post-meta{font-size:var(--text-sm);color:var(--color-gray-600);margin-bottom:var(--space-4)}.blog-post-meta span{margin:0 var(--space-2)}.blog-post-header h1{font-size:var(--text-5xl);max-width:900px;margin:0 auto}.blog-post-featured-image{margin-bottom:var(--space-12)}.blog-post-featured-image img{width:100%;max-height:500px;object-fit:cover;border-radius:var(--radius-lg)}.blog-post-content{padding:var(--space-8) 0}.blog-post-content h2{font-size:var(--text-3xl);margin-top:var(--space-12);margin-bottom:var(--space-6);padding-top:var(--space-4)}.blog-post-content h3{font-size:var(--text-xl);margin-top:var(--space-8);margin-bottom:var(--space-4)}.blog-post-content p{margin-bottom:var(--space-6);line-height:1.8}.blog-post-content ul,.blog-post-content ol{margin-bottom:var(--space-6);padding-left:var(--space-6)}.blog-post-content li{margin-bottom:var(--space-2);line-height:1.7}.blog-post-content a{color:var(--color-primary);text-decoration:underline}.blog-post-content code{background:var(--color-gray-100);padding:0.15em 0.4em;border-radius:4px;font-family:var(--font-mono);font-size:0.9em}.blog-intro{font-size:var(--text-xl);line-height:1.7;color:var(--color-gray-700);margin-bottom:var(--space-8);padding-bottom:var(--space-8);border-bottom:1px solid var(--color-gray-200)}.blog-quote{margin:var(--space-8) 0;padding:var(--space-6) var(--space-8);background:var(--color-light);border-left:4px solid var(--color-primary);border-radius:0 var(--radius-lg) var(--radius-lg) 0}.blog-quote p{font-size:var(--text-lg);font-style:italic;margin-bottom:var(--space-2)}.blog-quote cite{font-size:var(--text-sm);color:var(--color-gray-600);font-style:normal}.blog-code-block{margin:var(--space-8) 0;background:var(--color-anthracite);border-radius:var(--radius-lg);overflow:hidden}.blog-code-block .code-header{padding:var(--space-3) var(--space-4);background:rgba(0,0,0,0.3);display:flex;align-items:center;gap:var(--space-2)}.blog-code-block .code-content{padding:var(--space-4);overflow-x:auto}.blog-code-block code{background:none;padding:0;font-size:14px;line-height:1.6;color:#e0e0e0}.blog-terminal{margin:var(--space-8) 0;background:var(--color-anthracite);border-radius:var(--radius-lg);overflow:hidden}.terminal-content{padding:var(--space-4);font-family:var(--font-mono);font-size:14px;line-height:1.6}.terminal-line{color:#e0e0e0}.terminal-prompt{color:var(--color-accent)}.terminal-output{color:var(--color-gray-400);padding-left:var(--space-4)}.blog-image{margin:var(--space-8) 0}.blog-image img{border-radius:var(--radius-lg)}.blog-image figcaption{text-align:center;font-size:var(--text-sm);color:var(--color-gray-600);margin-top:var(--space-3)}.blog-gallery{display:grid;gap:var(--space-4);margin:var(--space-8) 0}.blog-gallery--2{grid-template-columns:repeat(2,1fr)}.blog-gallery--3{grid-template-columns:repeat(3,1fr)}.blog-gallery--4{grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.blog-gallery--3,.blog-gallery--4{grid-template-columns:repeat(2,1fr)}}.blog-gallery figure{margin:0}.blog-gallery img{border-radius:var(--radius-md);aspect-ratio:4/3;object-fit:cover}.blog-gallery figcaption{font-size:var(--text-sm);color:var(--color-gray-600);margin-top:var(--space-2)}.blog-video{margin:var(--space-8) 0;position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:var(--radius-lg)}.blog-video iframe{position:absolute;top:0;left:0;width:100%;height:100%}.blog-mockup{margin:var(--space-8) 0;background:var(--color-anthracite);border-radius:var(--radius-lg);overflow:hidden}.blog-mockup-content{padding:var(--space-6)}.content-mockup-plugin-tree{font-family:monospace;font-size:14px;color:#e0e0e0;line-height:1.8}.content-mockup-plugin-tree .folder{color:#f0c36d}.content-mockup-plugin-tree .file{color:#98c379}.content-mockup-plugin-tree .comment{color:#666;font-size:12px}.content-mockup-plugin-tree .indent-1{padding-left:20px}.content-mockup-plugin-tree .indent-2{padding-left:40px}.content-mockup-plugin-tree .indent-3{padding-left:60px}.content-mockup-plugin-tree .indent-4{padding-left:80px}.content-mockup-lighthouse{display:flex;justify-content:center;gap:24px;padding:20px 0}.content-mockup-lighthouse .score-item{text-align:center}.content-mockup-lighthouse .score{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#0cce6b,#0cce6b);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:28px;color:#fff}.content-mockup-lighthouse .score-label{font-size:11px;color:#888;margin-top:8px}.blog-callout{margin:var(--space-8) 0;padding:var(--space-6);border-radius:var(--radius-lg);border-left:4px solid}.blog-callout--tip{background:rgba(0,168,138,0.1);border-color:var(--color-accent)}.blog-callout--info{background:rgba(0,77,67,0.1);border-color:var(--color-primary)}.blog-callout--warning{background:rgba(255,193,7,0.1);border-color:#ffc107}.blog-callout--danger{background:rgba(220,53,69,0.1);border-color:#dc3545}.blog-callout--success{background:rgba(40,167,69,0.1);border-color:#28a745}.blog-callout-title{display:block;margin-bottom:var(--space-2)}.blog-callout p{margin:0}.blog-highlight{margin:var(--space-8) 0;padding:var(--space-6);background:var(--gradient-primary);border-radius:var(--radius-lg);color:var(--color-white);display:flex;gap:var(--space-4)}.blog-highlight-icon{flex-shrink:0}.blog-highlight-icon svg{width:32px;height:32px}.blog-highlight-content>strong{display:block;margin-bottom:var(--space-2)}.blog-highlight p{margin:0;opacity:0.9}.blog-feature-grid{display:grid;gap:var(--space-6);margin:var(--space-8) 0}.blog-feature-grid--2{grid-template-columns:repeat(2,1fr)}.blog-feature-grid--3{grid-template-columns:repeat(3,1fr)}.blog-feature-grid--4{grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.blog-feature-grid--2,.blog-feature-grid--3,.blog-feature-grid--4{grid-template-columns:1fr}}.blog-feature-item{background:var(--color-light);padding:var(--space-6);border-radius:var(--radius-lg);text-align:center}.blog-feature-icon{width:48px;height:48px;margin:0 auto var(--space-4);background:var(--gradient-primary);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--color-white)}.blog-feature-icon svg{width:24px;height:24px}.blog-feature-item h4{font-size:var(--text-base);margin-bottom:var(--space-2)}.blog-feature-item p{font-size:var(--text-sm);color:var(--color-gray-600);margin:0}.blog-promo{margin:var(--space-12) 0;padding:var(--space-10);background:var(--gradient-hero);border-radius:var(--radius-xl);text-align:center;color:var(--color-white)}.blog-promo h3{font-size:var(--text-2xl);margin:0 0 var(--space-3);color:var(--color-white)}.blog-promo p{font-size:var(--text-lg);opacity:0.9;margin-bottom:var(--space-6)}.blog-promo .btn-primary{background:var(--color-white);color:var(--color-primary);font-weight:700;padding:var(--space-3) var(--space-8);font-size:var(--text-base);box-shadow:0 4px 20px rgba(0,0,0,0.2);transition:all var(--transition-normal)}.blog-promo .btn-primary:hover{background:var(--color-accent);color:var(--color-white);transform:translateY(-2px);box-shadow:0 6px 25px rgba(0,0,0,0.25);text-decoration:none}.blog-promo .btn-primary{text-decoration:none}.blog-comparison{margin:var(--space-8) 0;overflow-x:auto}.blog-comparison table{width:100%;border-collapse:collapse}.blog-comparison thead{background:var(--color-primary);color:var(--color-white)}.blog-comparison th,.blog-comparison td{padding:var(--space-4);text-align:left;border-bottom:1px solid var(--color-gray-200)}.blog-comparison th{background:var(--color-primary);color:var(--color-white);font-weight:600;border-bottom:none}.blog-comparison .highlight{background:rgba(0,168,138,0.1);font-weight:600;color:var(--color-primary)}.blog-toc{margin:var(--space-8) 0;padding:var(--space-6);background:var(--color-light);border-radius:var(--radius-lg)}.blog-toc strong{display:block;margin-bottom:var(--space-4);font-size:var(--text-lg)}.blog-toc ol{margin:0;padding-left:var(--space-6)}.blog-toc li{margin-bottom:var(--space-2)}.blog-toc a{color:var(--color-gray-700)}.blog-toc a:hover{color:var(--color-primary)}.blog-post-tags{padding:var(--space-8) 0;border-top:1px solid var(--color-gray-200)}.blog-tags-label{font-weight:600;margin-right:var(--space-2)}.blog-tag{display:inline-block;padding:var(--space-1) var(--space-3);background:var(--color-light);border-radius:var(--radius-full);font-size:var(--text-sm);color:var(--color-gray-600);margin-right:var(--space-2)}.blog-related-section{padding:var(--space-12) 0;background:var(--color-light)}.blog-related h2{text-align:left;margin-bottom:var(--space-8)}.blog-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}@media (max-width:768px){.blog-related-grid{grid-template-columns:1fr}.blog-header{padding:var(--space-12) 0 var(--space-8)}.blog-header-with-stats{padding-bottom:0}.blog-header-with-stats .page-header-content{padding-bottom:var(--space-6)}.blog-header h1{font-size:var(--text-3xl)}.blog-header .breadcrumb ol{flex-wrap:wrap}}.blog-checklist{list-style:none;padding-left:0}.blog-checklist li{position:relative;padding-left:var(--space-8)}.blog-checklist .checkmark::before{content:'';position:absolute;left:0;top:6px;width:20px;height:20px;background:var(--color-accent);border-radius:50%}.blog-checklist .checkmark::after{content:'';position:absolute;left:7px;top:10px;width:6px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.blog-no-posts{text-align:center;padding:var(--space-12);color:var(--color-gray-600)}.blog-button-wrapper{margin:var(--space-8) 0}.blog-button--center{text-align:center}.blog-button--right{text-align:right}.blog-buttons{display:flex;flex-wrap:wrap;gap:var(--space-4);margin:var(--space-8) 0}.blog-buttons--center{justify-content:center}.blog-buttons--right{justify-content:flex-end}.blog-divider{margin:var(--space-10) 0;border:none;border-top:1px solid var(--color-gray-200)}.blog-divider--thick{border-top-width:3px}.blog-divider--dashed{border-top-style:dashed}.blog-divider--dotted{border-top-style:dotted}