.text_page {
    max-width: 1015px;
    text-align: center;
    margin: 16px auto 48px;
}

.projects_cards {
    max-width: 1360px;
    margin: 0 auto 56px;
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

.platform_logo {
    height: 28px;
    width: auto;
}

.project_card {
    width: 660px;
    height: 219px;
    display: grid;
    grid-template-columns: 326px 302px;
    gap: 32px;
    align-items: center;
}

.body_card .platform_div {
    display: flex;
    gap: 40px;
}

.project_card > a img, .project_card > a {
    width: 326px;
    height: 219px;
}

.body_card {
    height: fit-content;
}

.body_card .project_title a{
    color: #313332;
    line-height: 114.9%;
    font-weight: 500;
}

.body_card .project_title {
    margin: 32px 0 24px;
}

.body_card p, .block_status_date p {
    margin: 0;
    font-size: 15px;
}

.body_card .status_project.progress, .block_status_date .status_project.progress{
    background-color: #FFFFC9;
}

.body_card .status_project.anticipation, .block_status_date .status_project.anticipation {
    background-color: #E9DCFF;
}

.body_card .status_project, .block_status_date .status_project {
    display: flex;
    width: 114px;
    padding: 8px 0;
    background-color: #F2F2F2;
    border-radius: 8px;
    align-content: center;
    justify-content: center;
}

@media (max-width: 1367px) {
    .projects_cards {
        justify-content: center;
    }
    
    .project_card {
        width: 90%;
        justify-content: center;
        max-width: 1001px;
        display: grid;
        grid-template-columns: 326px 1fr;
        align-items: center;
    }
    
    .body_card {
        width: 100%;
    }
}

@media (max-width: 800px) {
    
    .wp-site-blocks h1{
        width: 88%;
        margin: 0 auto;
    }
    
    .text_page {
        width: 88%;
        margin: 16px auto 48px;
    }
    
    .project_card {
        width: 88%;
        height: 193px;
        grid-template-columns: 250px 1fr;
        gap: 32px;
    }
    
    .project_card > a img, .project_card > a {
        width: 250px;
        height: 165px;
    }
    
}

@media (max-width: 480px) {
    
    .wp-site-blocks h1{
        font-size: 20px;
        width: 88%;
        margin: 0 auto;
    }
    
    .text_page {
        width: 88%;
        text-align: start;
        margin: 8px auto 40px;
    }
    
    .project_card {
        width: 88%;
        height: fit-content;
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .project_card > a img, .project_card > a {
        width: 100%;
        height: auto;
    }
    
    .body_card .project_title {
        margin: 24px 0 16px;
    }
    
}

.single_project h1 {
    margin: 0 0 16px;
}

.single_project {
    max-width: 1245px;
    margin: 24px auto 56px;
}

.block_status_date {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
}

.point {
    width: 5.19px;
    height: 5.19px;
    border-radius: 50%;
    border: 2px solid #AD83FF;
    background-color: #AD83FF;
}

.date_project p{
    color: #AD83FF;
    font-size: 15px;
    font-weight: 400;
}

.project_content {
    margin-top: 32px;
    display: flex;
    gap: 64px;
}

.platform_block {
    max-width: 595px;
}

.platform {
    display: flex;
    height: fit-content;
    width: fit-content;
    padding: 24px 0 6px;
    gap: 16px;
    align-items: center;
}

.project_description {
    margin: 16px 0 32px;
}

.platform_block .platform_button {
    background-color: #AD83FF;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    color: #fff;
    width: 237px;
    margin: 32px auto 0;
}

.url_platform {
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    color: #313332;
}

.project_block {
    max-width: 587px;
}

@media (max-width: 1280px) {
    
    .platform_block, .project_block {
        max-width: 471px;
    }
    
}

@media (max-width: 1010px) {
    .single_project h1 {
        width: 90%;
        margin: 0 auto 16px;
    }
    
    .project_block {
        display: flex;
        flex-direction: column;
    }
    
    .project_content {
        flex-direction: column;
        align-items: center;
    }
    
    .platform_block, .project_block {
        max-width: 90%;
    }
}