/* ==========================================================================
   Textum Media — faq.css
   Page-only rules for /faq. Loaded after site.css.
   One job: the sticky left column beside the accordion. The accordion, the
   notice and the buttons are untouched shared components.
   Tokens only, no hex, no id selectors.
   ========================================================================== */


.faq-aside {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: var(--space-3);
}

/* Sticky only where there are two columns; below 901px .grid stacks and a
   sticky sidebar would sit on top of the answers. */
@media (min-width: 901px) {
  .faq-aside {
    position: sticky;
    top: calc(var(--nav-h) + var(--space-3));
  }
}

.faq-aside__title {
  font-size: var(--fs-xl);
  line-height: var(--lh-heading);
  letter-spacing: var(--tracking-display);
}

.faq-aside__body {
  font-size: var(--fs-sm);
  color: var(--fg-2);
  max-width: var(--measure-narrow);
}

.faq-contact {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  width: 100%;
  padding-top: var(--space-3);
  border-top: 1px solid var(--rule);
}

.faq-contact__link {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  letter-spacing: var(--tracking-mono);
  color: var(--link);
  text-decoration: none;
  overflow-wrap: anywhere;
}

.faq-contact__link:hover {
  text-decoration: underline;
}

/* Pull the promise line tight under the two contact links. */
.faq-aside__promise {
  margin-top: calc(var(--space-2) * -1);
}

.faq-still {
  margin-top: var(--space-6);
}