/*
Theme Name: FreshArt Blog
Theme URI: #
Description: 全新代码双栏自适应SEO博客 | 首页相关5竖排 | 文章相关6横排
Version: 3.0
Author: Custom Code
Text Domain: freshart-blog
*/

* {margin:0;padding:0;box-sizing:border-box;}
body {
    font-family: "PingFang SC","Microsoft YaHei",sans-serif;
    background:#f4f6f9;
    color:#333;
    line-height:1.75;
}
a {color:#222;text-decoration:none;transition:all .25s ease;}
a:hover {color:#2563eb;}
img {max-width:100%;height:auto;border-radius:10px;display:block;}
ul {list-style:none;}
.container {max-width:1200px;margin:0 auto;padding:0 16px;}

/* 头部导航 */
.site-header {
    background:#fff;
    box-shadow:0 2px 12px rgba(0,0,0,.06);
    padding:20px 0;
    position:sticky;top:0;z-index:999;
}
.head-wrap {display:flex;justify-content:space-between;align-items:center;}
.blog-logo {font-size:28px;font-weight:bold;color:#2563eb;}
.main-nav ul {display:flex;gap:28px;}
.main-nav a {font-size:15px;padding:4px 0;position:relative;}
.main-nav a::after{content:"";width:0;height:2px;background:#2563eb;position:absolute;left:0;bottom:0;transition:.3s;}
.main-nav a:hover::after{width:100%;}

/* 主体双栏 */
.site-main {padding:40px 0;}
.main-grid {display:flex;gap:35px;align-items:start;}
.content-left {flex:1;}
.sidebar-right {width:300px;}

/* 首页文章卡片 */
.home-post {
    background:#fff;border-radius:14px;padding:24px;margin-bottom:28px;
    box-shadow:0 4px 16px rgba(0,0,0,.05);
}
.post-thumb img {width:100%;height:170px;object-fit:cover;border-radius:10px;margin-bottom:18px;}
.post-title-h2 {font-size:22px;margin-bottom:10px;font-weight:600;}
.post-meta {font-size:13px;color:#888;margin-bottom:14px;}
.post-excerpt {color:#555;font-size:15px;}
.readmore {display:inline-block;margin-top:16px;padding:7px 20px;background:#2563eb;color:#fff;border-radius:30px;font-size:14px;}
.readmore:hover {background:#1d4ed8;color:#fff;}

/* 分页 */
.pagination {display:flex;justify-content:center;gap:8px;margin:40px 0;}
.pagination a,.pagination span {padding:9px 15px;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.05);}
.pagination .current {background:#2563eb;color:#fff;}

/* 文章单页 */
.single-box {background:#fff;border-radius:14px;padding:35px;box-shadow:0 4px 16px rgba(0,0,0,.05);}
.single-title {font-size:32px;margin-bottom:15px;border-left:4px solid #2563eb;padding-left:12px;}
.single-content {margin:30px 0;font-size:16px;line-height:1.9;}
.single-content p {margin-bottom:20px;}

/* 上下篇导航 */
.post-nav-box {display:flex;justify-content:space-between;background:#fff;padding:20px;border-radius:14px;margin:35px 0;}

/* 文章内：相关6篇横排 */
.related-6-title {font-size:20px;margin:40px 0 20px;padding-bottom:10px;border-bottom:2px solid #eee;}
.related-6-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.related-6-item {background:#f8f9fa;padding:15px;border-radius:10px;text-align:center;}

/* 首页底部：相关5篇竖排 */
.home-relate-5 {margin:50px 0;}
.home-relate-5 h3 {font-size:20px;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #eee;}
.home-relate-list li {padding:12px 15px;background:#fff;border-radius:10px;margin-bottom:12px;}

/* 侧边栏组件 */
.widget {background:#fff;border-radius:14px;padding:22px;margin-bottom:28px;box-shadow:0 4px 16px rgba(0,0,0,.05);}
.widget h4 {font-size:17px;margin-bottom:18px;padding-bottom:10px;border-bottom:2px solid #eee;position:relative;}
.widget h4::after{content:"";width:40px;height:2px;background:#2563eb;position:absolute;left:0;bottom:-2px;}
.widget li {padding:8px 0;border-bottom:1px dashed #eee;}
.widget li:last-child {border:none;}
.search-input {width:100%;padding:11px;border:1px solid #eee;border-radius:8px;outline:none;}

/* 底部 */
.site-footer {background:#1e293b;color:#fff;text-align:center;padding:35px 0;margin-top:40px;}

/* 移动端自适应 */
@media(max-width:992px){
    .main-grid {flex-direction:column;}
    .sidebar-right {width:100%;}
    .related-6-grid {grid-template-columns:repeat(2,1fr);}
    .single-title {font-size:24px;}
    .post-nav-box {flex-direction:column;gap:15px;}
}
@media(max-width:576px){
    .related-6-grid {grid-template-columns:1fr;}
    .main-nav ul {gap:15px;flex-wrap:wrap;justify-content:center;}
}