/* --- 全局设置 --- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: #F8F8F0; /* 米白色背景 */
    color: #4A4A4A; /* 深灰色文字 */
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue",
                 "Hiragino Sans GB", "Microsoft YaHei", "Arial", sans-serif;
    line-height: 1.7;
    overflow-x: hidden;
}

/* 定义抹茶绿色变量 */
:root {
    --matcha-green: #87A96B; /* 主色调：柔和的抹茶绿 */
    --light-matcha-bg: #E8F0E1; /* 浅抹茶色背景 */
    --dark-green-text: #3B5C2C; /* 深绿色文字，用于强调 */
    --link-green: #6B8E23; /* 链接颜色：稍亮的橄榄绿 */
}

a {
    color: var(--link-green);
    text-decoration: none;
    transition: color 0.3s ease, opacity 0.3s ease;
}
a:hover {
    opacity: 0.8;
}

/* --- 导航栏 (浅色雅致版) --- */
.main-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: rgba(248, 248, 240, 0.85); /* 米白色半透明背景 */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 1000;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08); /* 浅灰色边框 */
}
.nav-content {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.nav-brand {
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    text-decoration: none;
}
.nav-links {
    list-style: none;
    display: flex;
}
.nav-links li {
    margin-left: 30px;
}
.nav-links a {
    color: #555;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.3s ease;
}
.nav-links a:hover {
    color: var(--matcha-green); /* 悬停变抹茶绿 */
}


/* --- 主内容区 --- */
main {
    position: relative;
    z-index: 1;
}

/* --- 通用 Section 样式 --- */
section {
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 100px 20px; /* 上下边距减小 */
    text-align: center;
    position: relative;
    z-index: 1;
}
/* 交替浅抹茶色背景 */
section:nth-of-type(odd):not(#hero) { /* About 和 Contact */
     background-color: #fff; /* 白色 */
}
section:nth-of-type(even) { /* Work */
     background-color: var(--light-matcha-bg);
}

section h2 { /* 板块标题 */
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 40px;
    color: var(--dark-green-text); /* 深绿色标题 */
}


/* --- Section 1: Hero --- */
.hero {
    min-height: 100vh;
    /* 柔和的抹茶色渐变或纹理背景 */
    background: linear-gradient(135deg, #F0FFF0 0%, #D8E8D0 100%); 
    color: #333;
    z-index: 2;
}
.hero h1 { /* 姓名 */
    font-size: 3rem;
    font-weight: 700;
    color: #2F4F4F; /* 暗灰绿色 */
    margin-bottom: 5px;
}
.hero h2 { /* 职位 */
    font-size: 1.3rem;
    font-weight: 400;
    color: #556B2F; /* 暗橄榄绿 */
    margin-bottom: 20px;
}
.hero-slogan { /* Slogan */
    font-size: 1.1rem;
    color: var(--matcha-green); /* 抹茶绿 */
    max-width: 500px;
    font-style: italic;
}
/* 向下滚动提示 */
.scroll-down-prompt {
    position: absolute;
    bottom: 30px;
    color: rgba(0,0,0,0.3);
    font-size: 1.5rem;
    animation: bounce-gentle 2s infinite;
}
@keyframes bounce-gentle { /* 更柔和的弹跳 */
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-6px); }
    60% { transform: translateY(-3px); }
}


/* --- Section 2: About Me --- */
.about-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 750px;
    gap: 30px;
}
.about-text {
    text-align: center; /* 居中或左对齐均可 */
    color: #555;
    line-height: 1.8;
}
.about-text p {
    margin-bottom: 1.2em;
    font-size: 1.05rem;
}
/* 技能标签 (抹茶版) */
.skills {
    margin-top: 20px;
}
.skills span {
    display: inline-block;
    background: var(--light-matcha-bg); /* 浅抹茶背景 */
    color: var(--dark-green-text); /* 深绿文字 */
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 15px;
    margin: 5px;
    font-weight: 500;
    border: 1px solid rgba(135, 169, 107, 0.3); /* 淡淡的边框 */
}


/* --- Section 3: Work --- */
.project-card {
    max-width: 800px;
    background: #fff; /* 白色卡片 */
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(135, 169, 107, 0.15); /* 抹茶色阴影 */
    overflow: hidden;
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.project-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 35px rgba(135, 169, 107, 0.25);
}
.project-link { display: block; }
.project-visual img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.project-details {
    padding: 30px;
}
.project-details h3 { /* 项目标题 */
    font-size: 1.6rem;
    color: #333;
    margin-bottom: 5px;
}
.project-details h4 { /* 职责 */
    font-size: 0.9rem;
    color: #888;
    margin-bottom: 15px;
    font-weight: 400;
}
.project-contribution { /* 贡献描述 */
    font-size: 1rem;
    color: #555;
    margin-bottom: 20px;
    font-style: italic;
}
.project-cta { /* 跳转提示 */
    font-size: 1rem;
    font-weight: 500;
    color: var(--link-green);
}
.project-team-link { /* 团队链接 */
    text-align: center;
    margin-top: 25px;
    font-size: 0.9rem;
}
.project-team-link a { color: #888; }


/* --- Section 4: Contact --- */
.contact { min-height: 60vh; }
.contact-intro {
    color: #666;
    margin-bottom: 30px;
    max-width: 500px;
}
.contact-methods {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    margin-bottom: 30px;
}
.contact-email a {
    font-size: 1.3rem;
    font-weight: 500;
    color: #333; /* 深灰色邮箱 */
}
.team-contact-link {
    color: #888;
    font-size: 0.9rem;
}
.team-contact-link a { color: #666; text-decoration: underline; }


/* --- Footer --- */
.footer {
    padding: 25px 20px;
    text-align: center;
    background: var(--light-matcha-bg); /* 浅抹茶页脚 */
    color: #aaa;
    font-size: 0.85rem;
    position: relative;
    z-index: 10;
}
.footer p { margin: 3px 0; }
.footer a { color: #aaa; }
.footer a:hover { color: var(--matcha-green); }

/* --- V6.0 滚动淡入动画 (复用主站, 曲线可调整) --- */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}


/* --- 响应式设计 --- */
@media (max-width: 768px) {
    .nav-links { display: none; }
    .hero h1 { font-size: 2.2rem; }
    .hero h2 { font-size: 1.1rem; }
    .hero-slogan { font-size: 1rem; }
    section h2 { font-size: 1.8rem; }
    .about-text p { font-size: 0.95rem; }
    .project-visual img { height: 250px; }
    .project-details { padding: 25px; }
    .project-details h3 { font-size: 1.4rem; }
}