/*********** BANNER ***********/
#banner {
    position: relative;
}

#banner .banner-bg {
    position: relative;
    height: auto;
    color: var(--branco);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 8%;
}

#banner .banner-bg.banner-inicial {
    background-image: url(../../empreendimentos-imobiliarios/home/p4-engenharia-banner.webp);
}

#banner .container {
    position: relative;
    z-index: 1;
}

#banner .banner-bg .container {
    padding: 16.4vw 10vw 2.8vw 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

#banner .filter-01 {
    background: #000000;
    background-blend-mode: multiply;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(45.06%, rgba(40, 40, 40, 0.45)), to(rgba(15, 15, 15, 0.75)));
    background: -o-linear-gradient(top, rgba(40, 40, 40, 0.45) 45.06%, rgba(15, 15, 15, 0.75) 100%);
    background: linear-gradient(180deg, rgba(40, 40, 40, 0.45) 45.06%, rgba(15, 15, 15, 0.75) 100%);
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
}

#banner .filter-02 {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #000000;
    background-blend-mode: multiply;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(82.71%, rgba(0, 0, 0, 0)), to(rgba(32, 32, 32, 0.95)));
    background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0) 82.71%, rgba(32, 32, 32, 0.95) 100%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 82.71%, rgba(32, 32, 32, 0.95) 100%);
}

#banner .banner-bg .subtitulo {
    font-family: var(--manrope);
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 11px;
    width: 100%;
    margin-bottom: 0;
}

#banner .banner-bg .subtitulo b {
    letter-spacing: 0px;
    color: var(--vermelho);
}

#banner .banner-bg .nome {
    width: 100%;
    font-size: 9.01vw;
    font-weight: 800;
    line-height: 8vw;
    letter-spacing: 4.1px;
    margin-bottom: 0.52vw;
    margin-top: 0.3vw;
}

#banner .banner-bg .nome .block {
    text-align: right;
}

#banner .banner-bg .nome.emp {
    margin-bottom: 40px;
    font-size: 5.21vw;
    line-height: 5.9vw;
    padding-right: 13vw;
    padding-top: 2vw;
}

#banner .banner-bg .texto {
    font-size: 0.83333vw;
    font-weight: 500;
    line-height: 1.146vw;
    max-width: 480px;
}

#banner .banner-bg .status {
    font-size: 1.1458vw;
    font-weight: 900;
    line-height: 1.375vw;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 0.468vw;
}

#banner .banner-bg .endereco {
    font-size: 0.9375vw;
    font-weight: 400;
    line-height: 1.354vw;
    letter-spacing: 1px;
    text-transform: uppercase;
}

#banner .banner-bg .detalhes {
    font-size: 14px;
    font-weight: 900;
    line-height: 16.8px;
    letter-spacing: 1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0.88vw;
    gap: 20px;
}

#banner .banner-bg .detalhes .metragem,
#banner .banner-bg .detalhes .quartos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#banner .banner-bg .detalhes svg {
    margin-right: 8px;
}

#banner .banner-bg .btn {
    font-family: var(--manrope);
    font-size: 14px;
    font-weight: 800;
    line-height: 14.4px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    display: block;
    transition: all 0.5s;
    color: var(--branco);
    position: relative;
    cursor: pointer;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    border: 2px solid #f4f4f473;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    padding: 8.5px 19px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 32px;
    margin-top: 17px;
}

#banner .banner-bg .btn:hover {
    background-color: #f4f4f473;
    -webkit-box-shadow: inset 0 0 0 30px #27272780;
    box-shadow: inset 0 0 0 30px #27272780;
}


#banner .banner-bg .play-btn {
    width: 6.563vw;
    height: 6.563vw;
    position: absolute;
    left: 18.2vw;
    top: 27.3vw;
    cursor: pointer;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#banner .banner-bg .play-btn:hover {
    scale: 1.1;
}

#banner .navigation {
    position: absolute;
    z-index: 1;
    bottom: 6.3vw;
    left: 4.8%;
    width: 35px;
    height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.swiper-button-next,
.swiper-button-prev {
    display: block;
    width: 35px !important;
    height: 35px !important;
    border: 2px solid var(--vermelho);
    border-radius: 35px;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

.swiper-button-disabled {
    border: 2px solid transparent;
}

.swiper-button-prev {
    left: 0 !important;
}

.swiper-button-next {
    right: 0 !important;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    -webkit-box-shadow: inset 0 0 0 30px var(--vermelho);
    box-shadow: inset 0 0 0 30px var(--vermelho);
}

.swiper-button-next:hover::after {
    top: -8px;
}

.swiper-button-prev:hover::after {
    top: -9px;
}

#banner .swiper-button-next,
#banner .swiper-button-prev,
#quemsomos .swiper-button-next,
#quemsomos .swiper-button-prev {
    position: relative;
    top: auto;
    bottom: auto;
    right: auto;
    left: auto;
    margin-top: 0;
}

.swiper-button-next::after {
    content: url(../../empreendimentos-imobiliarios/icones/seta-esquerda.svg) !important;
    display: block;
    width: 7px;
    height: 24px;
    position: absolute;
    left: 13px;
    top: -18px;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

.swiper-button-prev::after {
    content: url(../../empreendimentos-imobiliarios/icones/seta-direita.svg) !important;
    display: block;
    width: 7px;
    height: 24px;
    position: absolute;
    left: 9px;
    top: 3px;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#banner .swiper-wrapper {
    -webkit-box-align: stretch !important;
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

#banner .swiperthumb .nome-thumb {
    font-family: var(--manrope);
    color: var(--branco);
    font-size: 0.8333vw;
    line-height: 1.146vw;
    font-weight: 800;
    position: relative;
    z-index: 1;
}

#banner .swiperthumb .thumb-bg {
    height: 11.625vw;
    padding: 1.563vw;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    transition: .3s ease-in-out;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -ms-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    cursor: pointer;
    background-color: var(--vermelho);
    background-position: center;
    opacity: 0.5;
}

#banner .detalhe-thumb {
    position: absolute;
    top: 1.563vw;
    right: 1.563vw;
}

#banner .container-thumb {
    width: 20.083vw;
    padding-left: 5vw;
    position: absolute;
    right: 0;
    bottom: 15.365vw;
    border-radius: 10px 0 0 10px;
    -webkit-border-radius: 10px 0 0 10px;
    -moz-border-radius: 10px 0 0 10px;
    -ms-border-radius: 10px 0 0 10px;
    -o-border-radius: 10px 0 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1;
    overflow: hidden;
}

#banner .container-thumb .swiper {
    overflow: visible;
    width: 72%;
    margin-left: 0;
}

#banner .swiperthumb .swiper-slide-active {
    opacity: 1;
    background-image: none !important;
}

/********* BIG NUMBERS ***********/
#numbers {
    position: relative;
    margin-top: -28px;
}

#numbers::before {
    content: '';
    display: block;
    width: 100%;
    height: calc(100% - 56px);
    background-color: #f4f4f4;
    position: absolute;
    top: 28px;
    left: 0;
}

#numbers .titulo {
    font-weight: 700;
    font-size: 2.604vw;
    line-height: 3.021vw;
}

.subtitulo {
    font-family: var(--manrope);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 10px;
    width: 100%;
    margin-bottom: 20px;
}

.subtitulo b {
    letter-spacing: 0px;
    color: var(--vermelho);
}

#numbers .esq {
    width: 42%;
    padding-left: 8.5%;
    position: relative;
}

#numbers .dir {
    width: 49.7%;
}

#numbers .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    z-index: 1;
}

#numbers .boxes {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 18px;
}

#numbers .boxes .box {
    width: 100%;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    color: var(--branco);
    background-color: var(--preto);
    font-size: 1.25vw;
    font-weight: 800;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.354vw 3.125vw;
}

#numbers .boxes .box.box-rosa {
    background-color: var(--vermelho);
}

#numbers .boxes .box.box-bg1 {
    background-image: url(../../empreendimentos-imobiliarios/home/big-number-bg1.webp);
    background-size: cover;
    background-position: center;
}

#numbers .boxes .box.box-bg2 {
    background-image: url(../../empreendimentos-imobiliarios/home/big-number-bg2.webp);
    background-size: cover;
    background-position: center;
}

#numbers .boxes .box .num {
    font-size: 2.5vw;
}

#numbers .boxes .box .tag {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #f4f4f444;
    font-family: var(--manrope);
    font-size: 14px;
    width: 30px;
    height: 30px;
    border-radius: 5px 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#numbers .boxes .trio {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 18px;
}

#numbers .boxes .trio .box {
    width: 50%;
    padding: 1.354vw 1.042vw;
    font-size: 0.8333vw;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    text-align: center;
}

#numbers .boxes .trio .box .num {
    font-size: 1.875vw;
}

#numbers .somos-fly {
    width: 180px;
    height: 180px;
    background-image: url(../../empreendimentos-imobiliarios/home/big-number-wheel.webp);
    background-position: center;
    border-radius: 50%;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    position: absolute;
    top: calc(50% - 90px);
    left: -8%;
    -webkit-animation: rotating 10s linear infinite;
    animation: rotating 10s linear infinite;
}

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#numbers .img-gly {
    width: 58px;
    height: 60px;
    position: absolute;
    top: calc(50% - 30px);
    left: 3%;
}

/********* LANÇAMENTOS E OBRAS ***********/
.obras {
    padding: 60px 0 90px;
    overflow-x: hidden;
    position: relative;
}

#obras.obras {
    padding: 60px 0 140px;
}

.obras .container {
    position: relative;
}

.obras .navigation {
    width: 95px;
    height: 47px;
    bottom: -80px;
    position: absolute;
    left: 0;
}

.obras .navigation .swiper-button-next::after,
.obras .navigation .swiper-button-prev::after {
    filter: invert(1);
    -webkit-filter: invert(1);
}

.obras .navigation .swiper-button-disabled {
    border: 2px solid var(--vermelho);
}

.obras .navigation .swiper-button-next::after,
.obras .navigation .swiper-button-prev::after {
    content: url(../../empreendimentos-imobiliarios/icones/seta-direita-v2.svg) !important;
    width: 24px;
    height: 7px;
    top: -18px;
}

.obras .navigation .swiper-button-next::after {
    left: -8px;
}

.obras .navigation .swiper-button-next:hover::after {
    top: -18px;
    left: 3px;
}

.obras .navigation .swiper-button-prev::after {
    left: 15px;
    transform: scaleX(-1);
}

.obras .navigation .swiper-button-prev:hover::after {
    left: 4px;
}

.obras::before {
    content: '';
    display: block;
    width: calc((99.5vw - min(90vw, 1366px)) / 2);
    height: 100%;
    background: #ffffff;
    background: -webkit-gradient(linear, left top, right top, color-stop(99%, rgba(255, 255, 255, 1)), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(left, rgba(255, 255, 255, 1) 99%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 99%, rgba(255, 255, 255, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.obras .titulo {
    font-weight: 700;
    font-size: 1.875vw;
    line-height: 2.188vw;
    margin-bottom: 20px;
}

.obras .area-filtro {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 40px 0;
}

.obras .area-filtro .btn-filtro {
    font-size: 14px;
    font-weight: 800;
    font-family: var(--manrope);
    text-transform: uppercase;
    line-height: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 9px;
    margin-right: 30px;
    cursor: pointer;
    color: #00000079;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

.obras .area-filtro .btn-filtro:hover,
.obras .area-filtro .btn-filtro.ativo {
    color: #000000;
}

.obras .area-filtro .btn-filtro a {
    color: var(--preto);
}

.obras .area-filtro .btn-filtro::after {
    content: '';
    background-image: url(../../empreendimentos-imobiliarios/icones/seta-baixo.svg);
    display: block;
    width: 8px;
    height: 5px;
    filter: grayscale(1) brightness(3);
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
    -webkit-filter: grayscale(1) brightness(3);
}

.obras .area-filtro .btn-filtro.ativo::after,
.obras .area-filtro .btn-filtro:hover::after {
    filter: grayscale(0) brightness(1);
    -webkit-filter: grayscale(0) brightness(1);
}

.obras .area-filtro .btn-filtro.todos::after {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
}

.obras .area-filtro .btn-filtro.todos:hover::after {
    margin-left: 10px;
}

.obras .swiper {
    overflow: visible;
}

.obras .swiper .capa {
    height: 26.614vw;
    border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -ms-border-radius: 5px 5px 0 0;
    -o-border-radius: 5px 5px 0 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-image: url(../../empreendimentos-imobiliarios/home/img-lancamento.webp);
    padding: 2.344vw 2.604vw;
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-shadow: 0px 4px 4px 0px #00000040;
    box-shadow: 0px 4px 4px 0px #00000040;
}

.obras .swiper.swiper-obras .capa {
    padding: 2.344vw 1.604vw;
}

.obras .swiper.swiper-obras .capa {
    background-image: url(../../empreendimentos-imobiliarios/home/img-obras.webp);
}

.obras .swiper .infos {
    color: var(--branco);
    font-size: 12.5px;
    font-weight: 500;
    line-height: 22px;
    position: relative;
    z-index: 1;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.obras .swiper .detalhes {
    color: var(--vermelho);
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
    position: relative;
    z-index: 1;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out 0.1s;
    -webkit-transition: all 0.3s ease-in-out 0.1s;
    -moz-transition: all 0.3s ease-in-out 0.1s;
    -ms-transition: all 0.3s ease-in-out 0.1s;
    -o-transition: all 0.3s ease-in-out 0.1s;
}

.obras .swiper .swiper-slide:hover .infos,
.obras .swiper .swiper-slide:hover .detalhes {
    max-height: 300px;
    opacity: 1;
}

.obras .swiper .swiper-slide:hover .filter {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(88.11%, rgba(0, 0, 0, 0.75)));
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 88.11%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 88.11%);
}

.obras .swiper .tag {
    color: var(--branco);
    font-size: 10px;
    font-weight: 700;
    line-height: 12px;
    position: absolute;
    z-index: 1;
    top: 25px;
    left: 25px;
    background-color: var(--vermelho);
    padding: 4px 10px;
}

.obras .swiper .nome {
    color: var(--branco);
    font-size: 1.667vw;
    font-weight: 700;
    line-height: 2.083vw;
    position: relative;
    z-index: 1;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.obras .swiper .filter {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(67.48%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.75)));
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 67.48%, rgba(0, 0, 0, 0.75) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 67.48%, rgba(0, 0, 0, 0.75) 100%);
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

.obras .swiper .nome-container {
    flex: 1;
}

.obras .swiper .btn {
    display: block;
    width: 35px;
    height: 35px;
    border: 2px solid var(--vermelho);
    border-radius: 35px;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    position: relative;
    z-index: 1;
}

.obras .swiper .btn::after {
    content: '';
    background-image: url(../../empreendimentos-imobiliarios/icones/seta-direita-v2.svg);
    display: block;
    height: 7px;
    width: 24px;
    position: absolute;
    left: -7px;
    top: 10px;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

.obras .swiper .swiper-slide:hover .btn {
    background-color: var(--vermelho);
}

.obras .swiper .swiper-slide:hover .btn::after {
    left: 3px;
}

.obras .swiper .bottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    gap: 15px;
}

.obras .area-status {
    width: 100%;
    height: 30px;
    background-color: #dadada;
    text-align: center;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0 2.604vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.obras .area-status .status {
    font-family: var(--manrope);
    font-size: 16px;
    color: var(--branco);
    font-weight: 700;
    z-index: 1;
}

.obras .area-status .status-obra {
    position: absolute;
    left: 0;
    height: 100%;
    background-color: var(--vermelho);
}

.obras .swiper-obras .area-status .status-obra,
.obras .swiper.swiper-obras .tag {
    background-color: var(--preto);
}

.obras .swiper.swiper-obras .capa {
    height: 16.814vw;
}

.obras .swiper.swiper-obras .nome {
    font-size: 1.25vw;
    line-height: 1.458vw;
}

.obras .non-swiper-slide {
    display: none;
}

/***** QUEM SOMOS ******/
#quemsomos {
    background-color: var(--preto);
    background-image: url(../../empreendimentos-imobiliarios/home/quemsomos-bg.webp);
    background-position: center;
    background-size: cover;
    color: var(--branco);
    padding: 5.104vw 0 3.125vw;
}

#quemsomos .titulo {
    font-weight: 800;
    font-size: 4.688vw;
    line-height: 4.688vw;
    margin-bottom: 30px;
}

#quemsomos .texto {
    font-family: var(--manrope);
    font-weight: 400;
    font-size: 0.938vw;
    line-height: 1.667vw;
}

#quemsomos .texto b {
    font-weight: 700;
}

#quemsomos .esq {
    width: 46%;
    padding-left: 3.5vw;
    position: relative;
}

#quemsomos .esq::before {
    content: '';
    display: block;
    position: absolute;
    left: -1vw;
    top: -3.49vw;
    background-image: url(../../empreendimentos-imobiliarios/home/quem-detalhes.svg);
    background-size: cover;
    width: 10.833vw;
    height: 9.375vw;
}

#quemsomos .dir {
    position: relative;
    width: 45%;
    padding-right: 4vw;
    height: 24vw;
}

#quemsomos .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#quemsomos .somos-fly {
    width: 180px;
    height: 180px;
    background-image: url(../../empreendimentos-imobiliarios/home/big-number-wheel.webp);
    background-position: center;
    border-radius: 50%;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    position: absolute;
    bottom: -1.2vw;
    right: -4.5%;
    -webkit-animation: rotating 10s linear infinite;
    animation: rotating 10s linear infinite;
}

#quemsomos .img-gly {
    width: 58px;
    height: 60px;
    position: absolute;
    bottom: 2vw;
    right: 5%;
}

#quemsomos .navigation {
    position: absolute;
    z-index: 1;
    bottom: 0;
    right: 0;
    width: 35px;
    height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#quemsomos .swiper-quemsomos {
    height: 100%;
}

#quemsomos .indice {
    position: absolute;
    top: 10vw;
    left: -3.5vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

#quemsomos .indice .ind {
    font-weight: 800;
    font-size: 1.25vw;
    line-height: 1.25vw;
    opacity: .5;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#quemsomos .indice .ind.atv {
    opacity: 1;
}

/******* DEPOIMENTOS ******/
#depoimentos {
    position: relative;
    padding: 5vw 0;
    overflow-x: hidden;
}

#depoimentos .area {
    width: 100%;
    height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 30px;
    -moz-column-gap: 30px;
    column-gap: 30px;
    overflow: hidden;
    position: relative;
    margin-bottom: 60px;
}

#depoimentos .box-texto {
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    width: 100%;
}

#depoimentos .texto-loop {
    display: inline-block;
    min-width: 200%;
    -webkit-animation: marquee 40s linear infinite;
    animation: marquee 40s linear infinite;
}

#depoimentos .texto {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.5px;
    display: inline-block;
}

#depoimentos .texto .frase:nth-child(4n + 1) {
    font-weight: 800;
    font-size: 46px;
}

#depoimentos .texto .frase {
    font-weight: 300;
    font-size: 32px;
}

#depoimentos .texto .separador {
    color: var(--vermelho);
    margin-left: 18px;
    margin-right: 18px;
    font-size: 32px;
}

@-webkit-keyframes marquee {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }

    100% {
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

@keyframes marquee {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }

    100% {
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

#depoimentos .dir {
    position: relative;
}

#depoimentos .dir::before {
    content: '';
    display: block;
    width: 26vw;
    height: 120%;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: absolute;
    top: -10%;
    left: 0;
    z-index: 2;
}

#depoimentos .dir::after {
    content: '';
    display: block;
    width: 28vw;
    height: 120%;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: absolute;
    top: -10%;
    right: 0;
    z-index: 2;
}

#depoimentos .swiper {
    width: 130%;
    margin-left: -15%;
}

#depoimentos .box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2.292vw;
    cursor: pointer;
}

#depoimentos .conteudo {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#depoimentos .aspas {
    position: absolute;
    top: 0;
    left: -3vw;
}

#depoimentos .foto-depoimento {
    width: 11.927vw;
    height: 11.927vw;
    border-radius: 160px;
    -webkit-border-radius: 160px;
    -moz-border-radius: 160px;
    -ms-border-radius: 160px;
    -o-border-radius: 160px;
    overflow: hidden;
}

#depoimentos .foto-depoimento img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

#depoimentos .texto-interno {
    font-family: var(--manrope);
    font-weight: 500;
    font-size: 1.042vw;
    line-height: 1.458vw;
}

#depoimentos .texto-interno b {
    font-weight: 600;
}

#depoimentos .texto-interno.texto-margin {
    margin: 20px 0;
}

#depoimentos .navigation {
    position: absolute;
    z-index: 4;
    bottom: 3vw;
    right: 27.8vw;
    width: 100px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#depoimentos .swiper-button-prev::after {
    content: url(../../empreendimentos-imobiliarios/icones/seta-esquerda-preta.svg) !important;
    left: 17px;
    top: -14px;
}

#depoimentos .swiper-button-next::after {
    content: url(../../empreendimentos-imobiliarios/icones/seta-direita-preta.svg) !important;
    left: -8px;
    top: -18px;
}

#depoimentos .swiper-button-prev:hover::after,
#depoimentos .swiper-button-next:hover::after {
    left: 3px;
}

/**********  VÍDEO  ***********/
#video {
    background: #000000;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(54%, rgba(0, 0, 0, 1)), color-stop(54%, rgba(255, 255, 255, 1)));
    background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 54%, rgba(255, 255, 255, 1) 54%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 54%, rgba(255, 255, 255, 1) 54%);
    color: var(--branco);
    padding: 4.688vw 0;
}

#video .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#video .esq {
    width: 70%;
    position: relative;
}

#video .play-btn {
    width: 6.563vw;
    height: 6.563vw;
    position: absolute;
    left: calc(50% - 4.281vw);
    top: calc(50% - 1.281vw);
    cursor: pointer;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#video .play-btn:hover {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
}

#video .dir {
    position: relative;
    width: 24%;
}

#video .titulo {
    font-weight: 800;
    font-size: 3.646vw;
    line-height: 3.958vw;
    margin-bottom: 25px;
    background: -o-linear-gradient(337.8deg, #000000 2.02%, #ED002E 97.26%);
    background: linear-gradient(112.2deg, #000000 2.02%, #ED002E 97.26%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

#video .texto {
    font-family: var(--manrope);
    font-weight: 600;
    font-size: 0.938vw;
    line-height: 1.38vw;
    margin-bottom: 15px;
}

#video .texto:last-child {
    margin-bottom: 0;
}

/**********  MODAL VÍDEO  ***********/
.modal-video-container {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 15;
    -webkit-transition: 0.3s ease all;
    -o-transition: 0.3s ease all;
    transition: 0.3s ease all;
}

.modal-video-container .filter {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #00000099;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 1;
}

.modal-video-container .box-video-p4 {
    z-index: 2;
    width: 60%;
    height: 33.5vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}

.modal-video-container .modal-video-content,
.modal-video-content iframe,
.modal-video-content object,
.modal-video-content embed {
    width: 100%;
    height: 100%;
}

.box-video-p4 .close-p4-video {
    position: absolute;
    top: -30px;
    right: 0;
    color: #fff;
    font-weight: 600;
    font-size: 24px;
    cursor: pointer;
    width: 32px;
    height: 32px;
    border: 2px solid var(--vermelho);
    background-color: #000000db;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 35px;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    -ms-border-radius: 35px;
    -o-border-radius: 35px;
}

@media only screen and (max-width: 800px) {
    .modal-video-container .box-video-p4 {
        width: 90%;
        height: 50.5vw;
    }
}

/************ BLOG ************/
#blog {
    padding: 4.948vw 0;
    position: relative;
}

#blog .titulo {
    font-weight: 400;
    font-size: 1.875vw;
    line-height: 2.396vw;
    width: 100%;
}

#blog .titulo span {
    font-weight: 700;
    background: -o-linear-gradient(337.8deg, #000000 2.02%, #ED002E 97.26%);
    background: linear-gradient(112.2deg, #000000 2.02%, #ED002E 97.26%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

#blog .btn {
    background: -webkit-gradient(linear, left top, right top, from(rgba(237, 0, 46, 1)), color-stop(36%, rgba(248, 50, 0, 1)), color-stop(68%, rgba(237, 0, 46, 1)), to(rgba(248, 50, 0, 1)));
    background: -o-linear-gradient(left, rgba(237, 0, 46, 1) 0%, rgba(248, 50, 0, 1) 36%, rgba(237, 0, 46, 1) 68%, rgba(248, 50, 0, 1) 100%);
    background: linear-gradient(90deg, rgba(237, 0, 46, 1) 0%, rgba(248, 50, 0, 1) 36%, rgba(237, 0, 46, 1) 68%, rgba(248, 50, 0, 1) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    padding: 11px 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    gap: 5px;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    color: var(--branco);
    font-size: 14px;
    font-weight: 800;
    line-height: 14.4px;
    letter-spacing: 1px;
    position: relative;
    font-family: var(--manrope);
    max-width: 180px;
    margin-top: 40px;
    transition: background-position .3s ease-in-out;
    -webkit-transition: background-position .3s ease-in-out;
    -moz-transition: background-position .3s ease-in-out;
    -ms-transition: background-position .3s ease-in-out;
    -o-transition: background-position .3s ease-in-out;
    margin-left: calc(50% - 90px);
}

#blog .btn:hover {
    background-position: 0 0;
}

#blog .bottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    gap: 30px;
    margin-top: 40px;
}

#blog .bottom .box {
    border-radius: 10px;
    background-color: var(--branco);
    width: 33.33%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#blog .bottom .box:hover {
    -webkit-box-shadow: 0px 0px 18.99px 0px #00000040;
    box-shadow: 0px 0px 18.99px 0px #00000040;

}

#blog .box .conteudo-top .esq {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

#blog .box .conteudo-top .esq .categoria {
    font-weight: 700;
    font-size: 12px;
    color: var(--preto);
    -webkit-transition: var(--transicao);
    -o-transition: var(--transicao);
    transition: var(--transicao);
}

#blog .box .conteudo-top .esq .categoria:hover {
    color: var(--vermelho);
}

#blog .box .conteudo-top .esq .icone {
    background-color: var(--vermelho);
    width: 38px;
    height: 38px;
    color: var(--preto);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#blog .box .conteudo-top .esq .icone svg {
    width: 21px;
    height: 21px;
}

#blog .box .conteudo-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px 22px 15px 15px;
    border: 2px solid #E9E9E9;
    border-bottom: none;
    border-radius: 10px 10px 0 0;
}

#blog .box .conteudo-top .detalhe_categoria {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5px;
}

#blog .box .conteudo-top .detalhe_categoria .circle {
    width: 5px;
    height: 5px;
    border-radius: 100%;
    background-color: var(--preto);
    opacity: .2;
}

#blog .box .imagem {
    height: 268px;
}

#blog .box .imagem img {
    line-height: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

#blog .box .conteudo-bottom {
    padding: 30px 30px 18px 30px;
    border: 2px solid #E9E9E9;
    border-top: none;
    border-radius: 0 0 10px 10px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#blog .box .conteudo-bottom .titulo {
    font-weight: 700;
    font-size: 18px;
    line-height: 25px;
    color: var(--preto);
    margin: 0 0 25px 0;
    -webkit-transition: var(--transicao);
    -o-transition: var(--transicao);
    transition: var(--transicao);
}

#blog .box .conteudo-bottom .texto {
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0.01rem;
}

#blog .box .data_post_home {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5px;
}

#blog .box .conteudo-bottom .data {
    font-weight: 400;
    font-size: 12px;
}

#blog .box .conteudo-bottom .titulo:hover {
    color: var(--vermelho);
}

#blog .box .data_post {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 20px 0 0;
}

#blog .box .data_post .esq {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 12px;
}

#blog .box .data_post .esq .icone {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#blog .box .data_post .btn_post {
    display: block;
    width: 35px;
    height: 35px;
    border: 2px solid #f2f2f2;
    background-color: #f2f2f2;
    border-radius: 35px;
    -webkit-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    position: relative;
    z-index: 1;
}



#blog .box .data_post .btn_post svg {
    transition: var(--transicao);
    position: absolute;
    left: -7px;
    top: 10px;
    transition: var(--transicao);
    -webkit-transition: var(--transicao);
    -moz-transition: var(--transicao);
    -ms-transition: var(--transicao);
    -o-transition: var(--transicao);
}

#blog .box:hover .btn_post,
#blog .box .data_post .btn_post:hover {
    background-color: var(--vermelho);
    border: 2px solid var(--vermelho);
}

#blog .box:hover .btn_post svg,
#blog .box .data_post .btn_post:hover svg {
    left: 1px;
}

#blog .swiper-slide {
    height: auto;
}

@media only screen and (max-width: 1660px) {
    #banner .banner-bg .container {
        padding: 16.4vw 19vw 3vw 0;
    }
}

@media only screen and (max-width: 1500px) {
    #blog .top .sub_titulo {
        font-size: 1.2rem;
        line-height: 100%;
    }

    #blog .top .titulo {
        font-size: 3.3rem;
        line-height: 4rem;
    }

    #blog .top .texto.destaque {
        margin: 0 0 20px 0;
    }

    #blog .top .texto {
        font-size: 1.1rem;
        line-height: 1.7rem;
    }

    #blog .box .imagem {
        height: 222px;
    }

    #blog .box .conteudo-top .esq .icone {
        width: 30px;
        height: 30px;
    }

    #blog .box .conteudo-top .esq .icone svg {
        width: 17px;
        height: 17px;
    }

    #blog .box .conteudo-top .detalhe_categoria .circle {
        width: 4px;
        height: 4px;
    }

    #blog .box .conteudo-bottom .texto {
        font-size: 13px;
        line-height: 20px;
    }

    #blog .box .conteudo-bottom .data {
        font-size: 11px;
    }

    #blog .top {
        margin: 0 0 25px;
    }

    #blog {
        padding: 80px 0;
    }

    #quemsomos .img-gly {
        bottom: 3vw;
    }
}

@media only screen and (max-width: 1440px) {
    #video {
        background: -webkit-gradient(linear, left bottom, left top, color-stop(56%, rgba(0, 0, 0, 1)), color-stop(56%, rgba(255, 255, 255, 1)));
        background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 56%, rgba(255, 255, 255, 1) 56%);
        background: linear-gradient(0deg, rgba(0, 0, 0, 1) 56%, rgba(255, 255, 255, 1) 56%);
    }

    #depoimentos .dir::after {
        height: 125%;
        top: -13%;
    }

    #quemsomos .dir {
        height: 27vw;
    }

    .obras .swiper .capa {
        height: 30.614vw;
    }

    .obras .swiper.swiper-obras .capa {
        height: 21.814vw;
    }

    .obras .titulo {
        font-size: 2.175vw;
    }

    #numbers .somos-fly {
        width: 160px;
        height: 160px;
        top: calc(50% - 80px);
        left: -6%;
    }

    #numbers .img-gly {
        width: 50px;
        height: auto;
        top: calc(50% - 35px);
        left: 4%;
    }

    #banner .banner-bg .play-btn {
        left: 26.2vw;
        top: 27.8vw;
    }

    #banner .navigation {
        bottom: 4.3vw;
    }
}

@media only screen and (max-width: 1366px) {
    #video .esq {
        width: 60%;
    }

    #video .dir {
        width: 33%;
    }

    #video .texto,
    #quemsomos .texto {
        font-size: 14px;
        line-height: 22px;
    }

    #video {
        background: -webkit-gradient(linear, left bottom, left top, color-stop(60%, rgba(0, 0, 0, 1)), color-stop(60%, rgba(255, 255, 255, 1)));
        background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 60%, rgba(255, 255, 255, 1) 60%);
        background: linear-gradient(0deg, rgba(0, 0, 0, 1) 60%, rgba(255, 255, 255, 1) 60%);
    }

    #depoimentos .navigation {
        bottom: 1vw;
    }

    #depoimentos .texto .frase:nth-child(4n + 1) {
        font-size: 36px;
    }

    #depoimentos .texto .frase {
        font-size: 28px;
    }

    #depoimentos .area {
        height: 80px;
    }

    #depoimentos .aspas {
        left: -6vw;
    }

    #quemsomos .img-gly {
        bottom: 3.5vw;
        right: 6%;
    }

    #numbers .somos-fly {
        left: -9%;
    }

    #numbers .img-gly {
        top: calc(50% - 27px);
        left: 3%;
    }
}

@media only screen and (max-width: 1300px) {
    #blog .top .dir {
        max-width: 537px;
    }

    #blog .top {
        gap: 40px;
    }

    #quemsomos .img-gly {
        bottom: 4vw;
        right: 7%;
    }

    #quemsomos .dir {
        height: 30vw;
    }
}

@media only screen and (max-width: 1100px) {
    #video {
        background: -webkit-gradient(linear, left bottom, left top, color-stop(65%, rgba(0, 0, 0, 1)), color-stop(65%, rgba(255, 255, 255, 1)));
        background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 65%, rgba(255, 255, 255, 1) 65%);
        background: linear-gradient(0deg, rgba(0, 0, 0, 1) 65%, rgba(255, 255, 255, 1) 65%);
    }

    #quemsomos .img-gly {
        bottom: 4.5vw;
        right: 8%;
    }
}

@media only screen and (max-width: 1024px) {
    #blog .top .dir {
        max-width: 100%;
    }

    #blog .top .titulo {
        max-width: 100%;
        font-size: 38px;
        line-height: 55px;
    }

    #blog .top {
        gap: 20px;
    }

    #blog .top .texto {
        font-size: 15px;
        line-height: 25px;
    }

    #blog .bottom .box {
        width: 100%;
    }

    #blog .bottom {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #blog .titulo,
    #video .titulo,
    #quemsomos .titulo,
    .obras .titulo,
    #numbers .titulo {
        font-size: 36px;
        line-height: 40px;
    }

    #blog .box .imagem {
        height: 35vw;
    }

    #video .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        gap: 40px;
    }

    #video .texto {
        color: var(--preto);
    }

    #video .dir,
    #video .esq {
        width: 100%;
    }

    #video .play-btn {
        width: 80px;
        height: 80px;
        left: calc(50% - 40px);
        top: calc(58% - 40px);
    }

    #video {
        background: -webkit-gradient(linear, left bottom, left top, color-stop(35%, rgba(0, 0, 0, 1)), color-stop(35%, rgba(255, 255, 255, 1)));
        background: -o-linear-gradient(bottom, rgba(0, 0, 0, 1) 35%, rgba(255, 255, 255, 1) 35%);
        background: linear-gradient(0deg, rgba(0, 0, 0, 1) 35%, rgba(255, 255, 255, 1) 35%);
        padding: 60px 0;
    }

    #depoimentos .texto-interno {
        font-size: 14px;
        line-height: 22px;
    }

    #depoimentos .foto-depoimento {
        width: 120px;
        height: 120px;
    }

    #depoimentos {
        padding: 30px 0 80px 0;
    }

    #depoimentos .navigation {
        bottom: 0;
        right: 5%;
    }

    #depoimentos .swiper {
        width: 170%;
        margin-left: -35%;
    }

    #depoimentos .dir::before,
    #depoimentos .dir::after {
        content: none;
    }

    #depoimentos .swiper-slide {
        opacity: 0.1;
        transition: all .3s ease-in-out;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        filter: blur(1.5px);
        -webkit-filter: blur(1.5px);
    }

    #depoimentos .swiper-slide.swiper-slide-next {
        opacity: 1;
        filter: blur(0px);
        -webkit-filter: blur(0px);
    }

    #numbers .dir,
    #numbers .esq {
        width: 100%;
    }

    #numbers .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        gap: 40px;
    }

    #quemsomos {
        padding: 60px 0;
        overflow: hidden;
    }

    #quemsomos .esq {
        width: 100%;
        max-width: 506px;
        padding-left: 0;
    }

    #quemsomos .dir {
        width: 100%;
        padding-right: 60px;
    }

    #quemsomos .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 60px;
    }

    #quemsomos .esq::before {
        left: -30px;
        top: -27px;
        width: 90px;
        height: 78px;
    }

    #quemsomos .somos-fly {
        bottom: -30px;
        right: -60px;
    }

    #quemsomos .img-gly {
        bottom: 35px;
        right: 0px;
    }

    #quemsomos .titulo .block {
        display: inline;
    }

    #quemsomos .indice .ind {
        font-size: 20px;
        line-height: 20px;
    }

    #quemsomos .indice {
        top: 9px;
        left: auto;
        right: 0;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .obras .swiper.swiper-obras .capa {
        height: 27.814vw;
        padding: 20px 15px;
    }

    .obras .swiper.swiper-obras .nome {
        font-size: 16px;
        line-height: 20px;
    }

    .obras .swiper.swiper-obras .infos {
        font-size: 11.5px;
        line-height: 18px;
    }

    .obras .swiper .detalhes {
        font-size: 13px;
    }

    .obras .swiper .nome {
        font-size: 24px;
        line-height: 26px;
    }

    .obras .swiper .capa {
        height: 48.614vw;
        padding: 20px 15px;
    }

    .obras .area-status .status {
        font-size: 14px;
    }

    .obras .swiper .tag {
        top: 20px;
        left: 15px;
    }

    .obras .swiper .nome-container {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .obras .area-status {
        padding: 0 15px;
    }

    #numbers .esq {
        padding-left: 100px;
    }

    #numbers .somos-fly {
        left: -4%;
        width: 150px;
        height: 150px;
        top: calc(50% - 75px);
    }

    #numbers .img-gly {
        left: 2%;
    }

    #numbers .boxes .box {
        font-size: 16px;
        padding: 20px 35px;
    }

    #numbers .boxes .box .num {
        font-size: 36px;
    }

    #numbers .boxes .trio .box .num {
        font-size: 28px;
    }

    #numbers .boxes .trio .box {
        font-size: 14px;
        padding: 20px 35px;
    }

    #numbers {
        margin-top: 0px;
        padding: 40px 0;
    }

    #numbers::before {
        height: 100%;
        top: 0px;
    }

    #banner .banner-bg .container {
        padding: 150px 0 250px;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    #banner .container-thumb {
        width: 300px;
        bottom: 40px;
        padding-left: 10vw;
    }

    #banner .swiperthumb .nome-thumb {
        font-size: 14px;
        line-height: 18px;
    }

    #banner .swiperthumb .thumb-bg {
        height: 150px;
        padding: 15px;
    }

    #banner .banner-bg .texto {
        font-size: 16px;
        line-height: 22px;
    }

    #banner .banner-bg .nome .block {
        text-align: left;
    }

    #banner .banner-bg .nome,
    #banner .banner-bg .nome.emp {
        font-size: 10.01vw;
        line-height: 10.2vw;
        margin-bottom: 20px;
        margin-top: 10px;
        padding-right: 0;
        padding-top: 0;
    }

    #banner .banner-bg .play-btn {
        left: auto;
        right: 8vw;
        top: 35.8vw;
        width: 80px;
        height: 80px;
    }

    #banner .filter {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(40, 40, 40, 0)), to(rgb(0 0 0 / 65%)));
        background: -o-linear-gradient(top, rgba(40, 40, 40, 0) 0, rgb(0 0 0 / 65%) 100%);
        background: linear-gradient(180deg, rgba(40, 40, 40, 0) 0, rgb(0 0 0 / 65%) 100%);
    }

    #banner .navigation {
        bottom: 40px;
    }
}

@media only screen and (max-width: 768px) {
    #numbers .img-gly {
        left: 3.5%;
    }
}

@media only screen and (max-width: 660px) {
    #blog .box .imagem {
        height: 49vw;
    }

    #blog .box .conteudo-bottom {
        padding: 20px;
    }

    #blog .box .data_post {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 20px;
    }

    #blog .box .data_post .btn_post {
        -ms-flex-item-align: end;
        align-self: flex-end;
    }

    #blog .box .conteudo-bottom .titulo {
        margin: 0 0 17px 0;
    }

    #blog .titulo,
    #video .titulo,
    #quemsomos .titulo,
    .obras .titulo,
    #numbers .titulo {
        font-size: 28px;
        line-height: 32px;
    }

    #depoimentos .box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #depoimentos .swiper-slide {
        opacity: 1;
        filter: blur(0px);
        -webkit-filter: blur(0px);
    }

    #depoimentos .swiper {
        width: 90%;
        margin-left: 5%;
    }

    #depoimentos .aspas {
        left: 0;
        scale: 0.7;
    }

    #quemsomos .somos-fly {
        bottom: -30px;
        right: -4.8%;
        width: 30vw;
        height: 30vw;
        background-size: cover;
    }

    #quemsomos .img-gly {
        height: auto;
        bottom: 3vw;
        right: 5vw;
        width: 11vw;
    }

    #quemsomos .dir {
        padding-right: 45px;
    }

    #quemsomos .dir {
        height: 250px;
    }

    .obras .swiper.swiper-obras .capa {
        height: 46.814vw;
    }

    .obras .swiper .capa {
        height: 73.614vw;
    }

    .obras .box-filtro {
        overflow: auto;
        margin-bottom: 30px;
    }

    .obras .area-filtro {
        width: 532px;
        padding: 35px 0 15px;
    }

    #numbers .esq {
        padding-left: 0px;
    }

    #numbers .somos-fly {
        width: 30vw;
        height: 30vw;
        background-size: cover;
        left: 0;
        top: auto;
        bottom: -35vw;
    }

    #numbers .img-gly {
        right: 5vw;
        width: 11vw;
        left: 10%;
        top: auto;
        bottom: -26vw;
    }

    #numbers .boxes .trio .box {
        font-size: 12px;
        padding: 20px 15px;
    }

    #numbers .boxes .trio .box .num {
        font-size: 25px;
    }

    #numbers {
        padding: 40px 0 25vw;
    }

    #banner .banner-bg .subtitulo {
        font-size: 11px;
        letter-spacing: 6px;
    }

    #banner .banner-bg .nome,
    #banner .banner-bg .nome.emp {
        font-size: 13.01vw;
        line-height: 13.2vw;
    }

    #banner .banner-bg .texto {
        max-width: 360px;
    }

    #banner .banner-bg .play-btn {
        top: auto;
        bottom: 230px;
    }

    #banner .container-thumb {
        width: 260px;
        padding-left: 15vw;
    }
}

@media only screen and (max-width: 430px) {
    #blog .top .titulo {
        font-size: 10vw;
        line-height: 12vw;
    }

    #quemsomos .dir {
        height: 300px;
    }
}

@media only screen and (max-width: 375px) {
    .obras .swiper.swiper-obras .capa {
        height: 64.814vw;
    }

    .obras .swiper .capa {
        height: 106.614vw;
    }

    #banner .banner-bg .container {
        padding: 150px 0 300px;
    }

    #banner .banner-bg .play-btn {
        bottom: 220px;
    }
}

@media only screen and (max-width: 330px) {
    #quemsomos .dir {
        height: 350px;
    }

    #numbers .boxes .trio .box {
        padding: 20px 10px;
    }

    #banner .container-thumb {
        width: 230px;
    }
}