a {
text-decoration: none;
color: #000;
}
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f8f8f8;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 10px;
}
/* 统一卡片样式，删除冗余product1 */
.product {
background: #fff;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
text-align: center;
overflow: hidden;
transition: transform 0.3s ease;
cursor: pointer;
flex: 1 1 calc(16.666% - 12px); /* 桌面6列均分，扣除gap间距 */
}
.product:hover {
transform: scale(1.05);
}
.product a {
display: block;
padding: 12px 8px;
}
.product img {
width: 60%;
height: auto;
margin-bottom: 10px;
}
.product h3 {
font-size: 1em;
margin: 0;
font-weight: normal;
}
/* 卡片外层容器使用gap代替margin，无多余空白 */
.products {
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: flex-start;
}
/* 平板端 3列 */
@media (max-width: 768px) {
.product {
flex: 1 1 calc(33.333% - 10px);
}
.product h3 {
font-size: 0.85em;
}
}
/* 手机端 2列 */
@media (max-width: 480px) {
.product {
flex: 1 1 calc(50% - 8px);
}
}