/* ==========================================================
   FAQ 区块（第九区块「常见问题」专用）
   - 复用 :root 变量（--primary / --card / --line / --ink / --ring 等）
   - 独立样式，不依赖 download.css 的裸 details/summary 规则
   ========================================================== */

.faq-section {
  padding: 72px 24px 88px;
  background: #fff;
}

.faq-head {
  max-width: 760px;
  margin: 0 auto 36px;
  text-align: center;
}

.faq-head h2 {
  font-size: 32px;
  font-weight: 700;
  color: var(--title-color, #153e7a);
  margin: 0 0 12px;
  line-height: 1.3;
}

.faq-head p {
  font-size: 16px;
  color: var(--muted-color, #666);
  margin: 0;
  line-height: 1.7;
}

.faq-list {
  max-width: 880px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.faq-item {
  background: var(--card, #fff);
  border: 1px solid var(--line, #e9eef3);
  border-radius: 12px;
  margin-bottom: 12px;
  transition: box-shadow .25s, border-color .25s;
  overflow: hidden;
}

.faq-item:hover {
  border-color: var(--primary, #1a73e8);
  box-shadow: var(--card-shadow-hover, 0 10px 26px rgba(31,49,71,.10));
}

.faq-item summary {
  cursor: pointer;
  padding: 18px 64px 18px 24px;
  font-weight: 600;
  font-size: 16px;
  color: var(--text-color, #222);
  list-style: none;
  position: relative;
  user-select: none;
  transition: color .2s;
  line-height: 1.55;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary:hover {
  color: var(--primary, #1a73e8);
}

.faq-item summary::after {
  content: '+';
  position: absolute;
  right: 20px;
  top: 50%;
  width: 28px;
  height: 28px;
  line-height: 26px;
  text-align: center;
  font-size: 22px;
  font-weight: 300;
  color: var(--primary, #1a73e8);
  border: 1.5px solid var(--primary, #1a73e8);
  border-radius: 50%;
  transform: translateY(-50%);
  transition: transform .25s;
  flex-shrink: 0;
}

.faq-item[open] summary {
  color: var(--primary, #1a73e8);
}

.faq-item[open] summary::after {
  transform: translateY(-50%) rotate(45deg);
}

.faq-item .faq-a {
  padding: 0 24px 20px;
  color: var(--lead-color, #4a5568);
  font-size: 15px;
  line-height: 1.8;
  margin: 0;
}

/* 小屏适配 */
@media (max-width: 640px) {
  .faq-section { padding: 48px 16px 60px; }
  .faq-head h2 { font-size: 24px; }
  .faq-head p { font-size: 14px; }
  .faq-item summary { font-size: 15px; padding: 16px 56px 16px 20px; }
  .faq-item .faq-a { font-size: 14px; padding: 0 20px 18px; }
  .faq-item summary::after { right: 16px; width: 24px; height: 24px; line-height: 22px; font-size: 18px; }
}