/* Keep support steps readable within the app's existing comic palette. */
.help-intro,
.help-topics,
.help-contact {
  padding: 3rem max(1.5rem, calc((100% - 1160px) / 2));
}
.help-intro {
  background: #292020 url("./app/rt-app-background-centered.webp") center / cover no-repeat;
  background-blend-mode: multiply;
  border-bottom: 1px solid #683023;
}
.help-intro h1 { font-size: clamp(2rem, 6vw, 3.8rem); line-height: 1.12; margin-bottom: 1rem; }
.help-intro h2 { font-size: 1.5rem; margin: 2rem 0 1rem; }
.help-lede { max-width: 48rem; }
.troubleshooting-page p,
.troubleshooting-page li { font-size: 1rem; line-height: 1.7; color: #e4d8d2; }
.troubleshooting-page strong { color: #fff8f3; }
.help-first-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; padding-left: 1.5rem; }
.help-first-steps li { padding-left: .25rem; }
.help-first-steps li::marker { color: #ffb16c; font-weight: 800; }
.help-jump-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 2rem; }
.help-jump-links a { padding-block: .5rem; color: #ffb16c; font-size: 1rem; text-underline-offset: .2em; }
.help-topics { background: #100d0d; }
.help-topics > h2 { margin-bottom: 1.75rem; font-size: clamp(1.75rem, 4vw, 2.4rem); }
.help-topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.help-topic-grid article { padding: 1.75rem; border: 1px solid #683023; border-radius: 1.25rem; background: #1c1411; scroll-margin-top: 7rem; }
.help-topic-grid h3 { font-size: 1.35rem; line-height: 1.35; margin: 0 0 1rem; }
.help-topic-grid ul,
.help-send-log ol { margin: 0; padding-left: 1.25rem; }
.help-topic-grid li + li,
.help-send-log li + li { margin-top: .8rem; }
.help-topic-grid a { color: #ffb16c; text-underline-offset: .2em; }
.help-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; border-top: 1px solid #683023; background: #171212; scroll-margin-top: 5rem; }
.help-contact h2 { font-size: clamp(1.75rem, 4vw, 2.4rem); }
.help-contact h3 { font-size: 1.35rem; line-height: 1.35; }
.help-contact .rt-app-button { margin-top: .75rem; }
.help-send-log > p { margin-top: 1.25rem; }
@media (max-width: 820px) {
  .help-first-steps,
  .help-topic-grid,
  .help-contact { grid-template-columns: minmax(0, 1fr); }
  .help-first-steps { gap: 1rem; }
  .help-contact { gap: 2rem; }
}
@media (max-width: 480px) {
  .help-topic-grid article { padding: 1.25rem; }
  .troubleshooting-page .help-contact .rt-app-button { --button-cap: 1.6rem; width: 100%; padding-inline: .25rem; font-size: 1rem; }
}
.help-open-app[hidden] { display: none; }
.help-open-app { margin-bottom: 1.5rem; }
.help-open-app #diagnostics-app-help { font-size: .95rem; }
.troubleshooting-page .help-open-app .rt-app-button { font-size: 1rem; }
