.hero-section{background:linear-gradient(135deg,#1a5276,#2e86c1);color:#fff;padding:60px 20px;text-align:center}
.hero-section h1{font-size:2rem;margin-bottom:16px;font-weight:bold;color:#fff}
.hero-section p{font-size:1.1rem;opacity:.9}
.reform-category-section,.area-section,.latest-posts-section{padding:50px 20px}
.reform-category-section h2,.area-section h2,.latest-posts-section h2{font-size:1.6rem;font-weight:bold;margin-bottom:30px;padding-bottom:10px;border-bottom:3px solid #2e86c1}
.category-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;list-style:none;padding:0}
.category-card{display:flex;flex-direction:column;align-items:center;padding:20px 10px;background:#f4f6f9;border-radius:8px;text-decoration:none;color:#333;border:1px solid #e0e0e0;transition:all .2s}
.category-card:hover{background:#2e86c1;color:#fff;transform:translateY(-3px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.category-icon{font-size:2rem;margin-bottom:8px;display:block}
.category-label{font-size:.95rem;font-weight:bold;margin-bottom:4px;display:block}
.category-count{font-size:.8rem;opacity:.7;display:block}
.area-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.area-card{display:flex;flex-direction:column;align-items:center;padding:16px 10px;background:#eaf4fb;border-radius:8px;text-decoration:none;color:#1a5276;border:1px solid #aed6f1;transition:all .2s}
.area-card:hover{background:#1a5276;color:#fff;transform:translateY(-3px)}
.area-name{font-size:1rem;font-weight:bold;margin-bottom:4px;display:block}
.area-count{font-size:.8rem;opacity:.7;display:block}
.posts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.post-card{background:#fff;border-radius:8px;overflow:hidden;border:1px solid #e0e0e0;transition:box-shadow .2s}
.post-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.12)}
.post-thumbnail img{width:100%;height:180px;object-fit:cover;display:block}
.post-content{padding:16px}
.post-content h3{font-size:.95rem;margin-bottom:8px}
.post-content h3 a{color:#333;text-decoration:none}
.post-content h3 a:hover{color:#2e86c1}
.post-content time{font-size:.8rem;color:#999}
.more-link{text-align:center;margin-top:30px}
.more-link a{display:inline-block;padding:12px 40px;background:#2e86c1;color:#fff;border-radius:4px;text-decoration:none;font-weight:bold}
@media(max-width:768px){.hero-section h1{font-size:1.4rem}.category-grid{grid-template-columns:repeat(3,1fr)}.area-grid{grid-template-columns:repeat(3,1fr)}.posts-grid{grid-template-columns:1fr}}