API

<?php
  //ПАРАМЕТРЫ ДЛЯ ВЫВОДА FAQ
  $providers = '14';// Можно несколько, перечислите через запятую без пробелов
  $apikey = 'xxxxxxxxxxxxxxxxx';//апи ключ
?>
<style>
.accordion .accordion-item{
  margin-top: 6px;
}
.accordion .accordion-item>a {
    position: relative;
    /*display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;*/
    display: block;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    padding: 5px 45px 5px 10px;
    color: #7288a2;
    font-size: 16px;
    font-weight: 400;
    border-bottom: 1px solid #e5e5e5;
}

.accordion .accordion-item>a:hover,
.accordion a:hover::after {
  cursor: pointer;
  color: #03b5d2;
}

.accordion .accordion-item>a:hover::after {
  border: 1px solid #03b5d2;
}

.accordion .accordion-item>a.active {
  color: #03b5d2;
  border-bottom: 1px solid #03b5d2;
}

.accordion .accordion-item>a::after {
  font-family: 'FontAwesome';
  content: '\f107';
  position: absolute;
  float: right;
  margin-top: -11px;
  right: 1rem;
  font-size: 1rem;
  color: #7288a2;
  padding: 5px;
  width: 30px;
  height: 30px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #7288a2;
  text-align: center;
}

.accordion .accordion-item>a.active::after {
  font-family: 'FontAwesome';
  content: '\f106';
  color: #03b5d2;
  border: 1px solid #03b5d2;
}

.accordion .content {
  opacity: 0;
  padding: 0 1rem;
  max-height: 0;
  border-bottom: 1px solid #e5e5e5;
  overflow: hidden;
  clear: both;
  -webkit-transition: all 0.2s ease 0.15s;
  -o-transition: all 0.2s ease 0.15s;
  transition: all 0.2s ease 0.15s;
}

.accordion .content p {
  font-size: 1rem;
  font-weight: 300;
}

.accordion .content.active {
  opacity: 1;
  padding: 1rem;
  max-height: 100%;
  -webkit-transition: all 0.35s ease 0.15s;
  -o-transition: all 0.35s ease 0.15s;
  transition: all 0.35s ease 0.15s;
}
</style>

<div class="accordion">
  <?php 
  $handle = curl_init('https://domconnect.ru/api.get_faqs?provs='.$providers.'&apikey='.$apikey);
  curl_setopt($handle, CURLOPT_RETURNTRANSFER, TRUE);
  curl_setopt($handle, CURLOPT_SSL_VERIFYPEER, FALSE);
  curl_setopt($handle, CURLOPT_CONNECTTIMEOUT, 10);
  curl_setopt($handle, CURLOPT_TIMEOUT, 10);
  $faqs_json = curl_exec($handle);
  $faq_posts = json_decode($faqs_json,true);
  $faq_posts = $faq_posts['response']['faqs'];
  if(is_Array($faq_posts)){
  foreach ($faq_posts as $k => $faq): ?>
  <div class="accordion-item">
    <a><?=$faq['title']?></a>
    <div class="content" style="color: black">
      <p><?=$faq['text']?></p>
    </div>
  </div>
  <? endforeach;} ?>
</div>
<script>
const items = document.querySelectorAll(".accordion .accordion-item>a");

function toggleAccordion(){
  this.classList.toggle('active');
  this.nextElementSibling.classList.toggle('active');
}

items.forEach(item => item.addEventListener('click', toggleAccordion));
</script>