.case-study-new-breacrumb .breadcrumbs a,
.case-study-new-breacrumb .breadcrumbs span {
    font-size: 13px;
    line-height: 18px;
    font-family: 'Inter', sans-serif;
    color: #222;
}

.case-study-new-breacrumb .breadcrumbs {
    line-height: 1;
    display: flex;
    gap: 10px;
    align-items: center;
}

.page-header.page-case-study-new {
    padding: 7px 0 !important;
}

.page-case-study-new .page-header_content {
    padding: 0;
}

.page-case-study-new .divider {
    display: block;
    width: 5px;
    height: 18px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="4.697" height="7.697" viewBox="0 0 4.697 7.697"><path id="Path_87115" data-name="Path 87115" d="M13.5,4.5l3,3m0,0-3,3" transform="translate(-12.651 -3.651)" fill="none" stroke="%23222" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.2"/></svg>') no-repeat;
    background-position: center;
    background-size: contain;
}

.Porfolio-block {
    padding: 60px 0;
}

.Porfolio-block .groove-row {
    display: grid;
    grid-template-columns: 500px 1fr;
    gap: 40px;
    align-items: start !important;
}

.Porfolio-block .groove-row .groove-column {
    width: 100%;
}

.Porfolio-block .groove-image img {
    border: none;
}

.Porfolio-block h1,
.Porfolio-block h1.Porfolio_title {
    font-size: 28px;
    line-height: 34px;
    color: #222;
    padding-bottom: 20px;
}

#amazon-polly-audio-tab {
    padding: 0;
}

.Porfolio_content #amazon-polly-audio-table {
    margin-bottom: 30px;
}

.Porfolio_content h3 span {

}

.Porfolio_content h3 span::before {
    display: none;
}

.Porfolio_content p {
    margin: 10px 0;
    padding-left: 24px;
    position: relative;
    font-size: 15px;
    line-height: 20px;
    color: #222;
}

.Porfolio_content p::before {
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path id="problem-icon" d="M7571,18546a8,8,0,1,1,5.656-2.344A7.946,7.946,0,0,1,7571,18546Zm-.058-6.822h0l1.646,1.643a.8.8,0,0,0,1.131,0,.8.8,0,0,0,0-1.129l-1.647-1.648,1.748-1.746a.8.8,0,0,0-.566-1.367.8.8,0,0,0-.564.234l-1.748,1.748-1.749-1.748a.8.8,0,0,0-1.131,0,.805.805,0,0,0,0,1.133l1.749,1.746-1.647,1.648a.8.8,0,1,0,1.13,1.129l1.647-1.643Z" transform="translate(-7563.002 -18530)" fill="%23f04545"/></svg>') no-repeat;
    position: absolute;
    left: 0;
    top: 2px;
}

.customer-background {
    background: #fff;
}

.customer-background.more-padding {
    padding-top: 20px;
}

.customer-background h2,
.customer-background h2 span {
    font-size: 28px !important;
    line-height: 34px !important;
    color: #575764;
    font-weight: 600 !important;
    font-family: 'Inter';
}

.customer-background h2 span.color {
    color: #E60078;
}

.customer-background p {
    font-size: 15px;
    line-height: 20px;
    color: #222;
    margin-bottom: 0;
}

.customer-background-box {
    max-width: 1170px;
    margin: 0 auto;
    background: #F6F6F6;
    border-radius: 24px;
    padding: 40px 50px 40px 70px;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 90px;
    align-items: center;
}

.text-block.text-3-block {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
}

.text-block.text-3-block .text-blockMain {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 25px;
}

.text-blockMain img {
    margin-bottom: 15px;
}

.text-blockMain ul {
    margin-left: 0;
    padding: 0;
    list-style-type: none;
}

.text-blockMain li {
    padding-left: 12px;
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 5px;
}

.text-blockMain li:last-child {
    margin-bottom: 0;
}

.text-blockMain li:before {
    display: block;
    content: "";
    width: 4px;
    height: 4px;
    background-color: #000;
    border-radius: 50%;
    left: 0;
    position: absolute;
    top: 8px;
}

.case-info .case-content:last-child {
    padding-bottom: 0;
}

.case-infoBox {
    margin-bottom: 100px;
    padding-top: 60px;
}

.case-content.case-content-no-description>span {
    margin-bottom: 13px;
}

.case-content.case-content-have-des>span {
    margin-bottom: -2px;
}

.case-des {
    margin-bottom: 25px;
}

.case-des b {
    font-weight: 600;
}

.case-content-have-des .text-block.text-3-block .text-blockMain {
    padding: 25px;
}

.text-blockMain b {
    font-weight: 600;
}

.text-blockMain p:last-child {
    margin-bottom: 0;
}

.case-studies-new-pc {
    display: block;
}

.case-studies-new-mobile {
    display: none;
}

.case-content>span {
    margin-bottom: 13px;
}

.text-4-block {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 15px;
}

.text-block.text-4-block .text-blockMain {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 25px;
}

.case-conclusion > span {
    margin-bottom: 3px;
}

.case-infoBox .techstack {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 15px;
}

@media (max-width: 767px) {
    .case-study-new-breacrumb .breadcrumbs {
        display: grid;
        grid-template-columns: 37px 5px 71px 5px 1fr;
    }

    .case-study-new-breacrumb .current-title {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        max-width: 100%;
    }

    .page-header.page-case-study-new {
        padding: 7px 15px !important;
        height: fit-content !important;
    }

    .case-studies-new-pc {
        display: none;
    }
    
    .case-studies-new-mobile {
        display: block;
    }

    .Porfolio-block .groove-row {
        display: block;
    }

    .Porfolio-block.groove-section {
        padding: 20px 15px 30px;
    }

    .Porfolio_content {
        display: flex;
        flex-direction: column;
    }

    .Porfolio_content * {
        order: 4;
    }

    .Porfolio_title {
        order: 1;
        margin-top: 0;
    }

    .case-studies-new-mobile {
        order: 3;
    }

    .Porfolio_content #amazon-polly-audio-table {
        order: 2;
        margin-bottom: 10px;
    }

    .Porfolio-block h1, .Porfolio-block h1.Porfolio_title {
        font-size: 24px;
        line-height: 31px;
        padding-bottom: 10px;
    }

    .Porfolio_content h3 {
        margin-top: 20px;
        margin-bottom: 10px !important;
    }

    .Porfolio_content p {
        margin: 0 0 10px;
    }

    .Porfolio_content h3 span {
        font-weight: 600;
        color: #000;
    }

    .customer-background-box {
        padding: 30px 20px;
        display: block;
        margin: 0 15px;
    }

    .customer-background h2, .customer-background h2 span {
        font-size: 20px !important;
        line-height: 24px !important;
    }

    .customer-background h2 {
        margin-bottom: 10px;
    }

    .customer-background-box .colLeft {
        margin-bottom: 30px;
    }

    .case-content>span {
        transform: translateY(0);
        margin-bottom: 15px;
    }

    .text-block.text-3-block {
        display: block;
    }

    .case-infoBox {
        padding-top: 15px;
        margin-bottom: 0;
    }

    .text-block.text-3-block .text-blockMain {
        margin-bottom: 10px;
        padding: 25px;
    }

    .text-block.text-3-block .text-blockMain:last-child {
        margin-bottom: 0;
    }

    .case-content {
        padding: 40px 0 40px !important;
        margin: 0 15px;
        border-bottom: solid 1px #707070;
    }

    .case-content:first-child {
        padding-top: 20px !important;
    }

    .case-content.case-last {
        border-bottom: none;
    }

    .case-content.case-content-have-des>span {
        margin-bottom: 5px;
    }

    .customer-background.more-padding {
        padding-top: 0;
    }

    .Porfolio_content p:last-child {
        margin-bottom: 0;
    }

    .case-des {
        margin-bottom: 15px;
    }

    .text-4-block {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .case-infoBox .techstack {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 10px;
    }

    .case-conclusion.case-last>span {
        margin-bottom: 10px;
    }
}