.case-template-page{
    header{
        background: #F6F6F6;
    }
}

.case-template{
    .bread-crumbs,
    .hero,
    .about,
    .result,
    .platform,
    .case-info{
        background: #F6F6F6;
    }

    .hero{
        padding-bottom: 75px;
    }

    .hero__wrapper{
        position: relative;
    }

    .hero__image{
        position: absolute;
        width: 1012px;
        height: 816px;
        right: 0;
        top: -200px;
    }

    .hero__title{
        width: 1283px;
        font-size: 80px;
        color: #0A0A0A;
        font-weight: 400;
        line-height: 80px;
        margin-bottom: 60px;
    }

    .hero__tags{
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .hero__tag{
        padding: 6px 20px 10px 20px;
        border-radius: 32px;
        background: #ECECEC;
        font-family: "Open Sans";
        font-size: 20px;
        font-weight: 400;
        line-height: 140%;
        color: #6C6C6C;
    }

    .hero__hashtags{
        margin-top: 60px;
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .hero__hashtag{
        font-size: 20px;
        line-height: 160%;
        color: #6C6C6C;
    }

    .about{
        padding: 75px 0;
    }

    .about__title{
        font-size: 40px;
        font-weight: 400;
        line-height: 36px;
        margin-bottom: 60px;
    }

    .about__content{
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
    }


    .about__info{
        display: flex;
        align-items: center;
        gap: 175px;
        width: 1136px;
    }

    .wrap-case-bottom{
        margin-top: 0;
        flex-shrink: 0;
    }

    .about__image-wrapper{
        border-radius: 40px;
        background: #FFF;
        display: flex;
        width: 408px;
        height: 210px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
    }

    .about__description{
        color: #6C6C6C;
        margin-bottom: 0;
    }

    .about__description span{
        font-family: Jost;
        font-size: 24px;
        line-height: 24px;
        color: #0A0A0A;
    }

    .result{
        padding: 75px 0;
    }

    .result__title-case{
        font-size: 40px;
        font-weight: 400;
        line-height: 36px;
        margin-bottom: 60px;
    }

    .result__wrapper{
        display: flex;
        justify-content: space-between;
    }

    .result__content{
        display: flex;
        flex-direction: column;
        gap: 80px;
        padding-top: 20px;
        width: 1137px;
    }

    .result__description{
        margin-bottom: 0;
        width: 553px;
        color: #6C6C6C;
    }

    .result__count-wrapper{
        display: flex;
        align-items: center;
        gap: 120px;
    }

    .result__count{
        display: flex;
        flex-direction: column;
        gap: 40px;
    }

    .result__count-number{
        font-size: 80px;
        color: #0A0A0A;
        font-weight: 450;
        line-height: 80px;
    }

    .result__count-describe{
        color: #0A0A0A;
        opacity: 0.8;
        font-family: "Open Sans";
        font-size: 20px;
        font-weight: 400;
        line-height: 140%;
    }

    .platform{
        padding: 75px 0;
    }

    .platform__wrapper{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .platform__title{
        font-size: 40px;
        font-weight: 400;
        line-height: 36px;
        margin-bottom: 60px;
    }

    .platform__content{
        width: 1137px;
        display: flex;
        align-items: center;
        gap: 40px;

        &.non--title{
            width: 1136px;
            margin: 0 auto;
            align-items: flex-start;


            .platform__img{
                width: 151px;
                height: 151px;
            }
        }
    }

    .platform__describe{
        color: #6C6C6C;
    }

    .case-info{
        padding: 75px 0 300px;
    }

    .case-info__wrapper{
        display: flex;
        flex-direction: column;
        gap: 150px;
    }

    .case-info__content{
        display: flex;
        align-items: center;
        gap: 30px;

        &.image--big-left{
            .case-info__img{
                &:first-child{
                    width: 991px;
                }
            }
        }

        &.img--signature{
            .case-info__img{
                width: 1280px;
                height: auto;
                margin: 0 auto;
            }
        }

        &.big--img{
            .case-info__img{
                height: auto;
            }
        }

        .case-info__title-case{
            margin-bottom: 50px;
        }

        &.content--title{
            flex-direction: column;
            align-items: flex-start;
        }
    }

    .case-info__description-wrapper{
        display: flex;

        &.no--title{
            width: 996px;
            margin: 0 auto;
        }
    }

    .case-info__description-wrapper .case-info__title-case{
        width: 492px;
        flex-shrink: 0;
    }

    .case-info__description-wrapper .case-info__description{
        width: 100%;
        margin: unset;
        margin-bottom: 40px;
    }

    .case-info__description-wrapper .case-info__description{
        &:last-child{
            margin-bottom: 0;
        }
    }

    .case-info__title-case{
        font-size: 40px;
        font-weight: 400;
        line-height: 36px;
    }

    .case-info__img{
        border-radius: 40px;
        overflow: hidden;
        height: 846px;
        width: auto;
        object-fit: cover;
    }

    .case-info__description{
        margin-bottom: 0;
        color: #6C6C6C;
        width: 1136px;
        margin: 0 auto;
    }


    .case-info__description span{
        font-family: "Open Sans";
        font-size: 20px;
        font-weight: 700;
        line-height: 160%;
    }

    .case-info__card{
        width: 100%;
        height: 100%;
        position: relative;
        display: flex;
        flex-direction: column;
    }


    .interesting__card-link {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }

    .interesting{
        padding: 300px 0 150px;
    }

    .interesting__title-wrapper{
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        margin-bottom: 96px;
    }

    .interesting__grid{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .interesting__card{
        width: 100%;
        height: 100%;
        position: relative;
        display: flex;
        flex-direction: column;
    }

    .interesting__card-link {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }

    .interesting__card-image-wrapper {
        height: 553px;
        border-radius: 40px;
        overflow: hidden;
        padding: 30px;
        margin-bottom: 24px;
        position: relative;

    }

    .interesting__card-image{
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        z-index: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .interesting__card-image img{
        width: 468px;
        height: 360px;
        object-fit: contain;
    }

    .interesting__card-content{
        position: relative;
        z-index: 10;
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .interesting__card-content-title{
        overflow: hidden;
        color: #0A0A0A;
        text-overflow: ellipsis;
        font-family: Jost;
        font-size: 32px;
        font-weight: 450;
        line-height: 110%;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        align-self: stretch;
        margin-bottom: 24px;
    }

    .interesting__card-content-subtitle{
        font-family: "Open Sans";
        color: #6C6C6C;
        font-size: 18px;
        font-weight: 400;
        line-height: 24px;
        margin-bottom: 30px;
    }

    .interesting__card-tags{
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: auto;
    }

    .interesting__card-tag{
        padding: 6px 20px 10px 20px;
        border-radius: 32px;
        background: #F6F6F6;
        font-family: "Open Sans";
        font-size: 18px;
        font-weight: 400;
        line-height: 24px;
        color: #6C6C6C;
    }

    .interesting__card-logo{
        width: 200px;
        height: auto;
    }

    .interesting__card-logo img{
        width: 100%;
        height: 100%;
    }

    .contact-form{
        padding: 150px 0 100px;
    }

    .contact-form__title{
        color: #0A0A0A;
        font-family: Jost;
        font-size: 140px;
        font-weight: 450;
        line-height: 128px;
    }

    .wrap-input textarea:focus, .wrap-input textarea:active, .wrap-input input:focus, .wrap-input input:active {
        border-bottom: 2px solid #23BD87;
    }

    .call-form{
        margin: 0;
    }

    .wrap-input textarea{
        resize: block;
    }

}

.bg-radial-pink{
    background: radial-gradient(50% 50% at 50% 50%, #FFA2A2 0%, #F78484 100%), radial-gradient(50% 50% at 50% 50%, #2F4056 0%, #202D3D 100%);
}
