@font-face {
  font-family: Poppins;
  src: url("../fonts/Poppins-300.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: Poppins;
  src: url("../fonts/Poppins-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: Poppins;
  src: url("../fonts/Poppins-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-display: swap;
  font-family: Poppins;
}
html {
  background-color: #efefef;
  overflow-x: hidden;
  overscroll-behavior: none;
  font-size: calc(10px + 0.390625vw);
}
body {
  height: 0 !important;
}
nav {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  background-color: #2b2a2a;
  width: 100%;
  max-height: 97px;
  inset: 0 auto auto 0;
  z-index: 1;
}
.proposalButton {
  display: flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
  color: #fff;
  font-size: 1em;
  font-weight: 500;
  background-color: #00a000;
  border: 0;
  padding: 8px 10px;
  cursor: pointer;
}
.proposalButton:hover {
  background-color: #00c000;
}
.logo img {
  width: 100px;
  margin: 10px 0;
  transition: transform 0.3s;
}
.logo img:hover {
  transform: scale(1.1);
}
.menu,
.menuMobile {
  font-family: Montserrat, "sans-serif";
  color: #efefef;
  font-size: 1rem;
}
.menuMobile,
.menuMobile ul label {
  display: none;
}
.icons ul,
.menu ul {
  display: flex;
  flex-direction: row;
  list-style-type: none;
}
.menuMobile ul {
  display: flex;
  flex-direction: column;
  justify-items: center;
  align-items: center;
  list-style-type: none;
}
.menu ul li,
.menuMobile ul li {
  font-weight: 800;
  margin: 0 12px;
  position: relative;
  align-self: center;
}
.menuMobile ul li img {
  width: 35px;
}
.menu ul li ul {
  position: absolute;
  top: 94%;
  width: 100%;
  border-top: 2px solid #f88c02;
  background-color: #2b2a2a;
  display: none;
  border-radius: 15px;
}
.menuMobile ul li ul {
  position: absolute;
  top: 41px;
  left: -105px;
  border-top: 2px solid #f88c02;
  background-color: #2b2a2a;
  display: none;
  border-radius: 15px;
}
.menuMobile ul li ul.open {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 160px;
  left: -105px;
  z-index: 10;
}
.menu ul li ul li:first-child,
.menuMobile ul li ul li:first-child {
  border-top: none;
}
.menu ul li ul li,
.menuMobile ul li ul li {
  border-top: 1px solid silver;
  display: block;
  width: 90%;
  padding: 14px 0;
  text-align: center;
  font-size: 1rem;
}
.menu ul li span:hover,
.menu ul li ul li:hover,
.menuMobile ul li span:hover,
.menuMobile ul li ul li:hover {
  color: #f88c02;
  cursor: pointer;
}
.menu a {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  padding: 12px 8px;
  min-height: 48px;
}
.menuMobile a {
  color: inherit;
  text-decoration: none;
  width: 90%;
  border-bottom: 1px solid #fff;
  padding: 12px 8px;
  min-height: 48px;
  display: inline-block;
}
.menuMobile a:last-of-type {
  border-bottom: none;
}
.menu a:hover,
.menuMobile a:hover {
  color: #f88c02;
}
.home {
  width: 100%;
  height: 840px;
  max-height: 840px;
  background-color: #202020;
  background-image: url(../images/bg-destaque2.webp);
  background-repeat: no-repeat;
  background-position: center;
}
.cardDestaque {
  color: #efefef;
  position: relative;
  top: calc(32% / 2);
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.cardDestaque p:first-of-type {
  font-size: 3.2em;
  font-weight: 700;
}
.cardDestaque h1 {
  font-size: 1.3em;
  font-weight: 300;
  margin-bottom: 15px;
}
.cardDestaque button {
  font-weight: 700;
  padding: 16px 20px;
  min-height: 48px;
  background-color: #d67300;
  color: #fff;
  border: 0;
  font-size: 1.2em;
  font-weight: 700;
}
.certificates {
  font-weight: 700;
  padding: 16px 20px;
  min-height: 48px;
  background-color: #d67300;
  color: #fff;
  border: 0;
  font-size: 1.2em;
  font-weight: 700;
  width: 100%;
  margin-top: 15px;
}
.cardDestaque button a,
.certificates a {
  color: #fff;
  text-decoration: none;
}
.cardDestaque button:hover,
.certificates:hover {
  background-color: #e68000;
  cursor: pointer;
}
.cardDestaque img {
  width: calc(100% / 2);
  max-width: 400px;
  transition: transform 0.2s;
}
.cardDestaque img:hover {
  transform: scale(1.02);
}
.quemSomosContainer {
  background-color: #2b2a2a;
  background-image: url(../assets/losango.svg);
  background-position: 0 0;
  background-repeat: repeat;
  background-blend-mode: overlay;
}
.quemSomos {
  width: 66%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr;
  padding: 45px 0;
}
.imagens {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-evenly;
}
.imagens img {
  width: 100%;
}
.imagens img:first-of-type {
  margin-bottom: 15px;
}
.linkImg {
  background-color: transparent;
  border: 0;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.headerQuemSomos {
  width: 90%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: #efefef;
}
.headerQuemSomos h1 {
  color: #f88c02;
  font-size: 1em;
  margin-bottom: 15px;
}
.headerQuemSomos h2 {
  font-size: 1.8em;
  margin-bottom: 15px;
}
.headerQuemSomos p {
  font-size: 1.3em;
  font-weight: 300;
}
.produtosContainer {
  background-color: #3f3c3c;
  background-image: url(../assets/ponto.svg);
  background-position: 0 0;
  background-repeat: repeat;
  background-blend-mode: overlay;
}
.headerProdutos {
  width: 66%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: #efefef;
  padding: 45px 0 0 0;
  margin: 0 auto;
}
.headerProdutos h1 {
  color: #f88c02;
  font-size: 1em;
  margin-bottom: 15px;
}
.headerProdutos h2 {
  font-size: 1.8em;
  margin-bottom: 15px;
}
.headerProdutos p {
  font-size: 1.3em;
  font-weight: 300;
}
.produtos {
  width: 66%;
  height: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  height: 100%;
  padding: 25px 0 20px 0;
  row-gap: 25px;
}
.itemMoto {
  padding-bottom: 25px;
}
.motoImg {
  width: 100%;
  max-width: 480px;
  zoom: 1.1;
  transition: transform 0.3s;
}
.motoImg:hover {
  transform: scale(1.03);
}
.motoModel {
  color: #efefef;
  font-size: 1.3em;
  font-weight: 700;
  margin-bottom: 10px;
  margin-top: 15px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  width: 95%;
}
.motoPrice {
  color: #efefef;
  font-size: 1em;
  font-weight: 500;
  background-color: #de7d01;
  border: 0;
  padding: 8px 10px;
  margin-bottom: 15px;
}
.motoPrice-modal {
  color: #efefef;
  font-size: 1em;
  font-weight: 500;
  background-color: #de7d01;
  border: 0;
  padding: 8px 10px;
}
.motoDescription {
  color: #efefef;
  width: 90%;
  margin-bottom: 15px;
  font-weight: 300;
  font-size: 1em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
#openItem {
  color: #efefef;
  background-color: transparent;
  border: 0;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  font-weight: 300;
  font-size: 0.9em;
}
#openItem img {
  width: 7px;
  height: 13px;
}
#openItem:hover {
  color: #f88c02;
  font-weight: 500;
}
.contatoContainer {
  background-color: #403d3d;
  background-image: url(../assets/losango.svg);
  background-position: 0 0;
  background-repeat: repeat;
  background-blend-mode: overlay;
  color: #efefef;
}
.contato {
  width: 66%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr;
  padding: 45px 0;
  gap: 30px;
}
.headerContato h1 {
  color: #f88c02;
  font-size: 1em;
  margin-bottom: 15px;
}
.headerContato h2 {
  font-size: 1.8em;
  margin-bottom: 15px;
}
.headerContato p {
  font-size: 1.2em;
  font-weight: 300;
}
.headerContato .labelWarning {
  background-color: #333;
  width: fit-content;
  padding: 5px;
}
.headerContato .location {
  margin-top: 15px;
}
.fone {
  display: flex;
  flex-direction: row;
  gap: 20px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 15px;
}
.fone p {
  text-decoration: none;
  color: #fff;
}
.fone img {
  width: 40px;
  transition: transform 0.3s;
}
.fone img:hover {
  transform: scale(1.1);
}
.redesContato {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.redesContato img {
  width: 50%;
  max-width: 200px;
  transition: transform 0.3s;
}
.redesContato img:hover {
  transform: scale(1.07);
}
.redesContatoImg {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  gap: 20px;
}
.redesContatoImg img {
  width: 40px;
  transition: transform 0.3s;
  cursor: pointer;
}
.redesContatoImg img:hover {
  transform: scale(1.1);
}
.redesContato p {
  font-weight: 300;
  font-size: 1em;
  margin: 10px 0;
  text-align: center;
}
footer {
  background-color: #2b2a2a;
  width: 100%;
  height: 54px;
  font-family: Montserrat, "sans-serif";
  color: #efefef;
  font-size: 0.7em;
  font-weight: 800;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding: 0 5%;
  position: relative;
}
.hidden {
  display: none !important;
}
.floating-bar {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 8px 0 0 8px;
  overflow: hidden;
  z-index: 3;
}
.floating-bar a {
  display: block;
  padding: 20px;
  text-align: center;
  color: #fff;
  transition: background-color 0.3s;
}
.floating-bar a:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
.floating-bar a .fab {
  font-size: 30px;
}
.slick-prev {
  left: -59px !important;
  top: 533px !important;
}
.slick-next {
  right: -31px !important;
  top: 532px !important;
}
.slick-list {
  margin: 0 auto !important;
}
.slick-prev:before {
  content: "←" !important;
  color: #de7d01 !important;
  font-size: 3rem !important;
  font-weight: 900;
}
.slick-next:before {
  content: "→" !important;
  color: #de7d01 !important;
  font-size: 3rem !important;
  font-weight: 900;
}
.slick-slide {
  height: auto !important;
}
.slick-dots {
  bottom: -30px !important;
}
.slick-dots li button:before {
  font-size: 0.9rem !important;
  color: #de7d01 !important;
}
.fullScreen {
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  position: fixed;
  z-index: 3;
  background-color: rgb(20, 20, 20, 0.9);
  overflow-y: hidden;
}
#closeModalButton {
  background-image: url(../assets/close.webp);
  background-color: rgb(0, 0, 0, 0);
  background-size: contain;
  position: absolute;
  top: 15px;
  right: 15px;
  width: 30px;
  height: 30px;
  border: none;
  cursor: pointer;
  transition: opacity 0.3s;
  z-index: 1;
}
#closeModalButton:hover {
  opacity: 0.5;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fullScreenContainer {
  width: 90%;
  max-width: 1600px;
  height: 90%;
  background-color: #403d3d;
  background-image: url(../assets/losango.svg);
  background-position: 0 0;
  background-repeat: repeat;
  background-blend-mode: overlay;
  margin: 0 auto;
  position: relative;
  top: 5%;
  opacity: 0;
}
.fullScreenContainer.active {
  animation: fadeIn 1.5s;
  opacity: 1;
}
.infoMoto {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: #efefef;
  padding: 25px 45px;
  justify-content: space-evenly;
}
.motoHead {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 25px;
}
.motoHead p {
  font-size: 1.5em;
  font-weight: 700;
}
.motoHead div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
}
.motoHead .productValue {
  color: #efefef;
  font-size: 1.2em;
  font-weight: 500;
  background-color: #de7d01;
  border: 0;
  padding: 5px 10px;
}
.certificacaoBackground {
  background-color: #403d3d;
}
.contatoBackground {
  background-color: #373636;
}
.vendido {
  color: #efefef;
  font-size: 1em;
  font-weight: 500;
  background-color: #c92727 !important;
  border: 0;
  padding: 8px 10px;
}
.vendido-out {
  color: #efefef;
  font-size: 1em;
  font-weight: 500;
  background-color: #c92727 !important;
  border: 0;
  padding: 8px 10px;
  margin-bottom: 15px;
}
.cardBox {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
}
.motoVendida {
  opacity: 0.4;
  padding-bottom: 25px;
}
.motoOther {
  text-align: center;
  margin: 15px 0;
  font-size: 1.1em;
  font-weight: 300;
}
.motoPayment,
.motoText {
  font-weight: 300;
  position: relative;
  top: 10px;
}
.motoText {
  text-align: center;
  margin-bottom: 30px;
  font-size: 1.2em;
}
.motoPayment {
  padding: 10px;
  background-color: #aa7d41;
  text-align: center;
  font-weight: 500;
  color: #fff;
}
.motoPictures div img {
  width: 90%;
}
.motoPictures .slick-next {
  top: 220px !important;
  right: -6px !important;
  z-index: 3;
}
.motoPictures .slick-prev {
  left: -35px !important;
  top: 226px !important;
  z-index: 3;
}
.carrosselFullscreen {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
  text-align: center !important;
}
.moto-image {
  opacity: 0;
  transition: opacity 0.8s ease-in;
}
.moto-image.loaded {
  opacity: 1;
}
.reveal {
  position: relative;
  transform: translateY(100px);
  opacity: 0;
  transition: 1s all ease;
}
.reveal.active {
  transform: translateY(0);
  opacity: 1;
}
.upArrow {
  display: none;
  position: fixed;
  z-index: 2;
  bottom: 10px;
  left: calc(98% / 2);
}
.upArrow img {
  width: 35px;
  transition: transform 0.3s;
  opacity: 0.8;
}
.upArrow img:hover {
  transform: scale(1.1);
  opacity: 1;
}
.upArrow img a {
  cursor: pointer;
}
.downArrow {
  position: fixed;
  z-index: 2;
  bottom: 0;
  left: calc(97% / 2);
}
.downArrow img {
  width: 55px;
  height: 55px;
  transition: transform 0.3s;
  opacity: 0.8;
}
.downArrow img:hover {
  transform: scale(1.1);
  opacity: 1;
}
.downArrow img a {
  cursor: pointer;
}
.model {
  display: none;
}
@media (min-width: 1261px) {
  .motoText {
    margin-bottom: 15px;
    margin-top: 0;
  }
}
@media (max-width: 1260px) {
  .quemSomos {
    grid-template-columns: 1fr;
  }
  .imagens {
    flex-direction: column;
    align-items: center;
    margin-top: 25px;
    gap: 20px;
  }
  .imagens img:first-of-type {
    margin-bottom: 0;
  }
  .imagens img:first-of-type {
    margin-bottom: 0;
  }
  .slick-prev {
    top: 477px !important;
  }
  .slick-next {
    top: 475px !important;
  }
  .motoPictures .slick-next {
    right: -11px !important;
  }
}
@media (max-width: 1100px) {
  .motoPictures .slick-next {
    right: -13px !important;
    top: 163px !important;
  }
  .motoPictures .slick-prev {
    left: -34px !important;
    top: 168px !important;
  }
}
@media (max-width: 1015px) {
  nav {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 22px;
    max-height: 115px;
  }
  .logo {
    margin-bottom: 5px;
    margin-left: 25px;
  }
  .logo img {
    width: 70px;
  }
  .menu {
    position: absolute;
    right: 25px;
    top: 45px;
  }
  .upArrow {
    display: block !important;
  }
  .downArrow {
    display: none !important;
  }
  .redesContato img {
    width: 70%;
  }
  .slick-prev {
    top: 547px !important;
  }
  .slick-next {
    top: 544px !important;
  }
  .motoPictures .slick-next {
    top: 221px !important;
  }
  .motoPictures .slick-prev {
    left: -33px !important;
    top: 227px !important;
  }
}
@media (max-width: 900px) {
  .motoHead {
    flex-direction: column;
    gap: 5px;
  }
}
@media (max-width: 800px) {
  .menu {
    display: none;
  }
  .menuMobile {
    display: block;
    position: absolute;
    right: 35px;
    top: 25px;
  }
  .menuMobile ul li img {
    width: 55px;
  }
  .menuMobile ul li ul {
    top: 53px;
    left: -91px;
  }
  .menuMobile ul li ul li {
    font-size: 1.2rem;
  }
  footer div p {
    font-size: 0.9rem;
  }
  .cardDestaque img {
    width: 70%;
  }
  .redesContato img {
    width: 85%;
  }
  .slick-prev {
    left: -35px !important;
    top: 633px !important;
  }
  .slick-next {
    right: -16px !important;
    top: 632px !important;
  }
  .motoPictures div img {
    width: 55%;
  }
  .motoPictures .slick-next {
    right: 12px !important;
    top: 213px !important;
  }
  .motoPictures .slick-prev {
    left: -15px !important;
    top: 214px !important;
  }
  nav {
    max-height: 79px;
  }
  .menuMobile {
    top: 11px;
  }
}
@media (max-width: 650px) {
  .cardDestaque img {
    width: 80%;
  }
  .redesContato img {
    width: 90%;
  }
  .motoPictures .slick-next {
    top: 222px !important;
  }
  .motoPictures .slick-prev {
    top: 224px !important;
    left: -11px !important;
  }
  .motoPictures div img {
    width: 75%;
  }
  .floating-bar a .fab {
    font-size: 20px;
  }
}
@media (max-width: 550px) {
  .slick-prev {
    top: 554px !important;
  }
  .slick-next {
    top: 554px !important;
  }
  .motoPictures div img {
    width: 85%;
  }
  .fullScreenContainer {
    overflow-y: scroll;
  }
  .motoPictures .slick-next {
    display: none !important;
  }
  .motoPictures .slick-prev {
    display: none !important;
  }
}
@media (max-width: 500px) {
  .redesContato img {
    width: 70%;
  }
  .contato {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 450px) {
  .headerQuemSomos {
    width: 100%;
  }
  .cardDestaque img {
    width: 80%;
  }
  .cardDestaque p:first-of-type {
    font-size: 2.7em;
  }
  .fone {
    gap: 7px;
  }
  .slick-prev {
    top: 472px !important;
  }
  .slick-next {
    top: 471px !important;
  }
  .motoPictures div img {
    width: 95%;
  }
  .motoPayment {
    margin-top: 0;
  }
  .infoMoto {
    color: #efefef;
    padding: 25px 25px;
    height: auto;
  }
  #closeModalButton {
    width: 20px;
    height: 20px;
  }
  .motoPictures .slick-next {
    top: 206px !important;
    right: -7px !important;
  }
  .motoPictures .slick-prev {
    top: 208px !important;
    left: -23px !important;
  }
}
@media (max-width: 375px) {
  footer p {
    text-align: end;
  }
  .menuMobile {
    right: 20px;
    top: 12px;
  }
  .menuMobile ul li ul {
    top: 53px;
    left: -88px;
  }
  .slick-prev {
    top: 394px !important;
  }
  .slick-next {
    top: 392px !important;
  }
  .motoPictures div img {
    width: 100%;
  }
  .motoPictures .slick-next {
    top: 169px !important;
    right: -9px !important;
  }
  .motoPictures .slick-prev {
    top: 170px !important;
    left: -24px !important;
  }
}
@media (max-width: 300px) {
  .cardDestaque button {
    padding: 12px;
  }
  .cardDestaque img {
    width: 100%;
  }
  .fone {
    gap: 10px;
  }
  .slick-prev {
    left: -27px !important;
    top: 340px !important;
  }
  .slick-next {
    top: 339px !important;
  }
}
@media (max-height: 600px) {
  .fullScreenContainer {
    overflow-y: scroll;
  }
  .motoPictures .slick-next {
    display: none !important;
  }
  .motoPictures .slick-prev {
    display: none !important;
  }
}