/* COMPONENTES */

.title {
  color: #00695A;
  font-family: 'bornasemibold', sans-serif;
  font-size: 7.6rem;
  font-weight: 600;
  line-height: 105%;
  letter-spacing: -1.14px;
  margin-bottom: 3.5rem;
}

.title.title--white {
  color: #FFFFFF;
}

.title.title--light-green {
  color: #00DF82;
}

@media (max-width: 1081px) {
  .title {
    font-size: 5.4rem;
  }
}

@media (max-width: 769px) {
  .title {
    font-size: 4.8rem;
  }
}

@media (max-width: 400px) {
  .title {
    font-size: 3.8rem;
  }
}

.subtitle {
  color: #222427;
  font-family: 'Barlow', sans-serif;
  font-size: 3.6rem;
  font-style: normal;
  font-weight: 600;
  line-height: 105%;
  margin-bottom: 2.5rem;
}

.subtitle.subtitle--small {
  font-size: 2.4rem;
  margin-bottom: 1.5rem;
}

.text--hero {
  color: #29302D;
  text-align: right;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

.text {
  color: var(--grey-medium);
  font-family: 'Inter', sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 160%;
  margin-bottom: 3.4rem;
}

.text.text--white {
  color: #FFFFFF;
}

@media (max-width: 769px) {
  .subtitle {
    font-size: 2.4rem;
  }

  .text {
    line-height: 115%;
  }
}

.text.text--dark {
  color: #29302D;
  margin-bottom: 0;
}

.text.text--green {
  color: #23BE7D;
}

.small--text {
  color: #23BE7D;
  font-family: 'Barlow', sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 104.3%;
  letter-spacing: .35rem;
  text-transform: uppercase;
  margin-bottom: .8rem;
}

.small--subtitle {
  color: #293646;
  font-family: 'Inter', sans-serif;
  font-size: 2.4rem;
  font-weight: 300;
  margin-bottom: 1.2rem;
}

.button {
  display: block;
  width: max-content;
  padding: 1.6rem 2.4rem;
  border-radius: 122px;
  color: #FFF;
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.3px;
  text-transform: uppercase;
  background: #23BE7D;
  transition: all 300ms ease-in;
}

.button:hover {
  opacity: .6;
}

@media (max-width: 400px) {
  .button {
    font-size: 1.2rem;
  }
}

.page-mdfe .title {
  font-family: 'bornasemibold', sans-serif;
}

.s-hero.page-cte .title {
  font-family: 'bornasemibold', sans-serif;
}

.button.button--green {
  background-color: #2CC295;
  color: #05372D;
}

.button.button--dark {
  background-color: #29302D;
}

.button.button--white {
  color: #00695A;
  background-color: #FFFFFF;
}

.icon {
  width: 4.8rem;
  height: 4.8rem;
}

main {
  overflow: hidden;
}

/* Increase top spacing before the plans sheet on CT-e and MDF-e pages */
.page-template-page-emissor-cte .plans-section,
.page-template-page-emissor-mdfe .plans-section,
.page-template-page-logistica-transporte .plans-section,
.page-id-1903 .plans-section,
.page-id-1906 .plans-section,
.page-id-1902 .plans-section {
  padding-top: 6rem;
}

@media (max-width: 640px) {
  .page-template-page-emissor-cte .plans-section,
  .page-template-page-emissor-mdfe .plans-section,
  .page-template-page-logistica-transporte .plans-section,
  .page-id-1903 .plans-section,
  .page-id-1906 .plans-section,
  .page-id-1902 .plans-section {
    padding-top: 4.5rem;
  }
}

/* HERO */

.s-hero {
  margin-top: 7rem;
}

.s-hero.page-cte {
  background-color: #05372D;
}

.s-hero.page-mdfe {
  background-color: #00695A;
}

.s-hero.s-hero--logistica {
  background: linear-gradient(180deg, #F0FFEB 0%, #FFFFFF 100%);
}

.box-hero {
  display: flex;
  align-items: center;
  gap: 6rem;
  padding: 9rem 0 12.4rem;
}

.box-hero .box-img {
  max-width: 562px;
  position: relative;
  right: -4rem;
}

@media (max-width: 1023px) {
  .box-hero .box-img {
    display: none;
  }
}

#start-now {
  display: flex;
  align-items: center;
  gap: 3.6rem;
}

.btn:hover {
  background-color: var(--primary-green);
}

.sales-call {
  display: flex;
  align-items: center;
  gap: 1.1rem;
}

.sales-call a {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--third-green);
  margin: 0;
}

.sales-call svg {
  width: 2.4rem;
  height: 2.4rem;
}

@media (max-width: 1081px) {
  .hero-text {
    width: 69%;
  }

  .box-hero {
    gap: 13.4rem;
  }

  .box-hero .box-img {
    max-width: initial;
    position: initial;
    width: 48%;
  }
}

@media (max-width: 921px) {
  .box-hero {
    gap: 5.4rem;
  }

  #start-now {
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
  }
}

@media (max-width: 730px) {
  .box-hero {
    flex-direction: column-reverse;
    padding: 6rem 0 7.4rem;
  }

  .hero-text {
    width: initial;
  }

  .box-hero .box-img {
    width: 100%;
  }

  .box-hero img {
    width: 100%;
  }
}
/* DESCRIPTION */

.s-description {
  padding-bottom: 10rem;
}

.s-description.page-mdfe {
  background-color: #00695A;
}

.box-description {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.box-description .box-img {
  position: relative;
  left: -50rem;
  width: 50%;
}

.box-description.page-mdfe .box-img {
  left: -60rem;
}

.box-description .box-img img {
  width: auto;
}

.box-description.clock .box-img img {
  height: 35rem;
}

.box-description .box-img img.responsive {
  display: none;
}

.box-description p {
  width: 37%;
  text-align: right;
}

.box-description .box-text p {
  width: 100%;
  text-align: left;
}

@media (max-width: 986px) {
  .box-description .box-img {
    left: -61rem;
  }

  .box-description.page-mdfe .box-img {
    left: -49rem;
  }
}

@media (max-width: 920px) {
  .box-description {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 3rem;
  }

  .box-description p {
    text-align: initial;
    width: initial;
  }

  .box-description .box-img {
    position: initial;
    width: initial;
  }
  
  .box-description .box-img img {
    display: none;
    height: auto;
  }
  
  .box-description .box-img img.responsive {
    display: block;
    width: 100%;
    height: auto;
  }
}

/* TRANSPORTADORA */

.box-transportadora {
  display: flex;
  align-items: center;
  gap: 10rem;
  padding-bottom: 12rem;
}

.grid-transportadora {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  justify-content: flex-start;
  gap: 0 3.4rem;
  flex-wrap: wrap;
  min-width: calc(20rem + 31.5rem + 3.4rem);
  position: relative;
}

.background-vector {
  position: absolute;
}

.grid-transportadora .grid-item {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  padding: 2.4rem;
  background: var(--white);
  border: 1px solid #6EF4A4;
  border-radius: 1rem;
}

.grid-transportadora .grid-item.only-image {
  padding: 0;
}

.grid-transportadora .grid-item.image-on-border {
  padding-top: 5.1rem;
}

.grid-transportadora .grid-item-title,
.grid-transportadora .grid-item-text {
  max-width: 16rem;
}

.grid-transportadora .grid-item-title {
  font-weight: 700;
  font-size: 2rem;
  color: var(--grey-medium);
  line-height: 110%;
}

.grid-transportadora .grid-item-text {
  color: var(--grey-medium);
  line-height: 110%;
  font-size: 1.6rem;
}

.grid-transportadora .grid-item-image {
  width: 4.8rem;
  height: 4.8rem;
  border-radius: 50%;
}

.grid-transportadora .grid-item-image.on-border {
  position: absolute;
  top: -2.5rem;
}

.grid-transportadora .grid-item:nth-of-type(1) {
  width: 20rem;
  margin-top: 5rem;
}

.grid-transportadora .grid-item:nth-of-type(2) {
  width: 31.5rem;
}

.grid-transportadora .grid-item:nth-of-type(3) {
  margin-top: 3.2rem;
  margin-left: 7.7rem;
  width: 20rem;
}

.grid-transportadora .grid-item:nth-of-type(4) {
  width: 23rem;
  height: 27.5rem;
}

.box-transportadora-img {
  max-width: 100%;
}

@media (max-width: 900px) {
  .box-transportadora {
    flex-direction: column;
  }
  
  .grid-transportadora {
    justify-content: center;
  }
  
}

@media (max-width: 580px) {
  .box-transportadora {
    gap: 6rem;
    padding-bottom: 8rem;
  }

  .grid-transportadora {
    justify-content: flex-start;
    align-items: center;
    min-width: auto;
    gap: 0 2rem;
  }

  .grid-transportadora .grid-item {
    gap: 1.6rem;
    padding: 2rem;
  }

  .grid-transportadora .grid-item-title {
    font-size: 1.6rem;
  }

  .grid-transportadora .grid-item-text {
    font-size: 1.4rem;
  }

  .grid-transportadora .grid-item:nth-of-type(1) {
    width: 17.1rem;
    margin-top: 2rem;
  }

  .grid-transportadora .grid-item:nth-of-type(2) {
    width: 17.3rem;
  }

  .grid-transportadora .grid-item:nth-of-type(3) {
    margin-left: 0;
    margin-top: 3.4rem;
  }

  .grid-transportadora .grid-item:nth-of-type(4) {
    width: 12.5rem;
    height: 21.8rem;
  }

  .grid-transportadora .grid-item:nth-of-type(4) img {
    height: 100%;
    object-fit: cover;
    border-radius: 1rem;
  }
}


@media (max-width: 404px) {
  .grid-transportadora {
    gap: 2rem;
  }

  .grid-transportadora .grid-item {
    gap: 1.6rem;
    padding: 2rem;
  }

  .grid-transportadora .grid-item-title {
    font-size: 1.6rem;
  }

  .grid-transportadora .grid-item-text {
    font-size: 1.4rem;
  }

  .grid-transportadora .grid-item:nth-of-type(1) {
    width: auto;
    margin-top: 0;
  }

  .grid-transportadora .grid-item:nth-of-type(2) {
    width: auto;
  }

  .grid-transportadora .grid-item:nth-of-type(3) {
    width: auto;
    margin-left: 0;
    margin-top:0;
  }

  .grid-transportadora .grid-item:nth-of-type(4) {
    width: auto;
  }

}

.s-logistica,
.s-calculo, .s-transporte {
  background-color: #F0FFEB;
}

.s-calculo.page-cte {
  background-color: #05372D;
}

.s-logistica {
  padding: 12rem 0 10rem;
}

.s-transporte {
  padding: 1rem 0 1rem;
}

.s-logistica.page-mdfe,
.s-logistica.page-cte,
.s-calculo.page-ctee {
  background-color: #FFF;
}

.s-calculo {
  padding: 0 0 12rem;
}

.box-logistica,
.box-calculo {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.box-logistica img {
  max-width: 50%;
}

@media (max-width: 1200px) {
  
  .box-logistica img {
    max-width: 40%;
  }
}

.box-calculo.page-cte {
  gap: 8.5rem;
}

.box-logistica .col-1,
.box-logistica .col-2 {
  width: 50%;
}

@media (max-width: 700px) {
  .box-logistica .col-1, 
  .box-logistica .col-2 {
    width: 100%;
  }

  .box-calculo.page-cte {
    gap: 4rem;
  }

  .box-logistica img {
    max-width: 100%;
  }
}

.box-logistica iframe {
  max-width: 58.8rem;
  height: 32.9rem;
}

.video-container { 
  position: relative; 
  padding-bottom: 56.25%;
  overflow: hidden;
  max-width: 100%;
  height: auto;
} 

.video-container iframe,
.video-container object,
.video-container embed { 
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.box-logistica.page-cte .logistica-text {
  max-width: 40%;
}

@media (max-width: 900px) {
  .box-logistica {
    flex-direction: column;
    align-items: flex-start;
  }

  .box-logistica.page-cte .logistica-text {
    max-width: 100%;
  }
  
}

@media (max-width: 580px) {
  .s-description.page-mdfee {
    padding-bottom: 8rem;
  }

  .s-logistica {
    padding: 8rem 0;
  }

  .s-logistica.page-cte {
    padding: 8rem 0 10rem;
  }

  .s-calculo {
    padding: 0 0 7rem;
  }

  .box-mdfe {
    padding: 8rem 0;
  }

  .s-comecar {
    margin-bottom: 7.7rem;
  }
}

.box-logistica {
  gap: 10rem;
}

@media (max-width: 500px) {
  .box-logistica {
    gap: 6rem;
  }

}

.box-btn {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.box-btn a {
  margin: 0;
}

.box-calculo .box-img {
  position: relative;
  right: 0;
  width: 45%;
}

.box-calculo img {
  width: auto;
}

.box-calculo img.responsive {
  display: none;
}

.swiper-logistica {
  max-width: 55%;
  overflow: hidden;
}

.swiper-logistica-slide {
  display: flex;
  gap: 1rem;
  background:#FFFFFF;
}

.swiper-logistica-slide img {
  object-fit: cover;
}

.swiper-logistica-slide .img-aside {
  max-width: 20%;
}

.swiper-logistica-slide .content .content-text {
  padding: 2.8rem 2rem;
}

.swiper-logistica-slide .content .content-text * {
  color: var(--grey-medium);
  line-height: 110%;
}

.swiper-logistica-slide .content img {
  height: 20rem;
}

.swiper-logistica-slide .content h3 {
  font-size: 2rem;
  margin-bottom: 1.6rem;
}

.swiper-logistica-slide .content p {
  font-size: 1.6rem;
}

.swiper-logistica .swiper-horizontal>.swiper-pagination-bullets,
.swiper-logistica .swiper-pagination-bullets.swiper-pagination-horizontal, 
.swiper-logistica .swiper-pagination-custom, 
.swiper-logistica .swiper-pagination-fraction {
  display: flex;
  justify-content: center;
  gap: 1.4rem;
  margin-top: 4rem;
}

.swiper-logistica .swiper-pagination-bullet {
  width: 1rem !important;
  height: 1rem !important;
  border: 0.1rem solid var(--primary-green);
  background-color: var(--white) !important;
  opacity: initial !important;
}

.swiper-logistica .swiper-pagination-bullet-active {
  background-color: var(--primary-green) !important;
}

.box-transporte,
.box-mdfe {
  display: flex;
  align-items: center;
  gap: 4.5rem;
}

@media (max-width: 900px) {
  .swiper-logistica {
    max-width: 100%;
  }

  .swiper-logistica-slide {
    height: auto;
  }

  .box-btn {
    flex-direction: column;
    align-items: flex-start;
  }

  .box-calculo,
  .box-transporte {
    flex-direction: column-reverse;
    align-items: flex-start;
  }

  .box-calculo .box-img {
    position: initial;
    width: initial;
  }
  
  .box-calculo img {
    display: none;
    height: auto;
  }
  
  .box-calculo img.responsive {
    display: block;
    width: 100%;
  }

  .box-transporte .transporte-text {
    max-width: initial !important;
  }  
  
}

.box-transporte {
  margin-bottom: 10rem;
  margin-top: 10rem;
}

.box-transporte .transporte-text {
  max-width: 50%;
}

.box-mdfe {
  padding: 16rem 0 14rem; 
}

.box-mdfe .box-img {
  width: 100%;
}

.box-mdfe .box-text {
  width: 107%;
}

.some-differentials {
  position: relative;
  background: #6EF4A4;
  padding: 8.1rem 0 11rem 0;
  min-height: 64rem; /* */
}

.some-differentials-box {
  display: flex;
  flex-direction: column;
}

.some-differentials-box-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6rem;
}

.some-differentials-box-header.page-cte {
  gap: 4rem;
}

.some-differentials-box-header .some-differentials-text {
  display: flex;
  align-items: center;
  gap: 3.8rem;
}

@media (max-width: 935px) {
  .some-differentials-box-header .some-differentials-text .button {
    display: none;
  }
}

.some-differentials-box-header h1 {
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 120%;
  color: #29302D;
}

.buttons-slider {
  display: flex;
  gap: 1rem;
}

.buttons-slider button {
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 2rem;
  background: var(--primary-green);
  border-radius: 0.4rem;
}

.buttons-slider button>img {
  width: 1rem;
  height: 1rem;
}

.some-differentials-box-slider {
  width: 100%;
  overflow: hidden;
}

.differential-box {
  display: flex;
  flex-direction: column;
  height: 28rem;
  background: var(--white);
  border-radius: 0.8rem;
  padding: 3.6rem 3rem 2.2rem 3rem;
}

.differential-box>img {
  width: 4.6rem;
  height: 4.6rem;
  margin-bottom: 1.6rem;
}

.differential-box h2 {
  font-size: 2rem;
  font-weight: 600;
  color: var(--primary-green);
  margin-bottom: 1.4rem;
}

.differential-box p {
  font-family: "Inter", sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  color: rgba(34, 36, 39, 0.7);
}

.differential-box-img {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.4rem;
  background: #e5f5ec;
  width: 4.6rem;
  height: 4.6rem;
  margin-bottom: 1.6rem;
}

.differential-box-img>img {
  width: 2.5rem;
  height: 2.5rem;
}

.some-diffenttials-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3rem;
  margin-top: 3rem;
}

.some-differentials-box>.some-diffenttials-pagination>.swiper-pagination-bullet {
  margin: 0.5rem;
  background-color: #fff;
}

@media (max-width: 500px) {
  .swiper-logistica-slide .img-aside {
    display: none;
  }
}

@media (max-width: 480px) {

  .some-differentials-box-header h1 {
    margin-left: 20px;
    margin-left: 2rem;
  }

  .buttons-slider {
    display: none;
  }

  .differential-box {
    margin-left: 2.5rem;
  }
}

@media (max-width: 375px) {
  .differential-box {
    margin-left: 10px;
    margin-left: 0rem;
  }
}

.s-comecar {
  margin-bottom: 16rem;
}

@media (max-width: 500px) {
  .s-comecar {
    margin-bottom: 12rem;
  }
}

.box-comecar {
  display: flex;
  align-items: flex-start;
  gap: 9rem;
}

.box-comecar .box-cards {
  display: flex;
  align-items: center;
  gap: 6rem;
}

.box-comecar .box-cards div a {
  margin-top: 1rem;
  display: inline-block;
}

@media (max-width: 769px) {
  .box-mdfe {
    padding-top: 12rem;
    flex-direction: column;
  }

  .box-mdfe .box-text {
    width: initial;
  }

  .box-comecar {
    flex-direction: column;
    gap: 6.5rem;
  }
  
}

@media (max-width: 500px) {
  .box-comecar .box-cards {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* CONTACT */

.contact-section {
  padding: 9.5rem 0 10.3rem;
  background: #293646;
  text-align: center;
}

.contact-section.page-mdfe {
  background-color: #00695A;
}

.contact-title {
  font-size: 4.8rem;
  font-weight: 600;
  color: #4CF481;
  margin-bottom: 1rem;
}

.contact-section p {
  margin: 0 auto 2rem;
  max-width: 52%;
}

.contact-section a {
  margin: 0 auto;
}

@media (max-width: 769px) {
  .contact-section p {
    max-width: 100%;
  }
}

@media (max-width: 530px) {
  .contact-title {
    font-size: 3.6rem;
  }

}

@media (max-width: 425px) {
  .contact-title {
    font-size: 2.7rem;
  }
}
