.app-help-hero {
  color: var(--app-color-text);
  background:
    radial-gradient(circle at 16% 14%, color-mix(in srgb, var(--app-color-accent) 18%, transparent), transparent 30rem),
    radial-gradient(circle at 84% 18%, color-mix(in srgb, var(--app-color-primary) 14%, transparent), transparent 28rem),
    linear-gradient(180deg, var(--app-color-surface-alt), var(--app-color-bg));
}

.app-help-hero > .container {
  max-width: 920px;
}

.app-help-search {
  margin: var(--app-space-5) auto 0;
}

.app-help-section {
  padding: var(--app-space-8) 0;
}

.app-help-section--alt {
  background-color: var(--app-color-surface-alt);
}

.app-help-topic-card {
  display: grid;
  align-content: start;
  gap: var(--app-space-3);
}

.app-help-topic-card__icon {
  margin-bottom: var(--app-space-1);
}

.app-help-topic-card__title {
  margin-bottom: 0;
}

.app-help-contact-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--app-space-5);
}

.app-help-contact-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--app-space-3);
}

.app-help-mobile-actions {
  display: grid;
  gap: var(--app-space-2);
}

.app-help-mobile-actions .app-btn {
  width: 100%;
}

@media (max-width: 768px) {
  .app-help-desktop-section {
    display: none;
  }

  .app-help-contact-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .app-help-contact-card__actions {
    width: 100%;
  }

  .app-help-contact-card__actions .app-btn {
    width: 100%;
  }

  .app-layout-v3 > footer {
    margin-top: var(--app-space-2);
  }

  .app-floating-actions {
    display: none;
  }
}