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

html {
    scroll-behavior: smooth;
}

/* V1.0 颜色变量定义 */
:root {
    --rice-paper: #FDFBF5; /* 主背景：米白/宣纸白 */
    --ink-black: #333333; /* 主要文字：墨黑 */
    --ink-gray: #5A5A5A; /* 次要文字：墨灰 */
    --seal-red: #A73737; /* 强调色：印章红 */
    --light-gray-wash: #EAEAEA; /* 浅墨灰背景/边框 */
    /* (可选: 雅致蓝 --scholar-blue: #34568B;) */
}

body {
    background-color: var(--rice-paper);
    color: var(--ink-black);
    /* (可选: 引入中文字体) */
    font-family: /*"Noto Serif SC",*/ -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", "Arial", sans-serif;
    line-height: 1.8; /* 增加行高，营造书卷气 */
    overflow-x: hidden;
}

a {
    color: var(--seal-red); /* 链接用印章红 */
    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(253, 251, 245, 0.85); /* 米白半透明 */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 1000;
    border-bottom: 1px solid var(--light-gray-wash); /* 浅墨灰边框 */
}
.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: var(--ink-black);
    text-decoration: none;
    /* font-family: 'Noto Serif SC', serif; */ /* 可选用衬线体 */
}
.nav-links {
    list-style: none;
    display: flex;
}
.nav-links li {
    margin-left: 30px;
}
.nav-links a {
    color: var(--ink-gray);
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.3s ease;
}
.nav-links a:hover {
    color: var(--ink-black);
}

/* --- 主内容区 --- */
main {
    padding-top: 60px; /* 导航栏高度 */
    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(even):not(#hero) { /* About 和 Contact */
     background-color: #fff; /* 纯白 */
}
section:nth-of-type(odd) { /* Work */
     background-color: rgba(234, 234, 234, 0.3); /* 极淡的墨灰 */
     /* border-top: 1px solid var(--light-gray-wash); */
     /* border-bottom: 1px solid var(--light-gray-wash); */
}

section h2 { /* 板块标题 */
    font-size: 2rem; /* 标题稍小，更雅致 */
    font-weight: 700;
    margin-bottom: 40px;
    color: var(--ink-black);
    /* font-family: 'Noto Serif SC', serif; */ /* 可选用衬线体 */
}


/* --- Section 1: Hero --- */
.hero {
    min-height: calc(100vh - 60px);
    background-color: var(--rice-paper); /* 保持米白 */
    /* (可选: 添加宣纸纹理背景图) */
    /* background-image: url('rice-paper-texture.png'); */
    color: var(--ink-black);
    z-index: 2;
    display: flex; /* 使用 flex 布局实现左右结构 */
    justify-content: center;
    align-items: center;
}
.hero-content {
    display: flex;
    align-items: center;
    gap: 40px; /* 竖排名字和右侧内容的间距 */
}
.hero-title { /* 姓名 (竖排) */
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--ink-black);
    writing-mode: vertical-rl; /* 核心：文字竖排 */
    text-orientation: mixed;
    letter-spacing: 0.2em; /* 增加字间距 */
    line-height: 1; /* 确保文字紧凑 */
    opacity: 0;
    animation: fadeInVertical 1.5s 0.5s forwards cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hero-details {
    text-align: left; /* 右侧内容左对齐 */
}
.hero-details h2 { /* 职位 */
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--ink-gray);
    margin-bottom: 20px;
    opacity: 0;
    animation: fadeInSlide 1s 0.8s forwards cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hero-details .hero-slogan { /* Slogan */
    font-size: 1.2rem;
    color: var(--seal-red); /* 印章红 */
    max-width: 400px; /* 限制宽度 */
    font-style: normal; /* 去掉斜体 */
    opacity: 0;
    animation: fadeInSlide 1s 1.1s forwards cubic-bezier(0.2, 0.8, 0.2, 1);
    /* font-family: 'Noto Serif SC', serif; */ /* 可选用衬线体 */
}
/* 向下滚动提示 (毛笔字风格) */
.scroll-down-prompt {
    position: absolute;
    bottom: 30px;
    color: rgba(0,0,0,0.3);
    animation: bounce-gentle 2s infinite;
}
.brush-stroke-arrow {
    font-size: 1.8rem;
    font-family: cursive; /* 简单模拟毛笔字风格 */
}
@keyframes bounce-gentle {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-6px); }
    60% { transform: translateY(-3px); }
}
/* Hero 入场动画 */
@keyframes fadeInVertical {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}
@keyframes fadeInSlide {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- Section 2: About Me --- */
.about { background-color: #fff; }
.about-content {
    max-width: 700px; /* 文本宽度控制 */
    position: relative; /* 为分割线定位 */
    z-index: 1;
}
.about h2 { margin-bottom: 20px; }
/* 优雅的分割线 */
.divider {
    width: 80px;
    height: 1px;
    background-color: var(--seal-red);
    margin: 0 auto 40px; /* 标题下方居中 */
}
.about-text p {
    margin-bottom: 1.5em;
    font-size: 1.05rem;
    color: var(--ink-gray);
    text-align: justify; /* 两端对齐，更具书卷气 */
}
/* 技能标签 (墨灰版) */
.skills {
    margin-top: 30px;
    text-align: center;
}
.skills span {
    display: inline-block;
    background: #fff;
    color: var(--ink-gray);
    font-size: 0.8rem;
    padding: 6px 14px;
    border-radius: 4px; /* 方形标签 */
    margin: 5px;
    font-weight: 400;
    border: 1px solid var(--light-gray-wash); /* 浅灰边框 */
}


/* --- Section 3: Work --- */
.work { background-color: var(--light-gray-wash); }
.work-grid {
    width: 100%;
    max-width: 800px; /* 单个作品可以更聚焦 */
    display: grid;
    grid-template-columns: 1fr; /* 始终单列 */
    gap: 30px;
    position: relative;
    z-index: 2;
}
/* 项目卡片 (宣纸风格) */
.work-card {
    display: block;
    background: var(--rice-paper); /* 米白背景 */
    border-radius: 8px; /* 稍小圆角 */
    border: 1px solid #DCDCDC; /* 浅灰边框 */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); /* 更轻的阴影 */
    overflow: hidden;
    text-decoration: none;
    color: var(--ink-black);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.work-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}
.card-visual img {
    display: block;
    width: 100%;
    height: 300px; /* 固定图片高度 */
    object-fit: cover;
    /* border-bottom: 1px solid var(--light-gray-wash); */ /* 图片下方分割线 */
}
.card-details {
    padding: 25px;
    text-align: left;
}
.card-details h3 { /* 项目标题 */
    font-size: 1.5rem; /* 稍小 */
    color: var(--ink-black);
    margin-bottom: 5px;
    /* font-family: 'Noto Serif SC', serif; */
}
.card-details h4 { /* 职责 */
    font-size: 0.9rem;
    color: var(--ink-gray);
    margin-bottom: 15px;
    font-weight: 400;
}
.card-contribution { /* 贡献描述 */
    font-size: 0.95rem; /* 稍小 */
    color: var(--ink-gray);
    margin-bottom: 20px;
    font-style: normal; /* 去掉斜体 */
}
.card-cta { /* 跳转提示 */
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--seal-red); /* 印章红 */
}
.project-team-link {
    text-align: center;
    margin-top: 30px;
    font-size: 0.9rem;
}
.project-team-link a { color: var(--ink-gray); }


/* --- Section 4: Contact --- */
.contact { min-height: auto; padding-bottom: 80px; background-color: #fff; }
.contact-intro {
    color: var(--ink-gray);
    margin-bottom: 30px;
    max-width: 500px;
}
.contact-methods {
    display: flex; flex-direction: column; align-items: center;
    gap: 20px; margin-bottom: 30px;
}
.contact-email a {
    font-size: 1.2rem; /* 邮箱字号 */
    font-weight: 400;
    color: var(--ink-black); /* 墨黑 */
    border-bottom: 1px solid transparent; /* 准备悬停下划线 */
    transition: border-color 0.3s ease;
}
.contact-email a:hover {
    border-bottom-color: var(--seal-red); /* 悬停时出现红线 */
}
.team-contact-link {
    color: #aaa; /* 更浅的灰 */
    font-size: 0.85rem;
}
.team-contact-link a { color: var(--ink-gray); text-decoration: underline; }


/* --- Footer (宣纸风格) --- */
.footer {
    padding: 25px 20px;
    text-align: center;
    background: var(--rice-paper); /* 米白 */
    color: #aaa; /* 浅灰 */
    font-size: 0.85rem;
    position: relative;
    z-index: 10;
    border-top: 1px solid var(--light-gray-wash); /* 浅灰上边框 */
}
.footer p { margin: 3px 0; }
.footer a { color: #aaa; }
.footer a:hover { color: var(--ink-black); }
/* (可选印章) */
/* .seal-icon { ... } */

/* --- V6.0 滚动淡入动画 (复用主站, 可调整曲线) --- */
.fade-in {
    opacity: 0;
    transform: translateY(20px); /* 更小的位移 */
    transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1.2s 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-content { flex-direction: column; gap: 20px; } /* Hero 手机端改为上下结构 */
    .hero-title { writing-mode: horizontal-tb; text-align: center; font-size: 2.5rem; letter-spacing: 0;} /* 名字恢复横排 */
    .hero-details { text-align: center; }
    .hero-details h2 { font-size: 1.1rem; }
    .hero-slogan { font-size: 1rem; }
    section h2 { font-size: 1.8rem; }
    .about-text p { font-size: 0.95rem; text-align: left;} /* About 文本左对齐 */
    .card-visual img { height: 250px; }
    .card-details { padding: 20px; }
    .card-details h3 { font-size: 1.3rem; }
    .contact-email a { font-size: 1.1rem; }
}