/* ===== 基础变量 ===== */
:root{
  --primary:#6f42c1;
  --secondary:#5e35b1;
  --accent:#a78bfa;
  --bg:#1e1e1e;
  --glass:rgba(255,255,255,.06);
  --glass-border:rgba(255,255,255,.12);
}

/* ===== 页面 ===== */
body{background:var(--bg);color:#f1f1f1;font-family:'Noto Sans SC',sans-serif;}

/* ===== 英雄区 ===== */
.hero{text-align:center;padding:7rem 2rem 3rem;}
.hero-title{font-family:'Orbitron',sans-serif;font-size:3rem;letter-spacing:1px;}
.hero-title .accent{color:var(--accent);}
.hero-subtitle{color:#a0a0a0;font-size:1.2rem;margin-top:.5rem;}

/* ===== 统计数字 ===== */
.stats{display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;margin:2rem 0;font-family:'Orbitron',sans-serif;}
.stat-item{text-align:center;}
.count{font-size:2.5rem;color:var(--accent);display:block;}
.label{font-size:1rem;color:#a0a0a0;}

/* ===== 商品网格 ===== */
.products-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:2.5rem;
  max-width:1200px;
  margin:0 auto;
  padding:2rem;
}

/* 玻璃卡片 */
.product-card{
  position:relative;
  background:var(--glass);
  border:1px solid var(--glass-border);
  border-radius:20px;
  padding:2rem;
  text-align:center;
  overflow:hidden;
  transition:transform .3s,box-shadow .3s;
  cursor:pointer;
}
.product-card::before{
  content:'';
  position:absolute;
  top:-50%;left:-50%;
  width:200%;height:200%;
  background:conic-gradient(var(--accent),transparent);
  opacity:0;
  transition:opacity .5s;
}
.product-card:hover::before{opacity:.08;}
.product-card:hover{
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 0 25px var(--accent);
}

/* 卡片内容 */
.product-card img{
  width:100%;
  height:180px;
  object-fit:contain;
  border-radius:12px;
  margin-bottom:1rem;
  filter:drop-shadow(0 0 10px var(--accent));
}
/* 去除卡片文字下划线 */
.product-card,
.product-card h3,
.product-card .price {
  text-decoration: none !important;
}
.product-card h3{font-size:1.4rem;margin-bottom:.5rem;color:#fff;}
.product-card .price{font-size:1.3rem;color:var(--accent);font-weight:bold;}

/* ===== 底部 ===== */
.footer{background:#141414;padding:2rem 0;text-align:center;color:#666;font-size:.9rem;}
.footer-logo{height:50px;margin-bottom:.5rem;}

/* ===== 响应式 ===== */
@media(max-width:768px){
  .hero-title{font-size:2.2rem;}
  .stats{gap:2rem;}
}