/*--------------------------------------------------
 *               FAQ section
 * ----------------------------------------------------*/
#faq {
  width: 100%;
  padding: 5rem 2rem 5.5rem 2rem;
  position: relative;
  z-index: 2;
}
#faq::before {
  content: var(--pseudo-content);
  position: absolute;
  width: 700px;
  height: 400px;
  border-radius: 50%;
  background: rgba(0, 72, 225, 0.6);
  right: 5%;
  bottom: -15%;
  filter: blur(140px);
}
#faq::after {
  content: var(--pseudo-content);
  position: absolute;
  width: 700px;
  height: 500px;
  border-radius: 50%;
  background: #21f0f666;
  right: 11%;
  bottom: 23%;
  filter: blur(140px);
}
#faq .content {
  max-width: 1200px;
  margin: 0 auto;
}
#faq .content > div {
  margin-top: 2rem;
  border-bottom: solid #00000038 4px;
  background: #0000007a;
  z-index: 2;
  position: relative;
  /* border-radius: 20px; */
  overflow: hidden;
  /* box-shadow: 2px 9px 32px #00000080; */
}
#faq .content .payment {
  display: none;
}
#faq label {
  display: block;
}
#faq input {
  appearance: none;
  opacity: 0;
  display: none;
}
#faq :is(h2, label, p) {
  font-family: "Poppins";
}
#faq h2 {
  text-align: center;
  line-height: normal;
  margin-bottom: 5rem;
}
#faq p {
  z-index: 2;
  font-size: clamp(0.8125rem, 1vw, 1rem);
  font-weight: 300;
  color: #ffffffc4;
}
#faq a {
  color:#21eeef;
  text-decoration: underline;
  font-weight: 500;
  white-space: nowrap;
}
#faq a:hover {
  color: white;
  text-decoration: none;
}
#faq label.choose-topic {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  /* background: #F4F4F4; */
  box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.1490196078) inset;
  padding: 0.4rem;
  border-radius: 40px;
  align-items: center;
  position: relative;
}
#faq label.choose-topic .marker {
  position: absolute;
  height: -webkit-fill-available;
  /* background: black; */
  border-radius: 30px;
  margin: 0.4rem 0;
  transition: all 0.35s cubic-bezier(0.24, -0.52, 0.76, 1.42);
}
#faq label.choose-topic b {
  font-size: clamp(1rem, 2vw, 14px);
  font-weight: 600;
  user-select: none;
  cursor: pointer;
  padding: 0.8rem 1.5rem;
  border-radius: 40px;
  transition: background 0.25s, color 0.25s;
  z-index: 2;
}
#faq label.choose-topic b#software {
  cursor: default;
}
#faq label.choose-topic:has(input:checked) b#software {
  cursor: pointer;
}
#faq label.choose-topic:has(input:checked) b#payment {
  cursor: default;
}
#faq label.choose-topic:has(input:checked) ~ .software {
  display: none;
}
#faq label.choose-topic:has(input:checked) ~ .payment {
  display: block;
}
#faq label.question {
  border-top: solid #fff 1px;
  padding: 1.2rem 2rem 1.2rem 1.5rem;
  font-size: clamp(14px, 1vw, 1.1rem);
  font-weight: 400;
  cursor: pointer;
  user-select: none;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16 16' style='enable-background:new 0 0 16 16%3B' xml:space='preserve'%3E%3Cg fill='none' stroke='%2321EEEF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10'%3E%3Cline class='st0' x1='8' y1='3.4' x2='8' y2='12.6'/%3E%3Cline class='st0' x1='12.6' y1='8' x2='3.4' y2='8'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center right 2%;
  background-size: clamp(17px, 2vw, 20px);
  transition: all 0.3s;
}
#faq .answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s;
}
#faq .answer > p {
  overflow: hidden;
  margin: 0;
  padding: 0 1.5rem;
  opacity: 0;
  transition: all 0.25s;
}
#faq label.question:has(input:checked) {
  background: #2b2b31a6;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16 16' style='enable-background:new 0 0 16 16%3B' xml:space='preserve'%3E%3Cline fill='none' stroke='%2321EEEF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' x1='12.6' y1='8' x2='3.4' y2='8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center right 2%;
  background-size: clamp(17px, 2vw, 20px);
}
#faq label.question:has(input:checked) + .answer {
  grid-template-rows: 1fr;
}
#faq label.question:has(input:checked) + .answer > p {
  padding: 1rem 1.5rem;
  /* background: #F2FDFF; */
  opacity: 1;
  color: #ffffff7d;
}

#main-content {
  padding-bottom: 0;
}

.testimonials {
  margin-bottom: 0;
}
/* .testimonials ~ #faq {
  margin-bottom: 1rem;
} */

@media (max-width: 1280px) {
  #faq {
    width: var(--main-width);
    margin: 0 auto;
    padding: 4rem 0 2rem 0;
  }
}