header {overflow: hidden; border-top: 2px solid var(--verde);}
.menu .conteudo {display: flex; flex-direction: row; justify-content: space-between;}
.menu .logo {display: inline-block; object-fit: contain; width: 250px; height: 68px; margin: 24px 0 26px;}
.menu .logo .img {width: 100%; height: 100%;}

.menu .right {display: flex; flex-direction: column;}
.menu .link, .menu .contato {display: block;}
.menu .right .info .ul, .menu .right .links {display: flex; flex-direction: row;} 
.menu .right .info .ul .contato {font: 400 15px / 17px Montserrat; color: var(--preto); padding: 10px;}
.menu .right .info .ul .contato p {display: inline; transition: .4s;}
.menu .right .info .ul .contato span {font: 600 17px / 17px Montserrat; color: var(--preto); transition: .4s;}
.menu .right .info .ul .contato.email {font: 300 15px / 17px Roboto; color: var(--preto);}

.menu .right .info {display: flex; padding: 12px 0 14px;}
.menu .right .info .ul {margin: 0 81px 0 0;}
.menu .right .info .ul .contato.tel {padding-left: 2px; margin: 0 35px 0 0;}
.menu .right .info .ul .contato.whatsapp {margin: 0 37px 0 0;}

.menu .right .info .ul .contato.tel .icone {width: 13px; height: 14px; margin: 0 7px 0 0;}
.menu .right .info .ul .contato.whatsapp .icone {width: 13px; height: 13px; margin: 0 7px 0 0;}
.menu .right .info .ul .contato.email .icone {width: 14px; height: 11px; margin: 0 6px 0 0;}

.menu .right .info .webmail .link { font: 300 15px / 17px Roboto; padding:8px 16px; background: var(--verde); color: var(--branco); transition: .4s;}
.menu .right .info .webmail .link:hover {background-color: #889b75;}

.menu .right .links {justify-content: space-between; position: relative;}
.menu .right .links::after {content: ''; position: absolute; top: 0; left: 0; width: 100vw; height: 2px; background: var(--cinza);}
.menu .right .links .link {padding: 17px 13px 21px; font: 300 15px / 17px Roboto; color: var(--preto);}
.menu .right .links .link.index {padding-left: 7px; }
.menu .right .links .li.select::before {content: ''; width: 100%; height: 7px; background-color: var(--verde); transition: ease-out .4s; display: block; transform-origin: left; position: relative; z-index: 10;}
.menu .right .links .li:not(.select)::before {content: ''; width: 100%; height: 7px; background-color: var(--verde); transform: scaleX(0); transition: ease-out .4s; display: block; transform-origin: left; position: relative; z-index: 10;}
.menu .right .links .li:not(.select):hover::before {transform: scaleX(1);}

.menu .mobile {position: relative; display: none;}
.menu .mobile .rec {width: 30px; height: 5px; background-color: var(--verde); margin: 2px 0; position: relative;}

.menu .engloba-mobile {display: flex; flex-direction: row; gap: 15px; justify-content: center; align-items: center;}
.menu .mobile.tel .contato {display: block; width: 25px; height: 25px;}
.menu .mobile.tel .icone {width: 100%; height: 100%;}

.logo-mb {margin: 20px; width: 200px; height: 54.4px; object-fit: contain; display: none;}
.logo-mb .img {width: 100%; height: 100%;}
.filter {width: 110%; height: 100%; position: absolute; top: 0; left: 0; z-index: -2; background-color: var(--preto);}

.menu .right .info .ul .contato.whatsapp:hover span {color: rgb(149, 197, 113);}
.menu .right .info .ul .contato.tel:hover span {color: rgb(149, 197, 113);}
.menu  .contato.email:hover p{color: rgb(149, 197, 113);}

@media (max-width: 1200px){
    .menu .conteudo{align-items: center;}
    .menu .right .links {justify-content: center; gap: 20px;}
    .menu .right .info .ul {margin: 0 30px 0 0;}
    .menu .right .info .ul .contato.tel, .menu .right .info .ul .contato.whatsapp {margin: 0 0 0 0;}
    .menu .logo {width: 200px; height: 54.4px; margin: 0;}
}

@media (max-width: 990px){    
    .logo-mb {display: block;}
    .menu .conteudo {padding: 20px 0;}
    .menu .right.close {right: 0;}
    .menu .right {flex-direction: row; transition: .4s;}
    .menu .right {position: fixed; top: 0; right: 110%;; width: 100%; height: 100vh; z-index: 100;}
    .menu .right .engloba-conteudo {width: 90vw; height: 100vh;background-color: var(--branco); flex-direction: column-reverse; justify-content: flex-end; align-items: flex-start; display: flex;}
    .menu .right .links {flex-direction: column; width: 100%; padding: 0 0 25px;}
    .menu .right .links::after {content: unset;}
    .menu .right .links .link ,.menu .right .links .link.index {padding: 10px 10px 10px 20px;}
    .menu .right .links .li {position: relative;}
    .menu .right .links .li.select::before {width: 10px; height: 100%; transform-origin: bottom; position: relative; left: 3px; top: 0; position: absolute; width: 6px;}
    .mobile.close {display: block; min-width: 13vw; background-color: #9290902f;}
    .mobile.close .engloba {display: flex; justify-content: center; flex-direction: column; align-items: center; padding: 30px; background-color: #889b75; position: relative;}
    
    .mobile.open {display: block;}
    .menu .mobile.tel {display: block;}

    .mobile.close .rec {position: absolute; background-color: var(--branco);}
    .mobile.close .engloba .rec.rec1 {transform: rotate(45deg);}
    .mobile.close .engloba .rec.rec2 {transform: rotate(-45deg);}

    .menu .right .links .li:not(.select)::before {width: 10px; height: 100%; transform-origin: bottom; transform: scaleY(0); position: absolute; left: 3px; top: 0; width: 6px;}
    .menu .right .links .li:not(.select)::before:hover {transform: scaleY(1);}
    .menu .right .info {padding: 10px 20px; align-items: center; width: 100%; justify-content: space-between; border-top: 2px solid var(--cinza);}
    .menu .right .info .ul {margin: 0;}
    .menu .right .info .ul .li .contato.tel {display: none;}
    .menu .right .info .ul .contato p {display: none;}
    .menu .right .info .ul .li .contato {padding: 5px;}    
    .menu .right .info .ul .li .contato .icone {width: 30px; height: 30px; margin: 0;}
}

@media (max-width: 600px){    
    .menu .logo {width: 180px; height: 48.96px; margin: 0;}
}