.blog-page{background:#fafafa;flex-direction:column;min-height:100vh;font-family:Kanit,sans-serif;display:flex}.blog-header{z-index:100;background:#fff;border-bottom:1px solid #eee;justify-content:space-between;align-items:center;padding:16px 24px;display:flex;position:sticky;top:0}.blog-brand{color:#1a1a1a;align-items:center;gap:10px;font-size:1.1rem;font-weight:600;text-decoration:none;display:flex}.blog-nav{gap:20px;display:flex}.blog-nav a{color:#666;border-bottom:2px solid #0000;padding:4px 0;font-size:.95rem;text-decoration:none}.blog-nav a:hover,.blog-nav a.active{color:#fa8112;border-bottom-color:#fa8112}.blog-main{flex:1;width:100%;max-width:800px;margin:0 auto;padding:40px 24px}.blog-page-title{color:#1a1a1a;margin:0 0 8px;font-size:2rem}.blog-page-subtitle{color:#888;margin:0 0 32px;font-size:1rem}.blog-list{flex-direction:column;gap:20px;display:flex}.blog-card{background:#fff;border:1px solid #eee;border-radius:12px;transition:box-shadow .2s,transform .2s;overflow:hidden}.blog-card:hover{transform:translateY(-2px);box-shadow:0 4px 20px #00000014}.blog-card a{padding:24px;text-decoration:none;display:block}.blog-card-title{color:#1a1a1a;margin:0 0 8px;font-size:1.25rem;line-height:1.5}.blog-card-desc{color:#555;margin:0 0 12px;font-size:.9rem;line-height:1.6}.blog-card-meta{color:#999;gap:16px;font-size:.82rem;display:flex}.blog-footer{text-align:center;color:#999;border-top:1px solid #eee;padding:24px;font-size:.85rem}@media (max-width:600px){.blog-main{padding:24px 16px}.blog-page-title{font-size:1.5rem}}