* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 body {
     font-family: 'Poppins', sans-serif;
     position: relative;

     justify-content: center;
     align-items: center;
     height: 100dvh;
     width: 100%;
     max-width: 430px;
     margin: 0 auto;

 
  background-image: url('../media/Background.png');
    background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
    background-attachment: fixed;
 

 }

 header {
     position: absolute;
     justify-content: center;
     align-items: center;
     width: 100%;

     color: white;
 }

 header img {
     margin-left: 7%;
     margin-top: 25%;
     width: 85%;
     background-size: cover;
     height: auto;
 }

 .Emblema{
    position: absolute;
    top: 0%;
    right: 0%;
      width: 23%;

 }

 header h1 {
     position: absolute;
     font-family: "Montserrat", sans-serif;
     font-size: 0.87rem;
     font-weight: 350;
     width: 100%;
     text-align: center;
     color: rgb(255, 255, 255);
     margin-top: 18%;
     left: 50%;
     transform: translateX(-50%);


 }

 div.socialAccount {
     position: absolute;
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
     height: 15%;
     left: 50%;
     transform: translateX(-50%);
 }

 div.socialAccount a {
     width: 7%;
     height: 100%;
     margin: 7px;
 }

 .linkfacebook {
    width: 100%;
    height: 100%;
     background-image: url('/media/Facebook.png');
          background-size: cover;
     background-repeat: no-repeat;
      background-position: center;


 }

 .linkinstragram {
     background-image: url('/media/Instagram.png');
     background-size: cover;
     background-repeat: no-repeat;
 }

 .linkzap {
     background-image: url('/media/WhatsApp.png');
     background-size: cover;
     background-repeat: no-repeat;
 }

 .containerMain {
     position: absolute;
     top: 38%;
     left: 50%;
 
     transform: translate(-50%, -50%);
     width: 100%;
     height: 15%;


 }

 .containerMain img.Agencia {
     width: 40%;
     margin-top: 5%;
 }

 .containerMain img.Computer {
     position: absolute;
     top: 32%;
     width: 58%;
     height: auto;
 }

 .containerMain img.Shape {
     position: absolute;
     top: 0%;
     left: 80%;
     width: 16%;
     height: auto;
 }


 .areaTextImage {
     position: absolute;
     width: 97%;
     height: 15%;
     top: 68%;
     left: 51%;
     z-index: 2;
    
     transform: translate(-50%, -50%);
     border-radius: 20px;
     background-image: url('/media/Background_text2.png');
     background-repeat: no-repeat;
     background-position: center;
     border-radius: 30px;




         z-index: 1;
 }



 .blur::after {
     content: "";
     position: absolute;
     top: 2%;
     left: 1%;
     right: 2%;
     bottom: 3%;

     box-shadow:
    
         0px 0px 10px 8px #0539e4;
     filter: blur(4);
     border-radius: 20px;
     opacity: 0.6;

     z-index: -1;
 }




 .areaTextImage p {
     position: absolute;
     font-family: Montserrat, sans-serif;
      font-weight: 450;
     font-size: clamp(5px, 2.75vw, 12.5px);
  width: 90%; 
  line-height: 1.0;
      white-space: nowrap;
     color: rgb(255, 255, 255);
    margin-left: 1em;
    text-align: center;


     padding-top: 3.5em;

     z-index: 2;



 }

 .btnConversation {
     position: absolute;
         text-decoration: none;
         text-align: center;
     top: 80%;
     left: 50%;
     width: 75%;
     padding: 4px;
     transform: translate(-50%, -50%);
     background-color: transparent;

     border: solid rgb(255, 91, 20);
     border-width: 2px;
     border-radius: 25px;
     color: white;

     font-size: 90%;
     box-shadow:
         0 0 -10px 1px white,
         0 0 1px -1px white,
         inset 0 0 0px 10px white;
         white-space: nowrap;

 }

 .btnConversation:hover {
     background-color: rgb(255, 91, 20);
     color: white;
     transition: background-color 0.3s;
 }



 .back-ginga {
    position: absolute;
    background-image:url('/media/GINGA-footer.png');

    width: 100%;
    height: 10%;
    bottom: 0;  
  
      background-size: cover;
    z-index: 1;
 }

 .btnZap{
       position: fixed;
    background-image: url("/media/WhatsApp.png");
    width: 12%;
    height: 6%;
    background-size: contain;
    background-repeat: no-repeat;
    bottom: 10%;
    right: 20px;
    z-index: 9999;
 }

 .btnsocial:hover{
    transform: scale(1.1);
    transition: transform 0.3s;
 }

 .secondMain{
    position: relative;
    top: 150vh;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    margin: 0 auto;
    height: 100dvh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;

    overflow: hidden;
 }



.swiper-wrapper {
    display: flex;
    align-items: center;

       
}

.swiper-slide {

    transition: 0.2s; /* Animação suave para as transformações */
 
  opacity: 0.5;         /* Opcional: deixa os do lado mais apagadinhos */
}


.swiper-slide-active {
  opacity: 1;
  z-index: 10;           /* Garante que fique na frente */
}

.card-content {

    position: relative;
    width: 310px; 
       height: 590px;
         background-image: url('../media/backgroundframe.png');
        background-size: 80% 75%;
        background-position: top center;
        background-repeat: no-repeat;
        
    margin: 0 auto;


}


.swiper {

    margin: 0 auto;
    height: 70%;
    max-width: 430px;
    min-width: 430px;
  overflow: visible !important;
}



.info-overlay {
    position: absolute;
    background-image: url('../media/frame.png');
    background-size: cover;
    background-position: center;
     background-repeat: no-repeat;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; 
   padding: 1.3em;
    box-sizing: border-box;
    text-align: center;
    color: white;
}



.info-overlay h2 {
    font-size: 1.4em;
    font-family: 'Poppins', sans-serif;
    align-self: start;
    white-space: nowrap;
   margin-left: 1.0em;
   margin-top: 100px;
}

.info-overlay ul {
    list-style: none;
    background-color: white;
    border: none;
    width: 23em;
    height: 6em;
    padding: 0.6em;
    margin-top: 0.90em;
    margin-left: 0.45em;
    color: black;
    font-size: 0.72em;
    justify-content: start;
    text-align: left;
font-family: 'Poppins', sans-serif;
    font-weight: 500;
    width: 265px;
}

.btn-card {
    position: absolute;
    background: #001540;
    color: white;
    border: none;
    text-decoration: NONE;
    align-self: start;
    padding: 10px 20px;
     bottom: 40px;
    left: 40px;
    border-radius: 20px;
    cursor: pointer;
}

footer{
    position: relative;
    bottom: -100%;
    width: 100%;
    height: 20%;

    background-color: #ff5b14;
    z-index: 1;
    color: white;
    display: block;

}

.leftFooter{
    position: absolute;

    width: 100%;
     font-family: 'Poppins', sans-serif;

    font-size: 0.80em;
    line-height: 1.6;
    padding-top: 1em;
    padding-left: 0.2em;
    font-weight: 350;
}
.rightFooter{
    position: absolute;

    width: 20%;
    top: 50%;
    height: 35%;
     font-family: 'Poppins', sans-serif;
right: 0;
    font-size: 0.83em;
    line-height: 1.6;
    font-weight: 350;
    justify-self: right;
    justify-content: right;
    text-align: center;
}

.rightFooter img{
    align-self: center;
    margin-top: 1px;
      width: 22%;

}
 .btnConversation2 {
     position: absolute;
     text-decoration: none;
     text-align: center;
     top: 193%;
     left: 50%;
     width: 75%;
     padding: 4px;
     transform: translate(-50%, -50%);
     background-color: transparent;

     border: solid rgb(255, 91, 20);
     border-width: 2px;
     border-radius: 25px;
     color: white;

     font-size: 90%;
z-index: 2;
 }

 .btnConversation2:hover {
     background-color: rgb(255, 91, 20);
     color: white;
     transition: background-color 0.3s;
 }


.bottomFooter{
   
    position: absolute;
    font-family: 'Poppins', sans-serif;
    bottom: 0;
    text-align: center;
    justify-self: center;
    width: 100%;
  
   
    font-size: 0.80em;
    line-height: 1.6;
    padding-top: 1em;
    padding-left: 0.2em;
    font-weight: 350;
   
}