
/* v432G — FAQ page manual layout cleanup.
   Scope: faq.html only. Real page-by-page pass after Fees. */

body:has(.faq-expanded-page){
  --faq-rail: 1368px;
  --faq-gutter: clamp(36px, 4.2vw, 72px);
  --faq-gap: clamp(22px, 2.4vw, 34px);
}

/* FAQ hero, tools/search block, FAQ content and footer now share one clear rail. */
body:has(.faq-expanded-page) .faq-compact-hero-v290G > .container,
body:has(.faq-expanded-page) main.section > .faq-expanded-page,
body:has(.faq-expanded-page) footer > .container,
body:has(.faq-expanded-page) .footer-grid{
  width:min(calc(100% - (var(--faq-gutter) * 2)), var(--faq-rail)) !important;
  max-width:var(--faq-rail) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Reduce the sense that the hero uses one page width and FAQ tools use another. */
body:has(.faq-expanded-page) .faq-compact-hero-v290G{
  padding-top:clamp(34px, 4vw, 54px) !important;
  padding-bottom:clamp(34px, 4vw, 54px) !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

body:has(.faq-expanded-page) .faq-hero-visual-card-v290G{
  width:100% !important;
  min-height:clamp(260px, 24vw, 330px) !important;
  border-radius:30px !important;
}

body:has(.faq-expanded-page) .faq-hero-copy-v290G{
  padding:clamp(38px, 4vw, 58px) clamp(34px, 4vw, 56px) !important;
  max-width:720px !important;
}

body:has(.faq-expanded-page) .faq-hero-copy-v290G h1{
  font-size:clamp(44px, 4.7vw, 72px) !important;
  line-height:.98 !important;
  max-width:12.5ch !important;
}

body:has(.faq-expanded-page) .faq-hero-copy-v290G p{
  max-width:660px !important;
}

/* Main FAQ area: no drifting card island. */
body:has(.faq-expanded-page) main.section{
  padding-top:clamp(64px, 6vw, 96px) !important;
  padding-bottom:clamp(70px, 6vw, 104px) !important;
}

body:has(.faq-expanded-page) .faq-expanded-page{
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Search/filter card forced to same full rail and cleaner internal alignment. */
body:has(.faq-expanded-page) .faq-tools-card{
  width:100% !important;
  max-width:100% !important;
  margin:0 auto clamp(28px, 3vw, 42px) !important;
  padding:clamp(24px, 2.6vw, 36px) !important;
  border-radius:30px !important;
  box-sizing:border-box !important;
}

body:has(.faq-expanded-page) .faq-tools-row{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 140px !important;
  gap:16px !important;
  align-items:end !important;
  width:100% !important;
}

body:has(.faq-expanded-page) .faq-search-label{
  width:100% !important;
}

body:has(.faq-expanded-page) .faq-search-input{
  width:100% !important;
  min-height:58px !important;
  border-radius:18px !important;
}

body:has(.faq-expanded-page) .faq-clear-btn{
  width:140px !important;
  min-height:58px !important;
  border-radius:999px !important;
}

/* Pills: keep them inside the same card, left aligned but not squeezed. */
body:has(.faq-expanded-page) .faq-filter-pills,
body:has(.faq-expanded-page) .faq-page-pills{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:12px !important;
  width:100% !important;
}

body:has(.faq-expanded-page) .faq-filter-pills{
  margin-top:18px !important;
}

body:has(.faq-expanded-page) .faq-page-pills{
  margin-top:14px !important;
}

body:has(.faq-expanded-page) .faq-filter-pill,
body:has(.faq-expanded-page) .faq-page-pill{
  flex:0 1 auto !important;
  max-width:100% !important;
  white-space:nowrap !important;
}

/* FAQ categories and answer cards share the same rail and stop looking like separate shifted blocks. */
body:has(.faq-expanded-page) .faq-category{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-top:clamp(30px, 3vw, 46px) !important;
}

body:has(.faq-expanded-page) .faq-category > h2{
  margin-left:0 !important;
  margin-right:auto !important;
  max-width:100% !important;
}

body:has(.faq-expanded-page) .faq-category-grid{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:var(--faq-gap) !important;
  align-items:stretch !important;
}

body:has(.faq-expanded-page) .faq-item{
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  box-sizing:border-box !important;
}

/* Pager and result count align with the FAQ rail, not a smaller internal card. */
body:has(.faq-expanded-page) .faq-pager-card,
body:has(.faq-expanded-page) .faq-pager-bottom-v289G,
body:has(.faq-expanded-page) .faq-result-count{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Do not let the floating Need Help pill visually collide with the FAQ tools. */
@media (min-width:1100px){
  body:has(.faq-expanded-page) .vge-chatbot-root:not(.is-open){
    right:18px !important;
  }
}

/* Tablet/mobile: keep same rail and stack answers cleanly. */
@media (max-width: 980px){
  body:has(.faq-expanded-page){
    --faq-gutter: clamp(22px, 5vw, 36px);
  }

  body:has(.faq-expanded-page) .faq-category-grid{
    grid-template-columns:1fr !important;
  }

  body:has(.faq-expanded-page) .faq-tools-row{
    grid-template-columns:1fr !important;
  }

  body:has(.faq-expanded-page) .faq-clear-btn{
    width:100% !important;
  }
}

@media (max-width: 640px){
  body:has(.faq-expanded-page){
    --faq-gutter:18px;
  }

  body:has(.faq-expanded-page) .faq-hero-visual-card-v290G{
    min-height:360px !important;
    border-radius:22px !important;
  }

  body:has(.faq-expanded-page) .faq-hero-copy-v290G{
    padding:28px 22px !important;
  }

  body:has(.faq-expanded-page) .faq-hero-copy-v290G h1{
    font-size:clamp(34px, 10vw, 48px) !important;
  }

  body:has(.faq-expanded-page) .faq-tools-card{
    padding:16px !important;
    border-radius:20px !important;
  }

  body:has(.faq-expanded-page) .faq-filter-pill,
  body:has(.faq-expanded-page) .faq-page-pill{
    white-space:normal !important;
  }
}
