.ybl-faqs{
  position: relative;
  max-width: 1340px;
  margin: 0 auto 0;
  padding-left: 20px;
  padding-right: 20px;

  .ybl-faq-anchor{
    position: absolute;
    top: -250px;
    color: transparent;
  }
  
  @media only screen and (max-width: 1320) {
    margin-bottom: 40px;
  }

  > h2.ybl-accordion-title{
    margin-bottom: 32px;
    margin-top: 0;
    @media only screen and (max-width: 900px){
      margin-bottom: 16px;
    }
  }
  
  .ybl-accordion-item{
    position: relative;
    color: white;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    margin-bottom: 0;
    scroll-padding-top: 80px;

    &:first-of-type{
        border-top: solid 1px #EDEDED;
    }

    .ybl-accordion-item-title{
      position: relative;
      padding: 24px 24px 24px 40px;
      margin: 0;
      font-size: 24px;
      line-height: 30px; 

      > span{
        position: absolute;
        top: -80px;
      }
      
      &.active{
        &:after{
          transform: rotateZ(180deg);
        }
      }

      &:after {
        display: block;
        content: '';
        width: 24px;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        transition: all .5s ease;
        transform: rotateZ(0deg);
        background: url('/cdn/shop/files/Dropdown_arrow_collapsed.svg?v=1712929128') no-repeat center center;
        background-size: contain;
      }
      
    }

    .ybl-accordion-item-content{
      position: relative;
      overflow: hidden; 
      background-color: #FFFFFF;
      height: 0;
      overflow: hidden;
      transition: all .5s ease-in-out;
      border-bottom: solid 1px #EDEDED;

      .ybl-accordion-item-content-wrapper{
        position: absolute;
        color: #033E46;
        padding: 0 0 0 40px; 
        @media only screen and (max-width: 900px){
          padding-right: 0;
        } 
        @media only screen and (max-width: 768px){
          padding-left: 0;
        }

        .highlight-wrapper{
          position: relative;
          padding: 48px;
          margin-bottom: 24px;
          margin-right: 20px;

          @media only screen and (max-width: 768px){
            margin-left: 20px;
          }

          .highlight-title > h3{
            font-size: 24px;
            line-height: 29px;
            margin-bottom: 0;
          }

          .highlight-subtitle > p {
            font-size: 24px;
            line-height: 29px;
          }
          ul, p{
            margin-bottom: 24px;
          }
        }

        .metafield-rich_text_field {
          color: #033E46;
        }

      }

      p{
        padding: 0;
        margin: 0 0 24px 0;
      }
    }
  } 
}