/* 
Theme Name: 分类网格SEO模板 
Theme URI: https://你的站点地址 
Description: 首页最新+分类网格布局，符合使用习惯 
Version: 1.0 
License: GPL v2 
Tags: 分类网格, 左侧边栏, SEO, 清爽 
Text Domain: cg-blog 
*/ 
 
* {margin:0;padding:0;box-sizing:border-box} 
:root { 
    --cg-bg: #f5f7fa; 
    --cg-card: #fff; 
    --cg-text: #2c3e50; 
    --cg-gray: #7f8c8d; 
    --cg-primary: #3498db; 
    --cg-border: #e3e6ea; 
    --cg-radius: 6px; 
} 
body { 
    font-family: "PingFang SC", "Microsoft Yahei", sans-serif; 
    background: var(--cg-bg); 
    color: var(--cg-text); 
    line-height: 1.7; 
    font-size: 16px; 
} 
a {color: var(--cg-primary);text-decoration:none} 
a:hover {color: #2980b9} 
img {max-width:100%;height:auto;border-radius:var(--cg-radius)} 
 
/* 全局容器 */ 
.cg-container {max-width:1200px;margin:0 auto;padding:0 20px} 
 
/* 核心布局：左侧边栏280px，右侧主内容自适应 */ 
.cg-wrap { 
    display: grid; 
    grid-template-columns: 280px 1fr; 
    gap: 2rem; 
    padding: 2rem 0; 
} 
.cg-main {order:2} 
.cg-sidebar { 
    order:1; 
    position: sticky; 
    top: 2rem; 
    align-self: flex-start; 
} 
 
/* 侧边栏模块 */ 
.cg-site-card { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    border-radius: var(--cg-radius); 
    padding: 1.5rem; 
    text-align: center; 
    margin-bottom: 1.5rem; 
    border-top: 3px solid var(--cg-primary); 
} 
.cg-site-name {font-size:1.3rem;font-weight:700;margin-bottom:0.5rem;color:var(--cg-text)} 
.cg-site-desc {color:var(--cg-gray);font-size:0.9rem;margin-bottom:1rem} 
.cg-social {display:flex;justify-content:center;gap:0.8rem} 
.cg-social a { 
    width: 36px; 
    height: 36px; 
    border-radius: 50%; 
    background: var(--cg-bg); 
    display: flex; 
    align-items: center; 
    justify-content: center; 
} 
.cg-social a:hover {background:var(--cg-primary);color:#fff} 
 
.cg-widget { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    border-radius: var(--cg-radius); 
    padding: 1.2rem; 
    margin-bottom: 1.2rem; 
} 
.cg-widget-title { 
    font-size: 1.1rem; 
    font-weight: 600; 
    margin-bottom: 1rem; 
    padding-left: 0.5rem; 
    border-left: 3px solid var(--cg-primary); 
} 
.cg-widget ul {list-style:none} 
.cg-widget ul li {margin-bottom:0.3rem} 
.cg-widget ul li a { 
    display: block; 
    padding: 0.6rem 1rem; 
    border-radius: 4px; 
    color: var(--cg-text); 
    border-left: 3px solid transparent; 
} 
.cg-widget ul li a:hover, 
.cg-widget ul li.current-menu-item a, 
.cg-widget ul li.current-cat a { 
    background: rgba(52, 152, 219, 0.08); 
    border-left-color: var(--cg-primary); 
    color: var(--cg-primary); 
} 
 
/* 面包屑 */ 
.cg-breadcrumb { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    padding: 0.6rem 1rem; 
    border-radius: var(--cg-radius); 
    font-size: 0.9rem; 
    color: var(--cg-gray); 
    margin-bottom: 1.5rem; 
} 
 
/* 通用模块标题 */ 
.cg-section-title { 
    font-size: 1.4rem; 
    font-weight: 600; 
    margin-bottom: 1.5rem; 
    padding-bottom: 0.5rem; 
    border-bottom: 2px solid var(--cg-primary); 
    display: inline-block; 
} 
 
/* 最新文章列表样式 */ 
.cg-post-list { 
    counter-reset: post-num; 
    display: flex; 
    flex-direction: column; 
    gap: 1rem; 
    margin-bottom: 3rem; 
} 
.cg-post-item { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    border-radius: var(--cg-radius); 
    padding: 1.5rem; 
    padding-left: 3.5rem; 
    position: relative; 
    counter-increment: post-num; 
} 
.cg-post-item::before { 
    content: counter(post-num); 
    position: absolute; 
    left: 1rem; 
    top: 50%; 
    transform: translateY(-50%); 
    width: 2rem; 
    height: 2rem; 
    border-radius: 50%; 
    background: var(--cg-primary); 
    color: #fff; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    font-weight: 700; 
    font-size: 0.9rem; 
} 
.cg-post-item:hover {border-color: var(--cg-primary)} 
.cg-post-title {font-size:1.2rem;font-weight:600;margin-bottom:0.8rem} 
.cg-post-excerpt {color:var(--cg-gray);font-size:0.95rem;margin-bottom:1rem;line-height:1.7} 
.cg-post-meta { 
    font-size: 0.85rem; 
    color: var(--cg-gray); 
    display: flex; 
    gap: 1.5rem; 
    padding-top: 0.8rem; 
    border-top: 1px dashed var(--cg-border); 
} 
.cg-post-meta span:first-child::before {content:'📅 '} 
.cg-post-meta span:nth-child(2)::before {content:'📂 '} 
.cg-post-meta span:nth-child(3)::before {content:'👁️ '} 
 
/* 分类网格布局：3个一排 */ 
.cg-category-grid { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: 1.5rem; 
} 
.cg-category-card { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    border-radius: var(--cg-radius); 
    padding: 1.2rem; 
} 
.cg-category-card:hover {border-color: var(--cg-primary)} 
.cg-category-card-title { 
    font-size: 1.1rem; 
    font-weight: 600; 
    margin-bottom: 1rem; 
    padding-bottom: 0.5rem; 
    border-bottom: 1px solid var(--cg-border); 
} 
.cg-category-card-title a {color: var(--cg-text)} 
.cg-category-card-title a:hover {color: var(--cg-primary)} 
.cg-category-posts {list-style:none} 
.cg-category-posts li { 
    margin-bottom: 0.6rem; 
    padding-left: 0.8rem; 
    position: relative; 
    font-size: 0.95rem; 
} 
.cg-category-posts li::before { 
    content: '·'; 
    position: absolute; 
    left: 0; 
    color: var(--cg-primary); 
    font-weight: 700; 
} 
.cg-category-posts li a { 
    color: var(--cg-text); 
    display: block; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
} 
.cg-category-posts li a:hover {color: var(--cg-primary)} 
 
/* 文章详情页 */ 
.cg-single { 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
    border-radius: var(--cg-radius); 
    padding: 2rem; 
} 
.cg-single-title {font-size:1.8rem;margin-bottom:1rem;line-height:1.4} 
.cg-single-meta { 
    color: var(--cg-gray); 
    margin-bottom: 1.5rem; 
    padding-bottom: 1rem; 
    border-bottom: 1px solid var(--cg-border); 
} 
.cg-single-content {line-height:1.8} 
.cg-single-content h2, .cg-single-content h3 {margin:1.5rem 0 1rem 0;font-weight:600} 
.cg-single-content p {margin-bottom:1rem} 
.cg-page-nav { 
    margin-top: 2rem; 
    padding-top: 1rem; 
    border-top: 1px solid var(--cg-border); 
    color: var(--cg-gray); 
    font-size: 0.95rem; 
} 
 
/* 分页 */ 
.cg-pagination { 
    display: flex; 
    gap: 0.5rem; 
    justify-content: center; 
    margin-top: 2rem; 
} 
.cg-pagination a, .cg-pagination span { 
    padding: 0.4rem 0.8rem; 
    border-radius: var(--cg-radius); 
    background: var(--cg-card); 
    border: 1px solid var(--cg-border); 
} 
.cg-pagination .current { 
    background: var(--cg-primary); 
    color: #fff; 
    border-color: var(--cg-primary); 
} 
 
/* 底部 */ 
.cg-footer { 
    background: var(--cg-card); 
    border-top: 1px solid var(--cg-border); 
    padding: 1.5rem 0; 
    text-align: center; 
    color: var(--cg-gray); 
    font-size: 0.9rem; 
} 
 
/* 移动端适配 */ 
@media (max-width:992px) { 
    .cg-wrap {grid-template-columns:1fr} 
    .cg-main, .cg-sidebar {order:unset} 
    .cg-sidebar {position:static} 
    .cg-category-grid {grid-template-columns:1fr} 
}