/* ════════════════════════════════════════════════════════════════
   <x-numox.faq> — Editorial side-label FAQ accordion
   ════════════════════════════════════════════════════════════════ */

.nx-faq { background: var(--nx-bone); padding: 120px 0; }

.nx-faq-side {
  position: sticky; top: 120px;
  display: flex; flex-direction: column; gap: 20px;
}
.nx-faq-side h2 {
  font-size: clamp(36px, 4vw, 52px); font-weight: 900;
  line-height: 1.05; letter-spacing: -1.5px; color: var(--nx-dark);
}
.nx-faq-side p {
  font-size: 15px; font-weight: 300;
  color: var(--nx-muted); line-height: 1.7; max-width: 300px;
}

.nx-faq-side-meta {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px;
}
.nx-faq-side-meta-item {
  background: #fff; border: 1px solid var(--nx-border); border-radius: 14px;
  padding: 14px 16px; display: flex; flex-direction: column; gap: 4px;
}
.nx-faq-side-meta-item .lbl {
  font-size: 11px; font-weight: 600; color: var(--nx-muted);
  letter-spacing: .04em; text-transform: uppercase;
}
.nx-faq-side-meta-item b {
  font-family: var(--font-num); font-size: 32px; font-weight: 900;
  color: var(--nx-dark); line-height: 1; letter-spacing: -1px;
}

.nx-faq-list { border-top: 1.5px solid var(--nx-dark); }
.nx-faq-item { border-bottom: 1.5px solid var(--nx-border); transition: border-color .25s; }
.nx-faq-item:has(.collapse.show) { border-bottom-color: var(--nx-dark); }

.nx-faq-btn {
  width: 100% !important;
  background: transparent !important;
  border: none !important; box-shadow: none !important; outline: none !important;
  border-radius: 0 !important;
  padding: 26px 4px !important;
  font-family: var(--font) !important;
  color: var(--nx-dark) !important;
  display: grid !important; grid-template-columns: auto 1fr auto;
  gap: 22px; align-items: center;
  text-align: start; line-height: 1.4;
  cursor: pointer;
  transition: color .25s;
}
.nx-faq-btn:hover { color: var(--nx-red) !important; }

.nx-faq-q-index { font-family: var(--font-num); font-size: 14px; font-weight: 900;
                  color: var(--nx-muted); letter-spacing: .04em; transition: color .25s; }
.nx-faq-btn:hover .nx-faq-q-index,
.nx-faq-btn[aria-expanded="true"] .nx-faq-q-index { color: var(--nx-red); }

.nx-faq-q-text { font-size: 18px; font-weight: 700; }

.nx-faq-icon {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1.5px solid var(--nx-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 300; color: var(--nx-dark);
  flex-shrink: 0; background: transparent;
  transition: all .25s;
}
.nx-faq-icon.minus { background: var(--nx-dark); color: #fff; border-color: var(--nx-dark); }
.nx-faq-btn:hover .nx-faq-icon.plus { border-color: var(--nx-red); color: var(--nx-red); }

.nx-faq-answer {
  padding: 0 4px 30px;
  padding-inline-start: 56px;
  font-size: 15px; font-weight: 300;
  color: var(--nx-body); line-height: 1.85;
}
.nx-faq-answer p              { margin-bottom: 10px; }
.nx-faq-answer ul,
.nx-faq-answer ol             { padding-inline-start: 22px; margin-bottom: 10px; }

@media (max-width: 1100px) {
  .nx-faq-side { position: static; }
}
@media (max-width: 768px) {
  .nx-faq           { padding: 72px 0; }
  .nx-faq-btn       { gap: 14px; padding: 20px 4px !important; }
  .nx-faq-q-text    { font-size: 15px; }
  .nx-faq-icon      { width: 32px; height: 32px; font-size: 18px; }
  .nx-faq-answer    { padding-inline-start: 4px; font-size: 14px; }
}