/* =========================================================
   FAQs · /faqs — Function Health FAQ pattern, Fitcom brand
   (centred head + rule · left jump-to rail with search and
   scrollspy · right topic sections of soft accordion cards)
   ========================================================= */

/* head */
.page-faqs .faqx-head{ padding:calc(84px + clamp(3rem,7vw,6rem)) 0 0; text-align:center; background:#fff; }
.page-faqs .faqx-head__h1{ font:800 clamp(2.6rem,5.5vw,4.2rem)/1 'Poppins',sans-serif; letter-spacing:-.02em; margin:0 0 1rem; }
.page-faqs .faqx-head__lead{ margin:0 0 clamp(2rem,4.5vw,3.4rem); font-size:1.05rem; color:var(--fc-mid,#5c5c5c); }
.page-faqs .faqx-head__rule{ border:0; border-top:1px solid var(--fc-line,#ECE8E2); margin:0; }

/* two-column body */
.page-faqs .faqx-body{ background:#fff; padding:clamp(2.4rem,5vw,4rem) 0 clamp(3rem,6vw,5rem); }
.page-faqs .faqx-grid{ display:grid; grid-template-columns:260px minmax(0,1fr); gap:clamp(2rem,5vw,4.5rem); align-items:start; }

/* left rail */
.page-faqs .faqx-rail{ position:sticky; top:110px; min-width:0; } /* min-width:0: the chip strip's content width must not stretch the grid column */
.page-faqs .faqx-search{ position:relative; margin-bottom:1.6rem; }
.page-faqs .faqx-search input{ width:100%; box-sizing:border-box; font:500 .95rem/1 'Poppins',sans-serif;
  color:var(--fc-ink,#141414); background:#fff; border:1px solid var(--fc-line,#D9D4CC); border-radius:999px;
  padding:.85rem 2.8rem .85rem 1.2rem; outline:none; }
.page-faqs .faqx-search input:focus{ border-color:var(--fc-orange,#F6921E); }
.page-faqs .faqx-search svg{ position:absolute; right:1rem; top:50%; transform:translateY(-50%); color:var(--fc-mid,#8a8a8a); pointer-events:none; }
.page-faqs .faqx-rail__label{ margin:0 0 .7rem; font:700 .72rem/1 'Poppins',sans-serif; letter-spacing:.16em; text-transform:uppercase; color:var(--fc-mid,#8a8a8a); }
.page-faqs .faqx-rail__nav{ display:flex; flex-direction:column; gap:.65rem; }
.page-faqs .faqx-rail__nav a{ font:600 .95rem/1.3 'Poppins',sans-serif; color:var(--fc-ink-2,#414042);
  text-decoration:none; width:fit-content; border-bottom:2px solid transparent; padding-bottom:.15rem;
  transition:color .15s ease, border-color .15s ease; }
.page-faqs .faqx-rail__nav a:hover{ color:var(--fc-ink,#141414); }
.page-faqs .faqx-rail__nav a.is-on{ color:var(--fc-orange,#F6921E); border-bottom-color:var(--fc-orange,#F6921E); }

/* right topics */
.page-faqs .faqx-topic{ margin-bottom:clamp(2.4rem,5vw,3.6rem); scroll-margin-top:120px; }
.page-faqs .faqx-topic__h2{ font:800 clamp(1.5rem,2.6vw,2.1rem)/1.2 'Poppins',sans-serif; letter-spacing:-.01em; margin:0 0 1.1rem; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-list{ display:flex; flex-direction:column; gap:.7rem; }

/* accordion card, Fitcom original: white hairline card; the toggle is the
   brand double-chevron (logo motif) in orange, flipping 180° when open;
   open card lifts onto parchment with the question in orange */
:is(.page-faqs, .page-trial, .page-branch) .faqx-item{ background:#fff; border:1px solid var(--fc-line,#ECE8E2); border-radius:14px;
  overflow:hidden; transition:background .2s ease, border-color .2s ease; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item summary{ display:flex; align-items:center; justify-content:space-between; gap:1rem;
  cursor:pointer; list-style:none; padding:1.15rem 1.3rem; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item summary::-webkit-details-marker{ display:none; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__q{ font:600 1rem/1.4 'Poppins',sans-serif; color:var(--fc-ink,#141414); transition:color .2s ease; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__sign{ flex:none; display:grid; place-items:center; width:30px; height:30px;
  color:var(--fc-orange,#F6921E); transition:transform .25s ease; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item[open] .faqx-item__sign{ transform:rotate(180deg); }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item[open]{ background:var(--fc-paper,#F7F5F1); border-color:transparent; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item[open] .faqx-item__q{ color:var(--fc-orange,#F6921E); }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__a{ padding:0 1.3rem 1.25rem; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__a p{ margin:0; font-size:.96rem; line-height:1.7; color:var(--fc-ink-2,#414042); max-width:70ch; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item:hover{ border-color:rgba(246,146,30,.4); }

.page-faqs .faqx-empty{ margin:1rem 0 0; color:var(--fc-mid,#5c5c5c); }

/* links inside answers + the dark CTA band */
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__a a{ color:var(--fc-orange,#F6921E); font-weight:600; text-decoration:none;
  border-bottom:1.5px solid rgba(246,146,30,.45); transition:border-color .15s ease; }
:is(.page-faqs, .page-trial, .page-branch) .faqx-item__a a:hover{ border-bottom-color:var(--fc-orange,#F6921E); }
.page-faqs .fc-finalcta__wa{ color:#fff; font-weight:600; text-decoration:none;
  border-bottom:1.5px solid rgba(246,146,30,.7); }
.page-faqs .fc-finalcta__wa:hover{ color:var(--fc-orange,#F6921E); }

/* mobile: rail collapses to a sticky horizontal chip strip */
@media (max-width:900px){
  .page-faqs .faqx-grid{ grid-template-columns:1fr; gap:1.4rem; }
  .page-faqs .faqx-rail{ position:sticky; top:64px; z-index:5; background:#fff; padding:.7rem 0 .6rem; }
  .page-faqs .faqx-rail__label{ display:none; }
  .page-faqs .faqx-rail__nav{ flex-direction:row; gap:.45rem; overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; padding-bottom:.2rem; }
  .page-faqs .faqx-rail__nav::-webkit-scrollbar{ display:none; }
  .page-faqs .faqx-rail__nav a{ flex:none; border:1px solid var(--fc-line,#ECE8E2); border-radius:999px;
    padding:.55rem .95rem; font-size:.85rem; border-bottom-width:1px; }
  .page-faqs .faqx-rail__nav a.is-on{ background:var(--fc-ink,#141414); border-color:var(--fc-ink,#141414);
    color:#fff; }
  .page-faqs .faqx-search{ margin-bottom:.8rem; }
}
