/* BitFire support FAQ — category navigation and answer presentation.
   Shared documentation, FAQ accordion, header, footer, and CTA styles come
   from enterprise-base.css and enterprise-docs.css. */

.faq-hero { padding-bottom: 100px; }
.faq-hero .docs-hero-grid { align-items: center; margin-bottom: 62px; }
.faq-hero h1 { max-width: 820px; }
.faq-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.faq-start { border-color: rgba(91, 173, 218, 0.3); }

.faq-topic-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  padding: 8px;
  border: 1px solid rgba(167, 210, 233, 0.18);
  border-radius: 20px;
  background: rgba(10, 28, 45, 0.82);
  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.28);
}

.faq-topic-strip > a {
  min-height: 108px;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 13px;
  align-items: center;
  padding: 21px;
  border-right: 1px solid rgba(167, 210, 233, 0.1);
  color: #e5f1f7;
  transition: background 160ms ease;
}

.faq-topic-strip > a:last-child { border-right: 0; }
.faq-topic-strip > a:hover { background: rgba(91, 173, 218, 0.08); }
.faq-topic-strip .icon { width: 24px; color: #5eb9e5; }
.faq-topic-strip strong,
.faq-topic-strip small { display: block; }
.faq-topic-strip small { margin-top: 4px; color: #7891a1; }

.faq-intro { border-bottom: 1px solid #dfe7ec; }
.faq-intro-grid { display: grid; grid-template-columns: 0.88fr 1.12fr; gap: 80px; align-items: center; }
.faq-intro h2 { margin-bottom: 18px; color: #173247; font-weight: 790; letter-spacing: -0.055em; line-height: 1; }
.faq-intro p { margin-bottom: 0; }
.faq-principles { overflow: hidden; border: 1px solid #d8e2e8; border-radius: 18px; background: #fff; }
.faq-principles span { min-height: 64px; display: flex; align-items: center; gap: 13px; padding: 17px 22px; border-bottom: 1px solid #e1e8ed; color: #405c6e; font-weight: 750; }
.faq-principles span:last-child { border-bottom: 0; }
.faq-principles .icon { width: 19px; flex: 0 0 auto; color: #15905b; }

.faq-body { padding-top: 108px; }
.faq-page-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: clamp(55px, 8vw, 112px); align-items: start; }
.faq-documentation { min-width: 0; max-width: 900px; }
.faq-category { scroll-margin-top: calc(var(--nav-height) + 25px); }
.faq-category .doc-heading { margin-bottom: 34px; }
.faq-category .faq-list { box-shadow: 0 18px 45px rgba(7, 19, 34, 0.045); }
.faq-category .faq-list summary { cursor: pointer; }
.faq-category .faq-list summary:hover { color: #1277ae; }
.faq-category .faq-list details > div { max-width: 790px; padding-bottom: 26px; line-height: 1.72; }
.faq-category .faq-list details p + p { margin-top: 12px; }
.faq-category .answer-link a { color: #1475a8; font-weight: 800; }
.faq-category .answer-link a:hover { color: #0c5f8c; }

.faq-safety {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 15px;
  margin-top: 22px;
  padding: 24px 26px;
  border: 1px solid #edd5b1;
  border-radius: 16px;
  color: #583e20;
  background: #fff8ed;
}
.faq-safety .icon { width: 23px; color: #c47718; }
.faq-safety strong { display: block; margin-bottom: 5px; }
.faq-safety p { margin: 0; color: #755e41; }
.faq-cta { padding-top: 92px; }

@media (max-width: 1050px) {
  .faq-topic-strip { grid-template-columns: repeat(2, 1fr); }
  .faq-topic-strip > a:nth-child(2) { border-right: 0; }
  .faq-topic-strip > a:nth-child(-n + 2) { border-bottom: 1px solid rgba(167, 210, 233, 0.1); }
  .faq-page-layout { grid-template-columns: 205px minmax(0, 1fr); gap: 48px; }
}

@media (max-width: 820px) {
  .faq-hero .docs-hero-grid { margin-bottom: 48px; }
  .faq-intro-grid { grid-template-columns: 1fr; gap: 38px; }
  .faq-page-layout { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .faq-hero { padding-bottom: 66px; }
  .faq-hero-actions { align-items: stretch; flex-direction: column; }
  .faq-hero-actions .button { width: 100%; }
  .faq-topic-strip { grid-template-columns: 1fr; }
  .faq-topic-strip > a,
  .faq-topic-strip > a:nth-child(2),
  .faq-topic-strip > a:nth-child(-n + 2) { min-height: 88px; border-right: 0; border-bottom: 1px solid rgba(167, 210, 233, 0.1); }
  .faq-topic-strip > a:last-child { border-bottom: 0; }
  .faq-body { padding-top: 70px; }
  .faq-category .faq-list summary { padding: 19px 52px 19px 19px; }
  .faq-category .faq-list summary::after { right: 17px; }
  .faq-category .faq-list details > div { padding: 0 19px 22px; }
  .faq-safety { grid-template-columns: 1fr; padding: 21px; }
}
