/* ==========================================
   全局 FAQ 样式 (分离式独立卡片 + 左侧图标)
   ========================================== */
:root {
  --brand-navy:    #1a3a5c;
  --brand-green:   #2a9d8f;
  --text-body:     #64748b;
  --border:        #e2e8f0; /* 极浅的灰色边框 */
}

/* 整体纯白背景 */
.prod-faq-wrap { 
  padding: 80px 40px; 
  background: #ffffff; 
  font-family: 'Inter', sans-serif; 
}

.prod-section-inner { max-width: 1400px; margin: 0 auto; }
.prod-section-header { text-align: center; margin-bottom: 40px; }

/* 标题样式 */
.prod-section-title { 
  font-size: clamp(1.6rem, 2.5vw, 2rem); 
  font-weight: 600; 
  color: var(--brand-navy); 
  margin-bottom: 12px; 
}

/* 绿色短划线 */
.prod-section-divider { 
  width: 40px; height: 2px; 
  background: var(--brand-green); 
  margin: 0 auto; 
}

/* 隐藏副标题 (如果 HTML 里有的话) */
.prod-section-sub { display: none; }

/* FAQ 列表容器 (移除背景和边框，让子元素独立) */
.prod-faq-list { 
  max-width: 860px; 
  margin: 0 auto; 
}

/* 独立卡片样式 */
.prod-faq-item { 
  background: #ffffff; 
  border: 1px solid var(--border); 
  margin-bottom: 12px; /* 卡片之间的间距 */
  border-radius: 2px; /* 极小的直角边 */
}

/* 问题行 */
.prod-faq-q { 
  width: 100%; background: none; border: none; 
  padding: 18px 24px; 
  display: flex; 
  align-items: center; 
  justify-content: flex-start; /* 靠左对齐 */
  gap: 16px; 
  cursor: pointer; text-align: left; 
}

/* 图标：通过 order: -1 强制移到左侧 */
.prod-faq-icon { 
  order: -1; 
  width: 24px; height: 24px; border-radius: 50%; 
  background: #cbd5e1; /* 浅灰色背景 */
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; 
  font-size: 1.2rem; color: #ffffff; /* 白色加号 */
  font-weight: 600;
  line-height: 1;
  transition: background 0.2s, transform 0.25s; 
}

/* 展开时的图标变化 */
.prod-faq-item.open .prod-faq-icon { 
  background: var(--brand-green); 
  transform: rotate(45deg); 
}

/* 问题文字 */
.prod-faq-q span { 
  font-size: 1.05rem; 
  font-weight: 500; 
  color: #1f2937; 
  line-height: 1.5; 
}

/* 答案区 */
.prod-faq-a { 
  max-height: 0; overflow: hidden; 
  transition: max-height 0.35s ease, padding 0.3s; 
  /* 左侧 padding 设为 64px，确保答案文字与上方的问题文字完美左对齐 */
  padding: 0 24px 0 64px; 
  font-size: 0.95rem; 
  color: var(--text-body); line-height: 1.7; 
}

/* 展开时的答案区 */
.prod-faq-item.open .prod-faq-a { 
  max-height: 500px; 
  padding-bottom: 24px; 
}

/* 移动端适配 */
@media (max-width: 900px) {
  .prod-faq-wrap { padding: 60px 20px; }
  .prod-faq-a { padding-left: 24px; } /* 手机端取消缩进，节省空间 */
}
