.faq__main {
  background-color: rgb(82 189 196 / 10%);
  padding: 66px 0;
  margin-top: 98px;
}

.faq__main .faq__wrap {
  min-height: 450px;
  position: relative;
}

.faq__item {
  display: flex;
  justify-content: flex-end;
  
}

.faq__answer {
  position: absolute;
  display: none;
  top: 0;
  left: 0;
  right: 385px;
  bottom: 0;
  padding-right: 100px;
}
.faq__answer p:not(:last-child){
  margin-bottom: 12px;
}
.faq__answer ul{
  list-style: disc;
  padding-left: 20px;
   margin-bottom: 12px;
}
.faq__answer ol{
   list-style: numeric;
  padding-left: 20px;
   margin-bottom: 12px;
}
.faq__item.active .faq__answer {
  display: block;
}

.answer_title {
  font-size: 20px;
  color: var(--main-accent2);
  line-height: 140%;
  margin-bottom: 14px;
}

.answer_text {
  font-size: 14px;
  line-height: 140%;
  color: var(--main-text);
}
.faq__blog__wrap .answer_text,.faq__service__wrap .answer_text{
  margin-bottom: 12px;
}
.faq__blog__wrap .faq__item:last-child .answer_text,.faq__service__wrap .faq__item:last-child .answer_title{
  margin-top: 12px;
}
.answer_img {
  margin-top: 26px;
  border-radius: 20px;
}

.faq_question {
  width: 385px;
  padding: 8px 24px;
  border: 1px solid var(--main-accent4);
  background-color: #fff;
  border-radius: 100px;
  display: flex;
  align-items: center;
  font-size: 14px;
  line-height: 140%;
  justify-content: space-between;
  cursor: pointer;
}

.faq__item:not(:last-child) .faq_question {
  margin-bottom: 12px;
}

.faq_question .plus_sign {
  border: 1px solid var(--main-accent4);
  border-radius: 100px;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.faq_question .icon-icons_cross {
  transition: rotate 0.3s ease;
}

.faq__item.active .icon-icons_cross {
  rotate: 45deg;
}

/* Blog & Service FAQ variants */
.faq__blog__wrap,
.faq__service__wrap {
  background-color: #eef9fa;
  border-radius: 24px;
  padding: 26px 102px;
  margin-top: 68px;
}

.faq__blog__wrap .faq__item,
.faq__service__wrap .faq__item {
  display: grid;
  grid-template-rows: max-content 0fr;
  overflow: hidden;
  transition: grid-template-rows 0.5s ease;
  justify-content: normal;
}

.faq__blog__wrap .faq__item.active,
.faq__service__wrap .faq__item.active {
  grid-template-rows: max-content 1fr;
}

.faq__blog__wrap .faq__answer,
.faq__service__wrap .faq__answer {
  position: static;
  display: block;
  min-height: 0;
  padding-right: 0;
}

.faq__blog__wrap .faq_question,
.faq__service__wrap .faq_question {
  width: 100%;
}

@media(max-width:1199px){
  .faq__main{
    margin-top: 68px;
  }
  .faq__block__heading{
    max-width: 384px;
  }
  .faq__answer{
    padding-right: 24px;
  }
}

@media(max-width:822px){
  
  .faq__item{
    display: grid;
    grid-template-rows: max-content 0fr;
    transition: grid-template-rows 0.5s ease-in-out;
    overflow: hidden;
  }
  .faq__item.active{
    grid-template-rows: max-content 1fr;
  }
  .faq_question{
    order: 1;
    width: 100%;
  }
  .faq__answer{
    position: static;
    order: 2;
    min-height: 0; 
    display: block;
  }
  .answer_img{
    margin: 0 auto;
    margin-top: 26px;
  }
  .faq__answer > :last-child {
    margin-bottom: 10px;
  }
}
@media(max-width:768px){
  .faq__service__wrap, .faq__blog__wrap {
    padding: 26px;
  }
  .faq_question{
    gap: 5px;
  }
}
@media(max-width:525px){
  .faq__service__wrap, .faq__blog__wrap {
    padding: 26px 10px;
  }
}