@charset "utf-8";
/* CSS Document */
@import "css/estilocor.css";

* { margin: 0; 	padding: 0; box-sizing: border-box;}

html {  font-size: 16px /* Geralmente 16px */
}


body {
  font-family: Arial, Helvetica, sans-serif;  
}

h1 {
  /* Tamanho varia entre 1.5rem e 2.5rem conforme a tela     font-size: 1.1rem;  font-size: clamp(0.95rem, 2vw, 1.3rem);*/
  font-size: clamp(1.3rem, 2vw, 2.4rem); /*1.5rem; clamp(1.1rem, 2vw, 1.8rem); 32pxpara 64px(ou 2rempara 4rem)	6vw 24pxpara 48px(ou 1.5rempara 3rem)	4vw*/
  color: #663300; 
  text-shadow: #b8a99e 2px 3px 2px; 
  padding: 1.5vh;
}

h2 {
  /* Tamanho varia entre 1.5rem e 2.5rem conforme a tela */
  font-size: clamp(1rem, 1.5vw, 1.5rem);
  color: #663300;
}

p {
  font-size: calc(0.85rem + 0.3vw);
}

/* p { font-size: clamp(1rem, 0.8rem + 0.5vw, 1.25rem); }*/

header {
    background-color:#000000;
    width: 100%;
    padding: 5px 2% 1px;
    box-shadow: 0px 5px 15px #464646;
}

.logo {
    text-align: center;
    border: none;
    margin: auto;
    width: 100%;
    height:auto;
    margin: 5px 0;
   }
   
.nav-menu{
    position: relative;
}   

.menu {
    display: flex;
    top: 3px;
    justify-content: space-around;
    background-color:  #cca85c;
    text-align: center;
    margin: 3px 8px;
    padding: 1px 6px;
}

.hamburger-button{
    position: absolute;
    width:auto;
    height:auto;
    top: 2.2rem;
    right: 1.2rem; /* Posiciona no canto superior direito */    
    display: none;
    background-color: #cca85c;
    border: 2px solid #5e4e45;  
    border-radius: 5px; 
    color: #663300;
    font-size: 1.4rem;
    padding: 6px 8px;
    cursor: pointer;
    z-index: 1000;
}

.hamburger-button .icon{
    display: inline-block;
    width: 20px;
    text-align: center;
}

.hamburger-button[aria-expanded="false"] .icon::before{
    content: "\2630";
}
.hamburger-button[aria-expanded="true"] .icon::before{
    content: "\2715";
}

.hamburger-button-js-enabled + .menu{
    position: absolute;
    width: 160px;
    margin:0;
    right: 0;
    top: 67%;
    flex-direction: column;
    border: 2px solid #fff;
    border-radius: 5px; 
    z-index: 980;
}

.hamburger-button-js-enabled + .menu-closed{
    display: none;
}


.menu li{
    list-style: none;
    display: inline-block;
}

.menu a {
    display: block;
    color: #000000;
    padding: 9px 8px 6px;
    text-decoration: none;
    font-size: 0.98rem;
    border-bottom: 4px solid transparent;
}

.menu a:hover, a:focus {
    background-color: #555;    
    color: #ffffff;
    border-bottom: 4px solid #ffffff;
}


.hamburger-button-js-enabled{
    display: block;
}

main{
   background-color: #EEE4DB; 
   height:auto;
   margin-top: 8px;
   padding: 0 20px;
}
   
container{
   width:100%; 
   padding: 0 20px;
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   /*  display: blocK; justify-content: flex-around;    background-color: pink;*/
}

.container1{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-around;
   margin-bottom: calc(0.7rem + 0.3vw);
   /*background-color: pink;*/
}

.secao1{
  flex: 1;
  width: 49%;
  display:block;
  height: auto;
  justify-content: center;
  align-items: center;
  position: relative; /* Define o contexto para o texto  */
  /* background-color: blue; */
}

.secao2 {
  flex-wrap: wrap;
  display:block;
  width: 51%;
  height: auto;
  justify-content: flex-start;
  align-content: center;
  padding-left: 1.8rem;
  /* background-color: yellow;  */
}

.secaos2 {
  display: flex; 
  flex-wrap: wrap;
  justify-content: center;      /* Centraliza horizontalmente */
  align-items: center; 
  width: 50%;
  height: auto;
  margin:auto;
  /* background-color: yellow;  */
}
.container2{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: flex-start;
   margin-bottom: calc(0.7rem + 0.3vw);
  /* background-color: orange; */
}

.secao3{
  flex: 1;     
  width: 50%;
  height: auto;
  display:block;
  justify-content: flex-start;
  /* background-color: #4DFFA6; */  
}

.secao4{
  width: 50%;
  height: auto;
  justify-content: flex-start;
  padding-left: 30px;
  /*background-color: #FF00FF;*/
}

.container3{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   width: 100%; 
   justify-content: space-around;
   gap: 10px; /* Espaçamento entre itens */
   /* background-color: grey; */
}

.secao5{
   width: 30%; 
   display: block;
   flex-wrap: wrap;
   align-content: center; 
   margin-bottom: 20px;
}

.imgserv {
    width: 100%;
    height: auto; 
    margin: 1rem 0 0.8rem;
    box-shadow: 8px 8px 10px #464646;
}

.imgfrota {
    width: 100%;
    height: auto; 
}

.imgfrota1 {
    width: 100%;
    height: auto; 
    margin: 2rem 0;
    border: 2px solid #2B0B00;
    border-radius: 10px; 
    box-shadow: 8px 8px 10px #464646;
}    

.imgvalores {
    width: 100%;
    height: auto;    
    display: block;
}

footer {
    background-color: #000000;
    height: 160px;
    padding: 0 20px;
    margin-bottom: 8px;
    box-shadow: 0px 5px 10px #464646;
}

.conteudof{
    width: 100%;
    position: relative;
    padding-top: 0.4rem;
}

.conteudof0{
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    height: 40px;
    margin: 5px 0;
    background-color: #000000;
}

.secaof1a{
  width: 35%;
  display: flex; 
  justify-content: flex-start;
  /* background-color: pink; */
}

.secaof1b{
  width: 65%;
  display: flex; 
  justify-content: flex-end;
  /* background-color: blue;*/ 
}

.conteudof1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position:absolute;
    width: calc(100% - 60px);
    height: 50px;
    left: 30px;
    z-index: 20;
    background-color: #AD751E /* #AF761F; */ 
}

.secaof2a{
  width: 55%;    
  height: auto;
  display: flex; 
  justify-content: flex-start;
  margin: 7px; 
  /* background-color: orange;*/
}

.secaof2b{
  width: 43%;    
  height: auto;
  display: flex; 
  justify-content: flex-end;
  margin: 7px;  
  /* background-color: yellow;*/
}

.conteudof2{
    position:absolute;
    width: 100%;
    height: 55px;
    top: 60px;
    z-index: 10;
    background-color: #cca85c;
} 

.conteudof3{
    position:absolute;
    margin: auto;
    width: 100%;
    height: 40px;
    top: 120px;

    z-index: 30;
    text-align: center;
    background-color: #000;
} 

a, a:visited, a:hover, a:focus { 
    text-decoration: none; 
    outline: none; }

.texto{
  padding: 2px 0;    
  font-size: 0.8rem ; 
  color:#ffffff; 
  line-height: 2rem; 
}

.textofa{
  padding: 0 10px 0 20px;
  font-size: 1rem; 
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof{
  padding: 0 20px 0 10px;
  font-size: 1rem; 
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof0{
    padding-top: 2px;
    line-height: 1.1rem; 
    font-size: 0.9rem;
    font-weight: 600;
}
.textof1{
    padding-top: 2px;
    line-height: 2.2rem; 
    font-size: 0.89rem;
    font-weight: 600;
}

.texto1 { 
    /*font-size: calc(1rem + 2vw);
    /*font-size:  min(0.85rem);
    font-size:  max(1.2rem); */ 
    font-weight: 500;
    color:#0D0D0D; 
    line-height: calc(1.1rem + 0.4vw); 
    text-align: justify;
}
    
.texto2 { 
    /* font-size: min(0.9rem 1.1rem); */ 
    font-weight: 500; 
    color:#0D0D0D; 
    line-height: calc(1.1rem + 0.4vw); 
    text-align: justify;
}

.textos2 { 
    /* font-size: min(0.9rem 1.1rem); */ 
    font-weight: 400; 
    color:#0D0D0D; 
    line-height: calc(1rem + 0.3vw); 
    text-align: justify;
}

.textoc1 { 
    /* font-size: min(0.9rem 1.1rem); */ 
    font-weight: 400; 
    color:#0D0D0D; 
    line-height: calc(1rem + 0.3vw); 
    text-align: center;
}

span{ color: #725603; font-weight: 600;}

/*Contato*/

.containerc1{   
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    padding: 3px;
}

.containerc2{   
    width:100%;
    display:grid;
    place-content: center;
    height: auto; 
    padding: 15px 0;
}

.form-container {
    width: 600px;  /*Largura máxima em desktop */
    padding: 20px;
    margin-bottom: 20px;
    background-color: #E6E1D2; 
    border:solid 2px #000000; 
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

form{
    display: grid;
    gap: 20px;
    padding: 15px 0;
}

/* Campos responsivos */
.form-group {
    margin-bottom: 15px;
}

label{
    display:block;
    color: #0D0D0D; 
    font-weight: 600;
}

labelobrig{
    color: #FF0000; 
}

input,textarea{
    width: 100%; /* Ocupa toda a largura do contêiner */
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

#nao_humano{
   display: none; 
}

.inputcaptcha{
    width: 100px; /* Ocupa toda a largura do contêiner */
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;   
}

select{
    width:100%;
    padding:8px;
    font-size:16px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.form-btn {
  display: flex;
  justify-content: center; 
  gap:20px;
} 

button {
    width: 80px;
    height:35px;
    padding: 8px 16px;
    background-color: #000000; /*#28a745;*/
    color: #fff;
    font-size:16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.form-contresp {
    width:100%;
    display:grid;
    place-content: center;
    text-align:center;
    font-size:0.98rem;
    line-height:1.5rem;
    gap:8px;
} 

/* Formulário de login */
.formlogin-container {
    width: 400px;  /*Largura máxima em desktop */
    padding:20px 30px 10px;
    margin: 30px auto;
    background-color: #E6E1D2; 
    border:solid 2px #000000; 
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.login{height:30px; border-radius:8px;  margin: 4px 0;}
.logins{width: 90%; height:30px; border-radius:8px;  margin: 4px 0;}
div i {
    cursor: pointer;
    text-align:right;
    padding: 6px;
}

/* Formulário de loginweb */
.formloginw-container {
    width: 350px;  /*Largura máxima em desktop */
    background-color:#cca85c; 
    border:solid 2px #000000; 
    border-radius: 8px;
    margin-bottom:20px
}
#formlogweb{width:100%; height:auto; margin:auto; 
  display: flex;
  flex-direction: row;
  justify-content: center; 
  align-items: center;
 
}

.btnwebm{
    width: 100%;
    height:40px;
    background-color: #000000;
    color: #ffffff;
    font-size:16px;
    border: none;
    border-radius: 8px;
    cursor: pointer;  
    text-align:center;
    position:relative; 
    float:center;
    margin: 15px 0;
    }
    
.menul {
    display: grid;
    grid-columns: "1fr";
    top:2px;
    justify-content: center;
    text-align: center;
    background-color:#cca85c; 
}

.menul li{
    list-style: none;
    display: inline-block;
    max-width:200px;
    color:#000000; 
    font-weight:bold;
    color:#ffffff;
}

.menul a {
    display: block;
    color: #ffffff;
    padding: 10px 10px 6px;
    text-decoration: none;
    font-size: 0.95rem;
    border-bottom: 4px solid transparent;
    border-radius: 6px;
}

.menul a:hover {
    background-color: #555;
    color: #ffffff;
    border-bottom: 4px solid #ffffff;
    border-radius: 6px;
}    



@media screen and (min-width: 860px){
    .hamburger-button{
        display: none;
    }

    .hamburger-button-js-enabled + .menu{
        position: static;
        display: flex;
        flex-direction: row;
        width: auto;
        justify-content: space-around;  
        align-items: center;
    }
}

@media screen and (max-width: 859px) {
  header {
     display: flex; 
     flex-direction: row;
     justify-content: space-between;
     padding: 7px 1.1% 5px;
  }
  
.logo {
   text-align: left;
   }    
 
.menu a {
    display: block;
    color: #000000;
    padding: 8px 3px;
    text-decoration: none;
    font-size: 0.9rem;
    border-bottom: 2px solid transparent;
}

container{
   padding: 0;
}   

.secao1{
  height: auto;
  display: flex;
  align-items:center;
  margin-top:3px;
  margin-bottom: calc(0.7rem + 0.3vw);
  
}

.secao2 {
  width: 100%;
  padding: 15px 0 3px;
  justify-content: flex-start;
  align-content: center;
}

.secaos2 {
    padding-left: 10px;
}

.secao3{
  width: 100%;
  justify-content: center;
  margin-bottom: calc(0.7rem + 0.3vw);
}

.secao4{
  width: 100%;
  padding: 1px 0 3px;
  justify-content: flex-start;
  align-content: center;
}

.secao5 {
  width: 40%;
}

.textos2 { 
    font-weight: 500; 
    line-height: calc(1.1rem + 0.4vw); 
}
}

@media screen and (max-width: 641px) {
  .form-container {
        width: 90vw;
    }  
    input,textarea{
        padding: 6px;
    }
}


@media screen and (max-width: 578px) { 
  header {
     height: 99px;
     padding-right: 10px
  }
  
 .logo{
   margin-top: 2px;
 }
 
 .hamburger-button{
    top: 1.3rem;
    right: 10px; /* Posiciona no canto superior direito */    
    font-size: 1.4rem;
    padding: 5px 8px;
}

 .hamburger-button-js-enabled + .menu{
    top: 70%;
}

.conteudof1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position:absolute;
    width: calc(100% - 30px);
    height: 50px;
    left: 15px;
    z-index: 20;
    background-color: #AD751E /* #AF761F; */ 
}

.textofa{
  padding: 0;
  font-size: 0.86rem; /*min(0.85rem 1rem); */
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof{
  padding: 0;
  font-size: 0.85rem; 
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof0{
    padding-top: 2px;
    line-height: 1.1rem; 
    font-size: 0.83rem;
    font-weight: 400;
}
.textof1{
    padding-top: 2px;
    line-height: 2.2rem; 
    font-size: 0.80rem;
    font-weight: 400;
}
}

@media screen and (max-width: 467px) { 
 .logo{
   margin-top: 6px;
 }
 
 .imgfrota1 {
    margin: 0.9rem 0;
    box-shadow: 6px 6px 10px #464646;
}   

.conteudof1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position:absolute;
    width: calc(100% - 30px);
    height: 50px;
    left: 15px;
    z-index: 20;
    background-color: #AD751E 
}

.secaof2a{
  width: 55%;    
  height: auto;
  display: flex; 
  justify-content: flex-start;
  margin: 7px 4px; 
  /* background-color: orange; */
}

.secaof2b{
  width: 43%;    
  height: auto;
  display: flex; 
  justify-content: flex-end;
  margin: 7px 4px;  
  /* background-color: yellow;*/
}

.texto{
  font-size: 0.7rem ; 
  color:#ffffff; 
  line-height: 1.8rem; 
}

.textofa{
  padding: 0;
  font-size: 0.70rem; /*min(0.85rem 1rem); */
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof{
  padding: 0;
  font-size: 0.71rem; 
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof0{
    padding-top: 2px;
    line-height: 1.1rem; 
    font-size: 0.69rem;
    
}
.textof1{
    padding-top: 2px;
    line-height: 2.2rem; 
    font-size: 0.68rem;
}
}

@media screen and (max-width: 422px) {    
 
 header {
     height: 90px;
     padding-right: 10px
  }
  
 .logo{
   margin-top: 8px;
 }
 
 .hamburger-button{
    top: 1.2rem;
    right: 8px; /* Posiciona no canto superior direito */    
    font-size: 1.3rem;
    font-weight:300;
    padding: 2px 5px;
}

 .hamburger-button-js-enabled + .menu{
    top: 69%;
}
 
.hamburger-button .icon{
    display: inline-block;
    width: 20px;
    text-align: center;
} 
 
footer {
    padding: 0 10px;
}

 .conteudof1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position:absolute;
    width: calc(100% - 20px);
    height: 50px;
    left: 10px;
    z-index: 20;
    background-color: #AD751E 
}
}
@media screen and (max-width: 378px) { 
    
footer {
    padding: 0 10px;
}

.texto{
  font-size: 0.6rem ; 
}

.textofa{
  padding: 0;
  font-size: 0.59rem; /*min(0.85rem 1rem); */
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof{
  padding: 0;
  font-size: 0.59rem; 
  color:#fff; 
  line-height: 2.4rem; 
  display: flex;
  align-items: center;
}

.textof0{
    padding-top: 2px;
    line-height: 1.0rem; 
    font-size: 0.6rem;
    
}
.textof1{
    padding-top: 2px;
    line-height: 2rem; 
    font-size: 0.6rem;
}
}

@media screen and (max-width: 330px) { 
    
footer {
    padding: 0 5px;
}
}