/* body .faq{
        padding-top: 139px;
        padding-bottom: 150px;
    } */

.faq {
  --faq-lp: 80px;
  --faq-rp: 64px;
  --faq-tp: 45px;
  --faq-bp: 49px;
  --faq-translateY: -28px;
}

.faq__opener.accordion__button {
  background: unset;
  border: none;
  padding-bottom: var(--faq-bp);
  padding-top: var(--faq-tp);
  position: relative;
  gap: unset;
}
.faq__opener-label {
  cursor: pointer;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.faq__item-text {
  /* overflow: hidden; */
  padding-left: var(--faq-lp);
  padding-right: var(--faq-rp);
  transform: translateY(var(--faq-translateY));
  /* user-select: none; */
}
.faq__item-preview-text {
  font-size: 1.867em;
  font-size: clamp(1.2rem, 1.009rem + 0.7vw, 1.867rem);
  line-height: 1.357;
}
.faq__item {
  border-bottom: 1px solid var(--grey-shade-5);
}
.faq__item:first-child {
  border-top: 1px solid var(--grey-shade-5);
}
/* .faq__item:last-child{
        border-bottom: none;
    } */
.faq__opener-input:checked ~ .faq__item-text {
  padding-bottom: calc(var(--faq-translateY) + var(--faq-bp));
}
.faq__switcher-item {
  padding: 8px 16px;
  background: #ffffff;
  color: #242426;
  border-radius: 50px;
}
.faq__switcher-item--active {
  border-radius: 50px;
  background: #436fff;
  color: #ffffff;
}
.faq__switcher-item:not(.faq__switcher-item--active) {
  cursor: pointer;
}
.faq__top-text {
  margin-top: 4px;
  padding-right: 20px;
}
.faq__switcher {
  flex-shrink: 0;
}
.faq__top {
  padding-bottom: 44px;
}

.faq__open-icon {
  /* background: #fff; */
  width: 42px;
  height: 42px;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
/* .faq__opener:hover .svg use{
        stroke: #fff;
    } */
.faq__open-icon .svg.svg-arrow-down use {
  stroke: var(--title-color);
}

/* .faq__opener:hover .svg use{
        stroke: var(--blue-shade-1)
    } */
.faq__opener-input:checked ~ .faq__opener .faq__open-icon {
  transform: rotate(180deg);
}
.faq__title {
  font-size: 2.4em;
  font-size: clamp(1.4rem, 1.009rem + 1.2vw, 2.4rem);
  line-height: 1.278;
  padding-right: 20px;
}
.faq__left-icon {
  width: 40px;
  height: 40px;
  margin-right: calc(var(--faq-lp) - 40px);
  flex-shrink: 0;
}
.faq__left-icon img {
  max-width: 40px;
  max-height: 40px;
}
.faq__items {
  padding-top: 8px;
}
.faq__items.accordion {
  border-bottom: unset;
}
.faq__item-link {
  display: inline-block;
  padding-top: 24px;
}
.faq__item-link .svg-arrow-right-xs {
  display: inline-block;
  margin-left: 17px;
}
.faq__opener-input:not(:checked) ~ .faq__item-text {
  height: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(calc(var(--faq-translateY) + 15px));
}
/* .faq__item-text{
        opacity: 1;
        visibility: visible;
        transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
    } */
.faq__toggle-block {
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.faq__toggle-block--hidden {
  height: 0;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
}
/* @media(max-width: 991px){
        body .faq {
            padding-top: 60px;
            padding-bottom: 60px;
        }
    } */
@media (max-width: 767px) {
  .faq {
    --faq-lp: 0px;
    --faq-rp: 60px;
    --faq-tp: 25px;
    --faq-bp: 29px;
    --faq-translateY: -14px;
  }
  .faq__top {
    flex-direction: column;
    padding-bottom: 20px;
  }
  .faq__top-text {
    padding-bottom: 16px;
  }
  /* .faq__text-wrap{
            padding-bottom: 32px;
        } */
  .faq__item-preview-text {
    -webkit-line-clamp: 15;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .h1.faq__short-text {
    font-size: clamp(var(--h3-mobile), 3vw, var(--h3-desktop));
    line-height: var(--h3-line-height);
  }
}

.faq__switcher-item:hover {
  color: var(--white);
  background-color: var(--color-base);
}
.faq__open-icon svg path,
.accordion__button svg use {
  stroke: var(--title-color);
}
.faq__item.accordion__item
  .accordion__button:hover
  .faq__open-icon
  .svg.svg-arrow-down
  use {
  stroke: var(--blue-shade-1);
}
.faq__item-link a{
    color:#436fff;
}
.faq__item-link svg use{
    stroke:#436fff;
}
.faq__item-link:hover svg use{
    stroke:var(--dark);
}