/* ============================================================
   FAQ 页面补充样式（common.css 未包含的部分）
   依赖 common.css 中的 CSS 变量
   ============================================================ */

/* 搜索框 */
.hero-search{max-width:600px;margin:0 auto;position:relative;}
.hero-search input{
  width:100%;padding:16px 56px 16px 22px;
  border-radius:14px;border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.08);backdrop-filter:blur(10px);
  color:#fff;font-size:16px;font-family:inherit;
  transition:var(--transition);
}
.hero-search input::placeholder{color:rgba(255,255,255,.4);}
.hero-search input:focus{
  outline:none;border-color:#4EFFC0;
  background:rgba(255,255,255,.12);
  box-shadow:0 0 0 4px rgba(78,255,192,.15);
}
.hero-search .search-icon{
  position:absolute;right:20px;top:50%;transform:translateY(-50%);
  color:rgba(255,255,255,.5);pointer-events:none;
}
.hero-search .search-icon svg{width:20px;height:20px;}

/* 分类标签 */
.faq-item.hide{display:none}
.faq-categories{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
  margin-bottom:40px;
}
.faq-cat{
  padding:10px 22px;border-radius:10px;
  font-size:14.5px;font-weight:600;color:var(--gray-5);
  background:#fff;border:1.5px solid var(--gray-2);
  cursor:pointer;transition:var(--transition);
  display:inline-flex;align-items:center;gap:8px;
}
.faq-cat:hover{border-color:var(--primary);color:var(--primary);}
.faq-cat.active{
  background:linear-gradient(135deg,#165DFF 0%,#0E42C8 100%);
  color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(22,93,255,.35);
}
.faq-cat .count{
  font-size:11.5px;padding:1px 7px;border-radius:999px;
  background:var(--gray-1);color:var(--gray-4);
  font-variant-numeric:tabular-nums;
}
.faq-cat.active .count{background:rgba(255,255,255,.2);color:#fff;}

/* 无结果提示 */
.no-result{
  text-align:center;padding:60px 24px;
  background:#fff;border-radius:var(--radius-lg);
  border:1px solid var(--gray-2);
  color:var(--gray-5);display:none;
}
.no-result.show{display:block;}
.no-result svg{width:56px;height:56px;margin:0 auto 16px;color:var(--gray-3);}
.no-result h3{font-size:17px;font-weight:700;color:var(--dark);margin-bottom:8px;}
.no-result p{font-size:14.5px;}

/* 底部 CTA */
.cta-help{
  background:linear-gradient(135deg,#165DFF 0%,#0E42C8 100%);
  border-radius:var(--radius-xl);padding:40px 36px;
  color:#fff;text-align:center;max-width:920px;margin:56px auto 0;
  position:relative;overflow:hidden;
}
.cta-help::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 50%,rgba(255,255,255,.12) 0%,transparent 50%),radial-gradient(circle at 70% 50%,rgba(0,196,140,.2) 0%,transparent 50%);}
.cta-help > *{position:relative;z-index:2;}
.cta-help h3{font-size:clamp(20px,2.2vw,26px);font-weight:800;margin-bottom:10px;letter-spacing:-.02em;}
.cta-help p{font-size:15px;color:rgba(255,255,255,.8);margin-bottom:22px;}
.cta-help .btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}

/* 响应式补充 */
@media (max-width:600px){
  .hero-search input{padding:14px 48px 14px 18px;font-size:15px;}
  .faq-categories{gap:8px;margin-bottom:28px;}
  .faq-cat{padding:8px 16px;font-size:13.5px;}
  .cta-help{padding:32px 20px;margin-top:40px;}
  .cta-help .btns{flex-direction:column;align-items:stretch;}
}