@font-face {
    font-family: 'Source Han Sans';
    src: url('/fonts/SourceHanSans-Regular.ttf') format('truetype');
}

/* 设置全局字体和页面边距 */
body {
    font-family: 'Source Han Sans', sans-serif;
    margin: 0;
    padding: 0;
    background-color: rgb(153, 204, 0);
}

section,
div {
    margin-bottom: 0;
}

/* 英雄区样式 */
#hero {
    position: relative;
    height: 500px;
    margin-top: 170px;
}
#hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 主内容 */
main {
    padding: 10px;
    margin: 0 auto;
    max-width: 1500px;
}

/* 课程介绍区 */
#courses {
    background-color: #fff;
    padding: 50px 20px;
    text-align: center;
}
#courses h2 {
    font-size: 28px;
}
#courses p {
    font-size: 18px;
}
.course-icons {
    display: flex;
    justify-content: center;
    gap: 270px;
    margin-top: 40px;
}
.course-icons a {
    text-decoration: none;
    color: #333;
    text-align: center;
}
.course-icons p {
    font-weight: bold;
    margin-top: 10px;
}

/* 为什么选择我们 */
#why-us {
    background-color: #fff;
    padding: 30px 70px;
    text-align: center;
}
#why-us h2 {
    font-size: 28px;
}
.why-us-cards {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 0 20px;
}
.card {
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    width: calc(33.33% - 20px);
    text-align: center;
}
.card img {
    display: block;
    margin: 0 auto 20px;
    max-width: 100%;
    height: auto;
}

/* 教师区 */
#teachers {
    background-color: #fff;
    padding: 50px 90px;
    text-align: center;
}
#teachers h2 {
    font-size: 28px;
}
.teachers-scroll-container {
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.teachers-scroll-container::-webkit-scrollbar {
    display: none;
}
.teachers-container {
    display: inline-flex;
}
.teacher-img {
    width: auto;
    height: 300px;
    margin-right: 20px;
}

/* 学生评价区 */
#students {
    background-color: #fff;
    padding: 50px 90px;
    text-align: center;
}
#students h2 {
    font-size: 28px;
}
.students-scroll-container {
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.students-scroll-container::-webkit-scrollbar {
    display: none;
}
.students-container {
    display: inline-flex;
}
.student-img {
    width: auto;
    height: 310px;
    margin-right: 20px;
}