.single-cases {
    background: #F1F4F9;
}

.single-case__container {
    max-width: 1440px;
    padding: 0 20px;
}

.case-first-screen {
    max-width: 1200px;
    margin: 0 auto;
}

.case-first-screen__top-bar {
    display: flex;
    justify-content: space-between;
    gap: 50px;
}

.single-case-breadcrumbs {
    margin-top: 114px;
    margin-bottom: 30px;
}

.case-first-screen__logo {
    height: 52px;
    object-fit: contain;
    width: fit-content;
}

.case-first-screen__logo-wrapper {
    display: flex;
}

.case-first-screen__name-wrapper {
    display: flex;
    gap: 20px;
    align-items: center;
}

.case-first-screen__name {
    color: #202029;
    font-weight: 400;
}

.case-first-screen__socials {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.case-first-screen__social {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-basis: 52px;
    background: #FF5A46;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    transition: all 0.3s ease;
}

.case-first-screen__social:hover {
    transform: scale(1.05);
    background: #d43e2c;
}

.case-first-screen__inner-wrapper {
    margin-top: 20px;
    border-radius: 20px;
    padding: 30px;
    background: #DEE3ED;
    display: flex;
    gap: 20px;
}

.case-first-screen__columns {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex-basis: 420px;
}

.case-first-screen__preview {
    flex-basis: 690px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 493px;
}

.case-first-screen ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-bottom: 0;
}

.case-first-screen ul li {
    color: #202029;
    position: relative;
    padding-left: 25px;

}

.case-first-screen ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 4.5px;
    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;
}

.case-first-screen__column-wrapper {
    border-radius: 20px;
    padding: 20px;
    background: #F1F4F9;
}

.case-first-screen__column-heading {
    letter-spacing: -0.05em;
    color: #202029;
    margin-bottom: 14px;
}

.case-first-screen__char {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    color: #202029;
    align-items: center;
}

.case-first-screen__char:not(:last-child) {
    padding-bottom: 7px;
    margin-bottom: 7px;
    border-bottom: 1px solid #DEE3ED;
}

.case-first-screen__char-value {
    text-align: end;
    max-width: 264px;
}

.case-first-screen__review {
    position: relative;
    bottom: 0;
    left: 0;
    background: #FFF;
    padding: 20px;
    border-radius: 20px;
}

.case-first-screen__review-top {
    display: flex;
    gap: 15px;
    margin-bottom: 15.5px;
}

.case-first-screen__review-avatar {
    width: 53px;
    height: 53px;
}

.case-first-screen__review-avatar-icon {
    width: 53px;
    height: 53px;
    border-radius: 100px;
}

.case-first-screen__review-name {
    color: #202029;
    margin-bottom: 2px;
}

.case-first-screen__review-position {
    font-weight: 300;
    color: #202029;
}

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

.case-first-screen__img {
    object-fit: contain;
    border-radius: 20px;
    width: 100%;
}

.case-first-screen__img-wrapper {
    display: flex;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #E8EDF5;
    border-radius: 20px;
    padding: 0 20px;
}

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

.mobile-accordion,
.case-first-screen__socials-mobile,
.case-first-screen__mobile-name {
    display: none;
}

.custom-breadcrumb__active {
    color: #484851;
}

.custom-breadcrumb__current-page {
    color: #FF5A46;
}

.custom-breadcrumb__current-page svg.custom-breadcrumb__separator path,
.custom-breadcrumb__active svg.custom-breadcrumb__separator path{
    stroke: #484851;
}

.custom-breadcrumb__separator  {
    flex-shrink: 0;
}

.custom-breadcrumb__active:hover .custom-breadcrumb__separator path {
    stroke: #484851;
}

.custom-breadcrumb__active:hover {
    color: #FF5A46;
}

.custom-breadcrumb__active .custom-breadcrumb__home-icon path {
    stroke: #202029;
}

.custom-breadcrumb__active:hover .custom-breadcrumb__home-icon path {
    stroke: #FF5A46;
}

.cases-template-default .footer__socials {
 background: #F1F4F9;
}

@media screen and (max-width: 1023.98px) {
    .case-first-screen__inner-wrapper {
        flex-direction: column;
        padding: 30px 20px;
    }

    .case-first-screen__img {
        object-position: top;
    }
.case-first-screen__socials-mobile {
    display: flex;
}

.case-first-screen__mobile-name {
    display: flex;
}

    .case-first-screen__columns {
        display: none;
    }

    .case-first-screen__review {
        display: none;
    }

    .case-first-screen__img-wrapper {
        position: relative;
        max-height: 500px;
    }

    .case-first-screen__preview {
        justify-content: flex-start;
        flex-basis: fit-content;
    }

    .case-first-screen__accordion {
        border: 2px solid #F1F4F9;
        border-radius: 12px;
        padding: 13px 20px;
        background: #FFF;
    }

    .case-first-screen__accordion.before-accordion {
        margin-bottom: 10px;
    }

    .case-first-screen__accordion .case-first-screen__before-heading,
    .case-first-screen__accordion .case-first-screen__after-heading {
        margin-bottom: 0;
    }

    .case-first-screen__tags {
        column-gap: 7px;
        row-gap: 7px;
    }

    .case-first-screen__accordion .c-accordion__content {
        padding-top: 10px;
    }

    .case-first-screen__accordion li {
        color: #202029;
    }

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

    .case-first-screen__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-first-screen__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%);
    }

    .case-first-screen__before-heading,
    .case-first-screen__after-heading {
        color: #202029;
        font-size: 18px;
        margin-bottom: 0;
    }



    .case-first-screen ul li,
    .case-first-screen__accordion li:not(:last-child) {
        margin-bottom: 0;
    }

    .case-first-screen__preview {
        min-height: auto;
    }

    .case-first-screen__top-bar {
        display: none;
    }

    .case-first-screen__social {
        width: auto;
        flex-basis: calc((100% - 32px) / 3);
    }

    .case-first-screen__socials {
        margin-top: 5px;
    }

    .single-case-breadcrumbs {
        justify-content: flex-start;
        background: #FFFFFF;
        border-radius: 14px;
        padding: 16px 20px;
        margin-top: 67px;
    }

    .case-first-screen__before-after {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
}

@media screen and (max-width: 599.98px) {
    .case-first-screen__img-wrapper {
        max-height: 250px;
    }
}

/* Body  */
.single-case__content {
    display: flex;
    gap: 20px;
    margin-bottom: 50px;
    margin-top: 59px;
}

.single-case__wrapper {
    flex-basis: 760px;
}

.single-case__custom-table-of-contents {
    flex-basis: 300px;
}

.single-case__helper-block {
    flex-basis: 298px;
}


.single-case__content .wp-block-cover__background {
    background: #E8EDF5 !important;
}

.single-case__content .wp-block-cover__inner-container .wp-block-cover__background {
    background: #DEE3ED !important;
}

.single-case__content .wp-block-cover {
    border-radius: 20px;
    padding: 50px 40px;
    border: 1px solid #d8e1e9;
    margin-bottom: 30px;
    min-height: fit-content;
}

.single-case__content .wp-block-cover:last-child {
    margin-bottom: 0
}

.single-case__content .wp-block-cover .wp-block-cover:last-child {
    margin-bottom: 0;
}

.single-case__content .wp-block-cover p:last-child {
    margin-bottom: 0;
}

.single-case__content .wp-block-cover__inner-container .wp-block-cover {
    border: 0;
}

.single-case__content .wp-block-cover {
    align-items: flex-start;
}

.single-case__content .wp-block-heading {
    margin-bottom: 20px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.single-case__content h2.wp-block-heading {
    font-size: 26px;
}

.single-case__content h3.wp-block-heading {
    font-size: 25px;
}

.single-case__content h4.wp-block-heading {
    font-size: 24px;
}

.single-case__content h5.wp-block-heading {
    font-size: 22px;
}

.single-case__content h6.wp-block-heading {
    font-size: 20px;
}

.single-case__wrapper p {
    margin-bottom: 30px;
    line-height: 1.55;
}

.single-case__wrapper p:has(+ p) {
    margin-bottom: 15px;
}

.single-case__content ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.single-case__content li ul {
    margin-top: 15px;

}

strong strong {
    font-weight: 700;
}

.single-case__content li ul:last-child {
    margin-bottom: 0;
}

.single-case__content ul:not(:last-child) {
    margin-bottom: 15px;
}

.single-case__content ul li {
    position: relative;
    padding-left: 35px;
    font-weight: 400;
    line-height: 1.55;
}

.single-case__content ul li::before {
    content: "";
    display: inline-block;
    width: 26px;
    height: 26px;
    background: url('data:image/svg+xml;utf8,<svg width="30" height="31" viewBox="0 0 30 31" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15 0.5C6.71625 0.5 0 7.21625 0 15.5C0 23.7838 6.71625 30.5 15 30.5C23.2838 30.5 30 23.7838 30 15.5C30 7.21625 23.2838 0.5 15 0.5ZM15 25.075C13.8275 25.075 13.025 24.1712 13.025 23C13.025 21.795 13.8612 20.925 15 20.925C16.2038 20.925 16.975 21.795 16.975 23C16.975 24.1725 16.2038 25.075 15 25.075ZM15.7775 17.1513C15.4787 18.17 14.5375 18.1875 14.2237 17.1513C13.8625 15.9563 12.5787 11.42 12.5787 8.47375C12.5787 4.58625 17.4425 4.5675 17.4425 8.47375C17.4412 11.4375 16.0887 16.0913 15.7775 17.1513Z" fill="%23A5A5B9" /></svg>') no-repeat center center;
    background-size: contain;
    margin-right: 10px; /* Відступ між іконкою та текстом */
    position: absolute;
    left: 0;
}

.single-case__content .wp-block-image {
    margin: 0;
}

.single-case__content .wp-block-image:not(:last-child) {
    margin-bottom: 30px;
}

.single-case__content .wp-block-image img,
.single-case__content ul img{
    border-radius: 15px;
    object-fit: cover;
}

.single-case__content ul img {
    outline: 10px solid #f0f1f5;
    border-radius: 15px;
    margin-top: 20px;
}

.single-case__content .wp-block-columns {
    gap: 20px;
    margin: 0;
    flex-wrap: nowrap!important;
}

.single-case__content .wp-block-columns {
    margin-bottom: 40px;
}

.single-case__content .wp-block-columns:last-child {
    margin-bottom: 0;
}

.single-case__wrapper p:has(+ p) {
    margin-bottom: 15px;
}

.single-case__wrapper .wp-block-image:has(+ .wp-block-image) {
    margin-bottom: 20px;
}

.single-case__wrapper #ez-toc-container {
    display: none;
}


@media screen and (max-width: 1023.98px) {
    .single-case__content h2.wp-block-heading {
        font-size: 24px;
    }

    .single-case__content h3.wp-block-heading {
        font-size: 22px;
    }

    .single-case__content {
        width: calc(100% - 10px);
        margin-right: auto;
        margin-left: auto;
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .single-case__custom-table-of-contents,
    .single-case__helper-block {
        display: none;
    }

    .single-case__wrapper {
        flex-basis: 100%;
    }

    .single-case__container {
        padding: 0 5px;
    }

    .single-case__content .wp-block-cover,
    .single-case__content .wp-block-cover:last-child {
        padding: 30px 20px;
    }

    .single-case__content .wp-block-cover {
        margin-bottom: 40px;
    }

    .single-case__content ul li::before {
        width: 22px;
        height: 22px;
        top: 2px;
    }

    .single-case__content ul li {
        padding-left: 30px;
    }

    .single-case__wrapper p {
        margin-bottom: 20px;
    }

    .single-case__content .wp-block-columns {
        min-height: 584px;
    }

    .single-case__content .wp-block-columns .wp-block-image,
    .single-case__content .wp-block-columns .wp-block-image img{
        height: 100%;
    }
}

@media screen and (max-width: 767.98px) {
   .single-case__content .wp-block-columns {
       flex-wrap: wrap!important;
   }

    .wp-block-image img {
        width: 100%;
    }
    
}