/* 重置 body 和 ul 的默认边距 */
body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #f5f5f5;
    overflow-x: hidden; /* 防止水平滚动条 */
}

/* 页面容器 */
.container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    max-width: 100%; /* 确保不超过视口宽度 */
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* 包含内边距在宽度内 */
}

/* 导航栏样式 */
.nav {
    background-color: #ffffff;  /*保持原背景色*/
    box-shadow: 0 0px 22px rgba(196, 66, 189, 0.1); /*保持原阴影*/
    width: 100%;
    margin: 0;
    padding: 0;
}

.ul1 {
    list-style: none;
    display: flex;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box; /* 包含内边距在宽度内 */
}

.a1 {
    color: rgb(0, 0, 0);
    text-decoration: none;
    padding: 1rem 1.5rem;
    display: block;
    transition: all 0.3s;
}

.a1:hover, .a1.b1 {
    border: 1px solid #e2e8f0; /*保持原悬停边框颜色*/
}

/* 主内容区样式 */
main {
    flex: 1;
    background-color: transparent; /* 透明背景 */
    padding: 2rem 0; /* 只保留上下内边距 */
    width: 100%;
}

.div1 {
    display: flex;
    flex-direction: column;
    align-items: center; /* 内容水平居中 */
    max-width: 800px; /* 恢复原始最大宽度 */
    margin: 2rem auto; /* 自动外边距实现居中 */
    padding: 0;
    gap: 2rem;
    margin-top: 50px;
    width: 100%; /* 占满可用空间但不超过max-width */
}

/* 文章内容样式 */
article {
    width: 100%;
    text-align: left; /* 文字保持左对齐 */
    padding: 0 20px; /* 添加左右内边距 */
    box-sizing: border-box;
}

.div2 {
    color: #7f8c8d;
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.h1-1 {
    margin-bottom: 0.1rem;
    margin-top: 0;
}

/* 页脚 */
.f1 {
    width: 100%;
    background: #ffffff;
    border-top: 1px solid #84d481; /*保持原边框颜色*/
    padding: 10px 0;
    text-align: center;
    margin-top: auto;
}