@charset "UTF-8";
/*!
 */
:root {
    --cl-azul: #0f6fec;
    --cl-gris:#F4F4F7;
    --cl-gris2:#EDF0F2;
    --cl-gris-oscuro:#242424;
    --cl-gris-socuro2:#414141;
    --cl-gris-azul:#777e90;
    --cl-dorado:#f1c27d;
    --cl-doraro2:#F5BE9C;
    --cl-doraro3:#D89C6E;
    --cl-naranja:#FF9100;
    --cl-naranja2:#FFEBDF;
    --cl-blanco:#fff;
    --cl-rojo:#ff2348;
    --cl-rosa:#f586ff;
    --cl-amarillo:#ffb006;
    --cl-verde:#00c921;
    --cl-morado:#7600fd;
    --cl-morado2:#e8efff;
    --cl-negro-azul:#0A162C;
    --cl-negro2:#151412;
}
a{
  text-decoration: none;
}
.color{
  background: var(--cl-negro-azul);
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}

.social-media{
  font-family: 'Social Media';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  }
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }


@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
       local('MaterialIcons-Regular'),
       url(../fonts/MaterialIcons-Regular.woff2) format('woff2'),
       url(../fonts/MaterialIcons-Regular.woff) format('woff'),
       url(../fonts/MaterialIcons-Regular.ttf) format('truetype');
}


@font-face {
  font-family: 'Social Media';
  src: local('Smartphone Color Pro'),
       local('SmartphoneColorPro');
    src: 
          url('../fonts/SmartphoneColorPro.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/SmartphoneColorPro.woff') format('woff'),
         url('../fonts/SmartphoneColorPro.ttf') format('truetype'),
         url('../fonts/SmartphoneColorPro.svg') format('svg');
  font-weight: 200;
  font-style: normal;
  }


body{
  font-family:'Nexa','sans-serif', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
 /* transition:all .5s;*/
 font-weight: 400;
 font-style: normal;


}

@font-face {
	font-family: 'Nexa';
    src: url('../fonts/original_NexaThin.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_NexaThin.woff') format('woff'),
         url('../fonts/original_NexaThin.ttf') format('truetype'),
         url('../fonts/original_NexaThin.svg') format('svg');
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: 'Nexa';
    src: url('../fonts/original_Nexa-Light.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_Nexa-Light.woff') format('woff'),
         url('../fonts/original_Nexa-Light.ttf') format('truetype'),
         url('../fonts/original_Nexa-Light.svg') format('svg');
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: 'Nexa';
    src: url('../fonts/original_NexaRegular.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_NexaRegular.woff') format('woff'),
         url('../fonts/original_NexaRegular.ttf') format('truetype'),
         url('../fonts/original_NexaRegular.svg') format('svg');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'Nexa';
    src: url('../fonts/original_Nexa_Bold.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_Nexa_Bold.woff') format('woff'),
         url('../fonts/original_Nexa_Bold.ttf') format('truetype'),
         url('../fonts/original_Nexa_Bold.svg') format('svg');
	font-weight: 600;
	font-style: normal;
}
@font-face {
	font-family: 'Nexa';
    src: url('../fonts/original_NexaBlack.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_NexaBlack.woff') format('woff'),
         url('../fonts/original_NexaBlack.ttf') format('truetype'),
         url('../fonts/original_NexaBlack.svg') format('svg');
	font-weight: bold;
	font-style: normal;
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 1,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}
.material-symbols-rounded {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}

i.fa-solid{
  font-size: 16px;
}

html, body{
  min-height: 100%;
  height: 100%;
  background:var(--cl-gris2);
  color: var(--cl-negro-azul);
}
main{
  height: 100%;
}


.cont{
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1600px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.navtop{
  display: flex;
  justify-content: space-between;
  padding-top: 10px;
  padding-bottom: 10px;
 
}
.logo-top{
  height: 50px;
  display: block;
}
.logo-top img{
  height: 100%;
  width: auto;
}
.fijo-navtop{
  position: fixed;
  top: 0;
  z-index: 9;
  width: 100%;
  background: var(--cl-gris2);
}
.menu-der{
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.menu-der li{
  display: flex;
}
.menu-der li a{
  text-decoration: none;
  padding: .5rem;
  margin: auto;
  color: var(--cl-gris-socuro);
}

/*  */

.slider {
  
  position: relative;
  width: 100%;
  margin-top: 70px;
  overflow: hidden;
  height: 70%; /* Ajusta la altura según tus necesidades */
}

.slides {
  position: relative;
  width: 100%;
  height: 100%;
}

.slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 1; /* Inicialmente oculto */
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden; /* Para ocultar el caption fuera de la vista */
  border-radius: 1px;
}
.slide figure{
  
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  margin-bottom: 0;
}
.slide figure::before{
  content: '';
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  z-index: 2;
  left: 0;
}
.slide figure img, .slide figure video{
  width: 100%;
  height: 100%;
  object-fit: cover;
   transition: opacity 1s ease-in-out, transform 5s ease-in-out; 
  transform: scale(1); 
  opacity: 0;
  
}

.slide.active  {
  opacity: 1;
  z-index: 2;
}
.slide.active figure img, .slide.active figure video{
  opacity: 1; /* Solo el slide activo es visible */
  transform: scale(1.2); /* Escala final */
  /* animation: zoom 6s linear; */
}
@keyframes zoom {
  0% {
      transform: scale(1); /* Comienza con escala normal */
      opacity: 0;
  }
  20%{
    opacity: 1;
  }
  100% {
      transform: scale(1.2); /* Termina con un zoom del 20% */
  }
}
.caption {
  position: relative;
  margin-bottom: -30px; /* Inicialmente fuera de la vista */
  
  color: white;
  padding: 0;
opacity: 0;
  font-size:3rem;
  text-align: left;
  transition:opacity .5s ease-in-out, bottom 0.5s ease-in-out; /* Animación de slide-up */
  z-index: 4;
}

.slide.active .caption {
opacity: 1;
z-index: 4;
}


.slide figcaption{
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1600px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  height: 60%;
  bottom: -20%;
  opacity: 0;
  transition:opacity 1s ease-in-out, bottom 0.5s ease-in-out; /* Animación de slide-up */
}
.slide.active figcaption{
  bottom: 0;
  opacity: 1;
}





.cont-direction{
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 5;
  height: 100px;
  width: 50px;
  display: flex;
  flex-direction: column;
}
.cont-direction button{
  width: 50px;
  height: 50px;
  display: flex;
  border: none;
  background: none;
}
.cont-direction button i{
  margin: auto;
}
button.prev{
  background: var(--cl-azul);
  color: var(--cl-blanco);
} 
button.next{
  background: var(--cl-gris2);
} 

.full-w{
  width: 100%;
}

.fijocap{
  position: absolute;
 bottom: 0;
 left: 0;
 width: 100%;
 height: 40%;
 z-index: 4;
 background: linear-gradient(to top, #002755 0%, rgba(0, 40, 85, 0) 100%);
}
.cont-fijo{
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 1600px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  display: flex;
  gap: 4rem;
  padding-top: 2rem;
}
.sect-fijo{
  color: #fff;
  display: flex;
  flex-direction: column;
}
.sect-fijo div{
  display: flex;
}
.sect-fijo span{
  width: 100px;
  height: 4px;
  background: var(--cl-azul);
  margin-bottom: 10px;
}
.sect-fijo div strong{
  font-size: 3rem;
  line-height: 1;
}
.sect-fijo div p{
  font-size: 1rem;
  line-height: 1.3;
  margin-bottom: 0;
  padding-left: 1rem;
}
.sect-marca{
  display: flex;
  padding-top: 2rem;
  padding-bottom: 4rem;
  align-items: start;
}
.sect-marca figure{
  width: 50%;
  border-radius: 1rem;
  margin-bottom: 0;
  position: relative;
} 
.sect-marca figure>img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1rem;
}
.sect-marca figcaption{
  width: 50%;
  padding:1rem;
}


.tith2{
  line-height: 1;
  font-size: 4rem;
  font-weight: bold;
  text-transform: capitalize;
}
.rec16-9{
  aspect-ratio: 16/9;
}
.rec1-1{
  aspect-ratio: 1/1;
}
.rec-fijo{
  position: absolute;
  width: 20%;
  aspect-ratio: 1/1;
  bottom: 0%;
  right: 0%;
  transform: translate(20%, 20%);
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(5px);
  border-radius: 1rem;
  padding: 1rem;
}

.rec-fijo2{
  position: absolute;
  width: 20%;
  aspect-ratio: 1/1;
  bottom: 0%;
  left: 0%;
  transform: translate(-20%, 20%);
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border-radius: 1rem;
  padding: 1rem;
}
.rec-fijo2 img, .rec-fijo img{
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.bg-gris{
  background: var(--cl-blanco);
}

.tx-right{
  text-align: right;
}

.btn-descubre{
  font-size: 1rem;
  line-height: 1;
  color: var(--cl-blanco);
  padding:.8rem 1rem;
  text-decoration: none;
  border-radius: 2rem;
  background: var(--cl-azul);
  position: relative;
  z-index: 4;
}
.logo-sect{
  width: 8rem;
  height: 8rem;
  background: var(--cl-blanco);
  border: 1px solid #c0c0c0;
  padding: 1rem;
  border-radius:1rem ;
  margin-left: -4rem;
  z-index: 4;
  position: relative;
  margin-top: -2rem;
}
.logo-sect img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sect-marca figcaption p{
  padding: 1rem;
  columns: 2;
}
.logo-sect2{
  width: 8rem;
  height: 8rem;
  background: var(--cl-blanco);
  border: 1px solid #c0c0c0;
  padding: 1rem;
  border-radius:1rem ;
  margin-right: -4rem;
  z-index: 4;
  position: relative;
  margin-top: -2rem;
  margin-left: auto;
}
.logo-sect2 img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.img-logo-pie{
  height: 50px;
  width: auto;
  display: block;
  margin-bottom: 2rem;
}
.img-logo-pie img{
  width: auto;
  height: 100%;
}

footer{
  background: var(--cl-negro-azul);
  color: var(--cl-blanco);
  padding-top: 3rem;
}
.tit-pie {
  font-size: 16px;
  font-weight: bold;
}
.list-pie {
  list-style: none;
  padding-left: 0;
}
.list-pie li {
  font-size: 14px;
  line-height: 24px;
  color: #fff;
}
.list-pie li a {
  color: #fff !important;
  line-height: 24px;
  display: block;
  
}
.list-pie li a i {
  vertical-align: middle;
  font-size: 24px;
  margin-right: 5px;
}

.pie-small {
  background:#061022;
  text-align: center;
  font-size: 12px;
  padding-top: 10px;
  padding-bottom: 10px;
  color: var(--cl-blanco);
}

.sec-gal{
  display: flex;
  gap: 1rem;
  align-items: start;
} 
.sec-gal figure{
  width: 20%;
  aspect-ratio: 3/4;
  overflow: hidden;
  margin-bottom: 0;
  border-radius: 1rem;
}
.sec-gal figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.sec-gal figcaption{
  width: calc(40% - 4rem);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 1rem;
}
.trj-01{
  background: var(--cl-negro-azul);
  color: var(--cl-blanco);
  border-radius: 1rem;
  padding: 1rem;
  position: relative;
}
.trj-01 strong{
  font-size: 4rem;
}
.trj-01 p{
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 300;
}
.sec-gal figcaption span{
  position: absolute;
  top: 1rem;
  right: 1rem;
  display: flex;
  color: var(--cl-blanco);
}
.trj-02{
  width: 200px;
  aspect-ratio: 9/16;
  background: var(--cl-azul);
}
.cont-trj{
  display: flex;
  gap: 1rem;
}

.trj-03{
  background: var(--cl-blanco);
  padding: 1rem;
  border-radius: 1rem;
  position: relative;
  padding-left: 30%;
}
.trj-03 h3{
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 800;
  z-index: 2;
  position: relative;
}
.trj-03 p{
  margin-bottom: 0;
  font-size: .8rem;
  line-height: 1.2;
  z-index: 2;
  position: relative;
}
.trj-03 img{
  position: absolute;
  height: 100%;
  width: auto;
  top: -10%;
  left: -5%;
  z-index: 1;
}

.sec-nosotros{
  padding-top: 3rem;
  padding-bottom: 3rem;
  background:#002755 ;
  color: var(--cl-blanco);
}

.columnas2 {
  column-count: 2;
  column-fill: 30px;
}
.thin {
  font-weight: 200;
}
.lh50 {
  line-height: 50px;
}
.p-50 {
  font-size: 50px;
}
.txt-verde {
  color: #51c75b;
  font-family: 'Nexa';
}
.txt-azul{
  color: #1080ff;
}
strong {
  font-weight: 700;
}
.bg-mora{
  background: var(--cl-morado2);
}
.img-r{
  display: block;
  margin: auto;
  margin-right: 0;
}

.nubes {
  position: absolute;
  bottom: -1px;
  width: 100%;
}

.txt-right{
  text-align: right;
}
.iconos-unidades {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.iconos-unidades div {
  background-color: #fff;
  border-radius: 1rem;
  box-shadow: 0px 10px 29px 0px rgba(73, 133, 255, 0.11);
  width: 23%;
  margin: 1%;
  padding: 10px;
}
.iconos-unidades div img {
  display: block;
  margin: auto;
}
.iconos-unidades div p {
  text-align: center;
}
.bg-blanco{
  background: #fff;
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.bg-unidades{
  padding-bottom: 2rem;
  padding-top: 2rem;
}

.mapa {
  width: 350px;
  height: 350px;
 
  border-radius: 50%;
  box-shadow: 0 10px 10px -5px rgba(0,0,0,.1) , -10px -10px 0 0 rgba(0, 0, 0, 0.03) inset;
  background: url(../img/mapa-girar.png);
  background-color: var(--cl-blanco);
    background-size: auto;
  background-size: cover;
  -webkit-animation: tierra-girando 10s infinite linear;
  animation: tierra-girando 10s infinite linear;
  margin: auto;
}

@-webkit-keyframes tierra-girando {
  from {
    background-position: left center;
  }
  to {
    background-position: 700px center;
  }
}

@keyframes tierra-girando {
  from {
    background-position: left center;
  }
  to {
    background-position: 700px center;
  }
}
    


.tab-uni {
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 1rem;
}

.tab-uni li {
  background-color: rgb(246, 249, 251);
  box-shadow: 0px 10px 29px 0px rgba(73, 133, 255, 0.2);
  width: 33%;
  border-radius: 6px;
  padding: 1rem;
}
.tab-uni li img {
  max-width: 80%;
  max-height: 60px;
  display: block;
  margin: auto;
}
.tab-uni li p {
  font-size: 2rem;
  text-align: center;
  margin-top: 10px;
  font-weight: bold;
}

.unidades-count{
  display: flex;
  gap: 1rem;
  margin-bottom: 2rem;
}
.unidades-count span{
  font-size: 2rem;
  font-weight: bold;
  line-height: 1;
}
.unidades-count p{
  margin-bottom: 0;
  font-size: 1rem;
  line-height: 1;
}
.navbar-expand-lg .navbar-collapse{
  flex-grow: inherit;
}


@media (max-width:1536px) {
  
}

@media (max-width:1280px) {
   
}

@media (max-width:1024px) {
  .columnas2{
    columns: 1;
  }
  .rec16-9{
    aspect-ratio: 1/1;
  }
  .tith2{
    font-size: 3rem;
  }
  .trj-01 strong{
    font-size: 2rem;

  }
  .trj-01 p{
    font-size: .8rem;
  }
  .sec-gal figcaption span{
    position: relative;
    right: auto;
    
  }
  .trj-03{
    padding-left: 1rem;
  }
  .trj-03 img{
    position: relative;
    width: 50%;
    margin: auto;
    display: block;
    height: auto;
  }
  .sec-gal{
    flex-wrap: wrap;
  }
  .sec-gal figcaption{
    width: 100%;
    flex-direction: row;
    
  }
  .cont-trj{
    width: 50%;
    flex-direction: column;
  }
  .sec-gal figure{
    width: 31%;
  }
  .iconos-unidades div{
    width: 31%;
  }
  .sect-marca{
    flex-wrap: wrap;
  }
  .sect-marca figure, .sect-marca figcaption{
    width: 100%;
  }
  .p-50{
    font-size: 2rem;
  }
  .logo-sect2{
    margin-right: auto;
  }
  .logo-sect{
    margin-left: auto;
  }
  .cont-fijo{
    flex-wrap: wrap;
  }
  .tab-uni li p{
    font-size: 1rem;
  }
  .iconos-unidades div{
    width: 48%;
  }
  .iconos-unidades div p{
    font-size: .8rem;
  }
  .cont-trj{
    width: 100%;
  }
  .sec-gal figcaption{
    flex-wrap: wrap;
  }
  .sec-gal figure{
    width: 30%;
  }
  .sect-marca figcaption p{
    padding: 0;
    columns: 1;
  }
  .tx-right{
    text-align: left;
  }
  .cont-fijo{
    gap: 1rem;
    padding: .5rem;
  }
  .sect-fijo div strong{
    font-size: 2rem;
  }
  .sect-fijo span{
    margin-bottom: 5px;
  }
}


@media (max-width:768px) {

}

@media (max-width:640px) {
   
}