*{margin: 0;
padding: 0;
box-sizing: border-box;
}
a{text-decoration: none;}
body{font: "微软雅黑";color: black;}
.nav{position: fixed;top: 0;left: 0;height: 60px;width: 100%;z-index: 999;background: white;}
.nav-mian{display: flex; justify-content: space-between;width: 1400px;height: 60px;font-size: 24px;margin: 0 auto;}
.nav-logo {float: left;height: 60px; margin: 0 auto;}
.nav-logo img{height: 60px;}
.topmenu {
  display: flex;
  list-style: none;
}
.topmenu > li {
  position: relative; /* 关键点：二级菜单相对这个一级li定位 */
  margin-right:35px;
  margin-top: 10px;
  font-size:24px;
}
.topmenu > li > a{
  color:#000;
  text-decoration:none;
}
.topmenu > li > a:hover{
  color: darkgrey;
}

/* =====二级菜单样式===== */
.submenu {
  list-style: none;
  /* 默认隐藏 */
  display: none;
  position: absolute;
  left: 0;
  top: 100%; /* 紧贴一级菜单下方 */
  background:white ;
  width: 180px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  padding: 8px 6px;
}
.submenu li a {
  display: block;
  padding: 8px 14px;
  font-size: 20px;
  color:#333;
  text-decoration:none;
}
/* 二级选项hover高亮，和截图灰色效果一致 */
.submenu li a:hover {
  background-color:#FDD5DC;
}
/* 悬浮一级li，显示二级下拉菜单 */
.topmenu > li:hover .submenu{
  display:block;
}
.banner{width: 100%;height: 685px;margin-top: 60px;}
.banner img{width: 100%;height: 685px;}
.recommend {
            padding: 60px 80px;
            text-align: center;
        }
        .section-title {
            margin-bottom: 40px;
            color: #333;
        }
        .section-title h3 {
            font-size: 16px;
            font-weight: normal;
        }
        .section-title p {
            font-size: 14px;
            margin-top: 4px;
        }
        .card-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 60px 220px;
            max-width: 900px;
            margin: 0 auto;
        }
        .card-item {
            position: relative;
        }
        .card-item img {
            width: 100%;
            border-radius: 4px;
        }
        .card-tag {
            position: absolute;
            top: 10px;
            left: 10px;
            background: rgba(255,255,255,0.6);
            padding: 2px 6px;
            font-size:13px;
        }
        .card-more {
            position: absolute;
            bottom: 10px;
            right: 10px;
            font-size:13px;
            color:#333;
        }
        footer{
            background-color:#fcd9d9;
            text-align:center;
            padding:40px;
            font-size:14px;
            color:#444;
        }