body{

font-family:"Microsoft YaHei";

background:#faf8f3;

}


header{

height:90px;

display:flex;

justify-content:space-around;

align-items:center;

background:white;

position:fixed;

top:0;

left:0;

width:100%;

z-index:999;

box-shadow:0 3px 15px rgba(0,0,0,.08);

}



nav a{

margin:0 20px;

text-decoration:none;

color:#333;

font-size:20px;

position:relative;

}



nav a::after{

content:"";

position:absolute;

left:50%;

bottom:-8px;

width:0;

height:3px;

background:#000;

transform:translateX(-50%);

transition:.3s;

}



nav a:hover::after{

width:35px;

}





.products{

width:1200px;

margin:auto;

padding-top:130px;

}



.products h2{

text-align:center;

font-size:42px;

}



.category{

margin-top:80px;

}



.category h3{

font-size:32px;

color:#b8860b;

}


.product-card p{

font-size:18px;

}



/* 首页返回按钮 */

.home-link{

color:#b8860b !important;

text-decoration:none;

font-size:20px;

font-weight:bold;

}


.home-link:hover{

color:#8f6508 !important;

}

/* 产品页面顶部介绍 */

.products h2{

    text-align:center;

    font-size:42px;

    color:#12284b;

}


.products > p{

    text-align:center;

    font-size:20px;

    color:#666;

    margin-top:25px;

    line-height:35px;

}

/* 产品列表 */

.product-list{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:35px;

    width:90%;

    margin:40px auto;

}

/* 产品卡片 */

.product-card{

    background:#ffffff;

    border:1px solid #d7a329;

    border-radius:20px;

    height:330px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    overflow:hidden;

    transition:.4s;

}

/* 图片 */

.product-card img{

    width:220px;

    height:220px;

    object-fit:contain;

    transition:.4s;
}


/* 品牌名字 */

.product-card span{

    margin-top:20px;

    font-size:26px;

    font-weight:bold;

    color:#b8860b;

}


/* 鼠标效果 */

.product-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 30px rgba(0,0,0,.15);

}

/* 产品分类导航 */

.product-nav{

    display:flex;

    gap:30px;

}


.product-nav a{

    text-decoration:none;

    color:#333;

    font-size:20px;

    position:relative;

}


/* 分类下面的小横线 */

.product-nav a::after{

    content:"";

    position:absolute;

    width:0;

    height:3px;

    background:#b8860b;

    left:50%;

    bottom:-10px;

    transform:translateX(-50%);

    transition:.3s;

}


.product-nav a:hover::after{

    width:35px;

}


.product-nav a:hover{

    color:#b8860b;

}

/* =========================
   产品分类固定侧边栏
========================= */

.product-section{
    scroll-margin-top:110px;
}
