/* SEÇÃO 2 */

.secao2 {
  width: 100%;
  padding: 8% 8% 0;
  display: flex; /* Adicionado para o gap e align-items funcionarem */
  align-items: center;
  gap: 4vw;
}

.card2 {
  display: none;
}

.texto_mob {
  display: none;
}

.etapa {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 9;
  gap: 4vw;
}

.etapa img {
  width: 12vw;
}

.etapa .card {
  display: flex;
  flex-direction: column;
  /* Empilha os itens verticalmente */
  align-items: center;
  /* Centraliza os itens horizontalmente */
  text-align: center;
  /* Centraliza o texto */
  position: relative;
  background-color: #91b900;
  width: 50%;
  border-radius: 4vw;
  padding: 1vw 2vw 3vw;
}

/* Configurações das Setas */
.etapa .card .seta1 {
  position: absolute;
  width: 137vw;
  opacity: 0.7;
  right: -30%;
  top: -190%;
}

.etapa .card .seta2 {
  position: absolute;
  width: 17vw;
  opacity: 0.7;
  right: -10%;
  top: -85%;
}

.etapa .card .seta3 {
  position: absolute;
  width: 17vw;
  opacity: 0.7;
  right: -18%;
  top: -90%;
  transform: rotate(-8deg);
}

.etapa .card .seta4 {
  position: absolute;
  width: 20vw;
  opacity: 0.7;
  right: -12%;
  top: -105%;
  transform: rotate(10deg);
}

.etapa .card h2 {
  font-size: 7vw;
}

.etapa .card p {
  font-size: clamp(16px, 1.5vw, 1.5vw);
}

/* FOOTER */

/* MEDIA QUERIES */

@media screen and (max-width: 820px) {
  header .menu_opener {
    display: block;
  }

  header .menu_closer {
    display: none;
  }

  header .icon {
    background-color: transparent;
  }

  header .open {
    display: block;
  }

  .card1 {
    display: none;
  }

  .card2 {
    display: block;
    flex-direction: column;
    align-items: center;
    position: relative;
    border-radius: 4vw;
    padding: 1vw 2vw 3vw;
    margin-bottom: 5vw;
  }

  .etapa {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 9;
    gap: 4vw;
  }

  .etapa .card {
    width: 100%;
    padding: 4vw;
    align-items: center;
  }

  .path_pc {
    display: none;
  }

  .botoes--footer {
    margin: 0px 15px;
  }

  .botoes--footer span {
    position: absolute;
    text-align: center;
    margin-top: -10vw;
    margin-bottom: 10vw;
    font-size: 1.5em;
    margin-left: -20px;
  }

  .p_mob {
    display: flex;
  }

  .texto_mob {
    display: block; /* Alterado para aparecer no mobile */
    font-size: 1em;
  }
}
