/* Estilo automático para a página: Leitura Empreendimento */

.page-container {
  padding: 0;
}

#cabecalho-emp {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 720px;
    display: flex;
    align-items: center;
    position: relative;

    .sombra-servico {
        background-image: linear-gradient(#000000ba, #0000006e);
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 0;
        top: 0;
        border-radius: 0;
    }

    .sub-titulo-cabecalho{
        color: var(--branco);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;  
    }

    h1{
        color: var(--branco);
        font-size: 48px;
        letter-spacing: -0.096px;
        margin-bottom: 24px;
    }

    .descricao-banner {
        color: var(--branco);
        font-size: 18px;
        font-weight: 500;
        line-height: 160%;
        letter-spacing: -0.036px;
    }



    .form-emp{
        border-radius: 16px;
        background: var(--degrade, linear-gradient(120deg, #933 -0.93%, #572424 47.72%, #212121 79.2%));
        padding: 22px;

        h3 {
            color: var(--branco);
            font-size: 24px;
            font-weight: 600;
            line-height: 160%;
            letter-spacing: -0.048px;
            margin: 0 0 16px 0;
        }
        .text-subtitulo {
            color: var(--branco);
            font-size: 16px;
            font-weight: 400;
            line-height: 160%;
            letter-spacing: -0.032px;
        }
        .form-control {
            border-radius: 8px;
            border: 1px solid #906060;
            background: rgba(120, 57, 57, 0.80);
            height: 50px;
            color: #BD9D9D;
            font-size: 15px;
            font-weight: 400;
            line-height: 160%;
        }
        .form-select {
            border-radius: 8px;
            border: 1px solid #906060;
            background: rgba(120, 57, 57, 0.80);
            height: 50px;
            color: #BD9D9D;
            font-size: 15px;
            font-weight: 400;
            line-height: 160%;
        }
        .btn-padrao{
            height: 51px !important;
            width: 100%;
            border: none;
            max-height: 100%;
        }
    
        input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
            color: #BD9D9D !important;
        }
        input::-moz-placeholder { /* Firefox 19+ */
            color: #BD9D9D !important;
        }
        input:-ms-input-placeholder { /* IE 10+ */
            color: #BD9D9D !important;
        }
        input:-moz-placeholder { /* Firefox 18- */
            color: #BD9D9D !important;
        }
        .form-control:focus {
            box-shadow: none;
        }
        .form-select:focus {
            box-shadow: none;
        }
    }
}

#diferenciais{
    background: var(--preto);
    padding: 66px 0;

    .subtitulo {
        color: #F4F4F4;
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;
    }

    .card-diferencial {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
   
        .moldura-diferenciais {
            width: 56px;
            height: 56px;
            background-color: #2d2323;
            border-radius: 8px;
            display: flex;
            justify-content: center;
            align-items: center;

            img{
                width: 28px;
                height: 28px;
                object-fit: contain;
            }
        }
    }
    .item-diferencial {
        color: var(--branco);
        text-align: center;
        font-size: 24px;
        font-weight: 700;
        letter-spacing: -0.048px;
        margin: 24px 0; 
    }

    .passadores{
        .swiper-button-prev {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            left: -70px;
        }

        .swiper-button-next {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            right: -70px;
        }

        .swiper-button-prev:after{
            content: '';
        } 
        .swiper-button-next:after{
            content: '';
        }
    }
}

#galeria{
    padding: 88px 0 0;
    text-align: center;

    .subtitulo {
        color: var(--preto);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -2px;
        }
    }

    h2{
        color: var(--preto);
        span{
            color: var(--vermelho);
        }
    }

    .img-galeria-emp{
        width: 100%;
        height: 420px;
        object-fit: cover;
        border-radius: 16px;
    }

    .passadores-galeria{
        .swiper-button-prev {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            left: 370px;
        }

        .swiper-button-next {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            right: 370px;
        }

        .swiper-button-prev:after{
            content: '';
        } 
        .swiper-button-next:after{
            content: '';
        }
    }
}

#videos{
    padding: 88px 0;
    text-align: center;

    .subtitulo {
        color: var(--preto);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -2px;
        }
    }

    h2{
        color: var(--preto);
        span{
            color: var(--vermelho);
        }
    }

    .capa-video{
        width: 100%;
        height: 500px;
        object-fit: cover;
        border-radius: 16px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .passadores-video{
        .swiper-button-prev {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            left: -70px;
        }

        .swiper-button-next {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            right: -70px;
        }

        .swiper-button-prev:after{
            content: '';
        } 
        .swiper-button-next:after{
            content: '';
        }
    }
}

#tuor360{
    padding: 0;
    margin: 0;
    margin-bottom: -7px;

    iframe{
        padding: 0;
        margin: 0;
        overflow: hidden;
        height: 500px;

        html, body{
            overflow: hidden;
        }
    }
}

#plantas{
    padding: 88px 0 0;
    background-color: var(--preto);

    .subtitulo {
        color: var(--branco);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -2px;
        }
    }

    h2{
        color: var(--branco);
        span{
            color: var(--vermelho);
        }
    }

    .fundo-preto{
        background-color: var(--preto);
    }

    .moldura {
        position: relative;
        height: 100%;
        padding: 25px 25px 0 0;

        &::after {
            display: inline-block;
            width: 238px;
            height: 330px;
            border-radius: 20px;
            background: #933;
            content: "";
            top: 0;
            right: 0;
            position: absolute;
            z-index: 0;
        }

        .img-planta{
            width: 100%;
            height: 460px;
            object-fit: cover;
            border-radius: 16px;
            position: relative;
            z-index: 1;
        }
    }

    .list-planta {
        margin: 0;
        padding: 0;
        li {
            color: var(--branco);
            font-size: 24px;
            font-weight: 500;
            line-height: 160%;
            letter-spacing: -0.048px;
            list-style-type: none;
            margin-bottom: 8px;
            padding-left: 8px;

            img{
                position: relative;
                top: -2px;
                left: -8px;
            }
        }
    }

    .passadores-plantas{

        display: flex;
        justify-content: flex-start;

        .swiper-button-prev {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            left: 0px;
            position: relative;
        }

        .swiper-button-next {
            background-color: var(--vermelho);
            width: 56px;
            height: 56px;
            border-radius: 40px;
            right: -70px;
            position: relative;
        }

        .swiper-button-prev:after{
            content: '';
        } 
        .swiper-button-next:after{
            content: '';
        }
    }

    hr{
        color: var(--branco);
    }

}

#localizacao{
    padding: 60px 0 83px;
    background-color: var(--preto);

    .subtitulo {
        color: var(--branco);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -2px;
        }
    }

    h2{
        color: var(--branco);
    }

    iframe{
        width: 100%;
        height: 300px;
        border-radius: 16px;
        margin-top: 26px;
    }
    .ml-24 {
        margin-left: 24px;
    }

}

#obra{
    padding: 88px 0;
    text-align: center;

    .subtitulo {
        color: var(--preto);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -2px;
        }
    }

    h2{
        color: var(--preto);
        span{
            color: var(--vermelho);
        }
    }

    .title_andamento {
        color: var(--preto);
        font-size: 18px;
        font-weight: 600;
        letter-spacing: -0.04px;
        margin: 0;

        .icon-obra{
            width: 25px;
            height: 25px;
            object-fit: contain;
        }
    }
    .card-obra {
        display: flex;
        border-radius: 5px;
        padding: 10px 20px 10px 10px;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 10px;
        position: relative;
        width: 100%;
    }
    .alinhar-valor {
        width: 100%;
        position: relative;
        display: flex;
        background-color: #fff;
        border-radius: 8px;
        border: 2px solid var(--preto);
        margin-top: 10px;
    }
    .porcentagem {
        margin: 0;
        right: 0;
        top: -43px;
        position: absolute;
        color: var(--vermelho);
        text-align: right;
        font-size: 20px;
        font-weight: 700;
        letter-spacing: -0.04px;
    }
    .skills {
        text-align: right;
        padding-top: 30px;
        padding-bottom: 10px;
        color: #fff;
    }

}

#porDentro{
    padding: 77px 0;
    background: var(--degrade, linear-gradient(120deg, #933 -0.93%, #572424 47.72%, #212121 79.2%));

    .subtitulo{
        color: var(--branco);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;

        img{
            position: relative;
            top: -1px;
        }
    }
    h2{
        font-weight: 600;
    }
    h3 {
        color: var(--branco);
        font-size: 24px;
        font-weight: 600;
        line-height: 160%;
        letter-spacing: -0.048px;
        margin: 0 0 16px 0;
    }
    .text-subtitulo {
        color: var(--branco);
        font-size: 16px;
        font-weight: 400;
        line-height: 160%;
        letter-spacing: -0.032px;
    }
    .formulario{

        .form-control {
            border-radius: 8px;
            border: 1px solid #906060;
            background: rgba(120, 57, 57, 0.80);
            height: 50px;
            color: #BD9D9D;
            font-size: 15px;
            font-weight: 400;
            line-height: 160%;
        }
        .form-select {
            border-radius: 8px;
            border: 1px solid #906060;
            background: rgba(120, 57, 57, 0.80);
            height: 50px;
            color: #BD9D9D;
            font-size: 15px;
            font-weight: 400;
            line-height: 160%;
        }
        .btn-padrao{
            height: 51px !important;
            width: 100%;
            border: none;
            max-height: 100%;
        }

        input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
            color: #BD9D9D !important;
        }
        input::-moz-placeholder { /* Firefox 19+ */
            color: #BD9D9D !important;
        }
        input:-ms-input-placeholder { /* IE 10+ */
            color: #BD9D9D !important;
        }
        input:-moz-placeholder { /* Firefox 18- */
            color: #BD9D9D !important;
        }
        .form-control:focus {
            box-shadow: none;
        }
        .form-select:focus {
            box-shadow: none;
        }
    }
}



/* TABLET */
@media (min-width: 768px) and (max-width: 1024px) {

    #cabecalho-emp {
        height: auto;
        padding: 140px 0 0px;

        .form-emp {
            border-radius: 16px 16px 0 0;
            margin-top: 40px;
        }
    }

    #diferenciais {
        .passadores {
            position: relative;

            .swiper-button-next {
                right: 10px;
            }
            .swiper-button-prev {
                left: 10px;
            }
        }
    }

    #galeria {
        .passadores-galeria {
            position: relative;
            margin-top: 40px;

            .swiper-button-prev {
                left: 10px;
            }
            .swiper-button-next {
                right: 10px;
            }
        }
    }

    #videos {
        .capa-video {
            height: 230px;
        }
        .passadores-video {
            position: relative;
            margin-top: 40px;

            .swiper-button-prev {
                left: 10px;
            }
            .swiper-button-next {
                right: 10px;
            }
        }
    }

    #plantas {
        margin-bottom: -10px;

        .moldura {
            margin-top: 37px;
            
            .img-planta {
                height: 360px;
            }
        }
        .passadores-plantas {
            display: flex;
            justify-content: space-between;
            margin-top: 40px;

                .swiper-button-next {
                    right: 0;
                }
                .swiper-button-prev {
                    left: 0;
                }

        }
    }
}

/* MOBILE */
@media all and (max-width: 767px) { 
    #cabecalho-emp {
        height: auto;
        padding: 140px 0 0px;

        .form-emp {
            border-radius: 16px 16px 0 0;
            margin-top: 40px;
        }
    }

    #diferenciais {
        .passadores {
            position: relative;

            .swiper-button-next {
                right: 10px;
            }
            .swiper-button-prev {
                left: 10px;
            }
        }
    }

    #galeria {
        .passadores-galeria {
            position: relative;
            margin-top: 40px;

            .swiper-button-prev {
                left: 10px;
            }
            .swiper-button-next {
                right: 10px;
            }
        }
    }

    #videos {
        .capa-video {
            height: 230px;
        }
        .passadores-video {
            position: relative;
            margin-top: 40px;

            .swiper-button-prev {
                left: 10px;
            }
            .swiper-button-next {
                right: 10px;
            }
        }
    }

    #tuor360{
        iframe{
            height: 300px;
        }
    }

    #plantas {
        margin-bottom: -10px;

        .list-planta {
            li {
                font-size: 18px;
            }
        }
        .moldura {
            margin-top: 37px;
            
            .img-planta {
                height: 360px;
            }
        }
        .passadores-plantas {
            display: flex;
            justify-content: space-between;
            margin-top: 40px;

                .swiper-button-next {
                    right: 0;
                }
                .swiper-button-prev {
                    left: 0;
                }

        }
    }

    #localizacao {
        text-align: center;

        .ordem-mob{
            flex-direction: column;

            .ml-24 {
                margin-top: 16px;
            }

        }
    }

    #obra {
        .card-obra {
            margin-bottom: 0;
        }
    }
}