.case__wrapper {
 background: #FFFFFF;
}

.case__top-bar {
 display: flex;
 gap: 30px;
 align-items: center;
 margin-bottom: 20px;
}

.case__heading {
 color: #202029;
 font-weight: 400;
}

.case__logo-wrapper {
 display: flex;
}

.case__logo {
 max-width: 125px;
 max-height: 60px;
 height: auto;
 object-fit: contain;
}

.case__inner-wrapper {
 display: flex;
 gap: 70px;
 padding: 30px 40px 30px 30px;
 background: #F1F4F9;
 border-radius: 20px;
}

.case__inner-wrapper ul {
 padding-left: 0;
 margin-left: 0;
 list-style: none;
 margin-bottom: 0;
}


.case__before-after {
 flex-basis: 400px;
 display: flex;
 flex-direction: column;
 gap: 20px;
}

.case__info {
 flex-basis: 660px;
 display: flex;
 gap: 17px;
 flex-direction: column;
}

.case__before,
.case__after {
 border-radius: 20px;
 background: #FFF;
 padding: 20px;
}

.case__before li,
.case__accordion li,
.case__after li {
 color: #202029;
 padding-left: 25px;
 position: relative;
}

.case__before li:not(:last-child),
.case__after li:not(:last-child) {
 margin-bottom: 7px;
}


.case__accordion li::after,
.case__after li::after {
 content: '';
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 display: flex;
 width: 15px;
 height: 15px;
 background: url('data:image/svg+xml,%3Csvg%20width%3D%2215%22%20height%3D%2216%22%20viewBox%3D%220%200%2015%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M7.5%200.5C3.38057%200.5%200%203.88057%200%208C0%2012.1194%203.38057%2015.5%207.5%2015.5C11.6194%2015.5%2015%2012.1194%2015%208C15%203.88057%2011.6194%200.5%207.5%200.5ZM6.59235%2011.4113L3.30803%208.12703L4.55086%206.8842L6.64986%208.9832L10.8637%205.15258L12.0465%206.45292L6.59235%2011.4113Z%22%20fill%3D%22%23202029%22%2F%3E%3C%2Fsvg%3E');
 background-size: contain; /* Для масштабування фону */
 background-repeat: no-repeat; /* Щоб фон не повторювався */
}

.after-accordion li:after,
.case__before li::after {
 content: '';
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 display: flex;
 width: 15px;
 height: 15px;
 background: url('data:image/svg+xml,%3Csvg%20width%3D%2215%22%20height%3D%2216%22%20viewBox%3D%220%200%2015%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_1038_1294)%22%3E%3Cpath%20d%3D%22M7.5%200.5C3.35813%200.5%200%203.85813%200%208C0%2012.1419%203.35813%2015.5%207.5%2015.5C11.6419%2015.5%2015%2012.1419%2015%208C15%203.85813%2011.6419%200.5%207.5%200.5ZM7.5%2012.7875C6.91375%2012.7875%206.5125%2012.3356%206.5125%2011.75C6.5125%2011.1475%206.93062%2010.7125%207.5%2010.7125C8.10188%2010.7125%208.4875%2011.1475%208.4875%2011.75C8.4875%2012.3363%208.10188%2012.7875%207.5%2012.7875ZM7.88875%208.82563C7.73937%209.335%207.26875%209.34375%207.11187%208.82563C6.93125%208.22813%206.28937%205.96%206.28937%204.48688C6.28937%202.54313%208.72125%202.53375%208.72125%204.48688C8.72062%205.96875%208.04437%208.29563%207.88875%208.82563Z%22%20fill%3D%22%23DEE3ED%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_1038_1294%22%3E%3Crect%20width%3D%2215%22%20height%3D%2215%22%20fill%3D%22white%22%20transform%3D%22translate(0%200.5)%22%20%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E');
 background-size: contain; /* Масштабування фону */
 background-repeat: no-repeat; /* Без повторення */
}

.case__before-heading,
.case__after-heading {
 margin-bottom: 10px;
 color: #202029;
}

.case__tags {
 flex-wrap: wrap;
 display: flex;
 gap: 16px;
}

.case__tag {
 color: #FFF;
 border-radius: 5px 5px 15px 5px;
 padding: 8px 12px;
 background: #202029;
}

.case__inner-info {
 height: 100%;
 position: relative;
 border-radius: 20px;
 overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.case__review {
 position: relative;
 margin-top: -181px;
 bottom: 0;
 left: 0;
 background: #FFF;
 padding: 20px;
 border-radius: 20px;
}

.case__review-top {
 display: flex;
 gap: 15px;
 margin-bottom: 15.5px;
}

.case__review-avatar {
 width: 53px;
 height: 53px;
}

.case__review-avatar-icon {
 width: 53px;
 height: 53px;
 object-fit: cover;
 border-radius: 100px;
}

.case__review-name {
 color: #202029;
 margin-bottom: 2px;
}

.case__review-position {
 font-weight: 300;
 color: #202029;
}

.case__review-body {
 border-radius: 20px;
 color: #202029;
 margin-bottom: 0;
}

.case__img {
 object-fit: contain;
 border-radius: 20px;
    height: 508px;
}



.case__btn {
 margin-top: auto;
}

.case__img-wrapper {
 display: flex;
    background: #F8F8F8;
    border-radius: 20px;
    justify-content: center;
    padding: 0 20px;
    width: 100%;
}

.case-heading-mobile {
 display: none;
}

.mobile-accordion {
 display: none;
}

@media screen and (max-width: 1199.98px) {
 .case__inner-wrapper {
  align-items: center;
 }

 .cases-slider__wrapper {
  padding: 40px;
 }

 .case__inner-wrapper {
  padding: 20px;
  gap: 30px;
 }
}

@media screen and (max-width: 1023.98px) {
  .case__review {
   display: none;
  }

 .case__inner-wrapper {
  flex-direction: column-reverse;
  gap: 20px;
  padding: 30px 15px;
 }

 .cases-slider__wrapper {
  padding: 40px 25px;
  border-radius: 20px;
 }

 .case__before-after,
 .case__info {
  flex-basis: 100%;
  width: 100%;
 }

 .case__info {
  flex-direction: column-reverse;
  gap: 0;
 }

 .case__logo-wrapper {
  display: none;
 }

 .case__heading.case-heading-mobile {
    display: block;
  margin-bottom: 15px;
  letter-spacing: -0.04em;
 }

 .case__heading {
  display: none;
 }

 .case__inner-info {
  margin-bottom: 20px;
 }

 .case__before-after {
  gap: 0;
 }

 .case__btn {
  margin-top: 25px;
 }

 .case__before {
  margin-bottom: 10px;
 }

 .mobile-accordion {
  display: block;
 }

 .case__before,
 .case__after {
  display: none;
 }

 .case__accordion {
  border: 2px solid #FFF;
  border-radius: 12px;
  padding: 13px 20px;
  background: #FFF;
 }

 .case__accordion.before-accordion {
  margin-bottom: 10px;
 }

 .case__accordion .case__before-heading,
 .case__accordion .case__after-heading {
  margin-bottom: 0;
 }

 .case__tags {
  column-gap: 7px;
  row-gap: 7px;
 }

 .case__accordion .c-accordion__content {
  padding-top: 10px;
 }

 .case__accordion li {
  color: #202029;
 }

 .case__accordion li:not(:last-child) {
  margin-bottom: 7px;
 }

 .case__accordion .c-accordion__title:after {
  content: '';
  display: inline-block;
  width: 16px;
  height: 17px;
  background: url('data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2217%22 viewBox%3D%220 0 16 17%22 fill%3D%22none%22 xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath d%3D%22M7.37568 12.9444L0.255608 5.82424C0.090796 5.65956 0 5.43973 0 5.20532C0 4.97092 0.090796 4.75108 0.255608 4.5864L0.779831 4.06205C1.12142 3.72085 1.6766 3.72085 2.01767 4.06205L7.99668 10.0411L13.9823 4.05541C14.1471 3.89073 14.3668 3.7998 14.6011 3.7998C14.8357 3.7998 15.0554 3.89073 15.2203 4.05541L15.7444 4.57977C15.9092 4.74458 16 4.96428 16 5.19869C16 5.43309 15.9092 5.65293 15.7444 5.81761L8.61782 12.9444C8.45249 13.1095 8.23174 13.2002 7.99707 13.1997C7.7615 13.2002 7.54088 13.1095 7.37568 12.9444Z%22 fill%3D%22%23202029%22/%3E%3C/svg%3E') no-repeat center;
  background-size: contain;
  transition: all 0.3s ease;
 }

 .case__accordion .c-accordion__title:after {
  content: '';
  display: inline-block;
  width: 16px;
  height: 17px;
  background: url('data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2217%22 viewBox%3D%220 0 16 17%22 fill%3D%22none%22 xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath d%3D%22M7.37568 12.9444L0.255608 5.82424C0.090796 5.65956 0 5.43973 0 5.20532C0 4.97092 0.090796 4.75108 0.255608 4.5864L0.779831 4.06205C1.12142 3.72085 1.6766 3.72085 2.01767 4.06205L7.99668 10.0411L13.9823 4.05541C14.1471 3.89073 14.3668 3.7998 14.6011 3.7998C14.8357 3.7998 15.0554 3.89073 15.2203 4.05541L15.7444 4.57977C15.9092 4.74458 16 4.96428 16 5.19869C16 5.43309 15.9092 5.65293 15.7444 5.81761L8.61782 12.9444C8.45249 13.1095 8.23174 13.2002 7.99707 13.1997C7.7615 13.2002 7.54088 13.1095 7.37568 12.9444Z%22 fill%3D%22%23202029%22/%3E%3C/svg%3E') no-repeat center;
  background-size: contain;
  transform-origin: center; /* Центр елемента */
  top: 50%;
  transform: translateY(-50%);
 }

 .custom-is-open .c-accordion__title:after,
 .is-open .c-accordion__title:after {
  transform: translateY(-50%) rotateX(180deg);
 }


 .case__img {
  height: auto;
  border-radius: 18px;
  min-height: 220px;
  max-height: 400px;
 }

 .case__top-bar {
  display: none;
 }

 .cases-slider__top {
  margin-bottom: 25px;
 }

}