/*
    ##########################
    ### Smartphones: 0 até 400
    ##########################
*/
@media (max-width: 400px) {
  
   .texto-sobre{
    margin: 0 40px;
  }
  
  
  
  
  .conteudo {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
    padding: 20px;
  }

  .fade img {
    height: 215px;
  }

  .logo {
    width: 100%;
  }

  .slick-prev,
  .slick-next {
    display: none !important;
  }

  .noticiaCards,
  .problema,
  .conceito,
  .tipos,
  .automacao,
  .casos,
  .dimtech-ajuda{
   margin: 4px 10px;
  }

  .tituloVent{
    margin-left: -48px;
  }

 .menu .subMenu ul {
    display: none; /* Esconde o submenu */
  }

  .menu .subMenu > a {
    display: block; /* Garante que o link "Serviços" fique visível */
  }

  .problema{
  margin: 4px 10px;
  }


  .noticia-card {
    flex-direction: column; /* empilha imagem e texto */
    align-items: center; /* centraliza o conteúdo */
  }

  .noticia-card img {
    width: 100%; /* ocupa 100% do card */
    height: auto; /* altura automática */
    object-fit: contain; /* mostra a imagem inteira sem cortes */
  }

  .card-conteudo {
    padding: 10px;
    text-align: center;
  }

  .menu ul li a:active {
    color: #41905f;
  }

  .servicos {
    display: flex;
    flex-direction: column-reverse; /* empilha */
    align-items: center; /* centraliza conteúdo horizontalmente */
    justify-content: center; /* centraliza verticalmente */
    width: 100%; /* garante largura total */
    box-sizing: border-box; /* respeita padding/border */
    padding: 10px; /* espaço interno */
  }

  .servicostexto {
    width: 100%; /* ocupa toda a largura no mobile */
    text-align: center; /* centraliza textos */
    margin: 0 auto; /* centraliza se sobrar margem */
    padding: 0 10px; /* espaço interno lateral */
    box-sizing: border-box;
  }

  .servicosimg {
    width: 100%; /* ocupa toda a largura */
    text-align: center; /* imagem centralizada */
    margin-bottom: 15px;
  }

  .servicosimg img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}
  .servicos h1 {
    margin-top: 10px;
    font-size: 1.6rem;
    line-height: 1.3;
    text-align: center;
    margin: 10px -30px;
    padding: 0 10px;
  }
  .backup00{

    margin: -90px 0px 90px 5px;
  }

 .mainResponsive {
  padding: 0 15px;
  box-sizing: border-box;
}

.cookie-container p {
    margin: 0px;
    display: inline;
}
}


/*
    ##########################
    ### Smartphones: 0 até 600
    ##########################
*/

@media (max-width: 600px) {
  
  
  .site {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .logo {
    margin-bottom: 10px; /* espaço entre logo e menu */
  }

  .menu {
    justify-content: center; /* centraliza o menu horizontalmente */
  }

  .menu ul {
    flex-direction: column; /* empilha os itens do menu se quiser em coluna */
    align-items: center;
    gap: 10px; /* espaço entre os itens */
  }

 
  .slick-prev,
  .slick-next {
    display: none !important;
  }
  .container{
    margin: 0px 5px;
    padding: 55px;
  }

  .servicos{
   flex-direction: column-reverse;
   margin: auto 12px;
   border-radius: 5px 5px;
  }
  figure.servicosimg figcaption {
    display: none;
  }

  .mainResponsive{
    background-color: #1b4350;
  }

  .menu .subMenu ul {
    display: none; /* Esconde o submenu */
  }

  .menu .subMenu > a {
    display: block; /* Garante que o link "Serviços" fique visível */
  }


  .img-sobre {
    width: 80%;
  }


  

  .servicosimg img {
    width: 100%;
    height: auto;
    object-fit: contain; /* Isso ajuda a manter a proporção sem distorcer */
}

  /* Ajustes nos textos */
  .servicostexto p,
  .servicostexto h2,
  .servicostexto ul {
    padding-left: 10px;
    padding-right: 10px;
  }

  

  /* Ajustar o alinhamento das listas */
  .servicostexto ul {
    list-style-type: disc;
    margin-left: 20px;
    font-size: 0.9rem;
  }

  /* Ajuste do espaço nas laterais das imagens */
  .servicosimg img {
    width: 100%;
    height: auto;
    margin-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }

  /* Ajustes nos botões de ação */
  .acoes-servico .btn-cta {
    width: 80%;
    margin: 0 10px;
  }






}

/*
    ##########################
    ### Tablets: 601 até 1000
    ##########################
*/
@media (max-width: 1000px) {
  .slick-dots {
    display: none !important;
  }

.img-sobre {
    width: 60%;
  }


.texto-sobre{
    margin: 0 40px;
  }
  .flex-imagens {
    padding: 0 20px;
    box-sizing: border-box;
    gap: 20px; /* espaçamento entre os blocos, se forem lado a lado */
  }

  .bloco-img img {
    width: 100%;
    height: auto;
    display: block;
  }



 .menu .subMenu ul {
    display: none; /* Esconde o submenu */
  }

  .menu .subMenu > a {
    display: block; /* Garante que o link "Serviços" fique visível */
  }
 

  .topoRedeSocial{
    padding: 0px 15px;
  }
  .email{
    padding: 0px 15px;
  }

  .menu {
    padding: 5px 33px;
  }

  .banner {
    width: 80%;
  }

  .conteudo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
  }

  /* Página Sobre */
  .textosobre{
    margin: 0 15px ;
  }
  .banner{
    max-width: 100%;
  width: 100%; 
}

 .servicos{
   flex-direction: column-reverse;
   margin: auto 12px;
   border-radius: 5px 5px;
  }
  figure.servicosimg figcaption {
    display: none;
  }

  .mainResponsive{
    background-color: #1b4350;
  }

   .servicosimg img {
    width: 100%;
    height: auto;
    object-fit: contain; /* Isso ajuda a manter a proporção sem distorcer */
}

  /* Ajustes nos textos */
  .servicostexto p,
  .servicostexto h2,
  .servicostexto ul {
    padding-left: 10px;
    padding-right: 10px;
  }

  


  /* Ajustar o alinhamento das listas */
  .servicostexto ul {
    list-style-type: disc;
    margin-left: 20px;
    font-size: 0.9rem;
  }
   
  /* Ajuste do espaço nas laterais das imagens */
  .servicosimg img {
    width: 100%;
    height: auto;
    margin-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
  }

  /* Ajustes nos botões de ação */
  .acoes-servico .btn-cta {
    width: 80%;
    margin: 0 10px;
  }
 

  .noticiaCards,
  .problema,
  .conceito,
  .tipos,
  .automacao,
  .casos,
  .dimtech-ajuda{
   margin: 10px 16px;
  }

  .form-contato{
    margin: 0px 10px;
  }

  .container{
    margin: 4px 9px;
    
  }
}

  @media (max-width: 1200px){
    .menu ul {
      padding: 20px;
    }

    
  }





/* End of Tablets Media Query */