.blog-page{min-height:100vh;background:var(--ink)}.blog-container{max-width:1200px;margin:0 auto;padding:120px 40px 80px}.blog-hero{text-align:center;margin-bottom:60px}.blog-hero h1{font-size:48px;font-weight:800;margin-bottom:16px;color:var(--color-text)}.blog-subtitle{font-size:24px;color:var(--color-text-light);margin-bottom:24px;font-weight:500}.blog-description{font-size:20px;color:var(--color-text-light);max-width:800px;margin:0 auto;line-height:1.6}.blog-filters{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:48px}.filter-btn{padding:10px 20px;background:#fff;border:2px solid var(--color-bg-gray);border-radius:var(--radius-sm);font-size:16px;font-weight:500;color:var(--color-text);cursor:pointer;transition:all .3s ease}.filter-btn:hover{border-color:var(--color-accent);color:var(--color-accent)}.filter-btn.active{background:var(--gradient-primary);border-color:transparent;color:#fff}.blog-posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.blog-post-card{background:#fff;padding:32px;border-radius:var(--radius);box-shadow:var(--shadow-sm);text-decoration:none;color:var(--color-text);transition:all .3s ease;display:block}.blog-post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.post-category{display:inline-block;padding:6px 12px;background:var(--color-bg-light);border-radius:var(--radius-sm);font-size:12px;font-weight:600;color:var(--color-text-light);margin-bottom:16px;text-transform:uppercase;letter-spacing:.5px}.blog-post-card h2{font-size:24px;font-weight:600;margin-bottom:12px;color:var(--color-text);line-height:1.3}.post-subtitle{font-size:16px;color:var(--color-text-light);line-height:1.6;margin-bottom:20px}.post-meta{display:flex;justify-content:space-between;align-items:center;padding-top:20px;border-top:1px solid var(--color-bg-gray)}.post-date{font-size:14px;color:var(--color-text-light)}.read-more{font-size:14px;font-weight:600;color:var(--color-accent)}@media(max-width:968px){.blog-posts-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.blog-container{padding:100px 20px 60px}.blog-hero h1{font-size:36px}.blog-posts-grid{grid-template-columns:1fr}}