/* page_architecture-b2b-details.less */

@import "main.less";

.page_architecture-b2b-details {
    .b2b_details_header {
        min-height         : 70vh;
        background-size    : cover;
        background-repeat  : no-repeat;
        background-position: center;
        position           : relative;

        @media @small {
            min-height: 25vh;
        }

        &:before {
            content         : '';
            position        : absolute;
            top             : 0;
            right           : 0;
            bottom          : 0;
            left            : 0;
            background-color: rgba(44, 57, 68, 0.3);
        }

        .architecture_b2b_header_text {
            z-index: 1;

            .architecture_b2b_title {
                font-family   : 'Barlow';
                font-style    : normal;
                font-weight   : 700;
                font-size     : 70px;
                line-height   : 80px;
                letter-spacing: 2.8px;
                text-transform: uppercase;
                color         : #fff;

                @media @small {
                    font-weight: 700;
                    font-size  : 25px;
                    line-height: 28px;
                }
            }

            .architecture_b2b_subtitle {
                font-family: 'Roboto';
                font-style : normal;
                font-weight: 400;
                font-size  : 24px;
                line-height: 28px;
                color      : #fff;
            }
        }
    }

    .b2b_details_content {
        padding: 80px 0;

        h4 {
            color         : #445B6D;
            text-transform: uppercase;
            font-family   : 'Barlow Semi Condensed';
            font-weight   : bold;
            letter-spacing: 1px;
            font-size     : 27px;
        }

        p {
            font-family: 'Barlow';

            &:not(:last-child) {
                margin-bottom: 60px;
            }
        }
    }

    .projects_slider_container {

        .projects_header {
            color: #445B6D;

            .projects_header_title {
                font-family   : 'Barlow Semi Condensed';
                font-style    : normal;
                font-weight   : 700;
                font-size     : 42px;
                line-height   : 119%;
                text-align    : center;
                text-transform: uppercase;

                @media @small {
                    font-size: 25px;
                }
            }

            .projects_header_subtitle {
                font-family: 'Roboto';
                font-style : normal;
                font-weight: 400;
                font-size  : 22px;
                line-height: 127%;
                text-align : center;

                @media @small {
                    font-size: 20px;
                }
            }
        }

        .projects_slider {
            padding: 60px 0;

            .slick-slide {
                margin: 0 27px;

                @media @small {
                    margin: 0;
                }

                &:not(:first-child) {
                    @media @small {
                        padding-left: 20px;
                    }
                }
            }

            .slick-arrow {
                filter: brightness(0) saturate(100%) invert(48%) sepia(38%) saturate(195%) hue-rotate(165deg) brightness(94%) contrast(87%);

                &::before {
                    font-size: 40px;
                }
            }

            .slick-prev {
                left: -55px;
            }

            .slick-next {
                right: -45px;
            }

            .slick-list {
                margin: 0 -27px;

                @media @small {
                    margin : 0;
                    padding: 0 20% 0 0 !important;
                }
            }

            .project_header {
                margin: 20px 0;

                .project_title {
                    font-family   : 'Barlow';
                    font-style    : normal;
                    font-weight   : 700;
                    font-size     : 32px;
                    line-height   : 112%;
                    letter-spacing: 1.71429px;
                    text-transform: uppercase;
                    color         : #445B6D;

                    @media @small {
                        font-size: 17px;
                    }
                }

                .project_desc {
                    font-family: 'Roboto';
                    font-style : normal;
                    font-weight: 400;
                    font-size  : 20px;
                    line-height: 24px;
                    color      : #000;

                    @media @small {
                        font-size: 15px;
                    }
                }
            }
        }
    }

    .offers_section {

        .offers_header {
            color         : #445B6D;
            text-align    : center;
            padding-bottom: 30px;

            .offers_title {
                font-family   : 'Barlow Semi Condensed';
                font-style    : normal;
                font-weight   : 700;
                font-size     : 42px;
                line-height   : 50px;
                text-align    : center;
                text-transform: uppercase;

                @media @small {
                    font-size  : 25px;
                    line-height: 31px;
                }
            }

            .offers_subtitle {
                font-family: 'Roboto';
                font-style : normal;
                font-weight: 400;
                font-size  : 22px;
                line-height: 28px;
                text-align : center;

                @media @small {
                    font-size  : 20px;
                    line-height: 24px;
                }
            }
        }

        .video_section {
            background-color: #262E37;
            padding         : 60px 0;

            .logo_newton {
                width        : 223px;
                margin-bottom: 20px;
            }

            .video_section_title {
                font-family: 'Barlow Semi Condensed';
                font-style : normal;
                font-weight: 700;
                font-size  : 42px;
                line-height: 50px;
                color      : #ACCBE4;

                @media @small {
                    font-size  : 25px;
                    line-height: 27px;
                }
            }

            .video_section_subtitle {
                font-family: 'Roboto';
                font-style : normal;
                font-weight: 400;
                font-size  : 20px;
                line-height: 26px;
                color      : #fff;

                @media @small {
                    font-size  : 18px;
                    line-height: 24px;
                }
            }

            .logo_newton.desktop_hide {
                margin    : 20px auto;
                margin-top: 0;
            }
        }
    }

    .products_section {
        background-color: #445B6D;
        padding         : 60px 0;

        @media @small {
            padding: 30px 0;
        }

        .products_slider {

            .products_slider_title {
                font-family   : 'Barlow';
                font-style    : normal;
                font-weight   : 700;
                font-size     : 21px;
                line-height   : 50px;
                letter-spacing: 3px;
                text-transform: uppercase;
                color         : #FFFFFF;

                @media @small {
                    font-size  : 24px;
                    line-height: 27px;
                }
            }

            .products_slider_subtitle {
                font-family   : 'Barlow';
                font-style    : normal;
                font-weight   : 700;
                font-size     : 32px;
                line-height   : 36px;
                letter-spacing: 1.71429px;
                text-transform: uppercase;
                color         : #ACCBE4;

                @media @small {
                    font-size  : 20px;
                    line-height: 24px;
                }
            }

            .products_slider_desc {
                font-family  : 'Barlow';
                font-style   : normal;
                font-weight  : 400;
                font-size    : 20px;
                line-height  : 24px;
                color        : #FFFFFF;
                margin-bottom: 0;
            }

            .slick-prev {
                left: 0;
            }

            .slick-next {
                right: 0;
            }
        }
    }

    .b2b_details_content {
        padding: 80px 0;

        h4 {
            color         : #445B6D;
            text-transform: uppercase;
            font-family   : 'Barlow Semi Condensed';
            font-weight   : bold;
            letter-spacing: 1px;
            font-size     : 27px;
        }

        p {
            font-family: 'Barlow';

            &:not(:last-child) {
                margin-bottom: 60px;
            }
        }
    }

    .back_b2b_section {
        background-color: #EAF0F4;
        margin          : 0;
        padding         : 60px 0;
        display         : block;
        text-decoration : none;

        .back_b2b_container {
            margin         : 0 auto;
            text-align     : center;
            display        : flex;
            align-items    : center;
            justify-content: center;

            @media @medium {
                width: 80%;
            }

            @media @small_medium {
                display: block;
            }

            @media @small {
                width: 100%;
            }

            img {
                width         : 55px;
                transform     : rotate(180deg);
                vertical-align: middle;
                margin-right  : 20px;

                @media @small_medium {
                    display   : block;
                    text-align: center;
                    margin    : 20px auto;
                    margin-top: 0;
                }
            }

            .back_b2b_text {
                font-family   : 'Barlow';
                font-style    : normal;
                font-weight   : 400;
                font-size     : 31px;
                line-height   : 37px;
                color         : #445B6D;
                letter-spacing: 1px;
                text-transform: uppercase;
                margin        : 0;
                text-align    : left;

                @media @small {
                    font-size  : 21px;
                    line-height: 24px;
                }
            }
        }
    }


    .contacts_section {
        padding-top: 100px;

        @media @small_medium {
            padding: 20px 0;
        }

        .top_footer_wrap {
            margin-bottom: 0;
        }

        .top_footer_title {
            text-transform: uppercase;
        }

        .top_footer_subtitle {
            font-family: 'Barlow Semi Condensed';
            font-style : normal;
            font-weight: 400;
            font-size  : 31px;
            line-height: 50px;
            color      : #262E37;

            @media @small {
                font-size  : 17px;
                line-height: 23px;
                margin-top : 20px;
            }
        }

        .address {
            @media @small {
                margin-bottom: 40px;
            }
        }

        .top_footer_header {
            margin: 0;
        }

        .address_title {
            font-family   : 'Barlow Condensed';
            font-style    : normal;
            font-weight   : 400;
            font-size     : 32px;
            line-height   : 100%;
            text-transform: uppercase;
            color         : #445B6D;
        }

        .address_desc {
            font-family: 'Roboto';
            font-style : normal;
            font-weight: 400;
            font-size  : 16px;
            line-height: 125%;
            color      : #000000;

            .email_address {
                margin : 40px 0;
                display: block;
            }
        }
    }

    .contact_altex_badge {
        position    : -webkit-sticky;
        position    : sticky;
        bottom      : 10px;
        text-align  : right;
        z-index     : 2;
        margin-right: 10px;

        @media @small {
            margin-right: 0;
        }

        img {
            width: 110px;

            @media @xlarge {
                width: 160px;
            }
        }

        .white_icon {
            filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(1%) hue-rotate(121deg) brightness(107%) contrast(101%);
        }
    }
}