/* -------------------------------------------------- ESTILO GERAL --------------------------------------------------*/ 

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Exo 2', sans-serif;
}

body{
    background-color: #003249;
    height: 100vh;
}

.flex{
    display: flex;
}

.interface{
    max-width: 1280px;
    margin: 0 auto;
}

.logo img{                      /*DEFINE OS TAMANHOS PARA A FOTO QUE FICARÁ NA NAV*/
    max-width: 80px;
    max-height: 80px;
    margin-bottom: -8%;
    margin-top: -8%;
}

/* -------------------------------------------------- ESTILO NAV --------------------------------------------------*/


header{
    padding: 5px 4%; /* ESPAÇAMENTO INTERNO DOS ITENS DA NAVBAR */
    box-shadow: 0 0 20px 5px #ffffff;  /* SOMBRA BRANCA NA "SEÇÃO" DA NAVBAR */
    background: #003249;
}


header .interface{
    display: flex;
    align-items: center; /* Alinha os itens ao centro (cima e baixo) */
    justify-content: space-between; /* ESPAÇAMENTO DOS ITENS DE FORMA IGUAL NA SECTION DA NAV */
}

header a{
    color: #CD3D17; /* COR DOS LINKS DA NAVBAR (INICIO, SERVIÇOS, SOBRE, CONTATOS) */
    text-decoration: none; /* TIRAR SUBLINHADO DOS LINKS*/
    display: inline-block; /* NECESSÁRIO PARA USAR O TRANSFORM */
    transition: .2s;
    font-size: 18px;
    padding: 4px 10px 5px 10px; /* c d b e */
    border-radius: 20px;
    font-weight: 600;
}

header nav.menu-desktop a:hover{  /* HOVER DOS LINKS DA NAVBAR */
    color: #003249; /* TRANSFORMA PARA ESSA COR */
    transform: scale(1.07); /* CRESCE UM POUQUINHO A LETRA OA PASSAR O CURSOR */
     text-shadow:
    0 0 15px #fff, /* ESFUMAÇADO ATRÁS DA PALAVRA */
    0 0 0px #fff; /* BRILHO DA LETRA */
    background-color: #FCFCFD;
}

header nav ul{
    list-style-type: none; /* TIRA AS "BOLINHAS" DE LISTAGEM DOS LINKS DA NAVBAR */
}

header nav.menu-desktop ul li{
    display: inline-block; /* SAI DE VERTICAL PARA HORIZONTAL A ORDEM DOS LINKS */
    padding: 0 35px; /* ESPAÇAMENTO INTERNO DE CIMA E BAIXO É 0 E ENTRE OS LINKS É 35 */
}


.btn-orçamento button{
    padding: 10px; /* ESPAÇAMENTO INTERNO DA ÁREA DE CLIQUE DO BOTÃO */
    font-size: 18px; /* TAMANHO */
    font-weight: 600; /* NEGRITO */
    background: #FCFCFC;
    color: #CF4521;
    border: 0; /* TIRA AS LINHAS DE BORDA DO BOTÃO */
    border-radius: 10px; /* DEIXA OS CANTOS PONTIAGUDOS ARREDONDADOS*/
    cursor: pointer;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.705);
    transition: box-shadow 0.3s ease;
}

.btn-orçamento button:hover{
    transform: scale(1.06);
    transition-duration: .2s;
    color: #CF4620;
    text-shadow: 0 0 1px #fff;
    box-shadow: 0 0 20px rgba(250, 248, 248, 0.863);
}

h2.titulo{
    color: #fff;
    font-size: 38px;
    text-align: center;
}

h3.titulo{
    color: #fff;
    font-size: 28px;
    text-align: center;
    margin:1% 3% 1% 3%; /*cdbe or trbl */
}



/* ------------------------------------------- ESTILO NAV MOBILE ---------------------------------------------*/
.btn-abrir-menu i {
    color: #CF4521; /*Emoji do estilo mobile*/
    font-size: 40px;
    cursor: pointer;
}


.menu-mobile{
    background: #003249;
    height: 100vh;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999999;
    width: 0%;
    overflow: hidden;
    transition: .4s;
}

.btn-abrir-menu{
    display: none;
}

.menu-mobile.abrir-menu{
    width: 70%;
}

.menu-mobile.abrir-menu ~ .overlay-menu{
    display:block;
}

.menu-mobile .btn-fechar {
    padding: 20px 5%;
}

.menu-mobile .btn-fechar i{
    color: #CF4521; /* Cor do X do menu mobile*/
    font-size: 40px;
    cursor: pointer;
}

.menu-mobile nav ul{
    text-align: center;
}

.menu-mobile nav ul li a{
    color: #CF4521; /* Cor do nome do menu mobile*/
    font-size: 30px;
    font-weight: 300;
    padding: 20px 8%;
    display: block;
}

.menu-mobile nav ul li a:hover{
    background-color: #CF4521;
    color: #fff
}

.overlay-menu{
    background-color: #00000085;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 88888;
    display: none;
}



/* -------------------------------------------------- ESTILO TOPO --------------------------------------------------*/

section.topo{
    padding: 120px 5%; /* ESPAÇAMENTO INTERNO DA SESSÃO */
    position: relative;
    background-image: linear-gradient(to top right, rgba(0,0,0,1), rgba(0, 0, 0, 0.3)),
    url(assets/analise-quimica.webp); /* CAMINHO DA IMG */
    background-size: cover; /* COBRE TODA A SESSÃO */
    background-position: center; /* CENTRALIZA A IMAGEM DO BACKGROUND */
    background-repeat: no-repeat; /*CASO A IMG FIQUE MUITO PEQUENA PRA SESS~~AO, NÃO REPETE ELA */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.603); /* SOMBRA NA PARTE INFERIOR */
}


section.topo::before{ /* BEFORE ADICIONADO PARA CONFIGURAÇÕES DA IMAGEM DE FUNDO */
    content: ''; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%;
    height: 100%; 
    background-color: rgba(0,0,0, 0.445); /* AJUSTA A OPACIDADE AQUI*/ 
    z-index: 0; 
} 

 

section.topo .interface{
     position: relative;
     z-index: 1;}


.topo h1{
    color: #fff; /* COR DA FRASE DE IMPACTO */
    font-size: 50px; /* TAMANHO DO TEXTO */
    line-height: 45px; /* ESPAÇAMENTO ENTRE LINHAS */
    max-width: 500px;
}

span{
    text-shadow:
    0 0 7px #fff, /* ESFUMAÇADO ATRÁS DA PALAVRA */
    0 0 1px #fff; /* BRILHO DA LETRA */
}

.topo .txt-topo h1 span, .topo .txt-topo p span{
    text-shadow:
    0 0 10px #fff, /* ESFUMAÇADO ATRÁS DA PALAVRA */
    0 0 1px #fff; /* BRILHO DA LETRA */
}

.topo .txt-topo{
    margin-right: auto;
    flex-grow: 1; /* PERMITE CRESCER SE NECESSÁRIO */
    max-width: 500px; /* MÁXIMO QUE O TEXTO PODE OCUPAR*/
}

.topo .txt-topo p{
    color: #fff; /* COR DA DESCRIÇÃO DA FRASE DE IMPACTO */
    text-align: justify;
    /* margin-right: 10rem; */
    font-size: 20px; /* TAMANHO */
    max-width: 500px;
    margin-top: 3%;
}

.topo .txt-topo .btn-orçamento button{
    margin-top: 3%;
    color: #CD3D17;
    background-color: #fff; /* Aqui ficaria melhor deixar o background branco mesmo */
}

.topo .img-topo img{
    flex-shrink: 0; /* FAZ COM QUE A IMAGEM NÃO ENCOLHA*/
    max-width: 300px; /* LIMITA A LARGURA DA IMAGEM */
    max-height: 300px; /* LIMITA  A ALTURA DA IMAGEM */
    position: relative;
    margin-right: 5rem; 
    animation: flutuar 2s ease-in-out infinite alternate;
}

@keyframes flutuar{
    0%{
        top: 0;

    }
    100%{
        top: 30px;
    }
}


/* -------------------------------------------------- ESTILO SERVIÇOS --------------------------------------------------*/

section.servicos{
    display: flex; 
    align-items: center;
    justify-content: center;
    min-height: 70vh; /* ALTURA MÍNIMA */
    /*background: linear-gradient(to top left, #1074bc, #072763);*/
    background: #003349; /* COR DO GRADIENTE DA PAGINA */
}

section.servicos .titulo{
    margin-top: 30px;
    margin-bottom: 20px;
    color: #CF4521;
}

.card-list .card-item {
    list-style: none; /* TIRA AS BOLINHAS DE LISTAGEM */
}

.card-list .card-item .card-link{ /* CARDS NO GERAL */
    user-select: none;
    display: block; /* EFEITO PARA A IMAGEM SE ENCAIXAR */
    background: #fff; /* COR DO FUNDO DO CARD */
    padding: 18px; /* ESPAÇAMENTO INTERNO DO CARD */
    border-radius: 12px; /* DEIXA AS BORDAS EM CURVAS */
    text-decoration: none; /* REMOVE O ASPECTO SUBLINHADO DE LINK*/
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15); /* SOMBRA DOS CARDS PRA DAR UM EFEITO */
    margin-top: 5%; /* ESPAÇO PARA CIMA DO CARD */
    margin-bottom: 5%; /* ESPAÇO PARA BAIXO DO CARD */
    border: 2px solid transparent; /* EFEITO PRA APLICAR O HOVER DE BORDA */
    transition: 0.2s ease; /* TEMPO DE TRANSIÇÃO */
}

.card-list .card-item .card-link:hover{ /* COR DA BORDA DO CARD AO PASSAR O CURSOR POR CIMA */
    border-color: #CF4521;
}

.card-list .card-item .card-link:active{ /* STATUS DO CURSOR AO PUXAR OS CARDS PARA O LADO */
    cursor: grabbing;
}

.card-list .card-link .card-image{ /* IMAGEM DO CARD */
    width: 100%; /* TAMANHO DA IMAGEM NO CARD*/
    aspect-ratio: 16 / 9; /* PROPORÇÃO DA IMAGEM NO CARD */
    object-fit: cover; /* A IMAGEM OCUPA O ESPAÇO DE FORMA PROPORCIONAL */
    border-radius: 10px; /* DEIXAR AS BORDASS DA FOTO EM CURVA*/
}

.card-list .card-link .badge{ /* NOME DO SERVIÇO */
    color: #CF4521; /* COR DO NOME DO SERVIÇO*/
    padding: 8px 16px; /* ESPAÇAMENTO INTERNO DE ONDE O BACKGROUND DO NOME OCUPA*/
    font-size: 0.95rem; /* TAMANHO DO NOME DO SERVIÇO */
    font-weight: 500; /* NEGRITO DO NOME DO SERVIÇO */
    margin: 16px 0 18px; /* MARGENS DE CIMA E BAIXO DO NOME DO SERVIÇO */
    background: #cf44212a; /* COR DO BACKGROUND DO NOME DO SERVIÇO*/
    width: fit-content; /* LARGURA DO NOME E DO BACKGROUND VAI SOMENTE ATÉ ONDE TEM CONTEÚDO (LETRAS) DO NOME */
    border-radius: 50px; /* CURVATURA DAS EXTREMIDADES DO BACKGROUND DOS NOMES DO SERVIÇOS */
}

.card-list .card-link:hover .badge{ /* NOME DO SERVIÇO */
    color: #ff3300; /* COR DO NOME DO SERVIÇO*/
    background: #cf44212a; /* COR DO BACKGROUND DO NOME DO SERVIÇO*/
}


.card-list .card-link .card-title{ /* DESCRIÇÃO */
    font-size: 0.7rem; /* TAMANHO DA DESCRIÇÃO */
    color: #003349; /* COR DA DESCRIÇÃO */
    font-weight: 500; /* NEGRITO DA DESCRIÇÃO */
    flex-grow: 1; /* O ITEM CRESCE PARA OUCPAR O ESPAÇO RESTANTE DO CONTAINER */
    max-height: 100px; /* ALTURA MÁXIMA */
    overflow-y: auto; /* CASO PASSE DA ALTURA MÁXIMA, APLICA UM SCROLL*/
    padding-right: 10px; /* ESPAÇAMENTO INTERNO DO TEXTO PARA COM O SCROLL */
}

.card-list .card-link:hover .card-title{ /* DESCRIÇÃO */
    color: #CD3D17; /* COR DA DESCRIÇÃO */
    transition: 0.4s ease;  
}

.card-list .card-link .card-button{ /* SETA DO CARD */
    height: 35px; /* ALTURA */
    width: 35px; /* LARGURA */
    color: #003349; /* COR DA SETA */
    border-radius: 50%; /* DEIXA CIRCULAR */
    margin: 30px 0 5px; /* ESPAÇAMENTO DA SETA PARA COM A DESCRIÇÃO */
    background: none; /* REFORÇA QUE A FIGURA NÃO TENHA NADA NO FUNDO */
    cursor: pointer; /* FORMATO DO CURSOR AO PASSAR POR CIMA DA SETA / BOTÃO DA SETA */
    border: 2px solid #003349; /* BORDA E FIGURA DA SETA */
    transform: rotate(-45deg); /* DIREÇÃO DA SETA */
    transition: 0.4s ease; /* FORMATO DE TRANSIÇÃO PARA O HOVER DA BORDA */
}

.card-list .card-link:hover .card-button{ /* HOVER DO BOTÃO */
    color: #CD3D17;
    background: #fff;
    border: 2px solid #CF4521;
    transform: rotate(-55deg) scale(1.05);
}

.card-wrapper{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    max-width: 1100px;
    margin: 0 60px 35px;
    padding: 20px 10px;
    overflow: hidden;
}

.servicos-pagination .swiper-pagination-bullet{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    height: 13px;
    width: 13px;
    opacity: 0.5;
    background: #CD3D17;
}

.servicos-pagination .swiper-pagination-bullet-active{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    opacity: 1;
}

/* Cor das setas da seção de Serviços */
.servicos .servicos-prev,
.servicos .servicos-next {
  color: #CD3D17; /* Exemplo de cor para a seta de serviços */
  margin-top: -35px;
}



/* -------------------------------------------------- ESTILO SOBRE --------------------------------------------------*/



section.sobre{
    background: #eeeeeee5; /* COR DO GRADIENTE DA PAGINA */
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.8);  /* sombra pra cima 
    ,0  4px 10px rgba(0, 0, 0, 0.8); sombra pra baixo */
    position: relative;
    margin-top: 25px;
}

.sobre .txt-sobre {
    padding: 80px 10%;
    position: relative; /* Permite posicionar elementos filhos de forma absoluta relativa a este bloco */
    background-image: linear-gradient(to bottom, rgba(0.6,0.7,0.8,0.8), rgba(0.6,0.7,0.8,0.7)), url(assets/Quimtec-Membros.webp);
    background-size: cover; /* Faz a imagem cobrir toda a área do fundo */
    background-position: center; /* Centraliza a imagem de fundo */
    background-repeat: no-repeat; /* Impede que a imagem de fundo se repita */
    color: #fff; /* COR DO TEXTO DO SOBRE NÓS */
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.719); /* SOMBRA NA PARTE INFERIOR */
    color: #FCFCFC;
}


section.sobre .flex{ 
    flex-direction: column;
    align-items: center;  /* Alinha os itens verticalmente ao centro (útil com display: flex no pai) */
    gap: 60px;
}


.sobre .txt-sobre h2{
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 30px;
    text-align: auto;
}

.sobre .txt-sobre p{
    margin: 20px 40px 20px auto;
    text-align: justify; /* Alinha o texto dos parágrafos justificado (bordas retas dos dois lados) */
    font-size: 20px; 
}


.CTA{
    padding: 20px 0;
    text-align: center;
}

.CTA .btn-orçamento-CTA button{
    padding: 20px; /* ESPAÇAMENTO INTERNO DA ÁREA DE CLIQUE DO BOTÃO */
    font-size: 18px; /* TAMANHO */
    font-weight: 600; /* NEGRITO */
    background: #fff;
    color: #CD3D17;
    border: 0; /* TIRA AS LINHAS DE BORDA DO BOTÃO */
    border-radius: 10px; /* DEIXA OS CANTOS PONTIAGUDOS ARREDONDADOS*/
    cursor: pointer;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.705);
    transition: box-shadow 0.3s ease;
}

.btn-orçamento-CTA button:hover{
    transform: scale(1.06);
    transition-duration: .2s;
    color: #cd2c17;
    text-shadow: 0 0 1px #fff;
    box-shadow: 0 0 20px rgba(236, 88, 3, 0.863);
}


section.sobre .titulo-valores{
    font-size: 40px;
    color: #CF4620; /*Cor do título da sessão*/
    align-items: center;
    text-align: center;
    margin-bottom: -100px;
    padding: 50px 0;
}

.valores-container {
    padding: 80px 4%;
    margin: 0px 10% 20px 10%;
    display: flex;
    flex-wrap: wrap; /* Permite que as caixas quebrem linha */
    gap: 20px;
    justify-content: center; /* Centraliza os boxes */
}

.valor-box {
    background-color: rgba(255, 255, 255, 0.1); /* Fundo levemente visível */
    border: 1px solid rgba(255, 255, 255, 0.2); /* Borda discreta */
    color: #CF4620;
    padding: 40px;
    border-radius: 20px;
    font-size: 20px;
    min-width: 160px;
    flex: 1 1 200px; /* Cresce, encolhe e ocupa no mínimo 200px */
    text-align: center;
    transition: .2s;
    background: #003249;
    box-shadow: 0px 0px 15px #00000044;
}

.valor-box:hover {
    transform: scale(1.07); /* Animação leve ao passar o mouse */
    box-shadow: 0px 0px 15px #0000007e;
}

.sobre .valor-box i{
    font-size: 50px;
    color: #CF4620; /*Cor dos emojis dos cards de valores*/
}

.sobre .valor-box h3{
    font-size: 18px;
    color: #FFF; /*Cor título dos cards de serviços */
    align-items: center;
    margin-top: 30px;
}


/* ------------------------------------------------- ESTILO PARCEIROS -------------------------------------------------*/

section.parceiros{
    padding: 40px 4%;
    background: linear-gradient(to bottom, #eeeeeee5 95%, #003349 100%);; /* COR DO GRADIENTE DA PAGINA */
    box-shadow: 0px -20px 80px -20px rgba(0, 0, 0, 0.3);
}

section.parceiros .titulo{
    color: #003349;
    text-align: center;
    width: 100%;
    padding: 40px 0;
    margin-top: -20px;
}

.card-list-parceiros .card-item-parceiros {
    list-style: none; /* TIRA AS BOLINHAS DE LISTAGEM */
}


/* STATUS DO CURSOR AO PUXAR OS CARDS PARA O LADO */
.card-list-parceiros .card-item-parceiros .card-link-parceiros:active{ 
    cursor: grabbing;
}

.card-list-parceiros .card-link-parceiros .card-image-parceiros{ /* IMAGEM DO CARD */
    width: 100%; /* TAMANHO DA IMAGEM NO CARD*/
    aspect-ratio: 1 / 1; /* PROPORÇÃO DA IMAGEM NO CARD */
    object-fit: contain; /* A IMAGEM OCUPA O ESPAÇO DE FORMA PROPORCIONAL */
    border-radius: 15px;
    transition: .3s ease;
}

.card-list-parceiros .card-link-parceiros .card-image-parceiros:hover{ /* IMAGEM DO CARD */
    border-radius: 50%;
}


.servicos-card-wrapper{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    max-width: 1100px;
    margin: 0 60px 35px;
    padding: 20px 10px;
    overflow: hidden;
}

.card-wrapper{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    max-width: 1100px;
    margin: 0 auto 35px;
    padding: 20px 10px;
    overflow: hidden;
}

.parceiros-pagination .swiper-pagination-bullet{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    height: 13px;
    width: 13px;
    opacity: 0.5;
    background: #003249;
}

.parceiros-pagination .swiper-pagination-bullet-active{ /* ESTRUTURA DE CONVERSA COM SWAPPER */
    opacity: 1;
}

/* Cor das setas da seção de Parceiros */
.parceiros .parceiros-prev,
.parceiros .parceiros-next {
  color: #003349; /* Exemplo de cor diferente para a seta de parceiros */
  margin-top: -15px;
}
/* ------------------------------------------------- ESTILO CONTATOS -------------------------------------------------*/

section.contatos{
    padding: 40px 4%;
    box-shadow: 0 0 40px 10px #003349;
    background: #003349;
    position: relative;
}

section.contatos .flex{
    justify-content: space-between;
}

section.contatos .line-contatos{
    padding: 10px 0px 0px 0px;
}

.borda{
    border-top: 4px solid #CD3D17; /*Cor da barrinha de divisão do rodapé*/
}

section.contatos .line-contatos p i{
    color: #FCFCFC; /*Cor dos emojis do rodapé */
    font-size: 22px;
}

section.contatos .line-contatos p a{
    color: #Fff; /* Cor dos textinhos do rodapé*/
    text-decoration: none;
}

section.contatos img{
    max-width: 120px;
    max-height: 120px;
    margin-bottom: 10px;
}


section.contatos .btn-social button{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 0;
    background-color: #CD3D17; /*cor do fundo dos botoes sociais*/
    color: #fff; /*cor dos emojis dos botoes sociais*/
    font-size: 25px;
    cursor: pointer;
    margin: 0px 5px 5px 5px;
    transition: .5s;
}

section.contatos .btn-social button:hover{
    color: #003349;
    background-color: #fff;
    border-radius: 30%;
    border: #Fff 2px solid;
}

section.contatos .frase-final{
    color: #fff;
    padding: 5px 0px 5px 0px;
    font-size: 14px;
}

footer #copyright {
    background: #eee;
    color: #ffffff;
    text-align: center;
    padding: 24px;
    justify-content: space-between;
}

footer #copyright a {
    color: #072763;
    text-decoration: none;
    display: inline-block;
    transition: .2s;
}

footer #copyright a:hover{
    color: #072763;;
    text-decoration: none;
    transform: scale(1.07);
}
.sof{
    font-weight: 600;
    color: #84cbfd;
    font-family: 'League Spartan', sans-serif;
}

.team{
    font-weight: 600;
    color: #1c58a8;
    font-family: 'League Spartan', sans-serif;
}
/*---------------------------- MEDIA SCREEN 1080px --------------------------------*/


@media screen and (max-width: 1080px){
    /* CLASSES GERAIS */
    .flex{
        flex-direction: column;
    }

    h2.titulo{
        font-size: 34px;
        line-height: 30px;
    }


    /* CABEÇALHO */

    header{
    padding: 12px 4%; /* ESPAÇAMENTO INTERNO DOS ITENS DA NAVBAR */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); /* SOMBRA NA PARTE INFERIOR */
    }

    .menu-desktop, .btn-orçamento{
        display: none;
    }

    /* TOPO*/
    section.topo{
        padding: 80px 8%;
    }

    section.topo .flex {
        gap: 40px;
    }
    
    .topo h1{
        font-size: 30px;
        text-align: center;
        align-items: center;
    }

    .topo .txt-topo{
        margin: 0 auto;
        align-items: center;
        text-align: center;
    }

    .topo .txt-topo p{
        text-align: center;
        margin: 25px 0;
    }

    .topo .img-topo{
        margin: 0 auto;
        display: flex;
        justify-content: center;
    }

    .topo .img-topo img {
        width: 100%;
        max-width: 190px;
        max-height: 190px;
        margin: 0 auto;     /* Centraliza horizontalmente */
        display: block;     /* Garante que margin auto funcione */
        animation: none;
        padding: 100px auto;
    }

    .logo img{
        max-width: 90px;
        max-height: 90px;
    }


    /* SESSÃO SERVIÇOS JÁ ESTÁ RESPONSIVA*/

    /* SESSÃO SOBRE */


    .sobre .txt-sobre{
        padding: 40px 8%;
    }

    .sobre .txt-sobre p{
        margin: 40px auto;
    }

    .btn-social{
        text-align: center;
    }

    /* ESTILO CONTATOS */
    .logo-footer img{
        width: 150px !important;
        height: 150px !important; 
        margin-bottom: 20px;
        margin-top: -50px;
    }

    .line-contatos{
        text-align: center;
        margin: 10px;
    }

    section.contatos .frase-final{
    color: #fff;
    margin-bottom: 10px;
    font-size: 14px;
}

    /* MENU MOBILE */
    .btn-abrir-menu{
        display: block;
    }
}

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

    .topo .img-topo img {
        max-width: 130px;
        max-height: 130px;
    }


    .card-wrapper, .servicos-card-wrapper{
        margin: 0 10px 25px;
    }

    .card-wrapper .swiper-slide-button, .servicos-card-wrapper .swiper-slide-button{
        display: none;
    }


    /* AJUSTANDO TAMANHO DO TEXTO DA SESSÃO SOBRE*/
    .sobre .txt-sobre h3{
        font-size: 20px;
    }

    .sobre .txt-sobre p{
        font-size: 18px; 
    }

    /* CONTATOS */
    section.contatos .frase-final{
    font-size: 10px;
    }
}

@media screen and (max-width: 350px) {
    section.contatos .line-contatos p a, 
    section.contatos .line-contatos p i{

        font-size: 12px;
    }
}