:root{
	font-size:62.5%;
	line-height:normal;

	--cor-branco:#fff;
  	--cor-preto:#000;
  	--cor-vermelho:#ED3237;
	--cor-txt:#3B4B50;
	--cor-verde-escuro:#0D6526;
	--cor-verde-claro:#58B32B;
	--cor-cinza-menu :#F3F3EE;
	--cor-cinza-listagem:#F8F8F4;
	--cor-cinza-borda:#D2CEBA;
	--cor-btn-compra:#EFEFEA;


	--medium:500;
	--semi:600; 
	--negrito:700;

	--font-regular:1.6rem;
	--line-regular:2.4rem;
}

*{box-sizing:border-box;}
::before{box-sizing: unset}

html{height:100% !important; width:100%; -webkit-backface-visibility:hidden !important;}
body {margin:0; min-width:322px; background-color:var(--cor-branco); overflow-y:auto; font-family:'Lato', 'Arial','verdana'; font-weight: 400; color:var(--cor-txt); height: 100%; font-size:var(--font-regular); line-height:var(--line-regular); -webkit-backface-visibility:hidden; overflow-x:hidden; -webkit-backface-visibility:hidden !important;-webkit-overflow-scrolling: touch;}

input, select, textarea {outline-style: none;font-family: 'Lato', sans-serif; font-size:var(--font-regular);color:var(--cor-txt);appearance: none !important;-webkit-appearance: none !important;-ms-appearance: none;border: 0;background-color: var(--cor-branco);}
input:-webkit-autofill{box-shadow: 0 0 0px 1000px white inset;-webkit-box-shadow: 0 0 0px 1000px white inset;font-family: inherit;}
input[type=button], input[type=submit], input[type=reset], input[type=file]{-webkit-appearance: none; appearance: none;}
input, button, select, textarea{outline: none;}
select::-ms-expand{display: none;}
select{background-repeat: no-repeat; background-position:calc(100% - 15px) center; background-image: url('../imagens/ico-select.png');}
select.aberto {background-image: url('../imagens/ico-select2.png');}

button{cursor: pointer;background-color: rgba(0, 0, 0, 0);outline-style: none !important;outline: none;outline: nonet;outline-offset: none;}
video, button, div{outline: none;font-family: inherit;appearance: none;-webkit-appearance: none;-ms-appearance: none;border: 0;-webkit-tap-highlight-color: transparent;}
button, div:focus{outline: none;-webkit-tap-highlight-color: transparent}

h1,h2,h3, button, figure {padding:0; margin:0;font-family: inherit; font-weight:400; font-size:var(--font-regular); line-height: var(--line-regular);}

a {color: inherit;outline: none;text-decoration: inherit;}
a:hover{color: inherit;outline: none;text-decoration: inherit;}
a img {outline : none;}

p, ul, li{margin:0; padding:0;color:inherit}
ul {list-style: none;}
img {border : 0; outline: none;}

.ColorErro{color: var(--cor-vermelho) !important;}
.BordaErro{border-color: var(--cor-vermelho) !important;}

.centralizar {display: flex;width: calc(100% - 40px);max-width: 1240px;margin: 0px 20px;flex-direction: column;align-items: center;}

header {display:flex;width:100%;justify-content:center;align-items:center;box-shadow: 0px 3px 15px 0px rgba(151, 147, 128, 0.46);position:relative;z-index:1}
header .centralizar {flex-direction:row;align-items: center;justify-content: space-between;height:85px;gap:30px}
header .menu {display: flex;align-items: center;gap: 30px;width:100%;max-width:420px}
header .menu>a {font-family:'Merriweather';margin:3px 0px;font-weight:600}
header .menu>a:hover {color:var(--cor-verde-claro);border-bottom:3px solid var(--cor-verde-claro);margin-bottom:0px}
header .busca {display: flex;align-items: center;border:1px solid var(--cor-cinza-borda);background-color:var(--cor-cinza-listagem);border-radius:21px;height:42px;padding:4px;flex:1}
header .busca>input[type=text] {padding-left:10px;background-color:transparent;flex:1;font-size:15px}
header .busca>input[type=button] {background-color:var(--cor-verde-escuro);height:34px;width:34px;border-radius:20px;background-image:url('../imagens/ico-busca.png');background-repeat:no-repeat;background-position:center;cursor:pointer}

main {display:flex;width:100%;justify-content:flex-start;align-items:center;flex-direction: column;min-height:calc(100% - 333px)}

main .banner {display:flex;width:100%}
main .banner-img {float:left;width:100%;height:auto}

main .titulo {width:100%;text-align:center;font-family:'Merriweather';font-size:30px;line-height:40px;font-weight:700;margin-top:50px;margin-bottom:35px}

main .caminho {display: flex;gap: 0px 10px;align-items: center;width: 100%;margin:30px 0px 50px 0px;flex-wrap:wrap}
main .caminho>span {color:var(--cor-verde-claro)}

/* MENU */
main .menu {display:flex;width:100%;background-color:var(--cor-cinza-menu);height:60px;justify-content: space-between;border-radius: 3px;}
main .menu-esquerda{display:flex;flex:1;min-width:0;}
main .menu-titulo {display:flex;align-items:center;border-right:1px solid var(--cor-cinza-borda);font-weight:700;padding:0px 25px;height:100%;white-space:nowrap;}
main .categorias{display:flex;flex:1;overflow:hidden;}

main .categoria{position:relative;flex:none;}
main .categoria-link{display:flex;align-items:center;gap:6px;height:100%;padding:0px 34px 0px 14px;text-decoration:none;white-space:nowrap;transition:.2s;background-repeat: no-repeat; background-position:calc(100% - 15px) center; background-image: url('../imagens/ico-select.png');}
main .categoria-link:hover{background-color: #E9E9DF;}

main .menu.sem-hover .categoria:hover > .submenu {display: none;}
main .menu:not(.sem-hover) .categoria:hover > .submenu{display:block;}

/* ---------- submenu ---------- */
main .submenu{display:none;position:absolute;top:100%;left:0;min-width:230px;background-color: #E9E9DF;z-index:1000;}
main .submenu a{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;text-decoration:none;}
/* ---------- ver todos ---------- */
main .todos{position:relative;margin-left:10px;flex:none;}
main .todos>.botao{height:100%;padding:0 35px 0 15px;cursor:pointer;background-color: #E9E9DF;background-repeat: no-repeat; background-position:calc(100% - 15px) center; background-image: url('../imagens/ico-select.png');display: flex;align-items: center;justify-content: center;}
main .dropdown{display:none;position:absolute;right:0;top:100%;min-width:250px;background-color: #E9E9DF;z-index:999;}
main .todos.aberto>.dropdown{display:block;}
main .todos.mobile{margin-left:0px;width:100%}
main .todos.mobile>.botao{width:100%}
/* categorias dentro do Ver Todos */
main .dropdown .categoria{width:100%;}
main .dropdown .categoria-link{height:45px;justify-content:space-between;}
main .dropdown .submenu{position:relative;top:unset;left:unset;min-width:0;}
main .todos.mobile .dropdown {width:100%}
/* main .todos .dropdown .categoria{border-top:1px solid var(--cor-cinza-borda)} */
/* main .todos .dropdown .categoria .submenu {background-color:var(--cor-cinza-menu)} */
/* FIM MENU */

main .linha {display:flex;width:100%;margin:10px 0px 20px 0px;border-top:1px solid var(--cor-cinza-borda)}

main .listagem {display:flex;width:100%;flex-wrap:wrap;gap:20px}
main .listagem>div {display:flex;flex-direction:column;width:calc(25% - 15px);background-color:var(--cor-cinza-listagem);border:1px solid var(--cor-cinza-borda);padding:8px;border-radius:5px}
main .listagem>div:hover {box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.16);cursor:pointer}
main .listagem>div:hover>div:nth-of-type(1)>div {display:flex}
main .listagem>div>div:nth-of-type(1) {background-repeat:no-repeat;background-size:cover;aspect-ratio:2.79 / 3;width:100%;display: flex;justify-content: center;align-items: flex-end;}
main .listagem>div>div:nth-of-type(1)>div {display:none;border-radius:3px;background-color:var(--cor-verde-escuro);margin-bottom:30px;color:#FFF;align-items: center;justify-content: center;gap: 10px;padding: 7px 25px;}
main .listagem>div>div:nth-of-type(2) {display:flex;flex-direction:column;width:100%;padding:12px 12px 5px 12px;gap:10px}
main .listagem>div>div:nth-of-type(2)>p:nth-of-type(1) {font-size:15px;font-family:'Merriweather';font-size:15px;font-weight:700;line-height:19px}
main .listagem>div>div:nth-of-type(2)>p:nth-of-type(2) {color:var(--cor-verde-claro);font-size:18px;font-weight:800}
main .listagem>div>div:nth-of-type(2)>p:nth-of-type(3) {font-size:15px;line-height:18px}

main .detalhes {display:flex;width:100%;gap:30px;align-items:flex-start}
main .detalhes .fotos {display:flex;gap:5px;width:48.47%;position: sticky;top: 15px;}
main .detalhes .fotos-p {display:flex;width:19.3%;gap:5px;flex-direction:column}
main .detalhes .fotos-p>a>img {width:100%;aspect-ratio:1.16 / 1.25;cursor:pointer}
main .detalhes .fotos-g {display:flex;gap:5px;flex:1;justify-content: center;align-items: center;}
main .detalhes .fotos-g>a>img {width:100%;aspect-ratio:4.8 / 5.16}

main .detalhes .descricao {display:flex;flex:1;flex-direction:column}

main .detalhes .bloco1 {display:flex;width:100%;flex-direction:column;background-color:var(--cor-cinza-listagem);border-radius:5px;padding:40px;gap:8px}
main .detalhes .bloco1>p:nth-of-type(1) {font-family:'Merriweather';font-size:18px;font-weight:700;margin-bottom:10px}
main .detalhes .bloco1>p:nth-of-type(2) {font-size:30px;font-weight:800;color:var(--cor-verde-claro)}
main .detalhes .bloco1>p:nth-of-type(3) {font-size:15px}
main .detalhes .bloco1>p:nth-of-type(4) {font-size:15px}
main .detalhes .bloco1>div:last-child {display:flex;width:100%;max-width:380px;gap:8px;flex-direction:column;margin-top:5px}
main .detalhes .bloco1>div:last-child>a {display:flex;width:100%;gap:10px;background-color:var(--cor-btn-compra);border:1px solid var(--cor-cinza-borda);height:53px;align-items: center;justify-content: center;}
main .detalhes .bloco1>div:last-child>a:hover {background-color:#DCEBE1;cursor:pointer}
main .detalhes .bloco1 .linha {display:flex;width:calc(100% + 32px);margin:10px -16px 10px -16px;border-top:1px solid var(--cor-cinza-borda)}

main .detalhes .bloco2 {display:flex;width:100%;flex-direction:column;margin-top:10px}
main .detalhes .bloco2 .texto {display:flex;flex-direction:column;border-bottom:1px solid var(--cor-cinza-borda);padding:16px 0px;gap:16px;cursor:pointer}
main .detalhes .bloco2 .texto>p:nth-of-type(1) {font-family:'Merriweather';font-size:18px;font-weight:700;background-image:url('../imagens/arrow-down.png');background-repeat:no-repeat;background-position:center right}
main .detalhes .bloco2 .texto>p:nth-of-type(2) {display:none}

footer {display:flex;width:100%;justify-content:center;align-items:center;margin-top:100px;background-color:var(--cor-verde-escuro);padding:30px 0px}
footer .centralizar {flex-direction:row;align-items: center;justify-content: space-between;gap:30px}
footer .dados {display:flex;gap:40px;color:var(--cor-branco);align-items: center;}
footer .dados>p {background-image:url('../imagens/ico-phone.png');background-repeat:no-repeat;background-position:left center;padding-left:26px}
footer .dados>div {display:flex;gap:10px;}

.whatsapp {position:fixed;bottom:30px;right:30px;width:66px;height:66px;background-color:#25D366;border-radius:40px;background-image:url('../imagens/ico-whats.png');background-repeat:no-repeat;background-position:center;cursor:pointer}

@media screen and (max-width:1050px){
	main .listagem>div {width:calc(33.33% - 14px)}
}

@media screen and (max-width:1000px){
	.centralizar {width: calc(100% - 30px);margin: 0px 15px}

	main .titulo {font-size:24px;line-height:30px;margin-top:40px;margin-bottom:25px}

	main .caminho {margin:20px 0px 25px 0px}

	main .menu-titulo {display:none}
	
	main .detalhes {gap:15px}
	main .detalhes .bloco1 {padding:20px}
	main .detalhes .bloco1>p:nth-of-type(2) {font-size:24px}
	main .detalhes .bloco1 .linha {width:100%;margin:10px 0px 10px 0px}
}

@media screen and (max-width:700px){
	main .listagem>div {width:calc(50% - 10px)}

	main .detalhes {flex-direction: column;}
	main .detalhes .fotos {width:100%;position:unset}
	main .detalhes .descricao {width:100%}
}

@media screen and (max-width:600px){
	header .centralizar {gap:15px;height:75px}
	header .centralizar>img {height:48px}
	header .menu {max-width:300px}
	header .menu>a {display:none}

	main .titulo {font-size:21px;line-height:26px;margin-top:30px;margin-bottom:15px}

	main .listagem {gap:10px}
	main .listagem>div {width:calc(50% - 5px)}
	main .listagem>div>div:nth-of-type(2) {padding:8px 0px 0px 0px}
	main .listagem>div>div:nth-of-type(2)>p:nth-of-type(1) {font-size:14px}
	main .listagem>div>div:nth-of-type(2)>p:nth-of-type(3) {font-size:14px}
}

@media screen and (max-width:550px){
	footer .centralizar {flex-direction: column;}

	main .menu {height:50px}
}

@media screen and (max-width:400px){
	header .busca>input[type=text] {width:100px}
	footer .dados {gap:30px}
}