/* FAQ V3 page styles */

.app-faq-hero {
  color: var(--app-color-text);
  background:
    radial-gradient(circle at 12% 12%, color-mix(in srgb, var(--app-color-accent) 18%, transparent), transparent 32rem),
    radial-gradient(circle at 88% 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-faq-hero > .container {
  max-width: 920px;
}

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

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

.app-faq-content__title {
  margin-bottom: var(--app-space-4);
  font-size: var(--app-font-size-600);
  font-weight: 800;
  line-height: var(--app-line-height-tight);
}

.app-faq-answer {
  color: var(--app-color-text);
  font-size: var(--app-font-size-300);
  line-height: 1.9;
  white-space: pre-line;
}

.app-faq-answer p:last-child {
  margin-bottom: 0;
}

.app-faq-related {
  margin-top: var(--app-space-5);
}

.app-faq-related__header {
  margin-bottom: var(--app-space-4);
}

.app-faq-related__title {
  margin: 0;
  font-size: var(--app-font-size-500);
  font-weight: 800;
}

.app-faq-content .app-breadcrumb a:has(.app-icon) {
  text-decoration-line: underline;
}

.app-faq-content .app-breadcrumb__ellipsis {
  font-weight: 800;
}

.app-faq-content a.app-breadcrumb__ellipsis {
  text-decoration-line: underline;
}

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

  .app-faq-content__title {
    margin-bottom: var(--app-space-3);
    font-size: var(--app-font-size-500);
  }

  .app-faq-answer {
    font-size: var(--app-font-size-300);
    line-height: var(--app-line-height-normal);
  }

  .app-faq-related {
    margin-top: 0;
  }

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

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