/* Hallmark · genre: modern-minimal · macrostructure: Long Document · design-system: design.md
 * Support page — loaded after content.css (page head, Q&A).
 * Contact strip as form fields, topics as ruled rows. No cards, no icon tiles.
 */

.support { padding-bottom: var(--space-3xl); }

/* ---------- Contact strip ---------- */
.support-contact { border-top: var(--rule-strong); padding-top: var(--space-md); max-width: 52rem; }
.support-contact__title { font-size: var(--text-xl); }
.support-contact__rows { margin: var(--space-md) 0 0; border-top: var(--rule); }
.support-contact__row {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xs);
  padding-block: var(--space-sm);
  border-bottom: var(--rule);
}
.support-contact__row dd {
  margin: 0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--space-xs) var(--space-md);
}
.support-contact__row dd:has(> .btn:only-child) { justify-content: flex-start; }
.support-contact__value {
  font-size: var(--text-md); font-weight: 500; letter-spacing: -0.01em;
  color: var(--color-ink); text-decoration: none;
  overflow-wrap: anywhere; min-width: 0;
  transition: color var(--dur-short) var(--ease-out);
}
a.support-contact__value:hover { color: var(--color-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
.support-contact__note { margin-top: var(--space-sm); font-size: var(--text-sm); color: var(--color-muted); max-width: var(--measure); }
@media (min-width: 40rem) {
  .support-contact__row { grid-template-columns: 7rem minmax(0, 1fr); align-items: center; gap: var(--space-md); }
  .support-contact__row dd:has(> .btn:only-child) { justify-content: flex-end; }
}

/* ---------- Sections ---------- */
.support-section { margin-top: var(--space-3xl); }

/* Topics — ruled rows: title left, guidance + links right */
.topics { border-top: var(--rule); }
.topic {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xs);
  padding-block: var(--space-md);
  border-bottom: var(--rule);
}
.topic h3 { font-size: var(--text-md); }
.topic__body { max-width: 65ch; }
.topic__body > p:first-child { color: var(--color-muted); }
.topic__links { margin-top: var(--space-xs); display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-lg); font-size: var(--text-sm); font-weight: 600; }
.topic__links a { white-space: nowrap; }
@media (min-width: 52rem) {
  .topic { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-xl); }
}

.support-more { margin-top: var(--space-md); font-size: var(--text-sm); }