/* Build material page — layout like cs.com.ru (centered shell, 70/30 columns) */

.page-build .load > .blog-area {
    width: 100%;
    box-sizing: border-box;
}

.page-build section.blog-area .container.build-page-container,
.page-build .load .build-page-container,
.load .build-page-container,
.build-page-container {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box;
}

#buildPageLayout,
.load .build-page-layout,
.build-page-layout {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 24px !important;
    width: 100% !important;
    box-sizing: border-box;
}

#buildPageLayout > .build-page-main,
.load .build-page-main,
.build-page-main {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: calc(100% - 364px) !important;
    float: none !important;
    clear: none !important;
    order: 1;
}

.page-build .blog-list-post,
.page-build .blog-list-post.blog-details-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
}

#buildPageLayout > .build-page-aside,
.load .build-page-aside,
.build-page-aside {
    flex: 0 0 340px !important;
    width: 340px !important;
    max-width: 340px !important;
    min-width: 0 !important;
    float: none !important;
    clear: none !important;
    margin: 0 !important;
    box-sizing: border-box;
    order: 2;
}

#buildPageLayout .blog-sidebar,
.load .build-page-aside.blog-sidebar,
.load .build-page-aside .blog-sidebar,
.blog-sidebar.build-page-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
    clear: none !important;
    position: sticky;
    top: 72px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-sizing: border-box;
    padding: 0 !important;
    background: transparent !important;
}

.page-build .build-sidebar-widgets.home-sidebar {
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
}

@media (min-width: 992px) {
    .page-build .blog-list-post-content,
    .page-build .full_descr,
    .page-build .csart-wrap {
        max-width: 100%;
        overflow-x: hidden;
    }

    .page-build .fg-gallery {
        max-width: 860px !important;
        width: 100%;
    }

    .page-build .full_descr > .dlx94-panel {
        max-width: 860px;
        width: 100%;
    }

    .page-build .full_descr img,
    .page-build .csart-desc img,
    .page-build .csart-wrap img,
    .page-build .blog-details-wrap img {
        max-width: 100% !important;
        height: auto !important;
    }

    .page-build .dl-grid {
        max-width: 860px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page-build .sidebar-widget-body--cats {
        max-height: 340px;
        overflow-y: auto;
        overflow-x: hidden;
        scrollbar-width: thin;
        scrollbar-color: #ff7a1a rgba(255, 255, 255, .08);
    }

    .page-build .build-sidebar-widgets .sidebar-build-scroll {
        max-height: 380px;
        overflow-y: auto;
        overflow-x: hidden;
    }
}

@media (max-width: 991px) {
    #buildPageLayout,
    .load .build-page-layout,
    .build-page-layout {
        flex-direction: column !important;
        flex-wrap: wrap !important;
        gap: 18px !important;
    }

    #buildPageLayout > .build-page-main,
    .load .build-page-main,
    .build-page-main {
        max-width: 100% !important;
    }

    #buildPageLayout > .build-page-aside,
    .load .build-page-aside,
    .build-page-aside {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #buildPageLayout .blog-sidebar,
    .load .build-page-aside.blog-sidebar,
    .blog-sidebar.build-page-sidebar {
        position: static !important;
        top: auto !important;
    }

    .page-build section.blog-area .container.build-page-container,
    .load .build-page-container,
    .build-page-container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}
