.version-container {
  display: flex;
  flex-direction: column;
  height: auto;
  background: 
    linear-gradient(
      to bottom,
      #00091A 0 30%,      /* cor até 60vh */
      transparent 30% 100% /* deixa transparente depois */
    ),
    url('/public/assets/bg-azul.webp'); /* imagem de fundo */
  background-repeat: no-repeat;
  background-size:cover;
  background-position: top;
  padding-top: 2rem;
}

.version-content {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.version-content h6 {
    font-size: 35px;
    font-weight: 500;
    text-align: center;
}

.version-content b {
    font-weight: 700;
    color: #E2B852;
}

.content-version-card {

   height: 400px;
   border: 0.2px solid #cec7c756;
   border-radius: 10px;    
   background: rgba(51, 51, 51, 0.2); /* fundo semitransparente */
   backdrop-filter: blur(10px);        /* aplica blur no que está atrás */
   -webkit-backdrop-filter: blur(10px); /* suporte Safari */

   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;

   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 5px;
   padding: 2rem;
}

.content-version-card p {
    font-size: 23px;
}

.container-text-and-btn {
  display: flex;
  flex-direction: column;
justify-content: space-around;
}

.image-mockup {
  position: relative;   /* garante um contexto para o <img> */
  z-index: 2;
}

.image-mockup img {
  position: absolute;   /* permite sair do fluxo */
  left: -10px;         /* desloca 50px para fora do container */
  top: 0;
  min-width: 750px;
  width: auto;
  height: auto;         /* ajuste conforme necessário */
}

.image-mockup-mobile {
    display: none;
}

/* div de formulario */



@media (max-width: 768px) {
  .content-version-card {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 1.5rem;
  }
  .btn-mobile-version {
    text-align: center;
  }

  .version-content {
    padding-inline: 1rem;
  }

  .version-content h6 {
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    padding-inline: 2rem;
}
  
.content-version-card p {
    font-size: 15px;
}

  .image-mockup {
    display: none;
  }

  .image-mockup-mobile {
    display: block;
  }
  .btn-mobile-version {
    margin-top: 1rem;
  }

}