.blog-list{padding:120px 0 80px;min-height:70vh}.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));grid-gap:32px;gap:32px}.blog-card{background:#f9fafb;border-radius:12px;transition:all .3s ease;overflow:hidden}.blog-card:hover{box-shadow:0 10px 25px rgba(0,0,0,.1);transform:translateY(-2px)}.blog-card a{text-decoration:none;display:block;padding:28px}.blog-card-title{font-size:1.25rem;font-weight:600;color:#111827;margin-bottom:12px;line-height:1.4}.blog-card-description{color:#6b7280;margin-bottom:16px;line-height:1.6}.blog-card-footer{display:flex;justify-content:space-between;align-items:center}.blog-card-date{font-size:14px;color:#9ca3af}.blog-card-read{font-size:14px;font-weight:500;color:#2563eb}.blog-article{padding:120px 0 80px}.blog-content{max-width:768px;margin:0 auto}.blog-back-link{display:inline-block;color:#2563eb;font-size:14px;font-weight:500;margin-bottom:24px;text-decoration:none;transition:color .3s ease}.blog-back-link:hover{color:#1d4ed8}.blog-header{margin-bottom:40px}.blog-header h1{font-size:2.5rem;font-weight:700;color:#111827;margin-bottom:12px;line-height:1.2}.blog-header time{color:#9ca3af;font-size:14px}.mdx-content h2{font-size:1.75rem;font-weight:600;color:#111827;margin:40px 0 16px;line-height:1.3}.mdx-content h3{font-size:1.25rem;font-weight:600;color:#111827;margin:32px 0 12px;line-height:1.4}.mdx-content p{color:#374151;line-height:1.8;margin-bottom:16px;font-size:17px}.mdx-content ol,.mdx-content ul{margin:16px 0;padding-left:24px;color:#374151}.mdx-content li{margin-bottom:8px;line-height:1.7;font-size:17px}.mdx-content strong{color:#111827;font-weight:600}.mdx-content a{color:#2563eb;text-decoration:underline;transition:color .3s ease}.mdx-content a:hover{color:#1d4ed8}.mdx-content blockquote{border-left:4px solid #2563eb;padding:12px 20px;margin:24px 0;background:#f9fafb;border-radius:0 8px 8px 0}.mdx-content blockquote p{color:#4b5563;font-style:italic;margin-bottom:0}@media (max-width:768px){.blog-header h1{font-size:2rem}.blog-grid{grid-template-columns:1fr}.mdx-content h2{font-size:1.5rem}}@media (max-width:480px){.blog-header h1{font-size:1.75rem}.blog-article,.blog-list{padding:100px 0 60px}}