* {
padding: 0;
margin: 0;
font-family: "Roboto", sans-serif;
border: none;
list-style: none;
box-sizing: border-box;
}

.container {
width: 100%;
max-width:1165px;
margin: 0 auto;
padding:0 20px;
}

a {
text-decoration: none;
color: #141414;
transition-duration: 0.4s;
cursor: pointer; 
}

a:hover {color: #F97316;}

html {scroll-behavior: smooth;}

body {
background-color:#f9fafb;
margin-top: 60px;
margin-bottom: 40px;
}

h1 {
font-family: 'Anton', sans-serif;
font-weight: normal;
font-size: 30px;
line-height: 38px;
margin: 0;
margin-bottom: 20px;
}

h2 {
font-family: 'Anton', sans-serif;
font-weight: 400;
font-size: 26px;
line-height:30px;
margin-bottom: 10px;
}

h3 { 
margin-top: 10px;
margin-bottom: 10px;
font-size: 24px;
font-family: 'Anton', sans-serif;
font-weight: normal;
margin: 0;
padding: 0;
}

h4 { 
margin-top: 16px;
margin-bottom: 10px;
font-size:16px;
font-family: "Roboto", sans-serif;
font-weight: bold;
text-transform: uppercase;
}

p {
font-size: 16px;
line-height:22px;
font-family: "Roboto", sans-serif;
}

button {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;}

.icon {margin-right:10px;}  

.btn {
/*width: 100%;*/
color: #fff;
background-color: #000117;
padding: 17px 40px;
transition-duration: 0.4s;
border-radius: 6px;
font-size: 16px;
font-weight:;
}

.btn:hover {
color: #fff;
background-color: #F26C0F;
padding: 17px 40px;
margin-top: 20px;
transition-duration: 0.4s;
border-radius: 6px;
}

.btn3 {
width: 100%;
background-color: #000117;
color: #fff;
padding: 17px 40px;
transition-duration: 0.4s;
border-radius: 6px;
font-size: 16px;
font-weight: bold;
}

.btn3:hover {
background-color: #000;
color: #fff;
padding: 17px 40px;
transition-duration: 0.4s;
border-radius: 6px;
}

.conteudo-hero {
margin-top: 40px;
}

.logo {
margin-bottom: 32px;
}

main {
display: flex;
align-items: center;
justify-content: space-between;
}

.box-text-main {
max-width: 420px;
}

.logos-clientes {
margin-top: 40px;
}

.logos {
margin-top: 22px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
}

.diferencias {
margin-top: 80px;
}

.box-diferenciais {
margin-top: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}

.box-importantes {
margin-top: 40px;
display: flex;
align-items: flex-start;
justify-content: space-between;
}

.limpeza-comum {
margin-top: 100px;
display: flex;
align-items: flex-start;
justify-content: space-between;
}

.box-limpeza-comum-text {
max-width: 564px;
}

.box-limpeza-comum-img {
max-width: 454px;
}

.box-aviso {
color: #ea580c;
margin-top: 60px;
background-color: #fff7ed;
border-radius: 10px;
padding: 40px 40px ;
}

.box-list {
display: flex;
align-items: center;
justify-content: space-between;
line-height: 20px;
}

ul {
line-height:26px;
font-size: 14px;
}

.garantia {
display: flex;
align-items: center;
background-color: #F91616;
height: 140px;
border-radius: 10px;
padding: 20px 40px;
margin: 0 auto;
margin-bottom: 20px;
margin-top: 80px;
background: rgba(16, 16, 16, 0.1);
}

.container .garantia {
display: flex;
align-items: center;
justify-content: space-between;
}

.mapa {
margin-top: 40px;
margin-bottom: 60px;
}

img {max-width: 100%;}


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

body {
margin-top: 22px;
}

main {
flex-direction: column;
gap: 40px;
}

.logos {
gap: 20px;
flex-wrap: wrap;
justify-content: flex-start;
}

.box-diferenciais {
margin-top: 32px;
align-items: flex-start;
flex-direction: column;
gap: 40px;
}

.limpeza-comum {
flex-direction: column;
gap: 40px;
}

.box-importantes {
flex-direction: column;
gap: 40px;
}

.box-list {
align-items: flex-start;
line-height: 20px;
flex-direction: column;
}

.garantia {
height: 400px;
text-align: center;
}

.container .garantia {
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
padding: 40px 40px;
}

.conteudo-hero {
margin-top: 20px;
}

.btn {
width: 100%;
}

h2 {
margin-bottom: 20px;
}

}