.nd-faq-preview,
.faq-page {
  --faq-border: var(--guide-border, #704b62);
  --faq-accent: var(--guide-accent, #ffb7ce);
  --faq-muted: var(--guide-muted, #e7cedb);
}
.nd-faq-list {
  display: grid;
  gap: .55rem;
  margin: 1rem 0;
  text-align: start;
}
.nd-faq-list details {
  border: 1px solid var(--faq-border);
  border-radius: .8rem;
  background: var(--guide-panel, #2b1c2d);
}
.nd-faq-list details[open] { border-color: #b67993; }
.nd-faq-list summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .8rem;
  padding: .75rem .95rem;
  border-radius: inherit;
  cursor: pointer;
  font-weight: 650;
  list-style: none;
}
.nd-faq-list summary::-webkit-details-marker { display: none; }
.nd-faq-list summary::after {
  content: "" / "";
  flex: none;
  width: .55rem;
  height: .55rem;
  margin: -.2rem .25rem 0 0;
  border-right: 2px solid var(--faq-accent);
  border-bottom: 2px solid var(--faq-accent);
  transform: rotate(45deg);
}
.nd-faq-list details[open] summary::after { transform: rotate(225deg); }
.nd-faq-list summary:focus-visible { outline: 2px solid var(--faq-accent); outline-offset: 2px; }
.nd-faq-list details > p,
#app .nd-faq-preview .nd-faq-list details > p {
  margin: 0;
  max-width: 68ch;
  padding: 0 .95rem .85rem;
  color: var(--faq-muted);
  line-height: 1.55;
}
.nd-faq-preview { text-align: center; }
.nd-faq-preview .nd-faq-list { max-width: 47rem; margin-inline: auto; }
.faq-page { max-width: 52rem; margin: 0 auto clamp(2rem, 7vw, 5rem); }
.faq-group + .faq-group { margin-top: 2rem; }
.faq-group h2,
.nd-first-steps h2 {
  margin: 0;
  font: 400 clamp(1.55rem, 3vw, 2.2rem)/1.15 Georgia, serif;
}
.nd-first-steps { margin: 0 0 clamp(1.6rem, 4vw, 3rem); text-align: center; }
.nd-first-steps ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  margin: .9rem 0 0;
  padding: 0;
  text-align: start;
  list-style: none;
  counter-reset: first-step;
}
.nd-first-steps li {
  counter-increment: first-step;
  padding: .85rem 1rem;
  border: 1px solid #704b62;
  border-radius: .85rem;
  background: #2b1c2d;
}
.nd-first-steps li::before {
  content: counter(first-step) ". ";
  color: #ffb7ce;
  font-weight: 700;
}
.nd-first-steps p { margin: .35rem 0 0; color: #e7cedb; }
@media (max-width: 700px) {
  .nd-first-steps ol { grid-template-columns: minmax(0, 1fr); }
}
