/* ==========================================
   MOBILE FIXES V1
   LS MONTAGENS
========================================== */

@media (max-width:1024px){

.container{

    width:95%;

}

}

/* ==========================================
TABLET
========================================== */

@media (max-width:991px){

section{

    padding:70px 0;

}

}

/*====================================
HERO MOBILE
====================================*/

@media (max-width:768px){

    header{
        position:static !important;
        overflow:visible !important;
    }

    .navbar{
        position:fixed !important;
        top:0;
        left:0;
        width:100%;
        z-index:99999;
    }

    .hero{

        min-height:100vh;

        display:flex;

        justify-content:center;

        align-items:center;

        padding:170px 20px 70px !important;

        text-align:center;

    }

    .hero-overlay{

        width:100%;
        height:100%;
        display:flex;
        justify-content:center;
        align-items:center;

    }

    .hero-texto{

        width:100%;
        max-width:100%;
        margin-top:0;
        padding:0 10px;

    }

    .hero-tag{

        display:inline-block;

        margin-bottom:20px;

        padding:8px 18px;

        font-size:11px;

        border-radius:30px;

    }

    .hero h1{

        font-size:34px !important;

        line-height:42px !important;

        margin-bottom:20px;

    }

    .hero p{

        font-size:16px !important;

        line-height:28px !important;

        margin-bottom:35px;

    }

    .hero-botoes{

        display:flex;

        flex-direction:column;

        gap:15px;

        align-items:center;

    }

    .hero-botoes a{

        width:100%;

        max-width:290px;

    }

    .scroll-down{

        margin-top:40px;

        font-size:28px;

    }

}

/* ==========================================
TELAS PEQUENAS
========================================== */

@media (max-width:480px){

.hero h1{

    font-size:28px;

}

.hero p{

    font-size:15px;

}

.parceiros-grid{

    grid-template-columns:1fr;

}

}

/*==================================
MENU MOBILE
==================================*/

@media(max-width:768px){

header{

    padding:15px 20px;

}

.logo img{

    max-width:150px;

}

nav{

    width:100%;

}

nav ul{

    width:100%;

    flex-direction:column;

    gap:0;

}

nav ul li{

    width:100%;

}

nav ul li a{

    display:block;

    width:100%;

    padding:16px;

}

}

/*==================================
TÍTULOS
==================================*/

@media(max-width:768px){

section h2{

    font-size:30px !important;

}

section p{

    font-size:16px;

    line-height:1.6;

}

}

/*==================================
BOTÕES
==================================*/

@media(max-width:768px){

.btn,

button{

    width:100%;

    text-align:center;

}

}

/*==================================
OBRAS
==================================*/

@media(max-width:768px){

.card-obra{

    border-radius:18px;

}

.card-obra img{

    height:220px;

}

.card-obra h3{

    font-size:22px;

}

}

/*==================================
MODAL
==================================*/

@media(max-width:768px){

.modal{

    padding:0;

}

.modal-box{

    width:100%;

    height:100%;

    max-width:none;

    max-height:none;

    border-radius:0;

}

.modal-topo{

    height:230px;

}

.modal-conteudo{

    padding:20px;

}

.modal-info{

    flex-direction:column;

    align-items:flex-start;

}

}

/*==================================
GALERIA
==================================*/

@media(max-width:768px){

#miniaturas{

    gap:10px;

}

#miniaturas img,

.thumb-video{

    width:95px;

    height:75px;

}

}

/*==================================
LIGHTBOX
==================================*/

@media(max-width:768px){

#lightboxImagem,

#lightboxVideo{

    max-width:95%;

    max-height:75%;

}

.nav-lightbox{

    width:45px;

    height:45px;

    font-size:22px;

}

}

/*==================================
WHATSAPP
==================================*/

@media(max-width:768px){

.whatsapp{

    right:18px;

    bottom:18px;

    width:58px;

    height:58px;

}

}

/*==================================
EMPRESAS
==================================*/

@media(max-width:768px){

.parceiros-grid img{

    max-width:140px;

    margin:auto;

}

}

/*====================================
AJUSTES MOBILE V2
====================================*/

@media (max-width:768px){

/* Navbar */

.navbar{

    padding:15px 20px !important;

    min-height:80px;

}

.logo img{

    height:55px !important;

}

/* Hero */

.hero{

    height:auto !important;

    min-height:100vh;

    padding-top:140px !important;

    padding-bottom:70px;

}

.hero-texto{

    width:100%;

    padding:0 20px;

}

.hero-texto h1{

    font-size:36px !important;

    line-height:42px !important;

}

.hero-texto p{

    font-size:16px !important;

    line-height:28px !important;

}

/* Botões */

.hero-botoes{

    flex-direction:column;

    align-items:center;

}

.hero-botoes a{

    width:100%;

    max-width:280px;

}

/* Estatísticas */

.stats .container{

    display:flex !important;

    flex-direction:column !important;

    gap:20px;

}

.stat-card{

    width:100%;

}

/* Empresa */

.empresa-grid{

    grid-template-columns:1fr !important;

    gap:30px;

}

.empresa-imagem img{

    height:260px !important;

}

/* WhatsApp */

.whatsapp{

    width:55px;

    height:55px;

    right:15px;

    bottom:15px;

}

}

/*==================================================
MOBILE V3 - HERO E ESTATÍSTICAS
==================================================*/

@media screen and (max-width:768px){

/* HEADER */

header{

    height:auto !important;

    min-height:100vh;

}

/* NAVBAR */

.navbar{

    padding:15px 18px !important;

    min-height:82px;

    align-items:center;

}

.logo img{

    height:52px !important;

}

/* HERO */

.hero{

    min-height:calc(100vh - 82px);

    padding:120px 20px 60px !important;

    display:flex;

    justify-content:center;

    align-items:center;

}

.hero-texto{

    width:100% !important;

    max-width:100%;

}

.hero-tag{

    display:inline-block;

    margin-top:15px;

    margin-bottom:20px;

    padding:8px 18px;

    font-size:11px;

}

.hero-texto h1{

    font-size:34px !important;

    line-height:40px !important;

    margin-bottom:20px;

}

.hero-texto p{

    font-size:16px !important;

    line-height:28px !important;

    margin-bottom:30px;

}

/* BOTÕES */

.hero-botoes{

    display:flex;

    flex-direction:column;

    gap:15px;

    align-items:center;

}

.btn-principal,

.btn-secundario{

    width:100%;

    max-width:290px;

    text-align:center;

}

/* SETA */

.scroll-down{

    margin-top:35px;

    font-size:28px;

}

/* ESTATÍSTICAS */

.stats{

    padding:40px 15px !important;

}

.stats .container{

    display:grid !important;

    grid-template-columns:1fr !important;

    gap:18px;

}

.stat-card{

    width:100%;

    padding:28px;

}

.stat-card h3{

    font-size:34px;

}

.stat-card p{

    font-size:16px;

}

/* WHATSAPP */

.whatsapp{

    width:55px;

    height:55px;

    right:14px;

    bottom:14px;

    font-size:28px;

}

}

/*==================================================
HERO MOBILE PREMIUM V4
==================================================*/

@media screen and (max-width:768px){

header{

    min-height:auto !important;
    height:auto !important;

}

.hero{

    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:110px 20px 70px !important;

}

.hero-texto{

    width:100%;
    max-width:100%;
    text-align:center;

}

.hero-tag{

    display:inline-block;
    font-size:11px;
    padding:8px 18px;
    margin-bottom:20px;
    letter-spacing:1px;

}

.hero-texto h1{

    font-size:32px !important;
    line-height:38px !important;
    margin-bottom:20px;

}

.hero-texto p{

    font-size:16px !important;
    line-height:28px !important;
    margin-bottom:35px;
    padding:0 5px;

}

.hero-botoes{

    display:flex;
    flex-direction:column;
    gap:15px;
    align-items:center;

}

.hero-botoes a{

    width:100%;
    max-width:290px;

}

.scroll-down{

    margin-top:40px;

}

}

/*==================================================
ESTATÍSTICAS MOBILE
==================================================*/

@media(max-width:768px){

.stats{

    padding:50px 15px;

}

.stats .container{

    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px;

}

.stat-card{

    padding:30px 20px;

}

.stat-card h3{

    font-size:34px;

}

.stat-card p{

    font-size:15px;

}

}

/*==================================================
EMPRESA MOBILE V5
==================================================*/

@media screen and (max-width:768px){

.empresa{

    padding:60px 20px !important;

}

.empresa-grid{

    display:flex !important;

    flex-direction:column !important;

    gap:35px !important;

}

.empresa-texto{

    order:2;

    width:100%;

    text-align:center;

}

.empresa-imagem{

    order:1;

    width:100%;

}

.empresa-imagem img{

    width:100%;

    height:230px !important;

    object-fit:cover;

    border-radius:18px;

}

.titulo-pequeno{

    display:block;

    font-size:13px;

    margin-bottom:10px;

    letter-spacing:2px;

}

.empresa h2{

    font-size:30px !important;

    line-height:38px;

    margin-bottom:18px;

}

.empresa p{

    font-size:16px !important;

    line-height:28px !important;

    margin-bottom:18px;

}

.empresa-btn{

    display:inline-block;

    width:100%;

    max-width:290px;

    padding:15px 20px;

    text-align:center;

}

}

/*==================================================
SERVIÇOS MOBILE V6
==================================================*/

@media screen and (max-width:768px){

.servicos{

    padding:60px 15px !important;

}

.servicos h2{

    font-size:30px !important;

}

.subtitulo{

    font-size:16px;

    margin-bottom:40px;

}

.servico{

    padding:22px !important;

    margin-bottom:35px;

    border-radius:18px;

}

.servico h3{

    font-size:24px !important;

    text-align:center;

}

.servico p{

    font-size:16px !important;

    line-height:28px !important;

}

.galeria{

    display:grid;

    grid-template-columns:1fr;

    gap:15px;

}

.galeria img{

    height:220px !important;

}

.botao-whatsapp{

    width:100%;

    text-align:center;

}

}

/*==================================================
OBRAS MOBILE V7
==================================================*/

@media screen and (max-width:768px){

.obras{

    padding:60px 15px !important;

}

.titulo-obras{

    margin-bottom:35px;

}

.titulo-obras span{

    font-size:13px;

    letter-spacing:2px;

}

.titulo-obras h2{

    font-size:30px !important;

    line-height:36px;

    margin:10px 0;

}

.titulo-obras p{

    font-size:16px;

    line-height:26px;

}

/* Cards */

.cards-obras{

    display:flex !important;

    flex-direction:column;

    gap:25px;

}

.card-obra{

    width:100%;

    border-radius:18px;

    overflow:hidden;

}

.card-obra img{

    width:100%;

    height:220px !important;

    object-fit:cover;

}

.card-obra .conteudo{

    padding:20px;

}

.card-obra h3{

    font-size:24px !important;

    margin-bottom:10px;

}

.card-obra p{

    font-size:15px;

    line-height:25px;

}

.cidade{

    display:block;

    margin-bottom:12px;

}

.barra{

    height:10px;

    margin-top:15px;

}

.porcentagem{

    margin-top:8px;

    font-size:15px;

}

.status{

    display:inline-block;

    margin-top:15px;

}

.btn-detalhes{

    width:100%;

    margin-top:20px;

    padding:15px;

    font-size:16px;

}

}

/*==================================================
MODAL MOBILE V8
==================================================*/

@media screen and (max-width:768px){

.modal{

    padding:0;

}

.modal-box{

    width:100% !important;

    height:100vh;

    max-width:none;

    border-radius:0;

    overflow-y:auto;

}

.modal-topo img,

#modalImagem{

    width:100%;

    height:240px !important;

    object-fit:cover;

}

#modalVideo{

    width:100%;

    height:240px;

}

.modal-conteudo{

    padding:20px;

}

.modal-conteudo h2{

    font-size:28px;

}

.modal-info{

    display:flex;

    flex-direction:column;

    gap:10px;

}

#miniaturas{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:10px;

}

#miniaturas img{

    width:100%;

    height:80px;

    object-fit:cover;

}

.fechar-modal{

    top:15px;

    right:18px;

    font-size:34px;

}

}

/*=====================================
HEADER FIX
======================================*/

@media(max-width:768px){

header{

    position:relative;

.navbar{

    position:fixed !important;

    top:0;

    left:0;

    width:100%;

    z-index:99999;

}

.hero{

    padding-top:120px !important;

    margin-top:0 !important;

}

}

@media(max-width:768px){

.footer-info{

    flex-direction:column;

    gap:18px;

}

footer h2{

    font-size:28px;

}

.desenvolvedora img{

    width:110px;

}

}