/*
Theme Name: PEICircle
Theme URI: https://peicircle.com
Author: PEICircle
Description: 岛民圈 PEI 华人社区主题
Version: 1.0
*/


/* ======================
   基础设置
====================== */


body {

    margin:0;

    padding:0;

    font-family:
    "Microsoft YaHei",
    Arial,
    sans-serif;

    background:#ffffff;

    color:#333;

}



a {

    text-decoration:none;


    color:#1a365d;

}


/* ======================
   网站整体宽度
====================== */


.site-header,
.homepage,
.site-main {

    max-width:1200px;

    margin:0 auto;

    padding:0 20px;

}



/* ======================
   Logo
====================== */


.custom-logo-link img,
.custom-logo {

    max-height:70px !important;

    width:auto !important;

}



/* ======================
   顶部区域
====================== */


.site-header {

    padding:15px 0;

}



/* ======================
   首页欢迎区域
====================== */


.hero {


    background:

    linear-gradient(
    135deg,
    #0077b6,
    #90e0ef
    );


    color:white;


    padding:60px 30px;


    border-radius:20px;


    text-align:center;


    margin-bottom:40px;


}



.hero h1 {

    font-size:38px;

    margin-bottom:15px;

}



.hero p {

    font-size:18px;

}



/* ======================
   栏目卡片布局
====================== */


.category-grid {


    display:grid;


    grid-template-columns:
    repeat(3,1fr);


    gap:25px;


    margin-bottom:50px;


}



/* ======================
   卡片基础
====================== */


.category-box {


    background:#ffffff;


    padding:30px 20px;


    border-radius:16px;


    text-align:center;


    box-shadow:
    0 4px 15px rgba(0,0,0,0.08);


    transition:
    all 0.3s ease;


    border-top:
    5px solid #0077b6;


}



/* 鼠标经过 */


.category-box:hover {


    transform:
    translateY(-8px);


    box-shadow:
    0 12px 30px rgba(0,0,0,0.15);


}



/* 标题 */


.category-box h2 {


    font-size:22px;


    color:#1a365d;


    margin-top:0;


}



/* 描述 */


.category-box p {


    color:#666;


    line-height:1.6;


}



/* ======================
   海岛主题颜色
====================== */


/* 本地资讯 */

.category-box:nth-child(1){

    border-top-color:#0077b6;

}


/* 岛民论坛 */

.forum-box {

    border-top-color:#e76f51;

}



/* 房屋 */

.category-box:nth-child(3){

    border-top-color:#d4a373;

}



/* 工作 */

.category-box:nth-child(4){

    border-top-color:#d62828;

}



/* 二手 */

.category-box:nth-child(5){

    border-top-color:#588157;

}



/* 活动 */

.category-box:nth-child(6){

    border-top-color:#f4a261;

}



/* ======================
   最新资讯
====================== */


.latest-posts {


    margin-top:40px;


}



.latest-posts h2 {


    font-size:28px;


}



.post-item {


    padding:15px 0;


    border-bottom:1px solid #eee;


}




/* ======================
   手机适配
====================== */


@media(max-width:768px){


.category-grid{


    grid-template-columns:1fr;


}


.hero h1{


    font-size:28px;


}


}
/* 社区栏目布局 */

.community-grid {

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}


/* 社区栏目卡片 */

.community-box {

background:white;

padding:25px;

border-radius:16px;

box-shadow:0 5px 18px rgba(0,0,0,0.08);

}



.community-box h2 {

color:#1a365d;

}



.community-box ul {

padding-left:20px;

}



.community-box li {

margin:10px 0;

}



@media(max-width:768px){

.community-grid{

grid-template-columns:1fr;

}

}
/* 首页栏目链接 */

.community-box h2 a {

color:#1a365d;

text-decoration:none;

}


.community-box h2 a:hover {

color:#0077b6;

}


/* 查看更多按钮 */

.more-link {

display:inline-block;

margin-top:15px;

color:#0077b6;

font-size:14px;

}


.more-link:hover {

text-decoration:underline;

}
/* 分类页面 */


.category-page {

max-width:900px;

margin:40px auto;

padding:0 20px;

}



.category-header {

background:#f5f9fb;

padding:30px;

border-radius:16px;

margin-bottom:30px;

}



.category-header h1 {

font-size:32px;

color:#1a365d;

}



.category-post {

background:white;

padding:25px;

margin-bottom:20px;

border-radius:15px;

box-shadow:
0 4px 15px rgba(0,0,0,0.08);

}



.category-post h2 a {

color:#1a365d;

}



.post-meta {

font-size:14px;

color:#888;

margin:10px 0;

}



.read-more {

color:#0077b6;

}
/* 文章详情页 */


.single-page {

max-width:900px;

margin:40px auto;

padding:0 20px;

}



.single-post {


background:white;


padding:35px;


border-radius:18px;


box-shadow:
0 5px 20px rgba(0,0,0,0.08);


}



.single-header h1 {


font-size:36px;


color:#1a365d;


margin-bottom:20px;


}



.single-meta {


color:#777;


font-size:14px;


display:flex;


gap:20px;


margin-bottom:30px;


}



.single-content {


font-size:18px;


line-height:1.8;


}



.single-footer {


margin-top:30px;


padding-top:20px;


border-top:1px solid #eee;


color:#555;


}
/* =========================
   首页社区栏目卡片
========================= */


.community-grid {

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

    max-width:1200px;

    margin:40px auto;

    padding:0 20px;

}



.community-box {


    background:#ffffff;


    padding:30px;


    border-radius:18px;


    box-shadow:
    0 5px 20px rgba(0,0,0,0.08);


    border-top:5px solid #0077b6;


    transition:all 0.3s ease;


}



.community-box:hover {


    transform:translateY(-8px);


    box-shadow:
    0 12px 30px rgba(0,0,0,0.15);


}



.community-box h2 {


    margin-top:0;


    font-size:24px;


}



.community-box h2 a {


    color:#1a365d;

    text-decoration:none;

}



.community-box h2 a:hover {


    color:#0077b6;

}



.community-box p {


    color:#666;

    margin-bottom:20px;

}



.community-box ul {


    padding-left:20px;

}



.community-box li {


    margin:10px 0;


}



.community-box li a {


    color:#333;


}



.more-link {


    display:inline-block;

    margin-top:15px;

    color:#0077b6;

}



@media(max-width:768px){


.community-grid{


grid-template-columns:1fr;


}


}