.faq_heading {
    font-size: clamp(20px, 4vw, 30px);
    line-height: 1.2;
    margin-bottom: 40px;
    text-align: center;
    margin-top: 100px;
    color: #000;
  }
  .faq_ans {
    font-size: 15px;
    width: 100%;
    text-align: center;
    color: #000;
  }
  main {
    max-width: 520px;
    margin: 0px auto;
    margin-bottom: 100px;
  
    summary {
      font-size: 18px;
      font-weight: 500;
      background-color: #6C63FF;
      color: #fff;
      padding: 1.5rem 1rem;
      margin-bottom: 1rem;
      outline: none;
      border-radius: 0.25rem;
      text-align: left;
      cursor: pointer;
      position: relative;
      border-radius: 4px !important;
      &:hover {
        text-decoration: underline;
        transition: all 0.5s ease;
      }
    }
    details[open] summary ~ * {
      animation: sweep 0.5s ease-in-out;
    }
    .faq__content {
      font-size: 15px;
      color: $black;
    }
  }
  @keyframes sweep {
    0% {
      opacity: 0;
      margin-top: -10px;
    }
    100% {
      opacity: 1;
      margin-top: 0px;
    }
  }
  details > summary::after {
    position: absolute;
    content: '+';
    right: 20px;
  }
  details[open] > summary::after {
    position: absolute;
    content: '-';
    right: 20px;
  }
  details > summary::-webkit-details-marker {
    display: none;
  }