:root {
  --psLayoutWidth: 1548;
  --psLayoutSidesPadding: 149;
}

* {
  /*border: rgba(255, 0, 0, .7) dotted 1px;*/
}

body, html {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  padding: 0;
  margin: 0;
}

body p,
body ul li,
body form input {
  font-size: 1.14vw;
  line-height: 1.71vw;
}

body h3 {
  font-size: 1.550387596899225vw;
}

section {
  position: relative;
  color: rgb(86, 101, 110);
  z-index: 1;
}

.accentHeaderWrap {
  text-align: center;
}
.accentHeader {
  position: relative;
  background: linear-gradient(180deg, rgba(153,189,65,1) 0%, rgba(153,189,65,1) 0%, rgba(115,143,43,1) 100%);
  color: white;
  text-transform: uppercase;
  font-size: 1.550387596899225vw;
  padding: 1.2919896640826873vw 0.9689922480620154vw;
  display: inline-block;
  box-sizing: border-box;
  text-align: center;
  margin: 0 auto 0
}

#mainWhatsapp {
  position: fixed;
  background: url("../img/icons/whatsappIcon.png") no-repeat;
  background-size: contain;
  text-indent: -1000vw;
  width: 7.10594315245478vw;
  height: 7.10594315245478vw;
  right: 9.62532299741602vw;
  bottom: 5.813953488372093vw;
  z-index: 100;
}

/* region: Efeitos */

.fade-in-element {
  opacity: 0;
  transform: translateY(15vw);
  visibility: hidden;
  transition: opacity 500ms ease-out, transform 700ms ease-out;
  will-change: opacity, visibility;
}

.fade-in-element.is-visible {
  opacity: 1;
  transform: none;
  visibility: visible;
}

/*endregion*/

/** region: Navegacao **/


#mainMenu {
  position: fixed;
  top: 0;/*2.2609819121vw;*/
  padding: 2.2609819121vw 9.6253229974vw; /* --psLayoutSidesPadding/--psLayoutWidth */
  height: 6.5891472868vw;
  display: flex;
  align-items: center;
  width: 100vw;
  box-sizing: border-box;
  z-index: 100;
}

#mainMenu.scrolled {
  background: rgb(41, 41, 41);
}

#mainMenu .logo, #mainMenu .logo:hover {
  color: rgba(0,0,0,0);
  width: 14.5348837209vw;
  height: 4.3281653747vw;
  background-image: url("../img/logos/logo_branco.png");
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
  margin-right: 3.5529715762vw;
}

#mainMenu ul {
  margin: 0;
  padding: 0;
}

#mainMenu ul li {
  display: inline-block;
  padding: 0 1.6149870801vw;
  border-right: 1px solid rgba(255, 255, 255, 0.4);
  font-size: 0.8397932817vw;
}

#mainMenu ul li:last-child {
  border: none;
}

#mainMenu a {
  color: #ffffff;
  text-transform: uppercase;
  text-decoration: none;
}

#mainMenu a:hover {
  color: rgba(255, 255, 255, 0.4);
}

#formRastreio {
  width: 19vw;
  height: 2.0671834625vw;
}

#formRastreio label {
  text-align: center;
}

#formRastreio label,
#formRastreio input {
  display: block;
  float: left;
}

#formRastreio .mainLabel {
  width: 5.8139534884vw;
  height: 2.0671834625vw;
  padding: 0 0.4521963824vw;
  box-sizing: border-box;
  text-transform: uppercase;
  color: white;
  display: inline-block;
  font-size: 0.5813953488vw;
  border: 0.1937984496124031vw solid rgba(255,255,255,.5);
  margin: 0;
}

#rastreieEncomenda {
  background: white;
  box-sizing: border-box;
  display: block;
  border: none;
  border-radius: 0;
  height: 2.0671834625vw;
  width: 8.5271317829vw;
  margin: 0;
}

#rastrear {
  margin: 0;
  display: block;
  border-radius: 0;
  border: none;
  height: 2.0671834625vw;
  width: 2.0671834625vw;
  color: rgba(0,0,0,0);
  background: url("../img/icons/searchIconWithbg.png");
  background-size: 2.0671834625vw;
  background-repeat: no-repeat;
}

/*endregion*/

/* region: Anuncios / Banners */
#anuncios {
  height: 50.0645994832vw;
  width: 100vw;
  overflow: hidden;
}

#slideshow {
  height: 50.0645994832vw;
  width: 300vw;
  position: relative;
  transition-property: all;
  transition-timing-function: ease-in-out;
  transition-duration: 300ms;
}


#anuncios picture,
#anuncios picture img{
  height: 50.0645994832vw;
  width: 100vw;
  float: left;
}
/*endregion*/

/* region: Quem Somos */
#quemSomos {
  box-sizing: border-box;
  width: 100vw;
  padding: 0 9.62532299741602vw;
  background: rgb(245, 245, 245);
  columns: 2;
  column-gap: 4.0051679586563305vw;
  position: relative;
  height: 45.21963824289406vw;
  overflow: hidden;
}

#quemSomos .content {
  padding: 6.459948320413436vw 0 0 0;
}

#quemSomos div {
  /*break-after: column;*/
}

.supportImage {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 41.98966408268734vw;
  height: 100%;
}

.supportImage img {
  min-width: 100%;
  height: 100%;
  position: relative;
  left: -10vw;
}

/* endregion */


/* region: Serviços */
#servicos {
  box-sizing: border-box;
  width: 100vw;
  padding: 6.459948320413436vw 9.62532299741602vw 5.167958656330749vw;
  columns: 2;
  column-gap: 1.937984496124031vw;
}

#servicos .none {
  display: none;
}

#servicos h3 {
  display: list-item;
  list-style-type: square;
  list-style-position: inside;
  color: rgb(153, 189, 65);
  text-transform: uppercase;
  padding: 1.1627906976744187vw 0;
  margin: 1.1627906976744187vw 0 0;
  text-align: center;
  border-bottom: rgb(238, 238, 238) 0.12919896640826875vw solid;
}

#servicos h3 .content {
  color: rgb(81, 81, 81);
}

#servicos p {
  padding: 1.1627906976744187vw 3.55297157622739vw;
}

#servicos .ballon {
  position: relative;
  background: rgb(245, 245, 245);
}

#servicos .ballon::after {
  content: "";
  background: url("../img/icons/ballonPoint.svg");
  background-size: cover;
  width: 1.937984496124031vw;
  height: 2.260981912144703vw;
  display: block;
  position: absolute;
  bottom: -2.260981912144703vw;
  right: 3.229974160206718vw;
}

/*#servicos h3:before {*/
/*  content: "";*/
/*  width: 0.6459948320413437vw;*/
/*  height: 0.6459948320413437vw;*/
/*  background: red;*/
/*  display: block;*/
/*  position: relative;*/
/*}*/

#servicos ul {
  list-style: none;
  list-style-position: outside;
}

#servicos ul li .icon {
  height: 1.2919896640826873vw;
  margin-right: 0.9689922480620154vw;
}

/* endregion */

/* region: Parceiros */

#parceiros {
  box-sizing: border-box;
  background: rgb(55,55,55);
  width: 100vw;
  padding: 1.937984496124031vw 9.62532299741602vw 3.875968992248062vw;
}

#parceiros .content {
  display: flex;
  justify-content: space-between;
  align-content: space-between;
  flex-direction: row;
}

#parceiros .stepper.right {
  width: 1.6795865633074936vw;
  background-image: url("../img/icons/rightChefron.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: -200vw;
  min-height: 2.9715762273901807vw;
  margin-left: 1.6795865633074936vw;
}

#parceiros .stepper.left {
  width: 1.6795865633074936vw;
  background-image: url("../img/icons/leftChefron.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: -200vw;
  min-height: 2.9715762273901807vw;
  margin-right: 1.6795865633074936vw;
}

#parceirosList {
  padding: 0;
  box-sizing: border-box;
  width: 300vw;
}

#parceirosList li {
  box-sizing: border-box;
  width: 9.6899224806vw;
  height: 9.6899224806vw;
  padding: 0.8074935400516795vw 0.9689922480620154vw;
  background: white;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#parceirosList li img {
  max-height: 80%;
  max-width: 80%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/*endregion*/

/* region: Contato */
#contato {
  box-sizing: border-box;
  width: 100vw;
  padding: 7.10594315245478vw 9.62532299741602vw 9.689922480620156vw;
}

#contato .content {
  display: flex;
  justify-content: space-between;
  position: relative;
}

#contato .contactImage img {
  width: 100%;
  height: auto;
}

#contato .contactInfo {
  text-align: center;
}

#contato .contactInfo a {
  display: inline-block;
  padding-left: 3.842377260981912vw;
  height: 2.842377260981912vw;
  line-height: 2.842377260981912vw;
  background-position: left;
  background-repeat: no-repeat;
  font-size: 2.260981912144703vw;
  color: rgb(55,55,55);
  text-decoration: none;
  font-weight: bold;
}

#contato .contactInfo .whatsapp {
  background: url("../img/icons/contatoWhatsAppIcon.png") no-repeat;
  background-size: contain;
}

#contato .contactInfo .instagram {
  background: url("../img/icons/contatoInstagramIcon.png") no-repeat;
  background-size: contain;
}

#contato .content > div {
  width: 25.839793281653744vw;
}
/*endregion*/

/* region: Rodapé */
#rodape {
  background: rgb(40,40,40);
  color: white;
  width: 100vw;
  box-sizing: border-box;
  padding: 5.167958656330749vw 9.6253229974vw 10.335917312661499vw; /* --psLayoutSidesPadding/--psLayoutWidth */
  /*columns: 3;*/
  display: flex;
  align-content: center;
  justify-content: space-between;
}

#rodape div {
  width: 25.1248923342vw;
}

#rodape .logo {
  color: rgba(0,0,0,0);
  width: 14.5348837209vw;
  height: 4.3281653747vw;
  background-image: url("../img/logos/logo_branco.png");
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
  margin-right: 3.5529715762vw;
}

#rodape .colLogo {
  position: relative;
}

#rodape .colLogo .wrapper {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
}

#rodape div {
  break-after: column;
}

#rodape h3 {
  font-size: 0.9689922480620154vw;
  display: list-item;
  list-style-type: square;
  list-style-position: inside;
  color: rgb(153, 189, 65);
  text-transform: uppercase;
  padding: 1.1627906976744187vw 0;
  margin: 1.1627906976744187vw 0;
  border-bottom: rgb(68, 92, 107) 0.12919896640826875vw solid;
}

#rodape h3 .content {
  color: white;
}

#rodape ul {
  padding: 0;
}

#rodape p,
#rodape li {
  font-size: 0.7751937984496123vw;
  line-height: 1.1627906976744184vw;
  list-style: none;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 0.7751937984496124vw;
  padding-left: 1.7751937984496124vw;
}

#rodape li a:hover {
  color: rgba(255,255,255,0.5);
}

#rodape li.telefone {
  background-image: url("../img/icons/rodapePhoneIcon.png");
}

#rodape li.whatsapp {
  background-image: url("../img/icons/rodapeWhatsAppIcon.png");
}

#rodape li.email {
  background-image: url("../img/icons/rodapeMailIcon.png");
}

#rodape li.instagram {
  background-image: url("../img/icons/rodapeInstagramIcon.png");
}

#rodape li.endereco {
  margin-top: 1vw;
  background-image: url("../img/icons/rodapeMapIcon.png");
}

#rodape .instagramFeed iframe {
  width: 25.839793281653744vw;
  height: 31.007751937984494vw;
}

.contatoInfo a {
  color: white;
  text-decoration: none;
}

.contatoInfo ul {
  margin: 0;
  list-style-position: outside;
}

.contatoInfo .telefone {

}
/*endregion*/

/* region: Hamburger Button (hidden on desktop) */
#hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  z-index: 200;
  flex-direction: column;
  justify-content: space-between;
  width: 32px;
  height: 24px;
}

#hamburger span {
  display: block;
  width: 100%;
  height: 3px;
  background: white;
  border-radius: 2px;
  transition: all 300ms ease;
  transform-origin: center;
}

#hamburger.active span:nth-child(1) {
  transform: rotate(45deg) translate(7px, 7px);
}

#hamburger.active span:nth-child(2) {
  opacity: 0;
}

#hamburger.active span:nth-child(3) {
  transform: rotate(-45deg) translate(7px, -7px);
}
/*endregion*/

/* ===================================================
   RESPONSIVE — Tablet (max-width: 1024px)
   =================================================== */
@media screen and (max-width: 1024px) {

  body p,
  body ul li,
  body form input {
    font-size: 14px;
    line-height: 22px;
  }

  body h3 {
    font-size: 18px;
  }

  .accentHeader {
    font-size: 18px;
    padding: 12px 16px;
  }

  /* Nav */
  #mainMenu {
    padding: 16px 24px;
    height: auto;
    flex-wrap: wrap;
    background: rgb(41, 41, 41);
  }

  #hamburger {
    display: flex;
    margin-left: auto;
  }

  #mainMenu nav {
    display: none;
    width: 100%;
    order: 3;
    padding-top: 16px;
  }

  #mainMenu nav.open {
    display: block;
  }

  #mainMenu ul {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  #mainMenu ul li {
    display: block;
    padding: 12px 0;
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    font-size: 14px;
  }

  #mainMenu ul li:last-child {
    border-bottom: none;
  }

  #mainMenu .logo, #mainMenu .logo:hover {
    width: 160px;
    height: 48px;
    margin-right: 0;
  }

  #formRastreio {
    display: none;
  }

  /* Banners */
  #anuncios {
    height: 40vw;
    margin-top: 64px;
  }

  #slideshow {
    height: 40vw;
  }

  #anuncios picture,
  #anuncios picture img {
    height: 40vw;
  }

  /* Quem Somos */
  #quemSomos {
    columns: 1;
    height: auto;
    padding: 40px 24px;
    overflow: visible;
  }

  #quemSomos .content {
    padding: 0 0 24px 0;
  }

  .supportImage {
    width: 100%;
    height: 300px;
  }

  .supportImage img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
  }

  /* Serviços */
  #servicos {
    columns: 1;
    padding: 40px 24px;
  }

  #servicos .none {
    display: block;
  }

  #servicos h3 {
    font-size: 16px;
    padding: 12px 0;
    margin: 12px 0 0;
  }

  #servicos p {
    padding: 12px 16px;
    font-size: 14px;
  }

  #servicos ul li {
    font-size: 14px;
  }

  #servicos ul li .icon {
    height: 16px;
    margin-right: 8px;
  }

  /* Parceiros */
  #parceiros {
    padding: 24px;
  }

  #parceirosList li {
    width: 140px;
    height: 140px;
    padding: 12px;
  }

  #parceirosList li img {
    max-height: 80%;
    max-width: 80%;
  }

  /* Contato */
  #contato {
    padding: 40px 24px;
  }

  #contato .content {
    flex-wrap: wrap;
    gap: 24px;
  }

  #contato .content > div {
    width: 100%;
  }

  #contato .contactImage img {
    width: 100%;
    height: auto;
    max-height: 300px;
    object-fit: cover;
    border-radius: 8px;
  }

  #contato .contactInfo a {
    font-size: 20px;
    padding-left: 36px;
    height: 32px;
    line-height: 32px;
  }

  #contato .map iframe {
    min-height: 300px;
    border-radius: 8px;
  }

  /* Rodapé */
  #rodape {
    flex-wrap: wrap;
    padding: 32px 24px 48px;
    gap: 24px;
  }

  #rodape div {
    width: 100%;
  }

  #rodape .logo {
    width: 160px;
    height: 48px;
    margin: 0 auto;
  }

  #rodape .colLogo .wrapper {
    justify-content: center;
  }

  #rodape h3 {
    font-size: 14px;
    padding: 12px 0;
    margin: 12px 0;
  }

  #rodape p,
  #rodape li {
    font-size: 13px;
    line-height: 20px;
    background-size: 14px;
    padding-left: 24px;
  }

  #rodape .instagramFeed iframe {
    width: 100%;
    height: 400px;
    border-radius: 8px;
  }

  /* WhatsApp flutuante */
  #mainWhatsapp {
    width: 60px;
    height: 60px;
    right: 16px;
    bottom: 24px;
  }
}


/* ===================================================
   RESPONSIVE — Mobile (max-width: 768px)
   =================================================== */
@media screen and (max-width: 768px) {

  body p,
  body ul li,
  body form input {
    font-size: 14px;
    line-height: 21px;
  }

  body h3 {
    font-size: 16px;
  }

  .accentHeader {
    font-size: 16px;
    padding: 10px 14px;
  }

  /* Nav */
  #mainMenu {
    padding: 12px 16px;
  }

  #mainMenu .logo, #mainMenu .logo:hover {
    width: 140px;
    height: 42px;
  }

  #mainMenu ul li {
    font-size: 14px;
    padding: 10px 0;
  }

  /* Banners */
  #anuncios {
    height: 55vw;
    margin-top: 56px;
  }

  #slideshow {
    height: 55vw;
  }

  #anuncios picture,
  #anuncios picture img {
    height: 55vw;
    object-fit: cover;
  }

  /* Quem Somos */
  #quemSomos {
    padding: 32px 16px;
  }

  #quemSomos .content {
    padding: 0 0 16px 0;
  }

  .supportImage {
    height: 220px;
    border-radius: 8px;
    overflow: hidden;
  }

  /* Serviços */
  #servicos {
    padding: 32px 16px;
  }

  #servicos p {
    padding: 10px 8px;
  }

  #servicos img {
    border-radius: 8px;
  }

  /* Parceiros */
  #parceiros {
    padding: 20px 16px;
  }

  #parceiros .accentHeader {
    font-size: 14px;
    padding: 8px 12px;
  }

  #parceirosList li {
    width: 125px;
    height: 125px;
    padding: 10px;
  }

  #parceirosList li img {
    max-height: 80%;
    max-width: 80%;
  }

  #parceiros .stepper.right,
  #parceiros .stepper.left {
    width: 24px;
    min-height: 40px;
    margin-left: 8px;
    margin-right: 8px;
  }

  /* Contato */
  #contato {
    padding: 32px 16px;
  }

  #contato .content {
    flex-direction: column;
    gap: 20px;
  }

  #contato .content > div {
    width: 100%;
  }

  #contato .contactImage {
    order: 2;
  }

  #contato .contactInfo {
    order: 1;
  }

  #contato .map {
    order: 3;
  }

  #contato .contactInfo a {
    font-size: 18px;
    padding-left: 32px;
    height: 28px;
    line-height: 28px;
  }

  #contato .map iframe {
    min-height: 250px;
    border-radius: 8px;
  }

  /* Rodapé */
  #rodape {
    flex-direction: column;
    padding: 24px 16px 40px;
    gap: 20px;
  }

  #rodape div {
    width: 100%;
  }

  #rodape .logo {
    width: 140px;
    height: 42px;
    margin: 0 auto;
  }

  #rodape h3 {
    font-size: 13px;
    padding: 10px 0;
    margin: 8px 0;
  }

  #rodape p,
  #rodape li {
    font-size: 12px;
    line-height: 18px;
    padding-left: 22px;
    background-size: 12px;
  }

  #rodape .instagramFeed iframe {
    width: 100%;
    height: 350px;
    border-radius: 8px;
    overflow: hidden;
  }

  /* WhatsApp flutuante */
  #mainWhatsapp {
    width: 52px;
    height: 52px;
    right: 12px;
    bottom: 20px;
  }
}

/* ===================================================
   RESPONSIVE — Small Mobile (max-width: 480px)
   =================================================== */
@media screen and (max-width: 480px) {

  #anuncios {
    height: 65vw;
    margin-top: 56px;
  }

  #slideshow {
    height: 65vw;
  }

  #anuncios picture,
  #anuncios picture img {
    height: 65vw;
  }

  .supportImage {
    height: 180px;
  }

  #contato .contactInfo a {
    font-size: 16px;
  }

  #rodape .instagramFeed iframe {
    height: 300px;
  }

  #parceirosList li {
    width: 110px;
    height: 110px;
    padding: 8px;
  }

  #parceirosList li img {
    max-height: 80%;
    max-width: 80%;
  }
}