/***NUENAS VENCION 1.1*****/
*,
::before,
::after{
    margin: 0;
    box-sizing: border-box;
    /*border:  1px solid #000000; */
}

:root{
    --color-primario: #B9ff66;
    --color-secundario: #191A23;
    --gray-color: #F3F3F3;

    --padding-container: 80px 0,

}

body,
input,
textarea,
button{
    font-family: "Space Grotesk", sans-serif;
}

.container{

     /* width: 90%; */
  /* max-width: 1200px;   poco usado */
  width: min(95%, 1400px); /* moderno*/
    margin: 0 auto;
margin-top: 10px;
    overflow: hidden;
}

/**horo- guiro**/

.nav{

--nav-icon-background: url("/menu-open.svg");
--transform-list-menu: translate(-100%);
background-color: #212121;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;

}

.nav:has(.nav__checkbox:checked){
    --nav-icon-background: url("/menu-close.svg"); 
    --transform-list-menu: translate(0)
    
 }

 .nav__checkbox{
    display: none;
 }

 .nav__label, .nav__logo-link{
    z-index: 100;
    
 }
 .nav__logo{
   width: 100px;
    height: 100px;
    margin-left: 20px;
 }


.nav__label {
    width: 36px;
    height: 36px;
    background-image: var(--nav-icon-background);
   background-size: cover;
   cursor: pointer;
 transition: backgronund-image .4s;
} 



.nav__list{
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    gap: 1rem;
    text-align: center;
    list-style: none;
  /*  background-color: rgb(255, 255, 255);
    background-color: ;*/
    background-color: #212121;
    padding: 0;

    transform: var( --transform-list-menu);
    transition: 5s;
}

.nav__link{
    display:inline-block;
    padding: .8rem .5rem;
    color:#000;
    text-decoration: none;

}

.nav__link--cta{
border: 1px solid #000;
border-radius: 10px;
 padding-left:  1.8rem;
padding-right: 1.8rem;

} 
.nav__link:hover{
  text-decoration: underline;
  
}


/** hero main**/

.hero__main{
    padding: 30px 0;
    display: grid;
    gap: 1.5rem;
}
/*
.hero__title{
    font-size:clamp(2rem, 4vw + 1rem,2.8rem) ;
}

.hero__figure{
    width: min(100%, 300px);
    justify-self: center;
}

.hero__img{
    width: 100%;
}

.hero__paragraph{
    font: 1.2rem;
    line-height: 2;

}
.hero__cta{
    background-color: var(--color-secundario);
    color: white;
    text-decoration: none;
    padding: 1rem 0;
    border-radius: 10px;
    text-align: center;
}

*/
button {
  width: 125px;
  height: 52px;
  cursor: pointer;
  color: #fff;
  font-size: 17px;
  border-radius: 1rem;
  border: none;
  position: relative;
  background: #100720;
  transition: 0.1s;
  
}

button::after {
  content: '';
  width: 100%;
  height: 100%;
  background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(255,94,247,1) 17.8%, rgba(2,245,255,1) 100.2% );
  filter: blur(15px);
  z-index: -1;
  position: absolute;
  left: 0;
  top: 0;
}

button:active {
  transform: scale(0.9) rotate(3deg);
  background: radial-gradient( circle farthest-corner at 10% 20%,  rgba(255,94,247,1) 17.8%, rgba(2,245,255,1) 100.2% );
  transition: 0.5s;
  
}

footer{
     width:100vw;
     display: flex;
     justify-content: center;
     flex-direction: column;
     align-items: center;
     padding: 1rem;
     color: #FFFFFF;
     margin-top: 30px;
     background-color:#212121;
 }

 .caja__redes__sociales{
  width: 95vw;
  display: flex;
  justify-content: space-evenly;
  flex-direction: row;
  flex-wrap: wrap;
 
 margin: 10px;
 }

 
 

 
 

 
 
 
 .h1__pais{
  margin-top: 30%;
  text-align: Center ;
  padding: 0px;
 }
 .xx{
  background-color: #0035FF;
 }
 /*
 .boton__pais{
  padding:auto;
  margin: auto;
  
  margin: 2rem;
  width: 300px;
  height: 52px;
  cursor: pointer;
  color: #fff;
  font-size: 17px;
  border-radius: 1rem;
  border: none;
 
  background: #100720;
  transition: 0.1s;
  
  
 }
*/
 .main__pais{
  margin-top: -29%;
  
}

.ul__pais{
  display: flex;
  justify-content: center;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  padding: 0;
}

.li__pais{
  text-decoration: none;
  list-style: none;
  margin: 1rem;
  width:125px ;
  height:52px ;
 display: flex;
 justify-content: center;
 flex-direction: column;
 align-items:center ;
  border-radius: 10px;
  background-color: rgb(56, 6, 97);
}

.enlace__pais{
  text-decoration: none;
  color: #fff;

}


 h1, H2 {
    text-align: center;
/*   padding-inline: %;*/
   
   margin-top: 10%;
font-size: 40px;

 }

 p{
text-align: center; 
 }

 .publicidad{
    width: 95vw;

    height: 60px;
    display: flex;
    justify-content: center;
    margin-top: 50px;
    margin-bottom: 50px;

 }

 .setrar_texto{
    width: 95vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
padding-top: 5px;
 padding: 10%;
    
    
    
 }

 .contenedor1{
    width: 100vw;
    height: auto;
    background: #6A6A6A;
   /* border: 1px solid #FF6500;*/
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: wrap;
    background: #F8F8F8;
   
 }

 .Ct1{
    width: 300px;
    height: 300px;
  /* border: 1px solid #445A42;*/
 /*  display: flex;
   justify-content: space-around;
   flex-direction: row;
   flex-wrap: wrap;*/
    margin: 10px;
 
    background: #FFFFFF;
 }

 .Fxx1{
  width: 100%;
  height: 100%;
  background: #FFFFFF;
}

 .contenedor2{
    width: 70vw;
   height: auto;
   
 /*  border: 1px solid #AFFF63;*/
   margin: 10px;
   display: flex;
 align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;
  background: #F8F8F8;
 
  margin-left: 10vw;
 }
 .Ct2{
    width: 50%;
    height: 190px;
    margin: 10px;
    background:#FFFFFF;
 /*   display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: column;*/
   
    display: flex;
    justify-content: center;
    align-items: center;
 }

 .cajaTEXTO{
    width: 300px;
    height:150px;
    background: #FFFFFF;
 /*   background: blanchedalmond;*/
    display: flex;
 justify-content: center;
 flex-direction: row;
    margin: 1px;
    align-items: center;
    flex-wrap: wrap;
 }
 .Fxx{
    width: 100%;
    height: 150px;
 }

 .xcajaTEXTO{
    width: 50%;
    height: 100%;
    display: flex;
   /* align-items: align;*/
    flex-direction: row;
    flex-wrap: wrap;
    background: #FFFFFF;
    padding: auto;
    margin: 5px;
    background: #F8F8F8;}

    .caja3{
      width: 95vw;
      height: 450px;
      margin-top: 50px;
      margin-bottom: 50px;
    display: flex;
    justify-content: center;
      
      
      
    }
    
   

     .lin__principale{
    text-decoration: none;
    color: #FFFFFF;
     }

     h3{
      color: #FFFFFF;
      color: #B8B8B8;
       list-style: none;
        text-decoration: none;
   }
   .cajaTEXTO{
    width: 300px;
    height:150px;
    background: #FFFFFF;
 /*   background: blanchedalmond;*/
    display: flex;
 justify-content: center;
 flex-direction: row;
    margin: 1px;
    align-items: center;
    flex-wrap: wrap;
    
    
 }

 #imgPGDR{
  width: 50px;
  height: 100%;
  border-radius: 100%;
  
}
.ul__footer{
 padding: 10px;

}
.li__footer{
list-style: none;
color: #FFFFFF;
text-align: center;


}

.cajaB__footer, .cajaA__footer{
 display: flex;
 justify-content: center;
 flex-direction: column;
 align-items: center;
 flex-wrap: nowrap;
 margin: 10px;
 
 text-align: center;
}

.cajaAA{
 width: 95vw;
 height: 30px;
 display: flex;
 justify-content: center;
 flex-direction: row;
 flex-wrap: nowrap;
 align-items: center;
 
 
 
  ;
}

.mini__imag{
 width: 80px;
 height: 80px;
 
}

.letras__pequena{
 font-size: 10px;
 width: 1rem;
 text-decoration: none;
 font-family: 'Times New Roman', Times, serif;
}

#hr{
 width: 95vw;
 height: 1px;
 margin-top: -15px;
 margin-bottom: 50px;
 background-color:#FF00BD;
 color: #FFFFFF;
}

.contenedor__main{
width: 100%;
height:auto;
display: flex;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
align-content: space-around;
background-color: #818181;
background-color:#F9F9F9;
padding: auto;
margin-top: 10rem;
margin-left: auto;
}

.mini__contenedores{
  width: 15rem;
  height: 25rem;
  margin: 0.5rem;
  flex-basis: auto;
  background-color: #B9ff66;
  background-color: #FFFFFF;
  border-radius: 5px;

}

.mini__imagen{
width: 100%;
height: 60%;
}

.hr__mini{
 background-color:#F9F9F9;
 border-color: #F9F9F9;
 border-color: #FFFFFF00;
}

.mini__titulo{
 height: 15%;
/*  background-color: #FF00BD;*/
  display: flex;
  justify-content: center;
  align-items: center;
  /*width: fit-content;*/
  align-self: center;

}

p1{
/*font-size: clamp(1rem, 35vw, 2rem 2.5rem); */
font-size: clamp(2rem, 5vw, 3rem ,7vw, );
/*color: #2AFF00;*/
margin-left: 0.5rem;
font-family: roboto,sans-serif;
/*font-family: serif;*/
}

.mini__prcio{
 height: 8%;
/* background-color: #585858EB;*/
}

h5{
  font-size: clamp(1rem, 4vw 1rem 2.5rem );
/*font-size: 100%*/
}

.mini__tienda{
  width: 100%;
  height: 10%;
 padding: 0px;
display: flex;
justify-content: space-around;
/*  background-color: darkorange;*/
}

.link__Amini__tienda{
  display: flex;
  width: 30%;
  border-radius: 5%;
/*justify-content: ;
align-content: ;*/
/*background-color: #0035FF;*/

}

.mini__imagenTienda {
  width:100%;
  height: auto;
  margin: 0.5em;
 border:1px solid #CECECE;
 border-radius: 5px;
 padding: 0px;
object-fit: contain;
 
  align-content: space-around;
  
 background-color: #DCDCDC;
}

.codigo{
 color: #D8D8D8;
 text-align: end;
}
  




@media ( width >=300px){
/* hero */
    .hero__main{
      padding: var(--padding-container);
      gap: 1rem;
      align-items: center;
      grid-auto-columns: 50% 40%;
      grid-template-areas:
      "titulo img"
      "parrafo img"
      "link img";

    }
    .hero__title{
        grid-area: titulo;
    }
    .hero__paragraph{
        grid-area: parrafo;
    }
    .hero__cta{
        grid-area: link;
        padding: 1rem 2rem;
        place-self: start;
    }
    .hero__figure{
   grid-area:img ;
    }
  

     .caja__foto_informacion{
 
        width: 95vw;
        height: 400px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
     margin: 0 auto;
     
      
   
     }

     .N1x{
      width:80vw;
      height: 350px;
       }
   

     .contenedor2{
      width: 100vw;
     height: auto;
     
   /*  border: 1px solid #AFFF63;*/
     margin: 10px;
     display: flex;
   align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    background: #F8F8F8;
    
   margin: auto;
   }
   
   
    .h1__pais{
  margin-top: 30%;
  text-align: Center ;
  padding: 0px;
  font-size: 30px;
 }

 .nav__list{
 height: 100vh;
position: fixed;/**🚩🧑‍🔧**/





    }

}

     
    
    
    /*******botones *********************/






@media (width >= 900px){**/
    /**hero main**/
    
.nav{
    --transform-list-menu: translate(0)
}


.nav__label{
    display: none;
}

.nav__list{
    position: sticky;
    grid-auto-flow: column;

    margin-left: 95%;
 
    gap: 1rem;
}


h1{
    text-align: center;
   padding-inline: 20%;
   margin-top: 10%;
   font-size: 40px;
 }

 .caja__foto_informacion{
 
    width: 95vw;
    height: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

 
 }

 .N1x{
  width:350px;
  height: 350px;
   }
 
 .contenedor2{
  width: 33%;
 height: auto;
 
/*  border: 1px solid #AFFF63;*/
 margin: 10px;
 display: flex;
align-items: center;
flex-direction: row;
flex-wrap: nowrap;
background: #F8F8F8;

align-self: center;
margin-left: 33%;
}


.nav__list{
 background-color: #FFFFFF00;
}

.ul__pais{
 height: 100vh;
}


}





















/*PAUSA*/


/*PAUSA*/