/* FAQ & author notes — shared quote styling */

.faq-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.faq-header .doc-title,
.faq-header .doc-section-title {
  margin-bottom: 0;
}

/* Standalone speaker bar */
.faq-speaker-bar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.75rem;
}

.faq-speaker-button {
  color: var(--color-ink-faded);
  opacity: 0.4;
  padding: 0.25rem;
  transition: opacity var(--dur-base), color var(--dur-base);
}
.faq-speaker-button:hover,
.faq-speaker-button:focus-visible {
  opacity: 0.8;
  outline: none;
}
.faq-speaker-button[aria-pressed="true"] {
  opacity: 0.7;
  color: var(--color-warm-wood);
}

.faq-speaker-button[aria-pressed="false"] .faq-speaker-icon-on  { display: none; }
.faq-speaker-button[aria-pressed="true"]  .faq-speaker-icon-off { display: none; }

.faq-item {
  margin-bottom: 1.5rem;
}

/* Quotes */

.quote {
  padding: 0.6rem 0 0.6rem 1rem;
  border-left: 2px solid var(--border-medium);
  margin-bottom: 0.5rem;
  position: relative;
}

.speaker {
  display: none;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-warm-wood);
  margin-bottom: 0.25rem;
}

.quote p {
  font-family: var(--font-body);
  font-size: clamp(0.85rem, 2vw, 0.95rem);
  line-height: 1.7;
  color: var(--color-ink);
  margin-bottom: 0.5rem;
}

.quote p:last-child {
  margin-bottom: 0;
}

.quote-gene {
  border-left-color: var(--color-candle-dim);
}
.quote-gene p {
  font-style: italic;
  font-size: clamp(0.85rem, 2vw, 0.93rem);
}

.quote-harper {
  border-left-color: var(--color-steel);
}
.quote-harper p {
  font-family: var(--font-heading);
  font-size: clamp(0.85rem, 2vw, 0.93rem);
}