/* =====================================================================
   FAQ page — loaded after styles.css and terms.css (same shell: black
   hero band, sticky topics list, .doc sections). Adds the question
   accordion. 1rem == 1 artboard px (1366 desktop, 430 phones).
   ===================================================================== */

.hero__sub--terms a { color: var(--white); text-decoration: underline; text-underline-offset: .12em; }
.hero__sub--terms a:hover, .hero__sub--terms a:focus-visible { color: var(--green); }

/* ---------- questions ---------- */
.qa__item { border-top: 1px solid #d9d9d9; }
.qa__item:last-child { border-bottom: 1px solid #d9d9d9; }
.qa__item summary { position: relative; cursor: pointer; list-style: none; font-family: var(--font-body); font-weight: 700; color: var(--black); transition: color .2s ease; }
.qa__item summary::-webkit-details-marker { display: none; }
.qa__item summary::after { content: "+"; position: absolute; right: 0; font-family: var(--font-display); font-weight: 400; color: var(--green-dark); }
.qa__item[open] summary::after { content: "\2013"; }
.qa__item summary:hover, .qa__item summary:focus-visible { color: var(--green-dark); outline: none; }
.qa__item p { color: #333; }
.qa__item a, .doc__more a { color: var(--green-dark); text-decoration: underline; text-underline-offset: .12em; }
.doc__more a { font-family: var(--font-display); letter-spacing: .05em; text-transform: uppercase; text-decoration: none; }
.doc__more a:hover, .doc__more a:focus-visible { color: var(--black); outline: none; }

@media (min-width: 1200px) {
  .qa { margin-top: 30rem; max-width: 760rem; }
  .qa__item summary { padding: 20rem 56rem 20rem 0; font-size: 21rem; line-height: 28rem; }
  .qa__item summary::after { top: 14rem; font-size: 36rem; }
  .qa__item p { padding: 0 56rem 24rem 0; font-size: 19rem; line-height: 27rem; }
  .doc__more { margin-top: 26rem; font-size: 19rem; }
}

@media (max-width: 1199px) {
  .qa { margin-top: 22rem; }
  .qa__item summary { padding: 15rem 36rem 15rem 0; font-size: 18rem; line-height: 24rem; }
  .qa__item summary::after { top: 10rem; font-size: 30rem; }
  .qa__item p { padding: 0 20rem 18rem 0; font-size: 16.5rem; line-height: 22rem; }
  .doc__more { margin-top: 20rem; font-size: 16rem; }
}