* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-family: 'Arial', sans-serif; /* 更改为通用无衬线字体 */
    line-height: 1.6; /* 微调行高 */
    font-size: 16px; /* 减小基础字号 */
}

body {
    color: #222; /* 深灰色文字 */
    background-color: #f8f8f8; /* 浅灰背景 */
    overflow-x: hidden;
    padding: 0;
}

.container {
    margin: 0 auto;
    padding: 0 1rem;
}

.site-header {
    background-color: #c62828; /* 红色背景 */
    color: #fff;
    padding: 1.2rem 0; /* 加大内边距 */
    box-shadow: 0 2px 10px rgba(198, 40, 40, 0.3); /* 红色阴影 */
}

.logo {
    font-size: 1.8rem; /* 加大字号 */
    font-weight: 700;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    font-family: 'Georgia', serif; /* 衬线字体 */
}

.content {
    padding: 2rem; /* 加大内边距 */
    min-height: 60vh;
    margin: 0 auto;
    max-width: 100%;
    width: 1200px;
    background-color: #fff; /* 白色内容区 */
    border-radius: 8px; /* 圆角 */
    box-shadow: 0 2px 15px rgba(0,0,0,0.1);
}

.content p {
    margin-bottom: 1.2rem;
    font-size: 1.1rem; /* 加大正文字号 */
    line-height: 1.7; /* 调整行距 */
}

.content img {
    max-width: 100%;
    height: auto;
    margin: 1.5rem auto; /* 增加图片边距 */
    display: block;
    border-radius: 8px; /* 更大圆角 */
    box-shadow: 0 4px 15px rgba(198, 40, 40, 0.2); /* 红色调阴影 */
}

.site-footer {
    background-color: #b71c1c; /* 深红色背景 */
    color: #fff;
    padding: 2.5rem 0; /* 加大内边距 */
    display: flex;
    justify-content: center;
}

.links {
    margin-bottom: 1.2rem;
    font-weight: 700;
    font-size: 1.1rem; /* 加大链接字号 */
}

.links a {
    margin: 0 12px; /* 增加链接间距 */
    text-decoration: none;
    color: #ffebee; /* 浅红色文字 */
    font-size: 1.1rem;
    transition: color 0.3s; /* 添加悬停效果 */
}

.links a:hover {
    color: #fff; /* 悬停变亮 */
}

.copyright {
    opacity: 0.9;
    font-size: 0.9rem;
}

@media (max-width: 768px) {
    html {
        font-size: 15px; /* 更小的移动端字号 */
    }
    .container {
        padding: 0 1.2rem; /* 调整内边距 */
    }
    .logo {
        font-size: 1.5rem; /* 适配移动端的logo大小 */
    }
    .content {
        padding: 1.5rem; /* 减少移动端内边距 */
    }
}
