/* =====================================================================
   faq-redesign.css — "More common questions" section on the FAQ page.
   A grouped native <details> accordion (no JS) in the lx-* design system.
   ===================================================================== */

.lx-faq-more{
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:clamp(3rem,8vw,8vw);
  max-width:var(--layout-max);
  margin-inline:auto;
  border-top:1px solid var(--color-border);
}

/* --- left: intro + CTA --- */
.lx-faq-more-intro{display:flex;flex-direction:column;align-items:flex-start}
.lx-faq-more-intro h2{
  margin:0 0 1.1rem;
  font-size:clamp(2.5rem,4.2vw,4.4rem);
  line-height:.95;
  letter-spacing:-.03em;
}
.lx-faq-more-intro>p:not(.lx-kicker){
  margin:0;
  max-width:26rem;
  color:var(--color-muted);
  font-size:1rem;
  line-height:1.72;
}
.lx-faq-more-cta{margin-top:1.9rem}
.lx-faq-more-cta span{transition:transform .25s cubic-bezier(.2,.7,.3,1)}
.lx-faq-more-cta:hover span,
.lx-faq-more-cta:focus-visible span{transform:translateX(4px)}

/* --- right: grouped accordion --- */
.lx-faq-more-groups{display:flex;flex-direction:column;gap:2.75rem;min-width:0}
.lx-faq-group-label{
  margin:0 0 .2rem;
  color:var(--color-accent);
  font-family:Inter,Manrope,Arial,sans-serif;
  font-size:.62rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase;
}

.lx-faq-item{border-bottom:1px solid var(--color-border)}
.lx-faq-item summary{
  list-style:none;
  cursor:pointer;
  display:flex;align-items:flex-start;justify-content:space-between;gap:1.35rem;
  padding:1.15rem 0;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(1.08rem,1.45vw,1.32rem);
  line-height:1.32;
  color:var(--stone-950);
  transition:color .2s ease;
}
.lx-faq-item summary::-webkit-details-marker{display:none}
.lx-faq-item summary::after{
  content:"";
  flex:none;
  width:11px;height:11px;
  margin-top:.42rem;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  opacity:.45;
  transition:transform .28s cubic-bezier(.2,.7,.3,1),opacity .2s ease;
}
.lx-faq-item summary:hover{color:var(--color-accent)}
.lx-faq-item[open] summary{color:var(--color-accent)}
.lx-faq-item[open] summary::after{transform:rotate(-135deg);opacity:.85}
.lx-faq-item summary:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:3px}

.lx-faq-item>p{
  margin:0;
  padding:0 2rem 1.45rem 0;
  max-width:46rem;
  color:var(--color-muted);
  font-size:.94rem;
  line-height:1.78;
  animation:lxFaqReveal .32s cubic-bezier(.2,.7,.3,1);
}
.lx-faq-item>p strong{color:var(--stone-900);font-weight:600}
@keyframes lxFaqReveal{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

@media(max-width:900px){
  .lx-faq-more{grid-template-columns:1fr;gap:2.5rem}
  .lx-faq-more-cta{margin-top:1.35rem}
  .lx-faq-more-groups{gap:2.25rem}
}
@media(prefers-reduced-motion:reduce){
  .lx-faq-item summary::after,
  .lx-faq-item>p,
  .lx-faq-more-cta span{transition:none;animation:none}
}