@charset "utf-8";
/* CSS Document */
.crumbs-bar{
  background:#fff;
  /*border-bottom:1px solid var(--gray);*/border-top: 1px solid var(--gray);
	padding: 0.8rem 1.3rem 0rem 1.3rem;background-color: #F9F9F9;
}
.crumbs-inner{
  width: 100%;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:300;
 
}
.crumbs-inner a{transition:color .2s;color:var(--text-t);}
.crumbs-inner a:hover{color:var(--primary)}
.crumbs-inner svg{width:7px;height:11px;flex-shrink:0;color:var(--text-t)}
.crumbs-inner .cur{
  color:var(--text-t);
  max-width:46%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
/* ---------- Page intro ---------- */
.page-intro{
  padding: 0.8rem 1.3rem 0rem 1.3rem;
  position:relative;background-color: #F9F9F9;
}
.page-intro .kicker{
  display:inline-flex;align-items:center;gap:12px;
  text-transform:uppercase;
  color:var(--primary);font-weight:400;margin-bottom:20px;
}
.page-intro .kicker::before{
  content:"";width:34px;height:2px;background:var(--primary);display:block;
}
.page-intro h1{
  font-weight:400;color:var(--dark);
  line-height:1.24;margin-bottom:18px;
}
.page-intro h1 em{font-style:normal;color:var(--primary)}
.page-intro p{
  color:var(--dark);max-width:680px;line-height:1.9;font-weight:400;
}
/* ---------- 分类区块 ---------- */
.mains{padding: 0.8rem 1.3rem 0.8rem 1.3rem;background-color: #F9F9F9;}
.cat-sec{margin-bottom:52px}
.cat-sec:last-child{margin-bottom:0}
.cat-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;margin-bottom:24px;flex-wrap:wrap;
}
.cat-head h2{
  font-weight:400;
  display:flex;align-items:center;gap:13px;
}
.cat-head h2::before{
  content:"";width:4px;height:28px;background:var(--primary);
  border-radius:3px;display:block;
}
.cat-head h2 small{
  font-size:13px;color:#e8e8e6;font-weight:400;
  align-self:flex-end;padding-bottom:3px;
}
.cat-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.cat-card{
  background:#fff;border:1px solid #e8e8e6;
  border-radius:12px;padding:20px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.cat-card:hover{
  transform:translateY(-4px);border-color:var(--primary);
  box-shadow:0 14px 34px rgba(50,50,47,.1);
}
.cat-card b{
  font-weight:400;
  transition:color .2s;
}
.cat-card:hover b{color:var(--primary-dark)}
.cat-card svg{
  width:7px;height:12px;color:#e8e8e6;flex-shrink:0;
  transition:.2s;
}
.cat-card:hover svg{color:var(--primary);transform:translateX(4px)}

/* ---------- 明星单品 ---------- */
.star-sec{
  margin-top:72px;padding-top:56px;
  border-top:1px solid var(--gray-line);
}
.star-head{
  display:flex;align-items:center;justify-content:center;
  gap:16px;margin-bottom:28px;flex-wrap:wrap;
}
.star-head h2{
  font-weight:400;color: var(--text-t);
  display:flex;align-items:center;gap:13px;
}
/*.star-head h2::before{
  content:"";width:6px;height:28px;background:var(--primary);
  border-radius:3px;display:block;
}*/
.star-head .note{font-size:13.5px;color:var(--gray);}
.star-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.star-card{
  background:#fff;border:1px solid var(--gray-line);
  border-radius:var(--radius);overflow:hidden;display:block;
  transition:transform .28s,box-shadow .28s,border-color .28s;
}
.star-card:hover{
  transform:translateY(-6px);border-color:var(--primary);
  box-shadow:var(--shadow);
}
.star-card .st-img{position:relative;/*aspect-ratio:16/10;*/overflow:hidden;background:#f0f0ee}
.star-card .st-img img{
  width:100%;height:100%;object-fit:cover;transition:transform .5s;
}
.star-card:hover .st-img img{transform:scale(1.05)}
.star-card .st-tip{
  position:absolute;top:12px;left:12px;
  background:rgba(50,50,47,.86);color:#fff;
  font-size:11.5px;
  padding:5px 12px;border-radius:999px;backdrop-filter:blur(4px);
}
.star-card .st-body{padding:20px 22px 22px}
.star-card h3{
  font-size:16px;font-weight:400;line-height:1.5;
  margin-bottom:10px;transition:color .2s;
}
.star-card:hover h3{color:var(--primary-dark)}
.star-card .st-link{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13.5px;color:var(--primary);font-weight:500;
}
.star-card .st-link svg{width:7px;height:12px;transition:transform .2s}
.star-card:hover .st-link svg{transform:translateX(4px)}

/* ---------- 咨询条 ---------- */
.cta-band{
  background:#fff;border-top:1px solid #e8e8e6;
  padding:0.5rem 0 0.6rem;
}
.cta-inner{
  padding: 0.2rem 1.3rem 0rem 1.3rem;
  display:flex;align-items:center;justify-content:space-between;
  gap:30px;flex-wrap:wrap;
}
.cta-inner .l{flex:1;min-width:280px}
.cta-inner h2{
  font-weight:400;
  display:flex;align-items:center;gap:13px;margin-bottom:12px;
}
.cta-inner h2::before{
  content:"";width:4px;height:28px;background:var(--primary);
  border-radius:3px;display:block;
}
.cta-inner p{color:var(--text-t);line-height:1.85;max-width:560px;padding-left:19px}
.cta-btns{display:flex;gap:14px;flex-wrap:wrap}
.btn-solid{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--primary);color:#fff;
  padding:10px 30px;border-radius:var(--radius);font-weight:400;
  transition:background .2s,transform .2s;
}
.btn-solid:hover{background:var(--primary-dark);transform:translateY(-2px)}
.btn-solid svg{width:15px;height:15px}
.btn-line{
  display:inline-flex;align-items:center;gap:9px;
  border:1.5px solid var(--dark);color:var(--dark);
  padding:10px 30px;border-radius:var(--radius);
  transition:.2s;
}
.btn-line:hover{border-color:var(--primary);color:var(--primary)}
