/* =========================================================================
   in-faq — «سخن پایانی و سوالات متداول» · طرح 13-faq.html
   آکاردئون بر پایهٔ <details>/<summary>؛ بدون جاوااسکریپت هم کار می‌کند.
   وابسته به: de-base.css   ·   تعامل اختیاری (تک‌بازشو): in-faq.js
   ========================================================================= */

.infq { position: relative; overflow: hidden; background: var(--infq-bg, var(--zn-bg1)); }
.infq-ghost { top: 30px; left: -14px; font-size: var(--infq-ghost-fs, 150px); --ghost-stroke: 1.5px; }
.infq-wrap { position: relative; z-index: 1; max-width: var(--infq-mw, 880px); margin: 0 auto; }
/* پیش‌فرض این بخش وسط‌چین است؛ کنترل «چینش سرتیتر» بازنویسی‌اش می‌کند. */
.infq-head { text-align: center; }
.infq-head .infq-lead { margin-inline: auto; }

.infq-h2 {
  margin: 16px 0 12px; font-size: var(--infq-h-fs, 34px); font-weight: 900; line-height: 1.55;
  background: linear-gradient(110deg, var(--infq-h1, var(--zn-t1)) 35%, var(--infq-h2c, var(--zn-accent-head)));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
.infq-lead { margin: 0 auto var(--infq-lead-mb, 34px); font-size: 14px; color: var(--zn-t5); line-height: 2.1; font-weight: 500; max-width: var(--infq-lead-w, 560px); }
.infq-lead p { margin: 0 0 12px; color: inherit; font: inherit; }
.infq-lead p:last-child { margin-bottom: 0; }

.infq-list { display: flex; flex-direction: column; gap: var(--infq-gap, 12px); }

.infq-item {
  overflow: hidden; border-radius: var(--infq-r, 18px);
  background: var(--infq-item-bg, rgba(255, 255, 255, .42));
  border: 2px solid var(--infq-item-bd, rgba(var(--zn-line), .16));
  box-shadow: none;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.infq-item[open] {
  background: var(--infq-item-bg-on, rgba(255, 59, 92, .07));
  border-color: var(--infq-item-bd-on, rgba(225, 29, 72, .4));
  box-shadow: 0 0 32px var(--infq-item-glow-on, rgba(225, 29, 72, .1));
}

.infq-q {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: var(--infq-q-p, 19px 24px); cursor: pointer; list-style: none;
}
.infq-q::-webkit-details-marker { display: none; }
.infq-q:focus-visible { outline: 2px solid var(--zn-crim); outline-offset: -2px; }
.infq-qt { font-size: var(--infq-q-fs, 15.5px); font-weight: 800; color: var(--infq-q-c, var(--zn-t1)); line-height: 1.8; text-align: right; }

.infq-ic {
  width: var(--infq-ic-s, 32px); height: var(--infq-ic-s, 32px); flex-shrink: 0;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 17px; font-weight: 900;
  background: var(--infq-ic-bg, rgba(var(--zn-line), .12));
  color: var(--infq-ic-c, var(--zn-t4));
  transition: background .15s ease, color .15s ease;
}
.infq-ic::before { content: var(--infq-sign-off, "+"); }
.infq-item[open] .infq-ic {
  background: var(--infq-ic-bg-on, linear-gradient(135deg, var(--zn-crim), var(--zn-rose)));
  color: var(--infq-ic-c-on, #FFF);
}
.infq-item[open] .infq-ic::before { content: var(--infq-sign-on, "−"); }

.infq-a { padding: var(--infq-a-p, 0 24px 21px); font-size: var(--infq-a-fs, 14px); color: var(--infq-a-c, var(--zn-t5)); line-height: 2.2; font-weight: 500; }
.infq-a p { margin: 0 0 12px; color: inherit; font: inherit; }
.infq-a p:last-child { margin-bottom: 0; }
.infq-a ul, .infq-a ol { margin: 0 0 12px; padding-right: 22px; }

@media (max-width: 600px) {
  .infq-q { padding: 16px 18px; gap: 10px; }
  .infq-a { padding: 0 18px 18px; }
}