/* =====================================================================
   faq.css — global restyle of the Webflow FAQ tabs/accordion block.
   Loaded AFTER webflow-shared.css (see BaseLayout) so these rules win.

   The FAQ ships as frozen Webflow markup on many pages. Rather than edit
   dozens of frozen HTML files, this ONE stylesheet retargets the existing
   classes — WITHOUT touching the DOM, so every Q&A stays crawlable
   (SEO/GEO). Tab JS keeps working but is made irrelevant.

   Guillaume 2026-08-01: NO grid, NO category buttons (General/Merchants/
   Experts/Private Circle) — one clean, centred, single-column FAQ. The
   category rail is hidden and ALL tab panes are shown so every question
   still renders (and is crawlable) in one stacked column, centred.

   Targeted classes (all from the Webflow export):
     .section.pd-120px            → FAQ section shell
     .display-2                   → "Frequently Asked Questions" heading
     .tabs-wrapper.tabs-left      → tabs layout
     .tabs-menu.tabs-vertical     → category rail  (HIDDEN)
     .tabs-content                → the Q&A column (CENTRED)
     .w-tab-pane                  → per-category pane (ALL shown)
     .accordion-item-wrapper      → one Q&A row
     .accordion-title             → the question
     .acordion-body               → the answer (sic — Webflow typo)
   Scoped under .section.pd-120px so no OTHER pd-120px section is hit.
   ===================================================================== */

/* --- section shell: tighter air, clean seam into the footer, NO grid --- */
.section.pd-120px {
  padding-top: clamp(56px, 7vw, 96px) !important;
  padding-bottom: clamp(32px, 5vw, 64px) !important;
}

/* --- heading: centred, tidy, still a clear crawlable <h2> -------------- */
.section.pd-120px .display-2 {
  font-size: clamp(26px, 3.4vw, 40px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.01em !important;
  text-align: center !important;
  margin-bottom: clamp(28px, 4vw, 48px) !important;
}

/* --- kill the left category rail entirely ------------------------------ */
.section.pd-120px .tabs-menu.tabs-vertical { display: none !important; }

/* --- single centred column: unwrap the two-col tabs layout ------------- */
.section.pd-120px .tabs-wrapper.tabs-left {
  display: block !important;
}
.section.pd-120px .tabs-content {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;   /* dead centre of the page */
  float: none !important;
}

/* --- show EVERY category's questions (all panes), stacked -------------- */
.section.pd-120px .w-tab-pane {
  display: block !important;
  opacity: 1 !important;
}

/* --- accordion rows: card-less, tight dividers, hover affordance ------- */
.section.pd-120px .accordion-item-wrapper {
  border-bottom: 1px solid #ffffff14 !important;
}
.section.pd-120px .accordion-item-wrapper:first-child {
  border-top: 1px solid #ffffff14 !important;
}
.section.pd-120px .accordion-header {
  padding: 22px 4px !important;
  cursor: pointer !important;
  transition: opacity .15s ease !important;
}
.section.pd-120px .accordion-header:hover { opacity: 0.82 !important; }
.section.pd-120px .accordion-title {
  font-size: clamp(16px, 1.5vw, 18px) !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  text-align: left !important;
}
/* answer body: quieter, readable measure */
.section.pd-120px .acordion-body p,
.section.pd-120px .acordion-body {
  color: var(--rc-text-muted, #c3c3d0) !important;
}
.section.pd-120px .acordion-body p {
  font-size: 15px !important;
  line-height: 1.6 !important;
  text-align: left !important;
}
.section.pd-120px .accordion-spacer { height: 6px !important; }
