/* ===================== FAQ ===================== */
.faq-head { padding: 81px 0 35px; text-align: center; }
.faq-head h1 { padding-bottom: 10px; font-size: 55px; font-weight: 700; line-height: 71.5px; color: #1f1f1f; }
.faq-search-gap { height: 24px; margin-top: 8px; }
.faq-intro { margin-top: 31px; padding-bottom: 10px; font-size: 18px; font-weight: 300; line-height: 27px; color: var(--ink-2); }

/* the live page has a 28px white strip between the intro and the questions */
.faq-body { margin-top: 28px; padding: 27px 0; }
.faq-grid { display: grid; grid-template-columns: 22.75% 1fr; column-gap: 3%; align-items: start; }

/* ---------- category picker ---------- */
.faq-filter { padding: 35px 20px; background: var(--white); border-radius: 10px; }
.faq-cat {
  display: block;
  margin-bottom: 10px;
  padding: 10px 7px 16px 35px;
  background: #f7f7f7;
  border-radius: 5px;
  font-size: 16px;
  line-height: 24px;
  color: #767676;
  cursor: pointer;
  transition: background-color 0.2s;
}
.faq-cat:hover { background: #f1f1f1; }
.faq-cat.active { padding-bottom: 10px; background: var(--orange); color: var(--white); }
.faq-cat input { width: 16px; height: 16px; margin: 4px 0 0 -24px; float: left; accent-color: var(--white); cursor: pointer; }

/* ---------- question lists: Divi's boxed toggle style ---------- */
.faq-lists { min-height: 725px; padding: 20px; background: var(--white); border-radius: 10px; }
.acc-boxed .acc-item { padding: 20px; border: 1px solid #d9d9d9; background: #f4f4f4; }
.acc-boxed .acc-item.open { background: var(--white); }
.acc-boxed .acc-q { padding: 0 50px 0 0; font-size: 20px; line-height: 24px; color: #666666; }
.acc-boxed .acc-item.open .acc-q { color: #333333; }
.acc-boxed .acc-q::before { left: auto; right: 0; top: 50%; margin-top: -11px; color: #cccccc; }
.acc-boxed .acc-item.open .acc-q::before { display: none; }
.acc-boxed .acc-a { padding: 35px 20px; }
.acc-boxed .acc-body { margin: 0; padding: 0; border: 0; font-size: 14px; font-weight: 400; line-height: 21px; color: #000000; }
.acc-boxed .acc-body p { margin: 0 0 16px; }
.acc-boxed .acc-body p + p { margin-top: 0; }

/* ---------- can't find it ---------- */
.faq-more { padding: 54px 0 50px; }
.faq-more-box { padding: 80px 0; background: #24272a; border-radius: 5px; text-align: center; }
.faq-more-box h2 { padding-bottom: 10px; font-size: 44px; font-weight: 700; line-height: 52.8px; color: var(--white); }
.faq-more-box p { margin-top: 32px; padding-bottom: 10px; font-size: 22px; font-weight: 300; line-height: 26.4px; color: #eeeeee; }
.faq-more-btn { margin-top: 31px; padding: 5.4px 18px; background: var(--orange); border-radius: 3px; font-size: 18px; font-weight: 300; line-height: 30.6px; color: var(--white); }
.faq-more-btn:hover { background: #ffad44; }

/* live: .disable-line-break hides these forced breaks below 1280px */
@media (max-width: 1279px) {
  .faq-intro br, .faq-more-box p br { display: none; }
}

/* ---------- tablet ---------- */
@media (max-width: 980px) {
  .faq-head { padding: 80px 0 38px; }
  .faq-head h1 { font-size: 43px; line-height: 42px; }
  .faq-intro { margin-top: 30px; }
  .faq-body { padding: 30px 0; }
  .faq-grid { grid-template-columns: 1fr; row-gap: 30px; }
  .faq-more { padding: 50px 0; }
  .faq-more-box p { margin-top: 30px; }
  .faq-more-btn { margin-top: 29px; }
}

/* ---------- phone ---------- */
@media (max-width: 767px) {
  .faq-head h1 { font-size: 26px; line-height: 42px; }
  .faq-more-box h2 { font-size: 26px; line-height: 31.2px; }
  .faq-more-box p { font-size: 16px; line-height: 19.2px; }
  .faq-more-box p br { display: none; }
}
@media (max-width: 580px) {
  .acc-boxed .acc-item { padding: 20px 0; }
}