/* 基础样式 */
body {
    font-family: 'Segoe UI', sans-serif;
    line-height: 1.6;
    margin: 0; /* 确保 body 没有外边距 */
    padding: 0; /* 确保 body 没有内边距 */
    color: #333;
    background: #f5f5f5; /* 降低白色灰度 */
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

/* 头部样式 */
header {
    background: #2c3e50;
    color: #fff;
    padding: 0; /* 去掉内边距 */
    position: sticky;
    top: 0;
    z-index: 1000;
    height: 80px; /* 增加高度 */
    display: flex;
    align-items: center;
}

header h1 {
    margin: 0;
    float: left;
    font-size: 2rem; /* 增加字体大小 */
}

nav ul {
    list-style: none;
    float: right;
    margin: 0;
}

nav ul li {
    display: inline-block;
    margin-left: 15px; /* 减小间距 */
}

nav ul li a {
    text-decoration: none;
    color: white; /* 默认文字颜色为白色 */
    font-weight: bold;
    font-size: 20px; /* 增加字体大小 */
    padding: 10px 0; /* 内边距 */
    font-family: '黑体', 'SimHei', sans-serif; /* 设置字体为黑体 */
}

/* 英雄区域 */
.hero {
    background: #f5f5f5; /* 降低白色灰度 */
    color: #333; /* 文字颜色保持黑色 */
    padding: 80px 0; /* 保持内边距 */
    text-align: center;
}

.lab-branding {
    margin-bottom: 40px;
    display: flex;
    justify-content: center; /* 居中 */
}

.branding-content {
    position: relative;
    display: flex;
    align-items: center; /* 垂直居中 */
    justify-content: center; /* 水平居中 */
    padding: 10px; /* 减小内边距，使高度更紧凑 */
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 背景渐变 */
    border-radius: 15px; /* 圆角 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 0 20px rgba(255, 255, 255, 0.5) inset; /* 增加内阴影增强金属感 */
    z-index: 1;
    width: 90%; /* 恢复原始宽度 */
    max-width: 1200px; /* 最大宽度与容器一致 */
    margin: 0 auto; /* 居中 */
    height: auto; /* 自动高度，适应内容 */
    min-height: 80px; /* 设置最小高度，确保与文本框高度一致 */
    overflow: hidden; /* 隐藏伪元素溢出部分 */
}

.branding-content::before,
.branding-content::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 90%; /* 保持宽度 */
    height: 5px; /* 增加高度以增强曲度 */
    background: linear-gradient(145deg, rgba(74, 144, 226, 0.8), rgba(44, 62, 80, 0.8)); /* 半透明渐变 */
    z-index: -1;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); /* 增加光晕效果 */
}

.branding-content::before {
    top: -3px; /* 调整位置 */
    border-radius: 50% 50% 0 0; /* 曲度效果 */
}

.branding-content::after {
    bottom: -3px; /* 调整位置 */
    border-radius: 0 0 50% 50%; /* 曲度效果 */
}

/* 将图标尺寸调整为背景条高度的80% */
.branding-content .image-box {
    width: auto; /* 宽度自适应 */
    height: 80%; /* 高度为背景条的80% */
    aspect-ratio: 1 / 1; /* 保持1:1宽高比，确保圆形或盾牌形状 */
    border: 2px solid gold; /* 金色边框 */
    border-radius: 50%; /* 将图标裁剪成圆形 */
    background: radial-gradient(
        circle at 30% 30%, /* 光源位置 */
        rgba(255, 223, 0, 0.8), /* 高光 */
        rgba(218, 165, 32, 0.6), /* 中间色调 */
        rgba(184, 134, 11, 0.8) /* 阴影 */
    ); /* 径向渐变模拟金属光泽 */
    overflow: hidden; /* 确保图标内容被裁剪为圆形 */
    z-index: 0; /* 将图标放置在底层 */
    position: absolute; /* 使用绝对定位 */
    left: 50%; /* 水平居中 */
    top: 50%; /* 垂直居中 */
    transform: translate(-50%, -50%); /* 精确居中 */
    box-shadow: 
        0 0 10px rgba(255, 223, 0, 0.5), /* 内发光 */
        0 4px 10px rgba(0, 0, 0, 0.3); /* 外阴影 */
    animation: rotateAndScale 5s ease-in-out forwards; /* 动画只执行一次并保持最终状态 */
}

/* 定义动画 */
@keyframes rotateAndScale {
    0% {
        transform: translate(-50%, -50%) rotate(0deg) scale(1); /* 初始状态 */
    }
    50% {
        transform: translate(-50%, -50%) rotate(180deg) scale(1.2); /* 旋转180度并放大 */
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg) scale(1); /* 旋转360度并恢复原大小 */
    }
}

.branding-content .text-content {
    text-align: center; /* 文本居中 */
    z-index: 1; /* 确保文本内容在图标之上 */
    position: relative; /* 确保文本内容在图标之上 */
    padding: 0 20px; /* 保留左右内边距 */
    width: 80%; /* 保留宽度 */
    max-width: 800px; /* 保留最大宽度 */
    margin: -40px auto 0; /* 保留上移效果 */
    background: transparent; /* 移除背景 */
    border-radius: 0; /* 移除圆角 */
    box-shadow: none; /* 移除阴影 */
}

.branding-content .overlay-title {
    font-size: 56px;
    color: #fff;
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8);
    font-weight: bold;
    letter-spacing: 2px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: inherit; /* 恢复为默认字体 */
}

.branding-content .overlay-title span {
    display: inline-block; /* 每个字母独立动画 */
    opacity: 0; /* 初始状态为透明 */
    transform: translateY(-100vh); /* 初始位置在屏幕外 */
    animation: flyIn 1s ease-in-out forwards; /* 动画效果 */
}

/* 为每个字母设置不同的动画延迟 */
.branding-content .overlay-title span:nth-child(1) { animation-delay: 0.1s; }
.branding-content .overlay-title span:nth-child(2) { animation-delay: 0.2s; }
.branding-content .overlay-title span:nth-child(3) { animation-delay: 0.3s; }
.branding-content .overlay-title span:nth-child(4) { animation-delay: 0.4s; }
.branding-content .overlay-title span:nth-child(5) { animation-delay: 0.5s; }
.branding-content .overlay-title span:nth-child(6) { animation-delay: 0.6s; }
.branding-content .overlay-title span:nth-child(7) { animation-delay: 0.7s; }
.branding-content .overlay-title span:nth-child(8) { animation-delay: 0.8s; }
.branding-content .overlay-title span:nth-child(9) { animation-delay: 0.9s; }
.branding-content .overlay-title span:nth-child(10) { animation-delay: 1.0s; }
.branding-content .overlay-title span:nth-child(11) { animation-delay: 1.1s; }
.branding-content .overlay-title span:nth-child(12) { animation-delay: 1.2s; }
.branding-content .overlay-title span:nth-child(13) { animation-delay: 1.3s; }

/* 定义字母飞入动画 */
@keyframes flyIn {
    0% {
        opacity: 0;
        transform: translateY(-100vh) rotate(0deg) scale(0.5); /* 初始状态：屏幕外、旋转0度、缩小 */
    }
    50% {
        opacity: 1;
        transform: translateY(0) rotate(180deg) scale(1.2); /* 中间状态：旋转180度、放大 */
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotate(360deg) scale(1); /* 最终状态：旋转360度、恢复原大小 */
    }
}

/* 实验室简介部分 */
.lab-info h2 {
    font-size: 2.5rem; /* 增加标题字体大小 */
    margin-bottom: 30px; /* 保持间距 */
    text-align: center;
}

.lab-info .info-box {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 金属感蓝色渐变 */
    padding: 20px; /* 恢复原始内边距 */
    border-radius: 8px; /* 保持圆角 */
    line-height: 1.6; /* 保持行高 */
    text-align: justify;
    width: 100%; /* 恢复原始宽度 */
    max-width: 1200px; /* 恢复原始最大宽度 */
    color: #fff; /* 文字颜色改为白色 */
    margin: 0 auto; /* 居中 */
}

/* 学术快讯部分 */
.research-news h2 {
    font-size: 1.8rem; /* 恢复原始标题字体大小 */
    margin-bottom: 30px; /* 保持间距 */
    text-align: center;
}

.research-news .news-grid {
    display: flex;
    flex-direction: column; /* 确保垂直排列 */
    gap: 20px; /* 恢复原始间距 */
    justify-content: center; /* 水平居中 */
    align-items: center; /* 垂直居中 */
}

.research-news .news-item {
    background: #fff;
    padding: 20px; /* 恢复原始内边距 */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer; /* 添加鼠标指针样式 */
    width: 100%; /* 恢复原始宽度 */
    max-width: 1200px; /* 恢复原始最大宽度 */
}

.research-news .news-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.research-news .news-item h4 {
    margin-bottom: 10px; /* 恢复原始间距 */
    color: #2c3e50;
}

.research-news .news-item p {
    margin: 5px 0; /* 恢复原始间距 */
    color: #666;
}

.info-grid, .news-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px; /* 减小间距 */
    margin-top: 15px; /* 减小间距 */
}

.info-item, .news-item {
    background: rgba(255, 255, 255, 0.1);
    padding: 15px; /* 减小内边距 */
    border-radius: 8px;
}

/* 各内容区域 */
section {
    padding: 50px 0; /* 减小内边距 */
}

h2 {
    font-size: 1.8rem; /* 减小字体大小 */
    margin-bottom: 30px; /* 减小间距 */
    text-align: center;
}

/* 研究方向网格 */
.research-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* 调整列宽 */
    gap: 40px; /* 增加间距 */
}

.research-item {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 设置为渐变蓝色 */
    padding: 20px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 保持阴影 */
    color: #000; /* 将文字颜色改为黑色 */
    position: relative; /* 确保文本框不会被其他元素覆盖 */
    z-index: 10; /* 确保文本框位于其他元素之上 */
}

.research-item h3 {
    margin-bottom: 10px; /* 减小间距 */
    color: #000; /* 将标题颜色改为黑色 */
}

/* 联系信息 */
.contact {
    background: #ecf0f1;
}

/* 添加画廊样式 */
.gallery-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* 调整列宽 */
    gap: 15px; /* 减小间距 */
    padding: 15px; /* 减小内边距 */
}

.gallery-item {
    border: 1px solid #ddd;
    padding: 10px; /* 减小内边距 */
    text-align: center;
    border-radius: 8px; /* 添加圆角 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 添加阴影 */
}

.gallery-item img {
    max-width: 100%;
    height: auto;
    margin-bottom: 8px; /* 减小间距 */
}

.team-grid, .research-grid, .platform-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px; /* 减小间距 */
    padding: 15px; /* 减小内边距 */
}

.team-member, .research-item, .feature {
    background: #f5f5f5;
    padding: 15px; /* 减小内边距 */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* 添加阴影 */
}

/* 修改加入我们模块样式 */
.join-us {
    background: #2c3e50; /* 将背景颜色改为与索引栏背景颜色一致 */
    color: #fff; /* 将文字颜色改为白色，确保可读性 */
    padding: 20px 0; /* 保持内边距 */
    min-height: 60px; /* 保持高度 */
    margin-top: 0; /* 确保没有上外边距 */
    display: flex;
    align-items: center;
}

.join-content {
    width: 100%;
    max-width: none;
    margin: 0 auto;
}

.join-text {
    background: rgba(255, 255, 255, 0.1); /* 与索引栏的透明度一致 */
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    width: 100%;
    max-width: none;
    margin: 0 auto;
    text-align: center; /* 内容居中 */
}

.join-text h2 {
    color: #fff;
    margin-bottom: 10px; /* 调整间距 */
    font-size: 1.5rem; /* 增大字体大小 */
}

.join-text p {
    margin: 5px 0;
    line-height: 1.4;
    font-size: 1rem; /* 调整字体大小 */
}

/* 调整论文网格布局为单列 */
.paper-grid {
    display: flex;
    flex-direction: column; /* 确保垂直排列 */
    gap: 20px; /* 设置间距 */
    margin-top: 20px; /* 与上方内容的间距 */
    background: #e0e0e0; /* 将 paper-grid 的背景颜色改为灰色 */
    padding: 15px; /* 添加内边距 */
    border-radius: 8px; /* 添加圆角 */
}

.paper-item {
    background: #fff; /* 将背景颜色改为白色 */
    padding: 15px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    color: #333; /* 将文字颜色改为深灰色 */
}

.paper-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.paper-item h4 {
    margin-bottom: 10px;
    color: #2c3e50; /* 保持标题颜色不变 */
}

.paper-item p {
    margin: 5px 0;
    color: #2c3e50; /* 将文本颜色改为与检索栏背景颜色一致 */
}

.paper-item p strong {
    color: #000; /* 将"被接收于："后面的文本改为黑色 */
    font-weight: bold; /* 加粗字体 */
}

/* 修改 .details 的背景颜色，并设置为默认隐藏 */
.paper-item .details {
    background: #fff; /* 将背景颜色改为白色 */
    color: #333; /* 将文字颜色改为深灰色 */
    margin-top: 10px;
    padding: 10px;
    border-radius: 4px; /* 圆角 */
    text-align: left; /* 文本左对齐 */
    display: none; /* 默认隐藏 */
}

/* 当 .paper-item 被点击时，显示 .details */
.paper-item.active .details {
    display: block; /* 显示 .details */
}

/* 为 lab-overview 添加带边框的文本框样式 */
#lab-overview {
    border: 1px solid #ddd; /* 边框颜色为浅灰色 */
    border-radius: 8px; /* 圆角 */
    padding: 20px; /* 内边距 */
    margin: 20px auto; /* 外边距 */
    max-width: 1200px; /* 最大宽度 */
    background: #fff; /* 恢复白色背景 */
    text-align: center; /* 内容居中 */
}

/* 图片文本框样式 */
.image-box {
    width: 100%;
    max-width: 800px; /* 设置最大宽度 */
    margin: 0 auto 40px; /* 居中并添加底部间距 */
    padding: 10px; /* 内边距 */
    background: #fff; /* 背景颜色 */
    border: 1px solid #ddd; /* 边框 */
    border-radius: 8px; /* 圆角 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 阴影 */
    text-align: center; /* 内容居中 */
}

.image-box img {
    max-width: 100%; /* 图片最大宽度 */
    height: auto; /* 保持图片比例 */
    border-radius: 4px; /* 图片圆角 */
}

/* 导航栏样式 */
header {
    display: flex;
    align-items: center; /* 垂直居中对齐 */
}

header .container {
    display: flex;
    align-items: center; /* 垂直居中对齐 */
    justify-content: space-between; /* 在h1和nav之间添加空间 */
    width: 100%;
}

header nav {
    display: flex;
    align-items: center; /* 垂直居中对齐 */
}

header nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center; /* 垂直居中对齐 */
}

header nav ul li {
    margin: 0 15px; /* 调整项目之间的间距 */
}

header nav ul li a {
    text-decoration: none;
    color: white; /* 默认文字颜色为白色 */
    font-weight: bold;
    font-size: 20px; /* 增加字体大小 */
    padding: 10px 0; /* 内边距 */
    font-family: '黑体', 'SimHei', sans-serif; /* 设置字体为黑体 */
}

/* 首页检索栏样式 */
.home header nav ul li a[href="index.html"],
.members header nav ul li a[href="members.html"],
.research header nav ul li a[href="research.html"],
.gallery header nav ul li a[href="gallery.html"],
.platform header nav ul li a[href="platform.html"] {
    color: gold; /* 当前页面的索引键文字颜色为金色 */
    font-size: 20px; /* 字体大小与索引栏一致 */
    font-weight: bold; /* 字体加粗 */
    padding: 10px 0; /* 内边距与索引栏一致 */
    font-family: '黑体', 'SimHei', sans-serif; /* 设置字体为黑体 */
}

/* 悬停效果 */
header nav ul li a:hover {
    color: #e0e0e0; /* 鼠标悬停时显示浅灰白色 */
}

header h1 {
    display: flex;
    align-items: center;
    gap: 10px;
}

header .image-box {
    position: relative;
    border: none;
    outline: none;
    box-shadow: none;
    padding: 5px;
    background-color: transparent; /* 保持背景透明 */
    width: 60px; /* 增加宽度 */
    height: 60px; /* 增加高度 */
    display: flex;
    align-items: center;
    justify-content: center;
}

header .image-box img {
    width: 100%; /* 增加图片填充比例 */
    height: auto;
    opacity: 1;
}

/* 论文展示模块样式 */
.published-papers {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 设置为渐变蓝色 */
    padding: 50px 0;
}

.paper-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.paper-item {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.paper-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.paper-item h3 {
    margin-bottom: 10px;
    color: #2c3e50;
}

.paper-item p {
    margin: 5px 0;
    color: #666;
}

/* 按年份展示的论文模块样式 */
.year-section {
    margin-bottom: 40px;
    padding: 20px;
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 设置为渐变蓝色 */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    color: #fff; /* 将文字颜色改为白色，确保可读性 */
}

.year-title {
    color: #fff; /* 将标题颜色改为白色 */
    border-bottom: 2px solid rgba(255, 255, 255, 0.3); /* 将下划线颜色改为半透明白色 */
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.5rem;
}

.paper-grid {
    display: flex;
    flex-direction: column; /* 确保垂直排列 */
    gap: 20px; /* 设置间距 */
}

.paper-item {
    background: #f5f5f5;
    padding: 15px;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.paper-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.paper-item h4 {
    margin-bottom: 10px;
    color: #2c3e50;
}

.paper-item p {
    margin: 5px 0;
    color: #666;
}

/* 定义文字发光动画 */
@keyframes textGlow {
    0% {
        text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8), 0 0 10px rgba(255, 223, 0, 0.5);
    }
    50% {
        text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8), 0 0 20px rgba(255, 223, 0, 0.8);
    }
    100% {
        text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8), 0 0 10px rgba(255, 223, 0, 0.5);
    }
}

.branding-content .overlay-text {
    font-size: 24px;
    color: #fff; /* 将文本颜色改为白色 */
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.8);
    animation: textGlow 3s ease-in-out infinite;
}

/* 成员模块样式 */
.members {
    padding: 0; /* 恢复为无内边距 */
    background: #f5f5f5;
}

.member-category {
    margin-bottom: 40px;
}

.member-category h2 {
    font-size: 2rem;
    margin-bottom: 10px; /* 将原来的 20px 改为 10px，使标题位置上移 */
    text-align: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3); /* 添加下划线，颜色为半透明白色 */
    padding-bottom: 10px;
    color: #fff; /* 将标题颜色改为白色 */
}

/* 成员模块网格布局 */
.member-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 默认每行放置三个文本框 */
    gap: 15px; /* 减小间距 */
    justify-content: center; /* 水平居中 */
    margin: 0 auto; /* 使网格在容器中居中 */
    max-width: 80%; /* 限制网格的最大宽度，确保居中效果 */
}

/* 成员模块文本框样式 */
.member-item {
    background: #fff;
    padding: 20px; /* 保持内边距 */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 3px solid gold; /* 增加金色边框宽度 */
    box-shadow: 0 4px 8px rgba(255, 215, 0, 0.3); /* 添加金色阴影，增强立体效果 */
    max-width: 200px; /* 减小文本框的最大宽度 */
}

/* 毕业生模块网格布局 */
.member-category.alumni .member-grid {
    grid-template-columns: repeat(4, 1fr); /* 毕业生模块每行放置四个文本框 */
    gap: 40px; /* 将文本框之间的间距增加到 40px */
    justify-content: center; /* 水平居中 */
    margin: 0 auto; /* 使网格在容器中居中 */
    max-width: 80%; /* 限制网格的最大宽度，确保居中效果 */
}

.member-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 12px rgba(255, 215, 0, 0.5); /* 悬停时增强阴影效果 */
}

/* 毕业生模块文本框图片样式 */
.member-category.alumni .member-item img {
    width: 120px; /* 固定宽度 */
    height: 120px; /* 固定高度 */
    border-radius: 50%; /* 保持圆形 */
    object-fit: cover; /* 确保图片比例不变，裁剪多余部分 */
    margin-bottom: 15px; /* 保持图片与文本之间的间距 */
}

.member-item h3 {
    font-size: 1.5rem; /* 恢复标题字体大小 */
    color: #2c3e50;
    margin-bottom: 10px; /* 恢复标题与文本之间的间距 */
}

.member-item p {
    font-size: 1rem; /* 恢复文本字体大小 */
    color: #666;
}

/* 成员模块外部容器样式 */
.members-container {
    background: #fff; /* 恢复为白色背景 */
    border: 1px solid #ddd; /* 边框颜色为浅灰色 */
    border-radius: 8px; /* 圆角 */
    padding: 20px; /* 内边距 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 阴影效果 */
}

/* 教师模块样式 */
.member-category.teachers {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 蓝色渐变 */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    color: #fff; /* 文字颜色为白色 */
}

/* 教师模块标题样式 */
.member-category.teachers h2 {
    font-size: 2rem;
    margin-bottom: 20px; /* 恢复为原来的 20px */
    text-align: center;
    border-bottom: 2px solid #b87333; /* 将下划线颜色改为古金色 */
    padding-bottom: 10px;
}

/* 教师模块文本框样式 */
.member-category.teachers .member-item {
    background: #fff;
    padding: 15px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;
    border: 5px solid transparent; /* 透明边框 */
    background-clip: padding-box; /* 确保背景不覆盖边框 */
    overflow: hidden; /* 隐藏溢出的伪元素 */
    max-width: 250px; /* 设置最大宽度为 250px */
    width: 100%; /* 使文本框宽度自适应 */
}

.member-category.teachers .member-item::before {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    background: linear-gradient(145deg, #b87333, #ffd700); /* 古金色渐变 */
    border-radius: 12px; /* 稍微增加圆角 */
    z-index: -1;
    animation: rotateBorder 5s linear infinite; /* 动态旋转边框 */
}

@keyframes rotateBorder {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* 教师模块文本框悬停效果 */
.member-category.teachers .member-item:hover {
    transform: perspective(1000px) rotateX(10deg) rotateY(10deg) translateY(-5px); /* 悬停时增强三维旋转效果 */
    box-shadow: 
        0 6px 12px rgba(184, 115, 51, 0.5), /* 悬停时增强古金色阴影 */
        0 8px 16px rgba(0, 0, 0, 0.3), /* 保持深色阴影 */
        0 10px 20px rgba(0, 0, 0, 0.2); /* 保持更浅的阴影 */
}

/* 教师模块文本框图片样式 */
.member-category.teachers .member-item img {
    width: 120px; /* 固定宽度 */
    height: 200px; /* 增加高度为 200px */
    border-radius: 50% / 60%; /* 调整椭圆形的垂直半径 */
    object-fit: cover; /* 确保图片比例不变，裁剪多余部分 */
    margin-bottom: 15px; /* 保持图片与文本之间的间距 */
}

/* 硕士研究生模块样式 */
.member-category.master-students {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 蓝色渐变 */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    color: #fff; /* 文字颜色为白色 */
}

/* 毕业生模块样式 */
.member-category.alumni {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 蓝色渐变 */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    color: #fff; /* 文字颜色为白色 */
}

/* 博士研究生模块样式 */
.member-category.phd-students {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 蓝色渐变 */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    color: #fff; /* 文字颜色为白色 */
}

/* 博士研究生模块分隔线样式 */
.member-category.phd-students + .member-category {
    border-top: 2px solid red; /* 将分隔线颜色改为红色 */
}

/* 博士研究生模块文本框样式 */
.member-category.phd-students .member-item {
    background: #fff;
    padding: 15px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 5px solid #8B008B; /* 增加紫红色边框，宽度与教师模块一致 */
    box-shadow: 
        0 4px 8px rgba(139, 0, 139, 0.3), /* 添加紫红色阴影，增强立体效果 */
        0 6px 12px rgba(0, 0, 0, 0.2), /* 添加深色阴影，进一步增强立体感 */
        0 8px 16px rgba(0, 0, 0, 0.1); /* 添加更浅的阴影，增加层次感 */
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg); /* 默认无旋转 */
}

.member-category.phd-students .member-item:hover {
    transform: perspective(1000px) rotateX(10deg) rotateY(10deg) translateY(-5px); /* 悬停时增强三维旋转效果 */
    box-shadow: 
        0 6px 12px rgba(139, 0, 139, 0.5), /* 悬停时增强紫红色阴影 */
        0 8px 16px rgba(0, 0, 0, 0.3), /* 悬停时增强深色阴影 */
        0 10px 20px rgba(0, 0, 0, 0.2); /* 悬停时增强更浅的阴影 */
}

/* 模块标题样式 */
.member-category h2 {
    font-size: 2rem;
    margin-bottom: 10px; /* 将原来的 20px 改为 10px，使标题位置上移 */
    text-align: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3); /* 添加下划线，颜色为半透明白色 */
    padding-bottom: 10px;
    color: #fff; /* 将标题颜色改为白色 */
}

/* 模块之间的分隔线 */
.member-category + .member-category {
    margin-top: 30px;
    border-top: 2px solid rgba(255, 255, 255, 0.3); /* 添加分隔线，颜色为半透明白色 */
    padding-top: 30px;
}

/* 硕士研究生模块分隔线样式 */
.member-category.master-students + .member-category {
    border-top: 2px solid #0073e6; /* 将分隔线颜色改为宝蓝色 */
}

/* 硕士研究生模块文本框样式 */
.member-category.master-students .member-item {
    background: #fff;
    padding: 15px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 5px solid #0073e6; /* 增加宝蓝色边框，宽度与博士研究生模块一致 */
    box-shadow: 
        0 4px 8px rgba(0, 115, 230, 0.3), /* 添加宝蓝色阴影，增强立体效果 */
        0 6px 12px rgba(0, 0, 0, 0.2), /* 添加深色阴影，进一步增强立体感 */
        0 8px 16px rgba(0, 0, 0, 0.1); /* 添加更浅的阴影，增加层次感 */
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg); /* 默认无旋转 */
}

.member-category.master-students .member-item:hover {
    transform: perspective(1000px) rotateX(10deg) rotateY(10deg) translateY(-5px); /* 悬停时增强三维旋转效果 */
    box-shadow: 
        0 6px 12px rgba(0, 115, 230, 0.5), /* 悬停时增强宝蓝色阴影 */
        0 8px 16px rgba(0, 0, 0, 0.3), /* 悬停时增强深色阴影 */
        0 10px 20px rgba(0, 0, 0, 0.2); /* 悬停时增强更浅的阴影 */
}

/* 毕业生模块分隔线样式 */
.member-category.alumni + .member-category {
    border-top: 2px solid #66CCCC; /* 将分隔线颜色改为 #66CCCC */
}

/* 毕业生模块标题样式 */
.member-category.alumni h2 {
    font-size: 2rem;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #50C878; /* 将下划线颜色改为翡翠绿 */
    padding-bottom: 10px;
}

/* 硕士研究生模块标题样式 */
.member-category.master-students h2 {
    font-size: 2rem;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #0073e6; /* 将下划线颜色改为宝蓝色 */
    padding-bottom: 10px;
}

/* 博士研究生模块标题样式 */
.member-category.phd-students h2 {
    font-size: 2rem;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #8B008B; /* 将下划线颜色改为紫红色 */
    padding-bottom: 10px;
}

/* 毕业生模块文本框样式 */
.member-category.alumni .member-item {
    background: #fff;
    padding: 15px; /* 保持内边距 */
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 5px solid #50C878; /* 将边框颜色改为翡翠绿 */
    box-shadow: 
        0 4px 8px rgba(80, 200, 120, 0.3), /* 添加翡翠绿阴影，增强立体效果 */
        0 6px 12px rgba(0, 0, 0, 0.2), /* 添加深色阴影，进一步增强立体感 */
        0 8px 16px rgba(0, 0, 0, 0.1); /* 添加更浅的阴影，增加层次感 */
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg); /* 默认无旋转 */
}

.member-category.alumni .member-item:hover {
    transform: perspective(1000px) rotateX(10deg) rotateY(10deg) translateY(-5px); /* 悬停时增强三维旋转效果 */
    box-shadow: 
        0 6px 12px rgba(80, 200, 120, 0.5), /* 悬停时增强翡翠绿阴影 */
        0 8px 16px rgba(0, 0, 0, 0.3), /* 悬停时增强深色阴影 */
        0 10px 20px rgba(0, 0, 0, 0.2); /* 悬停时增强更浅的阴影 */
}

/* 教师模块网格布局 */
.member-category.teachers .member-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 默认每行放置三个文本框 */
    gap: 50px; /* 将文本框之间的间距增加到 50px */
    justify-content: center; /* 水平居中 */
    margin: 0 auto; /* 使网格在容器中居中 */
    max-width: 80%; /* 限制网格的最大宽度，确保居中效果 */
}

/* 为 research-container 添加渐变蓝色背景 */
.research-container {
    border: 2px solid #f5f5f5; /* 将边框颜色设置为与首页背景颜色一致 */
    border-radius: 8px; /* 保留圆角 */
    padding: 20px; /* 保留内边距 */
    margin: 20px auto; /* 保留外边距，使内容居中 */
    max-width: 1200px; /* 保留最大宽度 */
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 设置为渐变蓝色 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 保留阴影效果 */
    color: #fff; /* 将文字颜色改为白色，确保可读性 */
}

/* 修改 footer 样式 */
footer {
    background: #2c3e50; /* 将背景颜色改为与索引栏背景颜色一致 */
    color: #fff; /* 将文字颜色改为白色，确保可读性 */
    padding: 20px 0; /* 添加内边距 */
    text-align: center; /* 内容居中 */
    margin-top: 0; /* 去掉上外边距，确保与 .join-us 无缝连接 */
}

/* 2023年论文部分 */
.year-section:nth-child(1) {
    background: linear-gradient(145deg, #4a90e2, #2c3e50); /* 保持渐变蓝色 */
    color: #fff; /* 文字颜色为白色 */
}

/* 2022年论文部分 */
.year-section:nth-child(2) {
    background: linear-gradient(145deg, #50C878, #2c3e50); /* 翡翠绿渐变 */
    color: #fff; /* 文字颜色为白色 */
}

/* 2021年论文部分 */
.year-section:nth-child(3) {
    background: linear-gradient(145deg, #8B008B, #2c3e50); /* 紫红色渐变 */
    color: #fff; /* 文字颜色为白色 */
}