.uslugi-banner .media-item img {
    height: 100%;
    right: 0;
    position: absolute;
}

.uslugi-banner .banners-entry__text {
    color: #F2F2F2;
}

.banners-entry__illustration::after {
    background: linear-gradient(270.09deg, rgba(0, 0, 0, 0) 0.09%, #000000 85.82%);
}

.uslugi-banner .banners-entry__header {
    max-width: 52rem;
}

.uslugi-banner .banners-entry__body {
    max-width: 72rem;
}

.uslugi-banner .banners-entry__body {
    margin-top: 3rem;
}

.uslugi-banner .banners-entry-links {
    margin-top: 4rem;
}

.uslugi-banner .banners-entry-links a {
    padding: 10px 20px;
}

.uslugi-banner .breadcrumbs__link.is--active {
    color: #fff;
}

.uslugi-banner .banners-entry {
    padding-top: 40px;
}

.uslugi-banner .hero__header {
    margin-bottom: 80px;
}

.uslugi-banner .breadcrumbs__list {
    direction: ltr; 
}

.banners-entry {
    animation: none;
}

.frame--banner .media-item .mobile {
    display: none;
}

/* Sandwich Panels Types Slider Section */
.frame--sandwich-panels-types {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
    position: relative;
}

.frame--sandwich-panels-types.gray {
    background: #F2F2F2;
}

.frame--sandwich-panels-types .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--sandwich-panels-types .frame-header__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.sandwich-panels-types__nav {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: auto;
}

.sandwich-panels-types__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
}

.sandwich-panels-types__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
}

.sandwich-panels-types__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.sandwich-panels-types__nav-btn.slick-disabled,
.sandwich-panels-types__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.sandwich-panels-types__pagination {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

.sandwich-panels-types__slider {
    overflow: hidden;
    margin-top: 60px;
}

.sandwich-panels-types__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 2rem;
}

.sandwich-panels-types__item {
    flex: 0 0 auto;
    min-width: 0;
}

/* Slick Slider styles for sandwich panels types section */
.sandwich-panels-types__list.slick-slider {
    display: block;
}

.sandwich-panels-types__list.slick-slider .slick-list {
    margin: 0 -1rem;
    overflow: hidden;
}

.sandwich-panels-types__list.slick-slider .slick-track {
    display: flex;
    flex-direction: row;
}

.sandwich-panels-types__list.slick-slider .slick-slide {
    height: auto;
    padding: 0 1rem;
}

.sandwich-panels-types__list.slick-slider .sandwich-panels-types__item {
    margin: 0;
    height: auto;
    overflow: hidden;
    width: 100%;
    display: flex;  
    align-self: stretch;
}

.sandwich-panels-types__list.slick-slider .sandwich-panels-types__item .promo-banner {
    flex: 1;
}

@media (max-width: 1024px) {
    .frame--sandwich-panels-types .frame-header__body {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .sandwich-panels-types__nav {
        margin-left: unset;
    }

    .sandwich-panels-types__pagination {
        font-size: 15px;
    }
}

@media (max-width: 580px) {
    .frame--sandwich-panels-types {
        padding: 60px 30px;
    }

    .frame--sandwich-panels-types .frame__title {
        font-size: 28px;
    }

    .sandwich-panels-types__slider {
        margin-top: 40px;
    }

    .sandwich-panels-types__pagination {
        font-size: 15px;
        min-width: 50px;
    }

    .sandwich-panels-types__nav {
        gap: 12px;
    }
}

.frame--uslugi-thickness {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
    position: relative;
}

.frame--uslugi-thickness .frame__header {
    margin-bottom: 6rem;
}

.uslugi-thickness__nav {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: auto;
}

.uslugi-thickness__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
}

.uslugi-thickness__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.uslugi-thickness__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
    
}

.uslugi-thickness__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.uslugi-thickness__nav-btn.slick-disabled,
.uslugi-thickness__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.uslugi-thickness__nav-btn svg {
    width: 16px;
    height: 16px;
}

.uslugi-thickness__pagination {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

.frame--uslugi-thickness .frame-header__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.frame--uslugi-thickness.gray {
    background: #F2F2F2;
}

.frame--uslugi-thickness .frame__title {
    font-weight: 600;
}

.uslugi-thickness__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.uslugi-thickness__item {
    background: #f2f2f2;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 12px;
    height: auto;
    min-height: auto;
}

.frame--uslugi-thickness.gray .uslugi-thickness__item {
    background: #fff;
}

.uslugi-thickness__item .uslugi-thickness__link img {
    max-width: 138px;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center center;
}

.uslugi-thickness__item .uslugi-thickness__link {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 16px;
}

.uslugi-thickness__item .uslugi-thickness__body .uslugi-thickness__title {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
}

.uslugi-thickness__item .uslugi-thickness__body .uslugi-thickness__count {
    font-size: 12px;
    font-weight: 500;
    margin: 0;
    color: #858687;
}

.link-see-all {
    width: 100%;
    border: 2px solid #e2e2e2;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    text-decoration: none;
    margin-top: 60px;
    color: #000;
}

/* Slick Slider styles for thickness section */
.uslugi-thickness__list.slick-slider {
    display: block;
}

.uslugi-thickness__list.slick-slider .slick-list {
    margin: 0;
    overflow: hidden;
}

.uslugi-thickness__list.slick-slider .slick-track {
    display: flex;
    flex-direction: row;
}

.uslugi-thickness__list.slick-slider .slick-slide {
    height: auto;
    padding: 0;
    gap: 22px;
    display: flex;
    flex-direction: column;
}

.uslugi-thickness__list.slick-slider .slick-slide > div {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    align-items: start;
}

.uslugi-thickness__list.slick-slider .uslugi-thickness__item {
    margin: 0;
    height: auto;
    display: flex;
    align-self: stretch;
}

.uslugi-thickness__list.slick-slider .uslugi-thickness__item .uslugi-thickness__link {
    height: 100%;
    width: 100%;
}

.frame--uslugi-thickness .frame__body {
    position: relative;
}


@media (max-width: 1024px) {
    .uslugi-thickness__list:not(.slick-initialized) {
        grid-template-columns: repeat(2, 1fr);
    }

    .uslugi-thickness__item {
        padding: 15px;
    }

    .uslugi-thickness__item .uslugi-thickness__link img {
        max-width: 100px;
    }

    .uslugi-thickness__list.slick-slider .slick-slide > div {
        gap: 1rem;
    }


    .uslugi-thickness__pagination {
        font-size: 14px;
    }
}

@media (max-width: 580px) {

    .see-all-text-gallery {
        display: inline-block !important;
    }

    .frame--text-with-gallery .frame__header {
        margin-bottom: 20px !important;
    }

    .text-with-gallery__text {
        font-size: 14px;
        max-height: 224px;  
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        line-clamp: 8;
        box-orient: vertical;
    }

    .frame--uslugi-thickness .frame-header__body {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .uslugi-thickness__nav {
        margin-left: unset;
    }

    .link-see-all {
        margin-top: 22px;
    }

    .frame--banner .media-item .mobile {
        display: block;
    }


    .uslugi-thickness__pagination {
        font-size: 15px;
        min-width: 50px;
    }

    .uslugi-thickness__nav {
        gap: 12px;
    }

    .uslugi-thickness__list.slick-slider .slick-slide > div {
        gap: 1rem;
    }
}

/* Технические характеристики */
.frame--technical-specs {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.technical-specs__table-wrapper {
    overflow-x: auto;
    margin: 0;
    width: 100%;
}

.frame--technical-specs .frame__title {
    font-weight: 600;
}

.technical-specs__table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    color: #000;
    margin: 0;
    border-spacing: 0;
}

.technical-specs__table thead {
    background: #222A30;
    color: #fff;
}

.technical-specs__table thead th {
    color: #fff !important;
    font-weight: 600;
    font-size: 18px;
    padding: 1.6rem;
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #fff;
    background: #222A30;
    width: 252px;
}

.technical-specs__table thead th:last-child {
    border-right: none;
}

.technical-specs__table thead tr {
    border: none;
}

.technical-specs__table thead tr > * {
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
}

.technical-specs__table tbody tr {
    background: #fff;
    border: none;
    border-right: 1px solid #D9D9D9;
    border-left: 1px solid #D9D9D9;
    border-bottom: 1px solid #D9D9D9;
}

.frame--technical-specs.gray {
    background: #F2F2F2;
}

.technical-specs__table tbody td {
    padding: 1.6rem;
    color: #000 !important;
    text-align: center;
    border: none;
    font-size: 16px;
    font-weight: 400;
    vertical-align: middle;
    background: #fff;
    width: 252px;
    border-right: 1px solid #D9D9D9;
}

.technical-specs__table tbody td:last-child {
    border-right: none;
}


.technical-specs__table tr > :first-child {
    padding-left: 1.6rem !important;
}

.technical-specs__table tr > :last-child {
    padding-right: 1.6rem !important;
}

.technical-specs__col-desktop {
    display: table-cell;
}

@media (max-width: 580px) {
    
    .banners-entry__illustration {
        bottom: unset;
    }

    .banners-entry__illustration::after {
        background: linear-gradient(179.4deg, rgba(0, 0, 0, 0) 38.5%, #000000 99.19%);
        height: auto;
        width: 100%;
    }

    .frame--banner .media-item .desktop {
        display: none;
    }

    .frame--banner .media-item .mobile {
        height: auto;
        width: 100%;
        position: static;
    }

    .uslugi-banner .hero__header {
        margin-bottom: 287px;
    }

    .uslugi-banner .banners-entry {
        padding-bottom: 60px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .uslugi-banner .banners-entry__text {
        color: #F9F9F9;
        font-size: 15px;
    } 

    .uslugi-banner .desktop {
        display: none;
    }


    .technical-specs__table thead th {
        font-size: 15px;
        padding: 1.2rem 1.6rem;
    }

    .technical-specs__table tbody td {
        font-size: 15px;
        padding: 1.2rem 1.6rem;
    }

    .technical-specs__table thead th:first-child,
    .technical-specs__table tbody td:first-child {
        min-width: 100px;
    }

    .technical-specs__table thead th:nth-child(2),
    .technical-specs__table tbody td:nth-child(2) {
        min-width: 180px;
    }
}

/* FAQ Section */
.frame--faq {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--faq.gray {
    background: #f2f2f2;
}

.frame--faq .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--faq .frame__header {
    margin-bottom: 60px;
}

.faq__list {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.faq__item {
    background: #f2f2f2;
    border-radius: 4px;
    margin-bottom: 16px;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

.frame--faq.gray .faq__item {
    background: #fff;
}

.frame--faq.gray .faq__question {
    background: #fff;
}

.faq__item:last-child {
    margin-bottom: 0;
}

.faq__question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px;
    background: #f2f2f2;
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    color: #000;
    transition: all 0.3s ease;
}

.faq__question:hover {
    background: #f9f9f9;
}

.faq__question-text {
    font-size: 20px;
    font-weight: 700;
    flex: 1;
    margin-right: 20px;
}

.faq__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    transition: .2s ease-in-out;
}

.faq__icon img {
    width: 100%;
    height: 100%;
}

.faq__item.active .faq__icon {
    transform: rotate(45deg);
}


.faq__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq__item.active .faq__answer {
    max-height: 2000px;
}


.faq__answer-content {
    padding-top: 30px;
    padding-bottom: 40px;
    margin-left: 40px;
    margin-right: 40px;
    border-top: 1px solid #D9D9D9;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
}

.faq__answer-content p {
    font-size: 15px;
    font-weight: 600;
    color: #666;
    line-height: 28px;
}

.faq__answer-content ul {
    margin: 0;
    padding-left: 20px;
}

.faq__answer-content li {
    color: #666;
    margin-bottom: 8px;
}

.faq__answer-content li:last-child {
    margin-bottom: 0;
}

@media (max-width: 580px) {
    .frame--faq {
        padding: 60px 30px;
    }

    .faq__question-text {
        font-size: 15px;
        font-weight: 600;
    }

    .frame--faq .frame__title {
        font-size: 28px;
    }

    .faq__question {
        padding: 16px 20px;
        font-size: 14px;
    }

    .faq__answer-content {
        padding: 0 ;
        padding-top: 15px;
        font-size: 14px;
        font-weight: 600;
        line-height: 22px;
        margin-left: 20px;
        margin-right: 20px;
    }

    .frame--faq .frame__header {
        margin-bottom: 30px;
    }

    .faq__icon {
        width: 16px;
        height: 16px;
    }
}

/* Advantages Section */
.frame--advantages {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--advantages.black {
    background: #000;
}

.frame--advantages .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--advantages.black .frame__title {
    color: #fff;
}

.frame--advantages .frame__header {
    margin-bottom: 60px;
}

.advantages__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 40px;
    row-gap: 50px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.advantages__item {
    position: relative;
    padding: 50px;
    padding-top: 0;
    padding-left: 0;
    padding-bottom: 50px;

}

.advantages__item:nth-child(1)::before,
.advantages__item:nth-child(2)::before,
.advantages__item:nth-child(3)::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 90%;
    height: 2px;
    background: #00B7F4;
}

.advantages__item:not(:nth-child(3n)):after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 76%;
    background: #00B7F4;
}

.advantages__item:nth-child(4),
.advantages__item:nth-child(5),
.advantages__item:nth-child(6) {
    padding-bottom: 0;
}


.advantages__item:nth-child(4)::after,
.advantages__item:nth-child(5)::after,
.advantages__item:nth-child(6)::after {
    height: 90%;
}

.advantages__title {
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    margin: 0 0 20px 0;
    color: #000;
    max-width: 236px;
}

.advantages__item:nth-child(5) .advantages__title{
    max-width: 250px;
}

.frame--advantages.black .advantages__title {
    color: #fff;
}

.advantages__description {
    font-size: 15px;
    font-weight: 600;
    line-height: 28px;
    margin: 0;
    color: #666;
}

.frame--advantages.black .advantages__description {
    color: #F2F2F2;
}

@media (max-width: 768px) {

    .frame--uslugi-thickness .frame__header {
        margin-bottom: 3rem;
    }

    .advantages__list {
        grid-template-columns: 1fr;
    }

    .frame--uslugi-thickness {
        padding: 60px 30px;
    }

    .advantages__item {
        padding: 30px 20px;
        padding-bottom: 40px;
        border-right: none !important;
    }

    .advantages__item:not(:nth-child(3n)):after{
        content: none;
    }

    .advantages__item {
        padding-top: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .advantages__item:nth-child(4)::before,
    .advantages__item:nth-child(5)::before{
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 50%;
        height: 2px;
        background: #00B7F4;
    }

    .advantages__item:nth-child(4),
    .advantages__item:nth-child(5) {
        padding-bottom: 40px;   
    }

    .advantages__item:nth-child(1)::before,
    .advantages__item:nth-child(2)::before,
    .advantages__item:nth-child(3)::before {
        width: 50%;
    }

    .frame--advantages {
        padding: 60px 30px;
    }

    .frame--advantages .frame__title {
        font-size: 28px;
    }

    .frame--advantages .frame__header {
        margin-bottom: 4rem;
    }

    .advantages__title {
        font-size: 18px;
        max-width: 100% !important;
        line-height: 32px;
        margin-bottom: 7px;
        font-weight: 600;
    }

    .advantages__description {
        font-size: 14px;
        line-height: 160%;
    }
}

.frame--gallery {
    margin: 0;
    background: #fff;
    padding-top: 100px;
}

.frame--gallery.gray {
    background: #f2f2f2;
}

.frame--gallery .slider {
    position: relative;
    overflow: visible;
}

.frame--gallery h2 {
    font-size: 32px;
    font-weight: 600;
}

.frame--gallery .frame__header {
    margin-bottom: 6rem;
}

.frame--gallery .slider__scene {
    overflow: visible;
    position: relative;
    width: calc(100vw - var(--scrollbar-width, 0));
    left: 50%;
    margin-left: calc(-50vw + var(--scrollbar-width, 0)/2);
}

.frame--gallery .slider__nav {
    right: 30px;
    top: -110px;
    position: absolute;
}

.frame--gallery .gallery__item {
    width: 40%;
}

.frame--popular-products .frame__header h2 {
    font-size: 32px;
    font-weight: 600;
}

.frame--popular-products {
    background: #fff;
    margin: 0;
    padding: 100px 30px;
}

.frame--popular-products.gray {
    background: #f2f2f2;
}

.popular-products__list {
    display: flex;
    flex-wrap: wrap;
}

.popular-products__list .catalog__item {
    margin: 0 !important;
}

.frame--popular-products .all-link {
    font-size: 12px;
    font-weight: 500;
    color: #000;
}

.frame--popular-products .link-see-all {
    display: none;
}

@media (max-width: 640px) {
    .frame--gallery .slider__nav .slider-steps {
        display: block;
    }
}

@media (max-width: 580px) {
    .frame--popular-products .frame__header h2 {
        font-size: 28px;
    }

    .frame--popular-products .all-link {
        display: none;
    }

    .frame--popular-products .link-see-all {
        display: block;
    }

    .frame--gallery .gallery__item {
        width: 100%;
    }

    .frame--gallery h2 {
        display: none;
    }

    .frame--gallery .slider__nav  {
        right: unset;
        left: 0;
        top: -70px;
    }

    .slider-pages__item:last-child::after,
    .slider-pages__page .caption::after,
    .slider-pages__page {
        color: #000;
        font-weight: 600;
        font-size: 15px;
    }

    .frame--gallery .slider__scene {
        width: unset;
        left: unset;
        margin-left: unset;
        overflow: hidden;
    }

    .frame--gallery .frame__header {
        margin-bottom: 30px;
    }
}

/* Why Order Section */
.frame--why-order {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--why-order.gray {
    background: #f2f2f2;
}

.why-order__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
    align-items: start;
    max-width: 1200px;
    margin: 0 auto;
}

.frame--why-order .button {
    margin-top: 0;
    padding: 15px 40px;
}


.why-order__content {
    display: flex;
    align-items: start;
    gap: 40px;
    flex-direction: column;
}

.why-order__title {
    font-size: 32px;
    font-weight: 600;
    line-height: 40px;
    margin: 0;
    color: #000;
}

.why-order__description {
    font-size: 18px;
    font-weight: 600;
    line-height: 32px;
    margin: 0;
    color: #666;
}

.why-order__features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px;
}

.why-order__feature {
    display: flex;
    flex-direction: column;
}

.why-order__feature-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
    padding-left: 40px;
    border-left: 3px solid #F0F0F0;
}

.why-order__feature-icon {
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00B7F4;
}

.why-order__feature-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(67%) sepia(100%) saturate(2000%) hue-rotate(170deg) brightness(1);
}

.why-order__feature-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 32px;
    margin: 0;
    color: #000;
}

.why-order__feature-description {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
    margin: 0;
    color: #858687;
    padding-left: 40px;
}

@media (max-width: 1280px) {
    .why-order__container {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .frame--why-order, .frame--technical-specs, .frame--gallery {
        padding: 60px 30px;
    }

    .why-order__container {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .why-order__content {
        gap: 30px;
    }

    .why-order__title {
        font-size: 28px;
        line-height: 110%;
    }

    .frame--why-order .button {
        padding: 10px 20px;
    }
    
    .why-order__description {
        font-size: 15px;
        font-weight: 400;
        color: #222A30;
        line-height: 160%;
    }

    .why-order__feature-header {
        padding-left: 20px;
        border-left-width: 2px;
    }

    .why-order__button {
        font-size: 14px;
        padding: 10px 20px;
    }

    .why-order__features {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .why-order__feature-header {
        gap: 12px;
        margin-bottom: 10px;
    }

    .why-order__feature-icon {
        width: 30px;
        height: 30px;
    }

    .why-order__feature-title {
        font-size: 18px;
    }

    .why-order__feature-description {
        font-size: 14px;
        color: #000;
        font-weight: 400;
    }
}

/* Text with Image Section */
.frame--text-with-image {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--text-with-image .description-without-image {
    margin: 0;
    margin-top: 30px;  
    font-size: 15px;
    font-weight: 600;
    line-height: 180%;
    color: #666;
}

.frame--text-with-image.gray {
    background: #F2F2F2;
}

.frame--text-with-image .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--text-with-image .frame__header {
    margin-bottom: 40px;
}

.text-with-image__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.text-with-image__image {
    width: 100%;
}

.text-with-image__image .media__wrapper {
    width: 100%;
    padding-bottom: 0;
}

.text-with-image__image .media__item {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.text-with-image__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.text-with-image__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
}

.text-with-image__text p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 180%;
    color: #666;
}

.text-with-image__toggle {
    display: none;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    color: #00B7F4;
    text-align: left;
    align-self: flex-start;
    transition: color 0.3s ease;
}

.text-with-image__toggle:hover {
    color: #0099CC;
}

.text-with-image__toggle-text {
    display: inline-block;
}

.text-with-image__text.is--expanded .text-with-image__toggle-text::after {
    content: " (Скрыть)";
}

@media (max-width: 991px) {



    .text-with-image__text.is--truncated {
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .text-with-image__toggle {
        display: block;
    }

    .text-with-image__container {
        grid-template-columns: 1fr;
        gap: 40px;
    }


}

@media (max-width: 768px) {
    .frame--text-with-image {
        padding: 60px 30px;
    }

    .frame--text-with-image .frame__title {
        font-size: 28px;
    }


    .text-with-image__text {
        font-size: 14px;
    }

    .text-with-image__text.is--truncated {
        -webkit-line-clamp: 6;
    }

    .text-with-image__toggle {
        font-size: 14px;
    }
}

/* VK Video Section */
.frame--video-vk {
    padding: 0 30px;
    background: #000;
    margin: 0;
}

.frame--video-vk .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--video-vk .frame__header {
    margin-bottom: 60px;
}

.video-vk__container {
    max-width: 1200px;
    margin: 0 auto;
}

.video-vk__wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    background: #000;
    overflow: hidden;
}

.video-vk__preview {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
}

.video-vk__preview-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.video-vk__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    transition: background 0.3s ease;
}

.video-vk__wrapper:hover .video-vk__overlay {
    background: rgba(0, 0, 0, 0.5);
}

/* Индикатор загрузки */
.video-vk__loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    pointer-events: none;
}

.video-vk__loading-dots {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.video-vk__loading-dots span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #00B7F4;
    animation: video-vk-loading 1.4s infinite ease-in-out both;
}

.video-vk__loading-dots span:nth-child(1) {
    animation-delay: -0.32s;
}

.video-vk__loading-dots span:nth-child(2) {
    animation-delay: -0.16s;
}

.video-vk__loading-dots span:nth-child(3) {
    animation-delay: 0s;
}

@keyframes video-vk-loading {
    0%, 80%, 100% {
        transform: scale(0.8);
        opacity: 0.5;
    }
    40% {
        transform: scale(1.2);
        opacity: 1;
    }
}

.video-vk__iframe-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: auto;
    overflow: hidden;
}

.video-vk__iframe-wrapper::after,
.video-vk__iframe-wrapper::before {
    content: none !important;
}

.video-vk__iframe {
    width: 100%;
    height: 100%;
    border: none;
    pointer-events: none; /* Отключаем pointer-events для iframe, чтобы клики проходили через overlay */
}

/* Overlay для перехвата кликов и скрытия контролов VK */
.video-vk__iframe-wrapper::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 120px; /* Полностью скрываем область контролов */
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.95) 20%, rgba(0, 0, 0, 0.7) 50%, transparent 100%);
    pointer-events: auto; /* Перехватываем клики */
    z-index: 3;
    opacity: 1;
    transition: opacity 0.3s ease;
}

/* Дополнительный overlay для полного скрытия */
.video-vk__iframe-wrapper::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: #000;
    pointer-events: auto;
    z-index: 4;
    opacity: 1;
}

/* При наведении немного уменьшаем непрозрачность overlay */
.video-vk__wrapper.playing:hover .video-vk__iframe-wrapper::before,
.video-vk__wrapper.playing:hover .video-vk__iframe-wrapper::after {
    opacity: 0.8;
}

/* Когда видео на паузе, показываем overlay полностью */
.video-vk__wrapper:not(.playing) .video-vk__iframe-wrapper::before,
.video-vk__wrapper:not(.playing) .video-vk__iframe-wrapper::after {
    opacity: 1;
}

.video-vk__controls {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5; /* Выше overlay, чтобы кнопка была кликабельной */
    transition: 0.2s ease;
}

/* Скрываем контролы во время загрузки */
.video-vk__wrapper.loading .video-vk__controls {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.video-vk__play-btn {
    background: transparent;
    border: 2px solid #00B7F4;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    color: #00B7F4;
    outline: none;
    padding: 0;
}

.video-vk__play-btn:hover {
    background: #00B7F4;
    transform: scale(1.1);
    color: #fff;
}

.video-vk__play-btn svg {
    width: 16px;
    height: 16px;
}

.video-vk__play-btn .icon-pause {
    width: 24px;
    height: 24px;
}

.video-vk__wrapper.playing .video-vk__preview {
    display: none !important;
}

/* Показываем превью при паузе (когда нет класса playing) */
.video-vk__wrapper:not(.playing).video-loaded .video-vk__preview {
    display: block !important;
    z-index: 4; /* Выше iframe, чтобы превью было видно */
}

.video-vk__wrapper.playing .video-vk__controls {
    opacity: 0;
    visibility: hidden;
    /* НЕ отключаем pointer-events, чтобы кнопка могла получать клики */
    /* pointer-events: none; */
}

.video-vk__wrapper.playing:hover .video-vk__controls {
    opacity: 1;
    visibility: visible;
    /* pointer-events: auto; */
}

/* Кнопка должна быть кликабельной даже когда скрыта */
.video-vk__play-btn {
    pointer-events: auto !important;
}

/* Когда превью скрыто, iframe должен быть виден */
.video-vk__preview[style*="display: none"] ~ .video-vk__iframe-wrapper,
.video-vk__preview[style*="display:none"] ~ .video-vk__iframe-wrapper {
    z-index: 2;
}

/* Альтернативный способ через класс */
.video-vk__wrapper.video-loaded .video-vk__iframe-wrapper {
    z-index: 2;
}

.video-vk__wrapper.video-loaded .video-vk__preview {
    display: none !important;
}

@media (max-width: 768px) {

    .frame--video-vk .frame__title {
        font-size: 28px;
    }

    .frame--video-vk .frame__header {
        margin-bottom: 40px;
    }

    .video-vk__play-btn {
        width: 50px;
        height: 50px;
    }

    .video-vk__play-btn svg {
        width: 14px;
        height: 14px;
    }

    .video-vk__play-btn .icon-pause {
        width: 20px;
        height: 20px;
    }
}

/* Text with Gallery Section */
.frame--text-with-gallery {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--text-with-gallery.gray {
    background: #F2F2F2;
}

.frame--text-with-gallery .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--text-with-gallery .frame__header {
    margin-bottom: 30px;
}

.text-with-gallery__content {
    margin-bottom: 60px;
}

.text-with-gallery__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
}

.text-with-gallery__text p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 28px;
    color: #666;
}

.text-with-gallery__gallery-section {
    margin-top: 50px;
}

.text-with-gallery__gallery-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
}

.see-all-text-gallery {
    font-size: 14px;
    font-weight: 600;
    color: #00B7F4;
    display: none;
    line-height: 160%;
    margin-top: 20px;
}

.see-all-text-gallery .caption::after{
    content: 'Показать полностью';
}

.project-order-modal__container .fields__item:first-child {
    margin-top: 0;
}

.see-all-text-gallery.active .caption::after{
    content: 'Скрыть';
}

.text-with-gallery__gallery-title {
    font-size: 32px;
    font-weight: 600;
    margin: 0;
    color: #000;
}

.text-with-gallery__gallery-title {
    font-size: 24px;
}

.text-with-gallery__nav {
    display: flex;
    align-items: center;
    gap: 20px;
}

.text-with-gallery__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
}

.text-with-gallery__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
}

.text-with-gallery__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.text-with-gallery__nav-btn.slick-disabled,
.text-with-gallery__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.text-with-gallery__pagination {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

.text-with-gallery__slider {
    position: relative;
    overflow: hidden;
}

.text-with-gallery__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.text-with-gallery__item {
    margin: 0;
}

.text-with-gallery__image {
    width: 100%;
}

.text-with-gallery__image .media__wrapper {
    width: 100%;
    padding-bottom: 0;
}

.text-with-gallery__image .media__item {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.text-with-gallery__single-image {
    margin-top: 60px;
}

.text-with-gallery__single-image .text-with-gallery__image {
    width: 100%;
}

/* Slick Slider styles for gallery */
.text-with-gallery__list.slick-slider {
    display: block;
}

.text-with-gallery__list.slick-slider .slick-list {
    margin: 0;
    overflow: hidden;
}

.text-with-gallery__list.slick-slider .slick-track {
    display: flex;
    flex-direction: row;
}

.text-with-gallery__list.slick-slider .slick-slide {
    height: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.text-with-gallery__list.slick-slider .slick-slide > div {
    display: flex;
    align-items: start;
    justify-content: center;    
}

.text-with-gallery__list.slick-slider .slick-slide .text-with-gallery__image .media {
    width: 100%;
}

.text-with-gallery__list.slick-slider .text-with-gallery__item {
    margin: 0;
    height: auto;
    display: flex;
    align-self: stretch;
}

@media (max-width: 768px) {
    .frame--text-with-gallery {
        padding: 60px 30px;
    }


    .frame--text-with-gallery .frame__title {
        font-size: 28px;
    }

    .frame--text-with-gallery .frame__header {
        margin-bottom: 40px;
    }


    .text-with-gallery__text.active {
        max-height: unset;
        -webkit-line-clamp: unset;
        line-clamp: unset;
    }

    .text-with-gallery__text p {
        font-size: 14px;
    }

    .text-with-gallery__gallery-section {
        margin-top: 40px;
    }

    .text-with-gallery__gallery-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
        margin-bottom: 30px;
    }

    .text-with-gallery__gallery-title {
        font-size: 28px;
    }

    .text-with-gallery__gallery-title {
        font-size: 20px;
    }

    .text-with-gallery__nav {
        gap: 12px;
    }

    .text-with-gallery__pagination {
        font-size: 15px;
        min-width: 50px;
    }

    .text-with-gallery__single-image {
        margin-top: 40px;
    }
}


.frame--application-products {
    padding-top: 100px;
    margin-top: 0 !important;
    padding-bottom: 100px;
    background: #fff;
}

.frame--application-products.gray {
    background: #F2F2F2;
}

.frame--application-products .frame-header__body {
    margin: 0 !important;
}

.frame--application-products .frame-header__body .frame__title {
    margin: 0 !important;
    font-size: 32px;
    font-weight: 600;
}

.frame--application-products .frame-header__wrapper {
    margin: 0;
    align-items: center;
    justify-content: space-between;
}

.application-products__wrapper {
    position: relative;
}

.application-products__controls {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 30px;
    margin-bottom: 20px;
}

.frame--application-products .frame__wrapper {
    display: flex;
    flex-direction: column;
    gap: 60px;
}

.application-products__prev,
.application-products__next {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    width: auto;
    height: 12px;
    display: flex;
    align-items: center;
    opacity: .5;
    transition: .2s ease-in-out;
    justify-content: center;
}

.application-products__prev img,
.application-products__next img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.application-products__counter {
    font-size: 16px;
    color: #000;
    font-weight: 500;
}

.application-products__slider {
    overflow: hidden;
}

.application-products-entry {
    display: flex;
    flex-direction: row-reverse;
}

.application-products-entry__image {
    z-index: 1;
}

.frame--application-products .frame__header {
    margin-bottom: 0;
}

.application-products-entry__content {
    z-index: 2;
    position: relative;
    left: 4rem;
    width: 50%;
    bottom: 4rem;
}

.application-products-entry__image {
    width: 50%;
}



.frame--application-products .slick-list {
    padding-top: 50px;
}

.application-products-entry__image .media__item {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.application-products-entry__content {
    padding: 40px;
    background: #f2f2f2;
}

.frame--application-products.gray .application-products-entry__content {
    background: #fff;
}

.application-products-entry__title {
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
    color: #000;
    margin: 0 0 20px 0;
}

.application-products-entry__text p {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.6;
    color: #666666;
    margin: 0;
}

.frame--promo-left .application-products-entry__text p {
    max-width: 317px;
}



@media (max-width: 768px) {

    .application-products__controls {
        margin-bottom: 0;
    }

    .frame--application-products .frame__wrapper {
        gap: 30px;
    }

    .application-products-entry {
        flex-direction: column;
    }

    .frame--application-products .slick-slide {
        height: 100%;
        display: flex;
        align-items: stretch;
    }

    .frame--application-products .slick-track {
        display: flex;
        align-items: stretch;
    }

    .frame--application-products .application-products__item {
        display: flex !important;
        align-items: stretch;
        width: 100%;
    }

    .frame--application-products .application-products-entry {
        display: flex;
        flex-direction: column;
        width: 100%;
        flex: 1;
    }

    .frame--application-products .application-products-entry__image {
        flex-shrink: 0;
    }

    .frame--application-products .application-products-entry__content {
        left: 0;
        bottom: 0;
        display: flex;
        flex-direction: column;
        flex: 1;
    }

    .slick-slide {
        padding: 0;
    }

    .application-products-entry__image {
        width: 100%;
    }

    .application-products-entry__content {
        width: 100%;
    }

    .frame--application-products .slick-list {
        padding-top: 0;
    }

    .application-products {
        padding: 0 !important;
    }
    
    .application-products {
        padding: 40px 0;
    }

    .frame--application-products {
        padding: 60px 30px;
    }
    
    .application-products-entry__content {
        padding: 30px;
    }
    
    .application-products-entry__title {
        font-size: 21px;
        margin-bottom: 15px;
        font-weight: 600;
        line-height: 120%;
    }

    .application-products-entry__content .button.is--main {
        margin-top: 20px;
    }
    
    .application-products-entry__text p {
        font-size: 14px;
        font-weight: 500;
        line-height: 160%;
    }
}

.frame--promo-right .frame__wrapper {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.frame--promo-right {
    background: #fff;
    margin: 0;
    padding: 100px 30px;
    padding-top: 170px;
}

.frame--promo-right.gray {
    background: #f2f2f2;
}

.frame.gray .application-products-entry__content {
    background: #fff;
}

.frame--promo-right .application-products-entry__content {
    background: #f2f2f2;
    bottom: 4rem;
}

.application-products-entry__content .button.is--main {
    padding: 12px 20px;
    margin-top: 16px;
    text-wrap: wrap;
    border-radius: 5000px;
    line-height: 100%;
    min-height: 52px;
    font-weight: 600;
}

.frame--promo-left {
    margin: 0;
    padding: 100px 30px;
    padding-top: 170px;
    background: #fff;
}

.frame--promo-left.gray {
    background: #f2f2f2;
}

.frame--promo-left .application-products-entry__content {
    bottom: 4rem;
    right: unset;
    left: -4rem;
    z-index: 1 !important;
    padding-left: 8rem;
}

.frame--promo-left .application-products-entry__image {
    z-index: 2 !important;
}

.frame--promo-left .application-products-entry {
    flex-direction: row !important;
}


@media (max-width: 768px) {
    .frame--promo-right {
        padding: 60px 30px;
    }

    .frame--promo-left {
        padding: 60px 30px;
    }
}

@media (max-width: 991px) {
    .frame--promo-right .application-products-entry__content {
        bottom: 2rem;
        left: 1rem;
        width: 100%;

        
    }

    .frame--promo-right .application-products-entry,
    .frame--promo-left .application-products-entry {
        flex-direction: column;
    }

    .frame--promo-left .application-products-entry__content {
        bottom: 2rem;
        left: 1rem;
        z-index: 2;
        padding-left: 30px;
    }

    .frame--promo-left .application-products-entry__image {
        z-index: 1 !important;
        width: 100%;
    }

    .frame--promo-right .application-products-entry__image {
        width: 100%;
    }   

    .frame--promo-left .application-products-entry {
        flex-direction: column !important;
    }

    .frame--promo-right {
        flex-direction: column;
    }
}

/* Production Technology Section */
.frame--production-technology {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--production-technology.gray {
    background: #F2F2F2;
}

.production-technology__container {
    display: grid;
    height: 586px;
    grid-template-columns: 1.1fr .9fr;
    gap: 0;
    align-items: start;
    max-width: 1200px;
    margin: 0 auto;
    background: #f2f2f2;
}

.frame--production-technology.gray .production-technology__container {
    background: #fff;
}

.production-technology__left {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.production-technology__left-wrapper {
    display: grid;
    grid-template-columns: auto 1fr;
    border-right: 2px solid #fff;
    align-items: start;
}

.frame--production-technology.gray .production-technology__left-wrapper {
    border-right: 2px solid #f2f2f2;
}

.production-technology__image {
    width: 250px;
    flex-shrink: 0;
}

.production-technology__image .media__wrapper {
    width: 100%;
    padding-bottom: 0;
}

.production-technology__image .media__item {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}

.production-technology__image .media__wrapper {
    padding-bottom: 0;
}

.production-technology__nav {
    list-style: none;
    margin: 0;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.production-technology__nav-item {
    margin: 0;
}

.production-technology__nav-link {
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: #666;
    text-decoration: none;
    transition: color 0.3s ease;
    border-bottom: 1px solid transparent;
}

.production-technology__nav-link:hover {
    color: #00B7F4;
}

.production-technology__nav-link.is--active {
    color: #00B7F4;
    font-weight: 600;
}

.production-technology__right {
    display: flex;
    height: 100%;
    overflow-y: auto;
    flex-direction: column;
}

.production-technology__content {
    font-size: 16px;
    padding: 40px;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
    display: none;
}

.production-technology__content.is--active {
    display: block;
}

.production-technology__content p {
    margin: 0 0 20px 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 28px;
    color: #666;
}

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

/* Мобильная версия - скрыта на десктопе */
.production-technology__mobile {
    display: none;
}

.production-technology__mobile-tabs-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 30px;  
    border-bottom: 2px solid #e2e2e2;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.production-technology__mobile-tabs-toggle:hover {
    background-color: #f9f9f9;
}

.production-technology__mobile-tabs-title {
    font-size: 15px;
    line-height: 28px;
    font-weight: 600;
    color: #666;
    margin: 0;
    flex: 1;
}

.production-technology__mobile-tabs-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: 12px;
    transition: transform 0.3s ease;
}

.production-technology__mobile-tabs-toggle.is--expanded .production-technology__mobile-tabs-icon {
    transform: rotate(180deg);
}

.production-technology__mobile-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, margin 0.3s ease;
}

.production-technology__mobile-tabs-toggle.is--expanded + .production-technology__mobile-nav {
    max-height: 500px;
}

.production-technology__mobile-nav-item {
    margin: 0;
}

.production-technology__mobile-nav-link {
    display: block;
    padding: 12px 20px;
    font-size: 15px;
    font-weight: 600;
    color: #666;
    text-decoration: none;
    transition: all 0.3s ease;
}

.production-technology__mobile-nav-link:hover {
    color: #00B7F4;
}

.production-technology__mobile-nav-link.is--active {
    color: #00B7F4;
}

.production-technology__mobile-card {
    overflow: hidden;
    display: none;
}

.production-technology__mobile-card.is--active {
    display: block;
}

.production-technology__mobile-image {
    width: 100%;
    aspect-ratio: 1/1;
    overflow: hidden;
}

.production-technology__mobile-image .media__wrapper {
    width: 100%;
    padding-bottom: 0;
}

.production-technology__mobile-image .media__item {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

.production-technology__mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border-bottom: 1px solid #D9D9D9;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.production-technology__mobile-header:hover {
    background-color: #f9f9f9;
}

.production-technology__mobile-title {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    margin: 0;
    flex: 1;
}

.production-technology__mobile-icon {
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: 12px;
    transition: transform 0.3s ease;
}

.production-technology__mobile-card.is--expanded .production-technology__mobile-icon {
    transform: rotate(180deg);
}

.production-technology__mobile-content {
    padding: 30px;
}

.production-technology__mobile-text {
    font-size: 15px;
    font-weight: 400;
    line-height: 28px;
    color: #666;
    margin-bottom: 16px;
}

.production-technology__mobile-text.is--truncated {
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.production-technology__mobile-text p {
    margin: 0;
}

.production-technology__mobile-link {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    color: #00B7F4;
    text-decoration: none;
    transition: color 0.3s ease;
}

.production-technology__mobile-link:hover {
    color: #0099CC;
}

@media (max-width: 1024px) {
    .production-technology__container {
        display: none;
    }

    .production-technology__mobile {
        display: block;
        background: #f2f2f2;
        max-width: 100%;
    }

    .frame--production-technology.gray .production-technology__mobile {
        background: #fff;
    }

    .frame.frame--documents {
        padding: 60px 30px !important;
    }
}

@media (min-width: 1025px) {
    .production-technology__mobile {
        display: none;
    }
}

@media (max-width: 768px) {
    .frame--production-technology {
        padding: 60px 30px;
    }

    .production-technology__mobile-header {
        padding: 16px 20px;
    }

    .production-technology__mobile-title {
        font-size: 15px;
    }

    .production-technology__mobile-text.is--truncated {
        -webkit-line-clamp: 6;
    }

    .production-technology__mobile-link {
        font-size: 14px;
    }
}

.promo-banner {
    display: block;
    position: relative;
    border-radius: 8px;
    padding: 24px;
    min-height: 240px;
    background: linear-gradient(340deg,rgba(0, 183, 244, 1) 20%, rgba(0, 0, 0, 1) 100%);
    overflow: hidden;
    

}

.promo-banner__img {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
    z-index: 1;
}

.promo-banner__wrapper {
    height: 100%;
}

.promo-banner__body {
    display: flex;
    flex-direction: column;
    gap: 17px;
    z-index: 2;
    position: relative;
    max-width: 230px;
    align-items: flex-start;
    height: 100%;
    justify-content: space-between;
}

.promo-banner__content {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.promo-banner .promo-banner__title {
    font-size: 18px;
    margin: 0;
    font-weight: 600;
    color: #fff;
}

.frame--sandwich-panels-types .promo-banner .button.is--main {
    font-size: 12px;
    font-weight: 500;
    padding: 12px 20px;
}

.frame--deliveery-and-price .promo-banner .promo-banner__subtitle {
    font-size: 20px !important;
    font-weight: 400 !important;
    color: #fff !important;
}

.frame--deliveery-and-price .promo-banner .button.is--main {
    font-size: 15px;
    font-weight: 600;
    padding: 12px 20px;
}

.promo-banner .promo-banner__subtitle {
    font-size: 14px;
    font-weight: 400 ;
    margin: 0;
    color: #fff;
}

/* Project Stages Section */
.frame--project-stages {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--project-stages.gray {
    background: #F2F2F2;
}

.frame--project-stages .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--project-stages .frame__header {
    margin-bottom: 60px;
}

/* Desktop version */
.project-stages__desktop {
    display: block;
}

.project-stages__mobile {
    display: none;
}

.project-stages__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.project-stages__column {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.project-stages__item {
    display: flex;
    align-items: flex-start;
}

.project-stages__number {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00B7F4;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-top: 10px;   
    margin-right: -30px;
    z-index: 2;
}

.project-stages__text {
    flex: 1;
    font-size: 18px;
    font-weight: 500;
    line-height: 32px;
    color: #000;
    padding: 20px;
    padding-left: 60px;
    background: #F2F2F2;
    z-index: 1;
    height: 100%;
}

.frame--project-stages.gray .project-stages__text {
    background: #fff;
}

/* Mobile version */
.project-stages__mobile {
    max-width: 100%;
}

.project-stages__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.project-stages__nav-btn {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00B7F4;
    color: #fff;
    border: none;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
}

.project-stages__nav-btn:hover {
    background: #0099CC;
}

.project-stages__nav-btn.is--active {
    background: #fff;
    color: #00B7F4;
    border: 2px solid #00B7F4;
}

.project-stages__content {
    position: relative;
}


.project-stages__stage {
    display: none;
    padding: 15px 20px;
    background: #f2f2f2;
}

.frame--project-stages.gray .project-stages__stage {
    background: #fff;
}

.project-stages__stage.is--active {
    display: block;
}

.project-stages__stage-title {
    font-size: 24px;
    font-weight: 600;
    color: #000;
    margin: 0 0 20px 0;
}

.project-stages__stage-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #666;
    margin: 0;
}

.frame--partners {
    background: #fff;
    margin: 0;
    padding-top: 100px;
    padding-bottom: 100px;
}

.frame--partners.gray {
    background: #f2f2f2;
}

.frame--partners .frame__title {
    font-weight: 600;
}

.frame--feedback {
    margin-top: 0;
}

.frame--feedback .frame__title {
    font-weight: 600;
}

@media (max-width: 1024px) {
    .project-stages__desktop {
        display: none;
    }

    .project-stages__mobile {
        display: block;
    }

    .frame--project-stages {
        padding: 60px 30px;
    }

    .frame--partners {
        padding: 60px 30px;
    }
}

@media (max-width: 580px) {

    .why-order__feature-title {
        font-size: 15px;
    }

    .why-order__feature-description {
        font-size: 12px;
    }

    .frame--project-stages .frame__title {
        font-size: 28px;
    }

    .frame--project-stages .frame__header {
        margin-bottom: 40px;
    }

    .project-stages__nav {
        gap: 4px;
        margin-bottom: 10px;
    }

    .project-stages__nav-btn {
        width: 34px;
        height: 34px;
        font-size: 15px;
    }

    .project-stages__stage-title {
        font-size: 18px;
        font-weight: 600;
        line-height: 32px;
        margin-bottom: 7px;
    }

    .project-stages__stage-text {
        font-size: 14px;
    }
}

.frame--deliveery-and-price {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--deliveery-and-price.gray {
    background: #F2F2F2;
}

.frame--deliveery-and-price .frame__title {
    font-weight: 600;
    margin-bottom: 0;
}

.frame--deliveery-and-price .frame__header {
    margin-bottom: 60px;
}

.frame--deliveery-and-price .frame-header__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

@media (min-width: 769px) {
    .frame--deliveery-and-price .frame-header__body {
        justify-content: flex-start;
    }
}

.delivery-and-price__nav {
    display: none;
    align-items: center;
    gap: 20px;
    margin-left: auto;
}

.delivery-and-price__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
}

.delivery-and-price__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
}

.delivery-and-price__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.delivery-and-price__nav-btn.slick-disabled,
.delivery-and-price__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.delivery-and-price__pagination {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

@media (max-width: 768px) {
    .delivery-and-price__nav {
        display: flex;
    }

    .frame--deliveery-and-price .frame-header__body {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .delivery-and-price__nav {
        margin-left: unset;
    }

    .delivery-and-price__pagination {
        font-size: 15px;
        min-width: 50px;
    }

    .frame--deliveery-and-price .frame__header {
        margin-bottom: 30px;
    }

    .delivery-and-price__nav {
        gap: 12px;
    }
}

.delivery-items-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
}

.delivery-items-grid .deliver-items-row:last-child .deliver-items-row__item p {
    font-size: 15px;
    font-weight: 600;
    line-height: 28px;
    color: #9EA0A2;
}

.deliver-items-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    min-height: 375px;
    height: 100%;
}

.deliver-items-row__item {
    display: flex;
    flex-direction: column;
    gap: 19px;
    padding: 40px;
}

.deliver-items-row__item:not(.promo-banner, .image, .black) {
    background: #f2f2f2;
}

.frame--deliveery-and-price.gray .deliver-items-row__item:not(.promo-banner, .image, .black) {
    background: #fff;
}

.deliver-items-row__item.black {
    background: #000;
    color: #fff;
}

.deliver-items-row__item.black h2 {
    color: #fff;
}

.deliver-items-row__item h2 {
    margin: 0;
    padding: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 40px;
}

.deliver-items-row__item.black p {
    color: #fff;
}

.deliver-items-row__item p {
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 32px;
}

.deliver-items-row__item.black ul {
    color: #A5A8A6;
}

.deliver-items-row__item ul {
    margin: 0;
    padding: 0;
    margin-left: 20px;
    font-size: 15px;
    font-weight: 600;
}

.deliver-items-row__item.image {
    padding: 0;
}

.deliver-items-row__item.promo-banner {
    border-radius: 0
}

.deliver-items-row__item.promo-banner h3 {
    font-size: 27px;
    line-height: 1;
    font-weight: 600;
}

.deliver-items-row__item.promo-banner p {
    font-size: 20px;
    line-height: 1;
}

.deliver-items-row__item.promo-banner .promo-banner__content {
    gap: 22px;
}

.deliver-items-row__item.promo-banner .promo-banner__body {
    max-width: 360px;
}

.deliver-items-row__item img {
    width: 100%;
    height: 100%;
}

@media (max-width: 1024px) {
    .deliver-items-row__item.promo-banner h3 {
        font-size: 20px;
    }

    .deliver-items-row__item.promo-banner p {
        font-size: 16px;
    }

    .deliver-items-row__item.promo-banner .promo-banner__content {
        gap: 16px;
    }

    .deliver-items-row__item.promo-banner .promo-banner__body {
        max-width: 220px;
    }

    .deliver-items-row__item.promo-banner .button.is--main {
        font-size: 14px;
        padding: 10px 16px;
    }

    .deliver-items-row__item.promo-banner .promo-banner__subtitle {
        font-size: 14px !important;
    }

    .deliver-items-row__item h2 {
        font-size: 20px;
        line-height: 32px;
    }

    .deliver-items-row__item p {
        font-size: 15px;
        line-height: 28px;
    }

    .deliver-items-row__item ul {
        font-size: 14px;
        font-weight: 600;
        line-height: 160%;
    }

    .deliver-items-row__item {
        gap: 15px;
    }
}

@media (max-width: 768px) {
    .deliver-items-row {
        grid-template-columns: 1fr;
    }
    
    .frame--deliveery-and-price {
        padding: 60px 30px;
    }
}

.delivery-items-slider.slick-slider {
    display: block;
}

.delivery-items-slider.slick-slider .slick-list {
    margin: 0;
    overflow: hidden;
}

.delivery-items-slider.slick-slider .slick-track {
    display: flex;
    flex-direction: row;
}

.delivery-items-slider.slick-slider .slick-slide {
    height: auto;
    padding: 0;
}

.delivery-items-slider.slick-slider .deliver-items-row {
    margin: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media (min-width: 769px) {
    .delivery-items-slider.slick-slider .slick-list,
    .delivery-items-slider.slick-slider .slick-track {
        display: block;
    }

    .delivery-items-slider.slick-slider .slick-slide {
        display: block !important;
        width: 100% !important;
    }
}

@media (max-width: 580px) {
    .deliver-items-row__item h2 {
        font-size: 18px;
        font-weight: 600;
    }

    .deliver-items-row__item p {
        font-size: 15px;
    }

    .deliver-items-row__item ul {
        font-size: 14px;
    }

    .deliver-items-row__item {
        gap: 19px;
        padding: 20px;
    }

    .deliver-items-row__item:first-child {
        flex: 1;
    }

    .deliver-items-row__item

    .deliver-items-row__item.promo-banner h3 {
        font-size: 18px;
    }

    .deliver-items-row__item.promo-banner p {
        font-size: 15px !important;
    }

    .deliver-items-row__item.promo-banner .promo-banner__body {
        max-width: 200px;
    }
    
}

.frame.frame--documents {
    overflow: visible !important;
    margin: 0;
    padding: 100px 30px;
    background: #fff;
    position: relative;
    clip-path: none !important;
}

.frame.frame--documents.gray {
    background: #f2f2f2;
}

.frame.frame--documents .frame__wrapper {
    overflow: visible !important;
    position: relative;
}

.frame.frame--documents .frame__body {
    overflow: visible !important;
    position: relative;
    margin: -130px 0;
}

.document-row {
    display: flex;
    align-items: center;
    gap: 60px;
    position: relative;
}

.document-left-content {
    flex: 1;
    z-index: 2;
    position: relative;
}

.document-left-content h2 {
    font-size: 32px;
    font-weight: 600;
    line-height: 32px;
}

.document-left-content p {
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-weight: 600;
    color: #666;
}

.document-left-content .button.is--accent {
    font-size: 12px;
    font-weight: 500;
    color: #000;
    padding: 12px 20px;
}

.document-right-content {
    flex: 1;
    position: relative;
    z-index: 1;
    overflow: visible;
    align-self: stretch;
    display: flex;
    align-items: stretch;
}

.document-right-content img {
    width: 100%;
    display: block;
    height: 100%;
    object-fit: cover;
}

.document-overlay {
    position: absolute;
    top: 30%;
    right: -40px;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 20px;
    z-index: 2;
    max-width: 400px;
}

.document-overlay__item {
    display: flex;
    align-items: center;
    gap: 16px;
    background: #fff;
    padding: 16px 20px;
    border-radius: 4px;
    text-decoration: none;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.document-overlay__item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.document-overlay__icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.document-overlay__icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.document-overlay__text {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    color: #000;
    flex: 1;
}

.left-content-image.mobile {
    display: none;
    width: 100%;
    height: auto;
}

.left-content-image.mobile img {
    width: 100%;
    height: auto;   
}

.document-left-content {
    display: flex;
    flex-direction: column;
    gap: 30px;
    align-items: flex-start;
}

@media (max-width: 991px) {

    .frame--feedback .frame__title{
        margin-bottom: 10px;    
    }

    .document-row {
        flex-direction: column;
    }

    .document-right-content {
        display: none;
    }

    .frame.frame--documents .frame__body {
        margin: 0;
    }

    .left-content-image.mobile {
        display: block;
    }

    .document-left-content {
        gap: 40px;
    }

}

@media (max-width: 580px) {

    .document-overlay {
        max-width: 262px;
        top: unset;
        top: 40%;
        gap: 10px;
        right: -30px;
    }

    .document-overlay__item {
        gap: 10px;
    }

    .document-overlay__text {
        font-size: 12px;
    }

    .document-left-content h2 {
        font-size: 28px;
    }

    .document-left-content p {
        font-weight: 400;
    }

    .document-overlay__item {
        padding: 12px 16px;
    }

    .document-overlay__text {
        font-size: 12px;
    }
    
}

@media (max-width: 400px) {
    .document-overlay {
        top: 34%;
    }
}

/* Colors Gallery Section */
.frame--colors-gallery {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--colors-gallery.gray {
    background: #F2F2F2;
}

.frame--colors-gallery .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--colors-gallery .frame__header {
    margin-bottom: 60px;
}

.colors-gallery__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 150px;
    align-items: start;
}

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

.colors-gallery__text {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #000;
}

.colors-gallery__text p {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 180%;
    color: #666;
}

.colors-gallery__list {
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 5px 16px;
    display: flex;
    flex-wrap: wrap;
}

.colors-gallery__list-item {
    margin: 0;
    display: inline;
    float: left;
    
}

.colors-gallery__color-link {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    color: #858687;
    transition: color 0.3s ease;
    display: inline;
    width: 100%;
    border-bottom: 1px solid #858687;
}

.colors-gallery__color-link:hover {
    color: #00B7F4;
}

.colors-gallery__color-link.is--active {
    color: #00B7F4;
    font-weight: 600;
    border-color: #00B7F4;
}

.colors-gallery__color-name {
    display: inline-block;
}

.colors-gallery__right {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.colors-gallery__main-image {
    position: relative;
    width: 100%;
    border-radius: 4px;
    overflow: hidden;
}

.colors-gallery__image-label {
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 32px;
    font-weight: 600;
    color: #fff;
    z-index: 2;
}

.colors-gallery__text h2 {
    margin-bottom: 30px !important;
}

.colors-gallery__main-image .media__wrapper {
    width: 100%;
    padding-bottom: 0;
}

.colors-gallery__main-image .media__item {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}

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

.colors-gallery__swatches-list {
    display: flex;
    gap: 12px;
    overflow: hidden;
}

.colors-gallery__swatch-item {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: border-color 0.3s ease;
    overflow: hidden;
}

.colors-gallery__swatch-item:hover {
    border-color: #00B7F4;
}

.colors-gallery__swatch-item.is--active {
    border-color: #00B7F4;
    border-width: 3px;
}

.colors-gallery__swatch-color {
    width: 100%;
    height: 100%;
}

.colors-gallery__swatch-color img {
    width: 100%;
    height: 100%;
}

.colors-gallery__pagination {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}

.colors-gallery__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
    padding: 0;
}

.colors-gallery__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
}

.colors-gallery__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.colors-gallery__nav-btn.slick-disabled,
.colors-gallery__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.colors-gallery__pagination-text {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

/* Slick Slider styles for colors gallery swatches */
.colors-gallery__swatches-list.slick-slider {
    display: block;
}

.colors-gallery__swatches-list.slick-slider .slick-list {
    margin: 0;
    overflow: hidden;
}

.colors-gallery__swatches-list.slick-slider .slick-track {
    display: flex;
}

.colors-gallery__swatches-list.slick-slider .colors-gallery__swatch-item {
    margin: 0;
    aspect-ratio: 1/1;
}

@media (max-width: 1024px) {
    .colors-gallery__container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .colors-gallery__swatches {
        flex-wrap: wrap;
    }

    .colors-gallery__pagination {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 580px) {
    .frame--colors-gallery {
        padding: 60px 30px;
    }

    .frame--colors-gallery .frame__title {
        font-size: 28px;
    }

    .frame--colors-gallery .frame__header {
        margin-bottom: 40px;
    }

    .colors-gallery__container {
        gap: 30px;
    }

    .colors-gallery__left {
        gap: 30px;
    }

    .colors-gallery__text {
        font-size: 14px;
    }

    .colors-gallery__text p {
        font-size: 14px;
    }

    .colors-gallery__color-link {
        font-size: 14px;
    }

    .colors-gallery__image-label {
        font-size: 14px;
        padding: 6px 12px;
        top: 15px;
        left: 15px;
    }

    .colors-gallery__swatch-item {
        width: 80px;
        height: 80px;
    }

    .colors-gallery__swatches-list.slick-slider .slick-slide {
        padding: 0 5px;
    }

    .colors-gallery__pagination-text {
        font-size: 14px;
        min-width: 50px;
    }

    .colors-gallery__pagination {
        gap: 12px;
    }
}

/* Completed Projects Section */
.frame--completed-projects {
    padding: 100px 30px;
    background: #fff;
    margin: 0;
}

.frame--completed-projects.gray {
    background: #F2F2F2;
}

.frame--completed-projects .frame__title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 0;
}

.frame--completed-projects .frame-header__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.completed-projects__nav {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-left: auto;
}

.completed-projects__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: none;
    border: none;
    height: 2.8rem;
}

.completed-projects__nav-btn--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M49.3423 12.657l5.6569-5.65684m0 0l-5.6569-5.6569m5.6569 5.6569L.999512 7'/%3E%3C/svg%3E") right center no-repeat;
    width: 5.6rem;
}

.completed-projects__nav-btn--prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='14' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6.65723 12.6565l-5.6569-5.65683m0 0l5.6569-5.6569m-5.6569 5.6569L25 6.99951'/%3E%3C/svg%3E") left center no-repeat;
    width: 2.6rem;
}

.completed-projects__nav-btn.slick-disabled,
.completed-projects__nav-btn[style*="opacity: 0.5"] {
    opacity: 0.5;
    cursor: not-allowed;
}

.completed-projects__pagination {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    min-width: 60px;
    text-align: center;
}

.completed-projects__slider {
    overflow: hidden;
    margin-top: 60px;
}

.completed-projects__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 2rem;
}

.completed-projects__item {
    flex: 0 0 auto;
    min-width: 0;
}

.completed-projects__card {
    background: #f2f2f2;
    overflow: hidden;
    display: flex;
    height: 100%;
    padding: 40px;
    gap: 40px;
}

.frame--completed-projects.gray .completed-projects__card {
    background: #fff;
}

.completed-projects__image {
    width: 50%;
    flex-shrink: 0;
}

.completed-projects__image .media__wrapper {
    width: 100%;
    padding-bottom: 75%; /* 4:3 aspect ratio */
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}

.completed-projects__image .media__item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.completed-projects__content {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 25px;
}

.completed-projects__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin: 0;
    color: #000;
}

.completed-projects__tag {
    display: inline-block;
    padding: 6px 12px;
    background: #00B7F42B;
    color: #2FB4E9;
    border-radius: 8px;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    align-self: flex-start;
}

.completed-projects__details {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.completed-projects__detail {
    display: flex;
    gap: 30px;
    font-size: 15px;
    line-height: 1.6;
}

.completed-projects__detail-label {
    font-weight: 500;
    font-size: 14px;
    color: #000;
    flex: 1;
}

.completed-projects__detail-value {
    color: #858687;
    font-size: 14px;
    font-weight: 600;
    flex: 1;
}

.completed-projects__link {
    color: #666666;
    text-decoration: underline;
    font-size: 12px;
    font-weight: 500;
    align-self: flex-start;
    transition: color 0.3s ease;
}

.completed-projects__link:hover {
    color: #00B7F4;
}

.completed-projects__want-btn {
    margin-top: auto;
    align-self: flex-start;
    padding: 12px 20px;
    border-radius: 5000px;
}

.button-wrapper {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.button-wrapper .button.is--accent {
    color: #000;
    font-size: 12px;
    font-weight: 500;
    padding: 12px 20px;
}

/* Slick Slider styles for completed projects */
.completed-projects__list.slick-slider {
    display: block;
}

.completed-projects__list.slick-slider .slick-list {
    margin: 0 -1rem;
    overflow: hidden;
}

.completed-projects__list.slick-slider .slick-track {
    display: flex;
    flex-direction: row;
}

.completed-projects__list.slick-slider .slick-slide {
    height: auto;
    padding: 0 1rem;
}

.completed-projects__list.slick-slider .completed-projects__item {
    margin: 0;
    height: auto;
    overflow: hidden;
    width: 100%;
}

/* Project Modal */
.project-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    overflow-y: hidden;
}

.project-modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 10001;
}

.project-modal__container {
    position: relative;
    max-width: 1200px;
    max-height: 750px;
    margin: 40px auto;
    background: #fff;
    border-radius: 8px;
    z-index: 10002;
    padding: 40px;
    margin-top: 40px;
    margin-bottom: 40px;
    overflow-y: auto;
}

.project-modal__close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 10003;
    color: #000;
    transition: color 0.3s ease;
}

.project-modal__close:hover {
    color: #00B7F4;
}

.project-modal__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}

.project-modal__left {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.project-modal__main-image {
    width: 100%;
    border-radius: 4px;
    overflow: hidden;
}

.project-modal__main-image .media__wrapper {
    width: 100%;
    padding-bottom: 75%; /* 4:3 aspect ratio */
    position: relative;
    overflow: hidden;
}

.project-modal__main-image .media__item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-modal__thumbnails {
    display: flex;
    align-items: center;
    gap: 12px;
}

.project-modal__thumb-nav {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f2f2f2;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.3s ease;
}

    .project-modal__thumb-nav--prev {
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M10 12L6 8l4-4'/%3E%3C/svg%3E") center no-repeat;
    }

    .project-modal__thumb-nav--next {
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6 4l4 4-4 4'/%3E%3C/svg%3E") center no-repeat;
    }

/* Project Order Modal */
.project-order-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    overflow-y: hidden;
}

.project-order-modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 10001;
}

.project-order-modal__container {
    position: relative;
    max-width: 600px;
    max-height: 90vh;
    margin: 40px auto;
    background: #fff;
    border-radius: 8px;
    z-index: 10002;
    padding: 40px;
    margin-top: 40px;
    margin-bottom: 40px;
    overflow-y: auto;
}

.project-order-modal__close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 10003;
    color: #000;
    transition: color 0.3s ease;
}

.project-order-modal__close:hover {
    color: #00B7F4;
}

.project-order-modal__content {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.project-order-modal__title {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    margin: 0;
    color: #000;
}

.project-order-modal__subtitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    margin: 0;
    color: #666;
}

.project-order-form {
    margin-top: 20px;
}

.project-order-form .fields__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.project-order-form textarea {
    width: 100%;
    min-height: 100px;
    padding: 12px;
    border: 1px solid #D9D9D9;
    border-radius: 4px;
    font-family: inherit;
    font-size: 15px;
    resize: vertical;
}

.project-order-form textarea:focus {
    outline: none;
    border-color: #00B7F4;
}

.project-order-form .field--checkbox {
    margin-top: 20px;
}

.project-order-form .field--checkbox input[type="checkbox"] {
    margin-right: 8px;
}

.project-order-form .field--checkbox .field__label {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
}

.project-order-form .field--checkbox .field__label a {
    color: #00B7F4;
    text-decoration: underline;
}

.uslugi-panels-type-item {
    background: #212324;
    border-radius: 8px;
    min-height: 286px;
    padding: 20px 30px;
    position: relative;
    flex: 1;
    overflow: hidden;
    display: block;
    text-decoration: none;
}

.header-uslugi-panels-type-item {
    display: flex;
    justify-content: space-between;
    align-items: start;
    z-index: 2;
    gap: 20px;
    position: relative;
}

.header-uslugi-panels-type-item h3 {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    max-width: 237px;
    line-height: 28px;
    margin: 0;
}

.count-uslugi-panels-type-item {
    font-size: 12px;
    font-weight: 400;
    color: #E2E2E2;
}

.image-uslugi-panels-type-item {
    position: absolute;
    width: auto;
    height: 100%;
    right: 0;
    bottom: 0;
    z-index: 1;
}

@media (max-width: 768px) {
    .project-order-modal__container {
        padding: 30px 20px;
        margin: 20px;
        max-height: 95vh;
    }

    .frame--popular-products {
        padding: 60px 30px;
    }

    .project-order-modal__title {
        font-size: 20px;
    }

    .project-order-modal__subtitle {
        font-size: 14px;
    }

    .project-order-modal__close {
        top: 10px;
        right: 10px;
        width: 32px;
        height: 32px;
    }
}


.project-modal__thumb-nav-prev {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M10 12L6 8l4-4'/%3E%3C/svg%3E") center no-repeat;
}

.project-modal__thumb-nav--next {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' d='M6 4l4 4-4 4'/%3E%3C/svg%3E") center no-repeat;
}

.project-modal__thumbnails-list {
    display: flex;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    flex: 1;
}

.project-modal__thumbnail-item {
    flex-shrink: 0;
    width: 100px;
    height: 75px;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    transition: border-color 0.3s ease;
    display: none; /* Hidden by default, shown via JS */
}

.project-modal__thumbnail-item:hover,
.project-modal__thumbnail-item.is--active {
    border-color: #00B7F4;
}

.project-modal__thumbnail-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-modal__right {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.project-modal__title {
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    margin: 0;
    color: #000;
}

.project-modal__tag {
    display: inline-block;
    padding: 6px 12px;
    background: #00B7F4;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    align-self: flex-start;
}

.project-modal__details {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.project-modal__detail {
    display: flex;
    gap: 8px;
    font-size: 15px;
    line-height: 1.6;
}

.project-modal__detail-label {
    font-weight: 600;
    color: #000;
}

.project-modal__detail-value {
    color: #666;
    font-weight: 400;
}

.project-modal__want-btn {
    padding: 12px 20px;
    border-radius: 5000px;
    align-self: flex-start;
}

.project-modal__description {
    margin-top: 20px;
}

.project-modal__description-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 15px 0;
    color: #000;
}

.project-modal__description-text {
    font-size: 15px;
    font-weight: 600;
    line-height: 28px;
    color: #666;
}

.project-modal__description-text p {
    margin: 0 0 15px 0;
}

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

@media (max-width: 1024px) {
    .frame--completed-projects .frame-header__body {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .completed-projects__nav {
        margin-left: unset;
    }

    .completed-projects__pagination {
        font-size: 14px;
    }

    .project-modal__content {
        grid-template-columns: 1fr;
    }

    .project-modal__container {
        padding: 30px 20px;
        margin: 20px;
    }
}

@media (max-width: 1024px) {
    .completed-projects__card {
        flex-direction: column;
        padding: 30px;
        gap: 30px;
    }

    .completed-projects__image {
        width: 100%;
    }

    .completed-projects__image .media__wrapper {
        padding-bottom: 56.25%; /* 16:9 aspect ratio */
    }
}

@media (max-width: 580px) {

    .uslugi-panels-type-item {
        padding: 20px;
    }

    .header-uslugi-panels-type-item h3 {
        font-size: 16px;
        max-width: 150px;
    }

    .frame--completed-projects {
        padding: 60px 30px;
    }

    .frame--completed-projects .frame__title {
        font-size: 28px;
    }

    .completed-projects__slider {
        margin-top: 40px;
    }

    .completed-projects__pagination {
        font-size: 12px;
        min-width: 50px;
    }

    .completed-projects__nav {
        gap: 12px;
    }

    .completed-projects__card {
        padding: 20px;
        gap: 20px;
    }

    .completed-projects__content {
        gap: 20px;
    }

    .completed-projects__title {
        font-size: 18px;
    }

    .project-modal__container {
        padding: 20px 15px;
        margin: 10px;
    }

    .project-modal__close {
        top: 10px;
        right: 10px;
        width: 32px;
        height: 32px;
    }

    .project-modal__title {
        font-size: 20px;
    }

    .project-modal__thumbnails {
        gap: 8px;
    }

    .project-modal__thumbnail-item {
        width: 80px;
        height: 60px;
    }
}