body {
  margin: 0;
  padding: 0;
  line-height: 1.6;
  font-family: Arial, Helvetica, sans-serif;

}

@font-face {
  font-family: 'Roboto';
  src: url('Roboto-Italic-VariableFont_wdth,wght.ttf') format('opentype');
}

@font-face {
  font-family: 'Ubuntu';
  src: url('Ubuntu-Regular.ttf') format('opentype');
}

@font-face {
  font-family: 'OpenSans';
  src: url('OpenSans-Regular.ttf') format('opentype');
}

.container {
  display: grid;
  grid-template-columns: 200px 1fr 1fr 1fr 1fr 50px 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 50px 100px 60px 130px 550px 100px 550px 100px 550px 100px 550px 100px 550px 100px 550px 50px;
    width: 100%;           /* Ocupa 100% em telas menores que Full HD */
    max-width: 1920px;     /* TRAVA: Não passa de Full HD */
    margin: 0 auto;
}

#menu-lateral,
#logo {
  display: none;
}

.menu {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #457d58;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  font-size: 16px;
  display: flex;
  align-items: center;
  width: 100%;           /* Ocupa 100% em telas menores que Full HD */
    max-width: 1920px;     /* TRAVA: Não passa de Full HD */
    margin: 0 auto;
}

.menu a {
  display: inline-block;
  padding: 17px 20px;
  text-decoration: none;
  color: #ffffff;
  position: relative;
}

.menu a:hover,
.menu a.active {
  padding: 17px 20px;
  text-decoration: none;
}

.menu a.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #ffffff;
}

.logo-dnf {
  margin-right: auto;
}

.imagem-0 {
  height: auto;
}

.banner-soluções {
  grid-column: 1/13;
  grid-row: 2/4;
  background-color: #ffffff;
}

.imagem-1 {
  width: 100%;
  height: 100%;
  opacity: 0.1;
  object-fit: cover;
  display: none;
}



.texto-1 {
  color: #000000;
  grid-column: 2/12;
  grid-row: 2;
  font-size: 36px;
  margin-top: 5%;
  
  
}

.fundo-colmeia{
  grid-column:1/13 ;
  grid-row:1/12 ;
}

.imagem-colmeia{
  width:100% ;
  height: 100% ;
  object-fit: cover;
}

/* agro stat */

.agro-stat {
  grid-row: 5;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-agro-stat-1 {
  grid-column: 2/5;
  grid-row: 5;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-agro-stat-1 p {
  font-size: 35px;
  font-family: Arial, Helvetica, sans-serif;
}

.texto-agro-stat-1 {
  grid-column: 2/6;
  grid-row: 5;
  margin-left: 80px;
  margin-top: 130px;
}

.texto-agro-stat-1 p {
  font-size: 22px;
  text-align: start;

}

.video-agro-stat-1 {
  grid-column: 7/12;
  grid-row: 5;
  margin-top: 6%;
  margin-right: 30%;
}

.video-agro-stat-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}






.ferramentas {
  grid-row: 7;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-ferramentas-1 {
  grid-column: 2/5;
  grid-row: 7;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-ferramentas-1 p {
  font-size: 35px;
  font-family: Arial, Helvetica, sans-serif;
}

.texto-ferramentas-1 {
  grid-column: 2/6;
  grid-row: 7;
  margin-left: 80px;
  margin-top: 120px;

}

.texto-ferramentas-1 p {
  font-size: 22px;
  text-align: start;
}

.video-ferramentas-1 {
  grid-column: 7/12;
  grid-row: 7;
  margin-top: 6%;
  margin-right: 29%;
}

.video-ferramentas-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}

/* potênciais-regionais */

.potênciais-regionais {
  grid-row: 9;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-potênciais-regionais-1 {
  grid-column: 2/6;
  grid-row: 9;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-potênciais-regionais-1 p {
  font-size: 35px;
}

.texto-potênciais-regionais-1 {
  grid-column: 2/6;
  grid-row: 9;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-potênciais-regionais-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-potênciais-regionais-1 {
  grid-column: 7/12;
  grid-row: 9;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-potênciais-regionais-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
  object-fit: cover;
}

/* simule-sua-rede */

.simule-sua-rede {
  grid-row: 11;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-simule-sua-rede-1 {
  grid-column: 2/6;
  grid-row: 11;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-simule-sua-rede-1 p {
  font-size: 35px;
}

.texto-simule-sua-rede-1 {
  grid-column: 2/6;
  grid-row: 11;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-simule-sua-rede-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-simule-sua-rede-1 {
  grid-column: 7/12;
  grid-row: 11;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-simule-sua-rede-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}

/* projeção-de-mercado */

.projeção-de-mercado {
  grid-row: 13;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-projeção-de-mercado-1 {
  grid-column: 2/6;
  grid-row: 13;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-projeção-de-mercado-1 p {
  font-size: 35px;
}

.texto-projeção-de-mercado-1 {
  grid-column: 2/6;
  grid-row: 13;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-projeção-de-mercado-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-projeção-de-mercado-1 {
  grid-column: 7/12;
  grid-row: 13;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-projeção-de-mercado-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}






.frota {
  grid-row: 15;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-frota-1 {
  grid-column: 2/6;
  grid-row: 15;
  margin-left: 80px;
  margin-top: 0px;
}

.titulo-frota-1 p {
  font-size: 35px;
}

.texto-frota-1 {
  grid-column: 2/6;
  grid-row: 15;
  margin-left: 80px;
  margin-top: 100px;

}

.texto-frota-1 p {
  font-size: 22px;
  text-align: start;
}

.imagem-frota-1 {
  grid-column: 7/13;
  grid-row: 15;
  margin-top: 5%;
  height: 80%;
  margin-right: 24%;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
  margin-left: 20px;

}

.imagem-frota-2 {
  grid-column: 7/13;
  grid-row: 15;
  width: 51%;
  height: 70%;
  border-radius: 20px;
  object-fit: cover;
  margin-top: 8%;
  margin-left: 14%;

}



.button {
  grid-column: 2 / 3;
  display: inline-block;
  padding: 15px 30px;
  font-size: 20px;
  color: #ffffff;
  text-align: center;
  background-color: #457d58;
  border: 2px solid #757575;
  border-radius: 30px;
  text-decoration: none;
  cursor: pointer;
  width: 110px;
  height: 30px;
  margin-top: 175%;
  margin-left: 70px;
  transition: background-color 0.3s ease, color 0.3s ease;
}


.button-1 {
  grid-row: 5;
}

.button-2 {
  grid-row: 7;
}

.button-3 {
  grid-row: 9;
}

.button-4 {
  grid-row: 11;
}

.button-5 {
  grid-row: 13;
}



@media screen and (max-width: 1440px){

.container {
  display: grid;
  grid-template-columns: 200px 1fr 1fr 1fr 1fr 50px 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 50px 100px 60px 130px 550px 100px 550px 100px 550px 100px 550px 100px 550px 100px 550px 50px;
}

#menu-lateral,
#logo {
  display: none;
}

.menu {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #457d58;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  font-size: 16px;
  display: flex;
  align-items: center;
}

.menu a {
  display: inline-block;
  padding: 17px 20px;
  text-decoration: none;
  color: #ffffff;
  position: relative;
}

.menu a:hover,
.menu a.active {
  padding: 17px 20px;
  text-decoration: none;
}

.menu a.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #ffffff;
}

.logo-dnf {
  margin-right: auto;
}

.imagem-0 {
  height: auto;
}

.banner-soluções {
  grid-column: 1/13;
  grid-row: 2/4;
  background-color: #ffffff;
}

.imagem-1 {
  width: 100%;
  height: 100%;
  opacity: 0.1;
  object-fit: cover;
  display: none;
}

.titulo-soluçoes {
  color: #000000;
  grid-column: 1;
  grid-row: 2;
  font-size: 55px;
  margin-left: 60%;
}

.texto-1 {
  color: #000000;
  grid-column: 1/9;
  grid-row: 3;
  font-size: 25px;
  margin-top: 1%;
  margin-left: 10%;
}

.fundo-colmeia{
  grid-column:1/13 ;
  grid-row:1/12 ;
}

.imagem-colmeia{
  width:100% ;
  height: 100% ;
  object-fit: cover;
}

/* agro stat */

.agro-stat {
  grid-row: 5;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-agro-stat-1 {
  grid-column: 2/5;
  grid-row: 5;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-agro-stat-1 p {
  font-size: 35px;
  font-family: Arial, Helvetica, sans-serif;
}

.texto-agro-stat-1 {
  grid-column: 2/6;
  grid-row: 5;
  margin-left: 80px;
  margin-top: 130px;
}

.texto-agro-stat-1 p {
  font-size: 22px;
  text-align: start;

}

.video-agro-stat-1 {
  grid-column: 7/12;
  grid-row: 5;
  margin-top: 6%;
  margin-right: 30%;
}

.video-agro-stat-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}






.ferramentas {
  grid-row: 7;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-ferramentas-1 {
  grid-column: 2/5;
  grid-row: 7;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-ferramentas-1 p {
  font-size: 35px;
  font-family: Arial, Helvetica, sans-serif;
}

.texto-ferramentas-1 {
  grid-column: 2/6;
  grid-row: 7;
  margin-left: 80px;
  margin-top: 120px;

}

.texto-ferramentas-1 p {
  font-size: 22px;
  text-align: start;
}

.video-ferramentas-1 {
  grid-column: 7/12;
  grid-row: 7;
  margin-top: 6%;
  margin-right: 29%;
}

.video-ferramentas-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}

/* potênciais-regionais */

.potênciais-regionais {
  grid-row: 9;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-potênciais-regionais-1 {
  grid-column: 2/6;
  grid-row: 9;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-potênciais-regionais-1 p {
  font-size: 35px;
}

.texto-potênciais-regionais-1 {
  grid-column: 2/6;
  grid-row: 9;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-potênciais-regionais-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-potênciais-regionais-1 {
  grid-column: 7/12;
  grid-row: 9;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-potênciais-regionais-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
  object-fit: cover;
}

/* simule-sua-rede */

.simule-sua-rede {
  grid-row: 11;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-simule-sua-rede-1 {
  grid-column: 2/6;
  grid-row: 11;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-simule-sua-rede-1 p {
  font-size: 35px;
}

.texto-simule-sua-rede-1 {
  grid-column: 2/6;
  grid-row: 11;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-simule-sua-rede-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-simule-sua-rede-1 {
  grid-column: 7/12;
  grid-row: 11;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-simule-sua-rede-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}

/* projeção-de-mercado */

.projeção-de-mercado {
  grid-row: 13;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-projeção-de-mercado-1 {
  grid-column: 2/6;
  grid-row: 13;
  margin-left: 80px;
  margin-top: 10px;
}

.titulo-projeção-de-mercado-1 p {
  font-size: 35px;
}

.texto-projeção-de-mercado-1 {
  grid-column: 2/6;
  grid-row: 13;
  margin-left: 80px;
  margin-top: 130px;

}

.texto-projeção-de-mercado-1 p {
  font-size: 22px;

  text-align: start;
}

.imagem-projeção-de-mercado-1 {
  grid-column: 7/12;
  grid-row: 13;
  margin-top: 6%;
  margin-right: 29%;
}

.imagem-projeção-de-mercado-2 {
  width: 130%;
  height: 86%;
  border-radius: 20px;
  border: 2px solid rgba(160, 160, 160, 0.5);
}






.frota {
  grid-row: 15;
  grid-column: 2/12;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
}

.titulo-frota-1 {
  grid-column: 2/6;
  grid-row: 15;
  margin-left: 80px;
  margin-top: 0px;
}

.titulo-frota-1 p {
  font-size: 35px;
}

.texto-frota-1 {
  grid-column: 2/6;
  grid-row: 15;
  margin-left: 80px;
  margin-top: 100px;

}

.texto-frota-1 p {
  font-size: 22px;
  text-align: start;
}

.imagem-frota-1 {
  grid-column: 7/13;
  grid-row: 15;
  margin-top: 5%;
  height: 80%;
  margin-right: 24%;
  border: 2px solid rgba(160, 160, 160, 0.5);
  border-radius: 20px;
  margin-left: 20px;

}

.imagem-frota-2 {
  grid-column: 7/13;
  grid-row: 15;
  width: 51%;
  height: 70%;
  border-radius: 20px;
  object-fit: cover;
  margin-top: 8%;
  margin-left: 14%;

}



.button {
  grid-column: 2 / 3;
  display: inline-block;
  padding: 15px 30px;
  font-size: 20px;
  color: #ffffff;
  text-align: center;
  background-color: #457d58;
  border: 2px solid #757575;
  border-radius: 30px;
  text-decoration: none;
  cursor: pointer;
  width: 110px;
  height: 30px;
  margin-top: 175%;
  margin-left: 70px;
  transition: background-color 0.3s ease, color 0.3s ease;
}


.button-1 {
  grid-row: 5;
}

.button-2 {
  grid-row: 7;
}

.button-3 {
  grid-row: 9;
}

.button-4 {
  grid-row: 11;
}

.button-5 {
  grid-row: 13;
}


}

@media screen and (max-width: 1366px) {

  body {
    overflow-x: hidden;

  }

  .container {
    grid-template-columns: repeat(13, 1fr) 20px;
    /* One column layout */
    grid-template-rows: 50px 80px 80px 80px 400px 100px 400px 100px 400px 100px 400px 100px 400px 100px 400px 50px;
    /* Adjust rows to fit content */
  }


  .menu {
    grid-column: 1/2;
  }


  .logo-dnf {
    margin-right: auto;
  }



  .imagem-0 {
    height: auto;

  }

  .titulo-soluçoes {
    grid-column: 1 / 10;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 35px;
    /* Adjusted font size for smaller screens */
    margin-top: 1%;
    margin-left: 2%;
    color: rgb(0, 0, 0);


  }

  
  .texto-1 {
    grid-column: 1 / 14;
    /* Span all columns */
    grid-row: 3;
    /* Place in the second row */
    font-size: 20px;
    /* Adjusted font size for smaller screens */
    margin-top: 7%;
    color: rgb(0, 0, 0);
    margin-left: 2%;


  }



  .banner-soluções {
    grid-column: 1 / 15;
    grid-row: 2 / 4;


  }

  .imagem-1 {
    width: 100%;
    height: 100%;
    opacity: 0.2;
    object-fit: cover;

  }



  .agro-stat,
  .ferramentas,
  .potênciais-regionais,
  .simule-sua-rede,
  .projeção-de-mercado,
  .frota {

    grid-column: 1 / 13;
    border: 2px solid rgba(160, 160, 160, 0.5);
    border-radius: 20px;
    display: grid;
    /* Use grid for internal layout of each section */
    grid-template-columns: 1fr 1fr;
    /* Two columns for content and media */
    padding: 30px;
    /* Add padding inside each section */
    box-sizing: border-box;
    /* Include padding in width */
    align-items: center;
    /* Vertically center content */
    margin-left: 3%;
    margin-right: 3%;

  }

  .titulo-agro-stat-1,
  .titulo-ferramentas-1,
  .titulo-potênciais-regionais-1,
  .titulo-simule-sua-rede-1,
  .titulo-projeção-de-mercado-1,
  .titulo-frota-1 {
    grid-column: 1 / 7;
    /* First column */

    margin-top: 0;
    margin-left: 10%;
    align-self: start;
    /* Align title to the top */
  }

  .titulo-agro-stat-1 p,
  .titulo-ferramentas-1 p,
  .titulo-potênciais-regionais-1 p,
  .titulo-simule-sua-rede-1 p,
  .titulo-projeção-de-mercado-1 p,
  .titulo-frota-1 p {
    font-size: 30px;
    font-family: Arial, Helvetica, sans-serif;
  }

  .texto-agro-stat-1,
  .texto-ferramentas-1,
  .texto-potênciais-regionais-1,
  .texto-simule-sua-rede-1,
  .texto-projeção-de-mercado-1,
  .texto-frota-1 {
    grid-column: 1 / 7;
    /* First column */
    margin-top: 15%;
    /* Space from title */
    margin-left: 10%;
  }

  .texto-agro-stat-1 p,
  .texto-ferramentas-1 p,
  .texto-potênciais-regionais-1 p,
  .texto-simule-sua-rede-1 p,
  .texto-projeção-de-mercado-1 p,
  .texto-frota-1 p {
    font-size: 16px;
  }

  .video-agro-stat-1,
  .video-ferramentas-1,
  .imagem-potênciais-regionais-1,
  .imagem-simule-sua-rede-1,
  .imagem-projeção-de-mercado-1 {
    grid-column: 8 /12;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
  }

  .video-agro-stat-2,
  .video-ferramentas-2,
  .imagem-potênciais-regionais-2,
  .imagem-simule-sua-rede-2,
  .imagem-projeção-de-mercado-2 {
    width: 120%;
    height: 60%;


    /* Max height to control size */
    border-radius: 20px;
    border: 2px solid rgba(160, 160, 160, 0.5);
    object-fit: cover;
    /* Ensure image/video covers its area */
  }

  .video-agro-stat-1 {
    grid-row: 5;
  }

  .video-agro-stat-2 {
    width: 120%;
    height: 60%;
  }


  .video-ferramentas-1 {
    grid-row: 7;
  }

  .video-ferramentas-2 {
    width: 120%;
    height: 60%;
  }




  .imagem-potênciais-regionais-1 {
    grid-row: 9;
    grid-column: 8/13;
  }

  .imagem-potênciais-regionais-2 {
    width: 90%;
    height: 60%;
    margin-right: 12%;
  }

  .imagem-simule-sua-rede-1 {
    grid-row: 11;
    grid-column: 8/13;
  }

  .imagem-simule-sua-rede-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }

  .imagem-projeção-de-mercado-1 {
    grid-row: 13;
    grid-column: 8/13;
  }

  .imagem-projeção-de-mercado-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }



  .imagem-frota-1 {
    grid-column: 7/13;
    grid-row: 15;
    margin-top: 15%;
    width: 75%;
    height: 60%;
    margin-left: 13%;
  }

  .imagem-frota-2 {
    grid-column: 7/13;
    grid-row: 15;
    width: 55%;
    height: auto;
    border-radius: 20px;
    object-fit: cover;
    margin-top: 18%;
    margin-left: 24%;
  }


  .button {
    grid-column: 1 / 2;
    display: inline-block;
    padding: 15px 30px;
    font-size: 20px;
    color: #457d58;
    text-align: center;
    background-color: #ffffff;
    border: 2px solid #ffffff;
    border-radius: 30px;
    text-decoration: none;
    width: 120px;
    height: 20px;
    margin-top: 170%;
    margin-left: 20%;
  }


  .button-1 {
    grid-row: 5;
  }

  .button-2 {
    grid-row: 7;
  }

  .button-3 {
    grid-row: 9;
  }

  .button-4 {
    grid-row: 11;
  }

  .button-5 {
    grid-row: 13;
  }


}




/* Estilos para telas maiores (desktops) a partir de 1024px de largura */
/* Example for screens smaller than 768px */
@media screen and (max-width: 1200px) {

  body {
    overflow-x: hidden;

  }

  .container {
    grid-template-columns: repeat(13, 1fr) 20px;
    /* One column layout */
    grid-template-rows: 50px 80px 80px 80px 400px 100px 400px 100px 400px 100px 400px 100px 400px 100px 400px 50px;
    /* Adjust rows to fit content */
  }


  .menu {
    grid-column: 1/2;
  }


  .logo-dnf {
    margin-right: auto;
  }



  .imagem-0 {
    height: auto;

  }

  .titulo-soluçoes {
    grid-column: 1 / 10;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 35px;
    /* Adjusted font size for smaller screens */
    margin-top: 1%;
    margin-left: 2%;
    color: rgb(0, 0, 0);


  }

  .texto-1 {
    grid-column: 1 / 14;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 20px;
    /* Adjusted font size for smaller screens */
    margin-top: 7%;
    color: rgb(0, 0, 0);
    margin-left: 2%;


  }



  .banner-soluções {
    grid-column: 1 / 15;
    grid-row: 2 / 4;


  }

  .imagem-1 {
    width: 100%;
    height: 100%;
    opacity: 0.2;
    object-fit: cover;

  }



  .agro-stat,
  .ferramentas,
  .potênciais-regionais,
  .simule-sua-rede,
  .projeção-de-mercado,
  .frota {

    grid-column: 1 / 13;
    border: 2px solid rgba(160, 160, 160, 0.5);
    border-radius: 20px;
    display: grid;
    /* Use grid for internal layout of each section */
    grid-template-columns: 1fr 1fr;
    /* Two columns for content and media */
    padding: 30px;
    /* Add padding inside each section */
    box-sizing: border-box;
    /* Include padding in width */
    align-items: center;
    /* Vertically center content */
    margin-left: 3%;
    margin-right: 3%;

  }

  .titulo-agro-stat-1,
  .titulo-ferramentas-1,
  .titulo-potênciais-regionais-1,
  .titulo-simule-sua-rede-1,
  .titulo-projeção-de-mercado-1,
  .titulo-frota-1 {
    grid-column: 1 / 7;
    /* First column */

    margin-top: 0;
    margin-left: 10%;
    align-self: start;
    /* Align title to the top */
  }

  .titulo-agro-stat-1 p,
  .titulo-ferramentas-1 p,
  .titulo-potênciais-regionais-1 p,
  .titulo-simule-sua-rede-1 p,
  .titulo-projeção-de-mercado-1 p,
  .titulo-frota-1 p {
    font-size: 30px;
    font-family: Arial, Helvetica, sans-serif;
  }

  .texto-agro-stat-1,
  .texto-ferramentas-1,
  .texto-potênciais-regionais-1,
  .texto-simule-sua-rede-1,
  .texto-projeção-de-mercado-1,
  .texto-frota-1 {
    grid-column: 1 / 7;
    /* First column */
    margin-top: 15%;
    /* Space from title */
    margin-left: 10%;
  }

  .texto-agro-stat-1 p,
  .texto-ferramentas-1 p,
  .texto-potênciais-regionais-1 p,
  .texto-simule-sua-rede-1 p,
  .texto-projeção-de-mercado-1 p,
  .texto-frota-1 p {
    font-size: 16px;
  }

  .video-agro-stat-1,
  .video-ferramentas-1,
  .imagem-potênciais-regionais-1,
  .imagem-simule-sua-rede-1,
  .imagem-projeção-de-mercado-1 {
    grid-column: 8 /12;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
  }

  .video-agro-stat-2,
  .video-ferramentas-2,
  .imagem-potênciais-regionais-2,
  .imagem-simule-sua-rede-2,
  .imagem-projeção-de-mercado-2 {
    width: 120%;
    height: 60%;


    /* Max height to control size */
    border-radius: 20px;
    border: 2px solid rgba(160, 160, 160, 0.5);
    object-fit: cover;
    /* Ensure image/video covers its area */
  }

  .video-agro-stat-1 {
    grid-row: 5;
  }

  .video-agro-stat-2 {
    width: 120%;
    height: 60%;
  }


  .video-ferramentas-1 {
    grid-row: 7;
  }

  .video-ferramentas-2 {
    width: 120%;
    height: 60%;
  }




  .imagem-potênciais-regionais-1 {
    grid-row: 9;
    grid-column: 8/13;
  }

  .imagem-potênciais-regionais-2 {
    width: 90%;
    height: 60%;
    margin-right: 12%;
  }

  .imagem-simule-sua-rede-1 {
    grid-row: 11;
    grid-column: 8/13;
  }

  .imagem-simule-sua-rede-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }

  .imagem-projeção-de-mercado-1 {
    grid-row: 13;
    grid-column: 8/13;
  }

  .imagem-projeção-de-mercado-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }



  .imagem-frota-1 {
    grid-column: 7/13;
    grid-row: 15;
    margin-top: 15%;
    width: 75%;
    height: 60%;
    margin-left: 13%;
  }

  .imagem-frota-2 {
    grid-column: 7/13;
    grid-row: 15;
    width: 55%;
    height: auto;
    border-radius: 20px;
    object-fit: cover;
    margin-top: 18%;
    margin-left: 24%;
  }


  .button {
    grid-column: 1 / 2;
    display: inline-block;
    padding: 15px 30px;
    font-size: 20px;
    color: #457d58;
    text-align: center;
    background-color: #ffffff;
    border: 2px solid #ffffff;
    border-radius: 30px;
    text-decoration: none;
    width: 120px;
    height: 20px;
    margin-top: 170%;
    margin-left: 20%;
  }


  .button-1 {
    grid-row: 5;
  }

  .button-2 {
    grid-row: 7;
  }

  .button-3 {
    grid-row: 9;
  }

  .button-4 {
    grid-row: 11;
  }

  .button-5 {
    grid-row: 13;
  }


}




@media screen and (max-width: 1200px) {

  body {
    overflow-x: hidden;

  }

  .container {
    grid-template-columns: repeat(13, 1fr) 20px;
    /* One column layout */
    grid-template-rows: 50px 80px 80px 80px 400px 100px 400px 100px 400px 100px 400px 100px 400px 100px 400px 50px;
    /* Adjust rows to fit content */
  }


  .menu {
    grid-column: 1/2;
  }


  .logo-dnf {
    margin-right: auto;
  }



  .imagem-0 {
    height: auto;

  }

  .titulo-soluçoes {
    grid-column: 1 / 10;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 35px;
    /* Adjusted font size for smaller screens */
    margin-top: 1%;
    margin-left: 2%;
    color: rgb(0, 0, 0);


  }

  .texto-1 {
    grid-column: 1 / 14;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 20px;
    /* Adjusted font size for smaller screens */
    margin-top: 7%;
    color: rgb(0, 0, 0);
    margin-left: 2%;


  }



  .banner-soluções {
    grid-column: 1 / 15;
    grid-row: 2 / 4;


  }

  .imagem-1 {
    width: 100%;
    height: 100%;
    opacity: 0.2;
    object-fit: cover;

  }



  .agro-stat,
  .ferramentas,
  .potênciais-regionais,
  .simule-sua-rede,
  .projeção-de-mercado,
  .frota {

    grid-column: 1 / 13;
    border: 2px solid rgba(160, 160, 160, 0.5);
    border-radius: 20px;
    display: grid;
    /* Use grid for internal layout of each section */
    grid-template-columns: 1fr 1fr;
    /* Two columns for content and media */
    padding: 30px;
    /* Add padding inside each section */
    box-sizing: border-box;
    /* Include padding in width */
    align-items: center;
    /* Vertically center content */
    margin-left: 3%;
    margin-right: 3%;

  }

  .titulo-agro-stat-1,
  .titulo-ferramentas-1,
  .titulo-potênciais-regionais-1,
  .titulo-simule-sua-rede-1,
  .titulo-projeção-de-mercado-1,
  .titulo-frota-1 {
    grid-column: 1 / 7;
    /* First column */

    margin-top: 0;
    margin-left: 10%;
    align-self: start;
    /* Align title to the top */
  }

  .titulo-agro-stat-1 p,
  .titulo-ferramentas-1 p,
  .titulo-potênciais-regionais-1 p,
  .titulo-simule-sua-rede-1 p,
  .titulo-projeção-de-mercado-1 p,
  .titulo-frota-1 p {
    font-size: 30px;
    font-family: Arial, Helvetica, sans-serif;
  }

  .texto-agro-stat-1,
  .texto-ferramentas-1,
  .texto-potênciais-regionais-1,
  .texto-simule-sua-rede-1,
  .texto-projeção-de-mercado-1,
  .texto-frota-1 {
    grid-column: 1 / 7;
    /* First column */
    margin-top: 15%;
    /* Space from title */
    margin-left: 10%;
  }

  .texto-agro-stat-1 p,
  .texto-ferramentas-1 p,
  .texto-potênciais-regionais-1 p,
  .texto-simule-sua-rede-1 p,
  .texto-projeção-de-mercado-1 p,
  .texto-frota-1 p {
    font-size: 16px;
  }

  .video-agro-stat-1,
  .video-ferramentas-1,
  .imagem-potênciais-regionais-1,
  .imagem-simule-sua-rede-1,
  .imagem-projeção-de-mercado-1 {
    grid-column: 8 /12;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
  }

  .video-agro-stat-2,
  .video-ferramentas-2,
  .imagem-potênciais-regionais-2,
  .imagem-simule-sua-rede-2,
  .imagem-projeção-de-mercado-2 {
    width: 120%;
    height: 60%;


    /* Max height to control size */
    border-radius: 20px;
    border: 2px solid rgba(160, 160, 160, 0.5);
    object-fit: cover;
    /* Ensure image/video covers its area */
  }

  .video-agro-stat-1 {
    grid-row: 5;
  }

  .video-agro-stat-2 {
    width: 120%;
    height: 60%;
  }


  .video-ferramentas-1 {
    grid-row: 7;
  }

  .video-ferramentas-2 {
    width: 120%;
    height: 60%;
  }




  .imagem-potênciais-regionais-1 {
    grid-row: 9;
    grid-column: 8/13;
  }

  .imagem-potênciais-regionais-2 {
    width: 90%;
    height: 60%;
    margin-right: 12%;
  }

  .imagem-simule-sua-rede-1 {
    grid-row: 11;
    grid-column: 8/13;
  }

  .imagem-simule-sua-rede-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }

  .imagem-projeção-de-mercado-1 {
    grid-row: 13;
    grid-column: 8/13;
  }

  .imagem-projeção-de-mercado-2 {
    width: 90%;
    height: 60%;
    margin-right: 14%;
  }



  .imagem-frota-1 {
    grid-column: 7/13;
    grid-row: 15;
    margin-top: 15%;
    width: 75%;
    height: 60%;
    margin-left: 13%;
  }

  .imagem-frota-2 {
    grid-column: 7/13;
    grid-row: 15;
    width: 55%;
    height: auto;
    border-radius: 20px;
    object-fit: cover;
    margin-top: 18%;
    margin-left: 24%;
  }


  .button {
    grid-column: 1 / 2;
    display: inline-block;
    padding: 15px 30px;
    font-size: 20px;
    color: #457d58;
    text-align: center;
    background-color: #ffffff;
    border: 2px solid #ffffff;
    border-radius: 30px;
    text-decoration: none;
    width: 120px;
    height: 20px;
    margin-top: 170%;
    margin-left: 20%;
  }


  .button-1 {
    grid-row: 5;
  }

  .button-2 {
    grid-row: 7;
  }

  .button-3 {
    grid-row: 9;
  }

  .button-4 {
    grid-row: 11;
  }

  .button-5 {
    grid-row: 13;
  }


}


/* Ajustes para telas muito pequenas (celulares até 500px) */
@media screen and (max-width: 500px) {

  /* esconder todas as imagens e vídeos */

  [class^="imagem-"],
  [class*=" imagem-"],
  [class^="video-"],
  [class*=" video-"] {
    display: none !important;
  }

  body {
    overflow-x: hidden;

  }

  .container {
    grid-template-columns: repeat(13, 1fr) 20px;
    /* One column layout */
    grid-template-rows: 50px 80px 80px 80px 400px 100px 400px 100px 400px 100px 400px 100px 400px 100px 470px 50px;
    /* Adjust rows to fit content */
  }

  #menu-lateral,
  #logo {
    display: block;
  }

  :root {
    
    --menu-bg-color: #457d58;
    --text-color: #f0f0f0;
    /* Cor clara para ícones e texto */
  }



  /* Cabeçalho Fixo */
  #main-header {
    
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
    background-color: var(--menu-bg-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
    z-index: 1002;
    box-sizing: border-box;
  }

  /* --- Estilização do Logo (Ajustado para IMG) --- */
  #logo img {
    height: 50px;
    /* Define a altura da imagem */
    width: auto;
    /* Mantém a proporção */
    display: block;

  }

  /* --- Ícone Hambúrguer --- */
  #hamburguer-icon {
    position: relative;
    width: 30px;
    height: 25px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .bar {
    width: 100%;
    height: 4px;
    background-color: var(--text-color);
    transition: 0.3s;
    border-radius: 2px;
  }

  /* --- Menu Lateral (A Telinha) --- */
  #menu-lateral {
    
    position: fixed;
    top: 0;
    right: 0;
    width: 250px;
    height: 100%;
    background-color: var(--menu-bg-color);
    padding-top: 60px;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.7);
    z-index: 1000;

    transform: translateX(100%);
    transition: transform 0.4s ease-in-out;
  }

  #menu-lateral ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  /* Estilos dos Links dentro do Menu Lateral */
  #menu-lateral li a {
    display: block;
    padding: 15px 20px;
    text-decoration: none;
    color: var(--text-color);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  }

  #menu-lateral li a:hover {
    background-color: #4b8067;
  }

  /* --- Classes para Abrir/Fechar --- */
  .menu-aberto {
    transform: translateX(0) !important;
  }

  /* --- Animação do Ícone (Transforma em um 'X') --- */
  .hamburguer-aberto #bar1 {
    transform: translateY(10.5px) rotate(45deg);
  }

  .hamburguer-aberto #bar2 {
    opacity: 0;
  }

  .hamburguer-aberto #bar3 {
    transform: translateY(-10.5px) rotate(-45deg);
  }

  .menu {
    display: none;
  }



  .titulo-soluçoes {
    grid-column: 1 / 10;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 35px;
    /* Adjusted font size for smaller screens */
    margin-top: 1%;
    margin-left: 5%;
    color: rgb(0, 0, 0);


  }

  .texto-1 {
    grid-column: 1 / 14;
    /* Span all columns */
    grid-row: 2;
    /* Place in the second row */
    font-size: 20px;
    /* Adjusted font size for smaller screens */
    margin-top: 18%;
    color: rgb(0, 0, 0);
    margin-left: 5%;


  }


  .agro-stat,
  .ferramentas,
  .potênciais-regionais,
  .simule-sua-rede,
  .projeção-de-mercado,
  .frota {

    grid-column: 1 / 13;
    border: 2px solid rgba(160, 160, 160, 0.5);
    border-radius: 20px;
    display: grid;
    /* Use grid for internal layout of each section */
    grid-template-columns: 1fr 1fr;
    /* Two columns for content and media */
    padding: 30px;
    /* Add padding inside each section */
    box-sizing: border-box;
    /* Include padding in width */
    align-items: center;
    /* Vertically center content */
    margin-left: 5%;
   

  }

  .titulo-agro-stat-1,
  .titulo-ferramentas-1,
  .titulo-potênciais-regionais-1,
  .titulo-simule-sua-rede-1,
  .titulo-projeção-de-mercado-1,
  .titulo-frota-1 {
    grid-column: 1 / 11;
    /* First column */

    margin-top: 0;
    margin-left: 10%;
    align-self: start;
    /* Align title to the top */
  }

  .titulo-agro-stat-1 p,
  .titulo-ferramentas-1 p,
  .titulo-potênciais-regionais-1 p,
  .titulo-simule-sua-rede-1 p,
  .titulo-projeção-de-mercado-1 p,
  .titulo-frota-1 p {
    font-size: 25px;
    font-family: Arial, Helvetica, sans-serif;
  }

  .texto-agro-stat-1,
  .texto-ferramentas-1,
  .texto-potênciais-regionais-1,
  .texto-simule-sua-rede-1,
  .texto-projeção-de-mercado-1 {
    grid-column: 1 / 11;
    /* First column */
    margin-top: 14%;
    /* Space from title */
    margin-left: 10%;
  }

  .texto-frota-1 {
    grid-column: 1 / 11;
    /* First column */
    margin-top: 26%;
    /* Space from title */
    margin-left: 9%;
  }

  .texto-agro-stat-1 p,
  .texto-ferramentas-1 p,
  .texto-potênciais-regionais-1 p,
  .texto-simule-sua-rede-1 p,
  .texto-projeção-de-mercado-1 p,
  .texto-frota-1 p {
    font-size: 16px;
    margin-right: auto;
  text-align: justify;
  text-justify: inter-word;
  width: calc(100% - 6%);
  box-sizing: border-box;
  padding: 0.25rem 0;
  line-height: 1.45;
  hyphens: auto;
  word-break: break-word;
  align-self: start;
  }




  .button {
    grid-column: 1 / 2;
    font-size: 20px;
    color: #457d58;
    text-align: center;
    background-color: transparent;
    border: none;
    border-radius: 30px;
    text-decoration: none;
    width: 120px;
    height: 20px;
    margin-top: 280%;
    margin-left: 14%;
    padding: 0;
    cursor: pointer;
  }


  .button-1 {
    grid-row: 5;
  }

  .button-2 {
    grid-row: 7;
  }

  .button-3 {
    grid-row: 9;
  }

  .button-4 {
    grid-row: 11;
  }

  .button-5 {
    grid-row: 13;
  }
}