/* ── ita_faq ─────────────────────────────────────────────────────────
   One section = one block, so each FAQ topic is independently
   reorderable; the gap between two of them is an explicit ita_spacer
   block in the page, not CSS on this block. The section's kicker+title
   reuses the shared .kicker/.h2 pattern (same 16px/18px spacing as
   everywhere else). The question list — <details>/<summary> for
   collapse, no JS — and its custom chevron toggle are the only truly
   new visual pieces this block needs. Tokens only. */

.block-ita_faq { scroll-margin-top: 96px; }
.block-ita_faq .faq-group-head { margin-bottom: 8px; }

.block-ita_faq .faq-list { margin-top: 10px; border-top: 1px solid var(--color-border); }
.block-ita_faq .faq-item { border-bottom: 1px solid var(--color-border); }

.block-ita_faq .faq-item summary {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 22px 0; cursor: pointer; list-style: none;
}
.block-ita_faq .faq-item summary::-webkit-details-marker { display: none; }
.block-ita_faq .faq-q {
  font-family: var(--font-display); font-weight: 700; font-size: 17px;
  color: var(--color-fg); line-height: 1.35;
}

.block-ita_faq .faq-toggle {
  flex: none; width: 24px; height: 24px; border-radius: 50%;
  border: 1.5px solid var(--color-border); position: relative;
}
.block-ita_faq .faq-toggle::before,
.block-ita_faq .faq-toggle::after {
  content: ""; position: absolute; top: 50%; left: 50%;
  background: var(--color-fg); transform: translate(-50%, -50%);
}
.block-ita_faq .faq-toggle::before { width: 10px; height: 1.5px; }
.block-ita_faq .faq-toggle::after  { width: 1.5px; height: 10px; transition: opacity .15s ease; }
.block-ita_faq details[open] .faq-toggle { border-color: var(--color-accent); }
.block-ita_faq details[open] .faq-toggle::before,
.block-ita_faq details[open] .faq-toggle::after { background: var(--color-accent); }
.block-ita_faq details[open] .faq-toggle::after { opacity: 0; }

.block-ita_faq .faq-a {
  padding: 0 0 26px; max-width: 760px;
  font-size: 15.5px; line-height: 1.75; color: var(--color-fg-muted);
}
.block-ita_faq .faq-a p + p { margin-top: 12px; }
.block-ita_faq .faq-a strong { color: var(--color-fg); font-weight: 700; }
.block-ita_faq .faq-a a { color: var(--color-fg); text-decoration: underline; text-underline-offset: 3px; }
.block-ita_faq .faq-a a:hover { color: var(--color-accent); }
.block-ita_faq .faq-a ul.plain { margin-top: 6px; }
.block-ita_faq .faq-a ul.plain li strong { color: var(--color-fg); }

@media (max-width: 700px) {
  .block-ita_faq .faq-q { font-size: 16px; }
}
