/*
    Theme Name: WeLive LATAM
    Theme URI:
    Author: Leandro Perrone
    Autor URI: leandro_perrone@hotmail.com
    Description: Theme para WeLive LATAM
    Version: 1.0
    License: GNU General Public License v2 or later
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Tags: WeLive LATAM
    Text Domain: welive
*/

:root {
    --Inter : 'Inter';
    --NHaasGroteskDSPro65Md : 'NHaasGroteskDSPro65Md';


    --Black : #0D0D0D;
    --Primary : #A49B8B;
    --PrimaryDark : #726A5A;
    --Light : #F7F7F8;
    --White : #FFFFFF;
}


/* FONDOS */
.fondoBlack { background-color: var(--Black); }
.fondoGrey3 { background-color: var(--Grey3); }


/* Preloader CSS */
.loading {width: 100%;height: 100vh;position: fixed;background-color: var(--PrimaryDark);z-index: 999999;overflow: visible; top:0;}
.loading img {position: absolute;top: 50%;left: 47%;margin: -50px 0 0 -50px;width: 200px;transform-origin: center;  animation: scale 1.5s infinite alternate;}
.loading.fade {z-index:0;animation-name: fade;animation-duration: 0.3s;animation-fill-mode: both;animation-iteration-count: 1;animation-delay: 0.3s;}
@-webkit-keyframes scale {
From {-webkit-transform: scale(.8);}
To {-webkit-transform: scale(1.2);}
}

#exampleModalCenter .modal-dialog {
        max-width: 1000px;
        margin: 1.75rem auto;
}
#exampleModalCenter .modal-content {
    position: relative;
    background: white!important;
    margin: 3% auto;
    padding: 0;
    width: 100%!important;
    max-width: 800px;
    border-radius: 30px;
    height: 87%;
    overflow: hidden;
    border: none;
}
#exampleModalCenter .close {
    position: absolute;
    top: 5vw;
    right: 13vw;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
}



html { /*font-size: 62.5%; overflow-x: hidden!important;*/ }
main { /*font-size: 62.5%; overflow-x: hidden!important;*/ }
body { font-family: var(--Inter); fo  nt-size: 1rem; line-height: 1.375rem; color: var(--Black);  font-optical-sizing: auto; /*overflow-x: hidden!important;*/ }
h1, h2 { font-family: var(--NHaasGroteskDSPro65Md); font-weight: normal; }
h1 { font-size: 4.5rem; line-height: 4.5rem; }
h2 { font-size: 3rem; line-height: 2.5rem; color: var(--Black); }
h2 strong { color: var(--Primary); font-weight: normal; }
h1 span, h2 span { font-family: var(--HelveticaNeueMedium); }
h3 {  }
h4 { font-size: 1rem; color: var(--Primary); font-weight: 400; }
strong {  }

.btn { font-family: var(--Inter); font-size: 1rem; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; border-radius: 40px; transition: .5s all; position: relative; text-align: left; padding-top: 10px; border: 1px solid var(--Black); }
.btn svg { width: 12px; margin-left: 5px; }
a:hover.btn { background-color: var(--PrimaryDark); color: var(--Light); border: 1px solid var(--PrimaryDark); }
a:hover.btn path { stroke: var(--Light)!important; }

.btnMas { font-family: var(--Inter); font-size: 1rem; padding-left: 0px; padding-right: 20px; padding-bottom: 15px;  transition: .5s all; position: relative; text-align: left; padding-top: 25px; color: var(--Light); }
.btnMas svg { width: 20px; margin-left: 15px; transform:rotate(45deg); }
a:hover.btnMas {  }
a:hover.btnMas svg { transform:rotate(0deg); }
.btnWhite { background-color: var(--Light); color: var(--Black); border: none; }
.btnWhiteDos { background-color: rgba(255, 255, 255, .2); color: var(--White); border: none; text-transform: uppercase; font-family: var(--NHaasGroteskDSPro65Md); font-size: 0.625rem; position: absolute; left: 50px; bottom: 40px; padding-left: 20px; padding-right: 20px; padding-bottom: 7px; border-radius: 40px;  padding-top: 7px; letter-spacing: 1px; }

.btnWhiteVideo { background-color: rgba(255, 255, 255, 0); color: var(--White); border: 1px solid var(--White); font-family: var(--NHaasGroteskDSPro65Md); font-size: 1rem; position: absolute; right: 180px; top: 50px; padding-left: 20px; padding-right: 20px; padding-bottom: 7px; border-radius: 30px;  padding-top: 7px;text-decoration: none; text-transform: initial; transition: all .5s; }
.btnWhitePlanta { background-color: rgba(255, 255, 255, 0); color: var(--White); border: 1px solid var(--White); font-family: var(--NHaasGroteskDSPro65Md); font-size: 1rem; position: absolute; right: 50px; top: 50px; padding-left: 20px; padding-right: 20px; padding-bottom: 7px; border-radius: 30px;  padding-top: 7px;text-decoration: none; text-transform: initial; transition: all .5s; }
.btnWhiteTour{ background-color: rgba(255, 255, 255, 0); color: var(--White); border: 1px solid var(--White); font-family: var(--NHaasGroteskDSPro65Md); font-size: 1rem; position: absolute; right: 275px; top: 50px; padding-left: 20px; padding-right: 20px; padding-bottom: 7px; border-radius: 30px;  padding-top: 7px; text-decoration: none; text-transform: initial; transition: all .5s; }
.btnWhiteVideo:hover, .btnWhiteTour:hover, .btnWhitePlanta:hover { background-color: var(--White); color: var(--Black); } 


.clearfix { clear: both; }

.imgContain { width: 100%; overflow: hidden; transition: all .8s; border-radius: 20px; }
.imgContain .imagen { width: 100%; overflow: hidden; transition: all .8s; }
.imgContain .imagen:hover { transform: scale(1.1); }


header {  z-index: 300; padding: 1% 0; transition: .5s all; width: 100vw; height: 100px; background-color: var(--White); top:0; left:0; width: 100%; z-index: 1040 }
.fixed { position: fixed; top:0; left:0; width: 100%; }
header.fixed { padding-top: 1%; padding-bottom: 1%; height: 80px; border-bottom: 1px solid #EEE; }

.home header { background-color: transparent; position: fixed;  }
header .marca { opacity: 1; transition: .5s all; margin-top: 10px; margin-left: 4vw; }
.home header .marca.light { display: block; }
.home header .marca.dark { display: none; }
.home header.fixed .marca.dark { display: block; }
.home header.fixed .marca.light { display: none; }
header .marca.light { display: none; }
.home header.fixed .marca { opacity: 1; transition: .5s all; }
.home header.fixed { background-color: var(--White); }
.home .nav-link.ocultar { display:block; }
.home .nav-link.mostrar { display:none; }
.nav-link.ocultar { display:none; }
.nav-link.mostrar { display:block; }

.menu { background-color: var(--Light); width: 370px; border-radius: 20px; padding: 15px; position: fixed; right: 4vw; top: 5vw; z-index: 3001; display: none; }
.menu a.nav-link { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; color: var(--Black); padding-left: 20px; background-color: transparent; border-radius: 10px; height: 45px; padding-top: 12px; transition: .5s all; }
.menu a.nav-link:hover { background-color: #E6E6E6; border-radius: 10px; }
.menu .redesHeader { margin-top: 30px; margin-bottom: 20px; }
.menu .redesHeader .colm1 { padding-left: 33px; }
.menu .redesHeader .colm2 { padding-left: 28px; }
.menu .redesHeader a:link { color: var(--Black); text-decoration: none; transition: .5s all; line-height: 24px; }
.menu .redesHeader a:visited { color: var(--Black); text-decoration: none; }
.menu .redesHeader a:hover { color: var(--Black); text-decoration: underline; }
.menu .redesHeader .DescMenu { position: relative; left: 20px;
    top: 0;
    border: 1px solid black !important;
    color: black !important;
    margin-bottom: 20px;
}


.openMenu { color: var(--Black)!important; position: fixed; top: 20px; right: 4vw; z-index: 10; border: 1px solid var(--Black)!important; outline: 0; width: 200px!important; border-radius: 40px!important;; text-align: left; padding-left: 20px!important; padding-right: 20px!important; font-size: 1rem;  }
.openMenu:hover { color: var(--White)!important; background-color: var(--Black)!important; }
.DescMenu { color: var(--Black)!important; position: fixed; top: 20px; right: 22vw; z-index: 10; border: 1px solid var(--Black)!important; outline: 0; width: 150px!important;; border-radius: 40px!important; text-align: left; padding-left: 20px!important; padding-right: 20px!important; font-size: 1rem; text-decoration: none; }
.DescMenu:hover { color: var(--White)!important; background-color: var(--Black)!important; }

header.fixed .openMenu { color: var(--Black)!important; border: 1px solid var(--Black)!important; }
header.fixed .openMenu:hover { color: var(--White)!important; background-color: var(--Black)!important; }
header.fixed .DescMenu { color: var(--Black)!important; border: 1px solid var(--Black)!important; }
header.fixed .DescMenu:hover { color: var(--White)!important; background-color: var(--Black)!important; }

.home .openMenu { color: var(--Light)!important; border: 1px solid var(--Light)!important; transition: .5s all; }
.home .openMenu:hover { color: var(--Black)!important; background-color: var(--Light)!important; }
.home .DescMenu { color: var(--Light)!important; border: 1px solid var(--Light)!important; transition: .5s all; }
.home .DescMenu:hover { color: var(--Black)!important; background-color: var(--Light)!important; }
.openMenu svg { position: absolute; right: 20px; top: 11px; transition: .5s all; }
.openMenu:hover svg { transform: rotate(45deg)!important; }
.openMenu path { stroke: black!important; } 
.openMenu:hover path { stroke: white!important; } 
.home .openMenu path { stroke: var(--Light)!important; } 
.home .openMenu:hover path { stroke: black!important; } 
header.fixed .openMenu path { stroke: black!important; } 
header.fixed .openMenu:hover path { stroke: white!important; } 
.home .openMenu.desplegado { color: var(--Black)!important; background-color: var(--Light)!important; }
.home .openMenu.desplegado:visited { color: var(--Black)!important; background-color: var(--Light)!important; }
.home .openMenu.desplegado:hover { color: var(--Black)!important; background-color: var(--Light)!important; }
.openMenu.desplegado { color: var(--White)!important; background-color: var(--Black)!important; }
.openMenu.desplegado:visited { color: var(--White)!important; background-color: var(--Black)!important; }
.openMenu.desplegado:hover { color: var(--White)!important; background-color: var(--Black)!important; }
header.fixed .openMenu.desplegado { color: var(--White)!important; background-color: var(--Black)!important; }
header.fixed .openMenu.desplegado:visited { color: var(--White)!important; background-color: var(--Black)!important; }
header.fixed .openMenu.desplegado:hover { color: var(--White)!important; background-color: var(--Black)!important; }
header.fixed .openMenu.desplegado path { stroke: white!important; } 
header.fixed .openMenu.desplegado:hover path { stroke: white!important; } 
header.fixed .openMenu.desplegado svg { transform: rotate(45deg)!important; }
header.fixed .openMenu.desplegado:hover svg { transform: rotate(45deg)!important; }
.openMenu.desplegado path { stroke: white!important; } 
.openMenu.desplegado:hover path { stroke: white!important; } 
.openMenu.desplegado svg { transform: rotate(45deg)!important; }
.openMenu.desplegado:hover svg { transform: rotate(45deg)!important; }
.home .openMenu.desplegado path { stroke: black!important; } 
.home .openMenu.desplegado:hover path { stroke: black!important; } 
.home .openMenu.desplegado svg { transform: rotate(45deg)!important; }
.home .openMenu.desplegado:hover svg { transform: rotate(45deg)!important; }



.rotate { transform: rotate(90deg)!important; fill: black!important; }
.btn-close.rotate path { stroke: black!important; }
.btn-close { box-sizing: content-box; width: 2em; height: 2em; padding: 0.25em 0.25em; color: white; background: transparent!important; border: 0; border-radius: 0.25rem; opacity: .8; transition: .5s all; border: none; outline: 0; }
button:focus { outline:0!important; border: none; }

.btn-close:focus {
    outline: 0;
    box-shadow: none;
    opacity: 1;
}

/* HERO */
.hero { height: 100vh; color: var(--Grey1); background-color: var(--Black)!important; position: relative; width: 100%; }
.unSlide { width: 100vw; height: 100vh; }
.unSlide img { width: 100vw; height: 100%; object-fit: cover; transition: transform 1s ease; }
.hero h1 { position: absolute; z-index: 1000; top: 9vw; left: 5vw; color: var(--Light); width: 50vw; }
.hero .btn { position: absolute; z-index: 1000; bottom: 5vw; left: 5vw; background-color: var(--Light); color: var(--Black); border: none; }
.hero .bajada { position: absolute; z-index: 1000; font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.5rem; line-height: 1.8rem; color: var(--Light); font-weight: normal; width: 26vw; padding-left: 25px; border-left: 1px solid var(--Primary); right: 5vw; bottom: 5vw; }
.hero .bajada strong { color: var(--Primary); font-weight: normal; }
.hero .bajada p { margin-top: 0; margin-bottom: 0.4rem; }
.heroSlider .slick-current img {
  transform: scale(1.08); /* zoom cuando está activo */
}
.degradeBottom { bottom: 0; left: 0; width: 100%; height: 30%; background: linear-gradient(to top, rgba(0,0,0,0.9), transparent 100%); position: absolute; z-index: 2; }
.degradeTop { top: 0; left: 0; width: 100%; height: 30%; background: linear-gradient(to bottom, rgba(0,0,0,0.9), transparent 100%); position: absolute; z-index: 2; }



/* SOMOS */
.somos { color: var(--PrimaryDark); background-color: var(--Light); }
.somos .texto { padding-top: 8vw; padding-bottom: 9.7vw; padding-right: 7vw; font-family: var(--NHaasGroteskDSPro65Md); font-size: 3.5rem; line-height: 4rem; }
.somos .texto h4 { margin-bottom: 55px; font-family: var(--Inter); }
.somos .img { padding-top: 7.7vw; }
.somos .img1 { height: 40vh; }
.somos .img1 .imgContain { height: 40vh; }
.somos .img1 .imgContain .imagen { height: 40vh; }


/* DESTACADOS */
.destacados { padding-top: 6vw; padding-bottom: 6vw; }
.destacados h2 { font-size: 2rem; }
.destacados .boton { text-align: right; }
.destacadoSlider { margin-top: 3vw; }
.destacadoSlider .unSlide { border-radius: 20px; overflow: hidden; position: relative; }
.destacadoSlider .unSlide .titulo { position: absolute; font-size: 8.75rem; color: var(--Light); font-family: var(--NHaasGroteskDSPro65Md); mix-blend-mode: normal; line-height: 8rem; top: 3vw; left: 4vw; }
.rounded { border-radius: 30px!important; }
.destacadoSlider .unSlide { width: 100vw; height: 90vh; }
.destacadoSlider .unSlide .detalles { position: absolute; color: var(--Light); bottom: 3vw; right: 4vw; display: flex; }
.destacadoSlider .unSlide .detalles .unDetalle { padding-left: 25px; padding-right: 25px; border-right: 1px solid var(--Primary); }
.destacadoSlider .unSlide .detalles .unDetalle:last-child { border-right: none; }
.destacadoSlider .unSlide .detalles .unDetalle .texto { opacity: .5; }
.destacadoSlider .unSlide .detalles .unDetalle h4 { text-transform: uppercase; color: var(--Light); font-size: 0.625rem!important; font-size: var(--NHaasGroteskDSPro65Md); opacity: 1; }
.destacadoSlider .unSlide.light .titulo { color: var(--Black)!important; mix-blend-mode: normal; } 
.destacadoSlider .unSlide.light .detalles { color: var(--Black)!important; } 
.destacadoSlider .unSlide.light .detalles .unDetalle h4 { color: var(--Black)!important; } 
.destacadoSlider .unSlide.light .btnWhiteDos { color: var(--Black)!important; background-color: var(--Light); }



/* CARACTERISTICAS */
.caracteristicas { padding-bottom: 6vw; }
.caracteristicas h4 { margin-bottom: 20px; }
.card .tag { position: absolute; top: 30px; left: 30px; z-index: 4; background-color: var(--Light); padding: 8px 20px; border-radius: 20px; font-size: 0.875rem; margin-right: 20px; }
.card .tag img { width: 15px; height: auto; object-fit: none; display: inline-block; position: relative; margin-right: 10px}

* {
    /*box-sizing: border-box;*/
  }

.card {
  position: relative; transition: .5s all;
  width: 300px;
  max-width: 95%;
  height: 85vh;
  border-radius: 20px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.3s ease;
}
.carrouselDos .card { height: 63vh; }

.card img {
  position: absolute; top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.4s ease, transform 0.4s ease;
}

.overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: linear-gradient(to top, rgba(0,0,0,0.9), transparent 100%);
  overflow: hidden;
}

.overlay-inner {
  padding: 10px 40% 30px 30px; transition: .5s all;
  max-height: 15em; /* altura inicial para 3 líneas */
  overflow: hidden;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1), max-height 1s ease;
  transform: translateY(0);
}
.carrouselDos .overlay-inner { padding: 10px 50px 30px 30px; }

.overlay-inner h3 {
  margin: 0 0 10px 0; font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.5rem; line-height: 1.75rem;
  color: var(--Light);
}
.carrouselDos  h3 { position: absolute; top: 30px; left: 30px; font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.5rem; line-height: 1.75rem;
  color: var(--Light); }

.overlay-inner p {
  margin: 0;
  color: var(--Light);
  display: -webkit-box;
  -webkit-line-clamp: 3; /* mostrar solo 3 líneas inicialmente */
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: all 0.5s ease;
}
.carrouselDos .overlay-inner p { -webkit-line-clamp: 2; }

/* Hover / Active */
.card:hover img,
.card.active img {
  filter: brightness(50%);
  transform: scale(1.05);
}

.card:hover,
.card.active {
  /*transform: translateY(-5px);*/
}

.card:hover svg { transform:rotate(0deg); transition: .5s all; }
.card svg { transition: .5s all; }

.card:hover .overlay-inner,
.card.active .overlay-inner {
  transform: translateY(-5px); transition: .5s all;
  max-height: 100%;
}

.card:hover .overlay-inner p,
.card.active .overlay-inner p {
  -webkit-line-clamp: unset; /* quitar limitación de 3 líneas */
}

/* Responsive */
@media (max-width: 768px) {
 
  .overlay-inner { padding: 30px; max-height: 15em; }
  .overlay-inner h3 {  }
}

@media (max-width: 480px) {
  .card { height: 300px; }
  .overlay-inner { padding: 30px; max-height: 14.6em; }
  .overlay-inner h3 { font-size: 1.1em; }
}


/* SERVICIOS */
.servicios { background: url(img/fondo_servicios.jpg) bottom center no-repeat #060f1b; background-size: cover; padding-top: 6vw; padding-bottom: 20vw; color: var(--Primary); }
.servicios h2 { color: var(--Light); }
.servicios h4 { margin-bottom: 20px; }
.servicios .texto { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; line-height: 2rem; padding-left: 5vw; padding-top: 2.5vw; }

/* --- Ajustables --- */
:root { 
  --timeline-padding: 80px; /* espacio arriba y abajo de la línea */
  --center-width: 80px;     /* ancho columna central */
}

.timeline {
  position: relative;
  width: 95%;
  margin: 40px auto;
  padding: var(--timeline-padding) 0;
}

.timeline-line {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 1px;
  height: 0;
  background: #A49B8B;
  background: linear-gradient(180deg,rgba(164, 155, 139, 0.3) 0%, rgba(164, 155, 139, 1) 15%, rgba(164, 155, 139, 1) 85%, rgba(164, 155, 139, 0.3) 100%);
  border-radius: 2px;
  transition: height 0.35s cubic-bezier(.2,.9,.2,1);
  z-index: 0;
}

/* Cada paso como flex para centrar verticalmente contenido */
.timeline-item {
  display: flex;
  justify-content: space-between;
  align-items: center; /* centra verticalmente número, imagen y texto */
  margin: 120px 0;
  opacity: 0;
  transform: translateY(20px);
  transition: transform 0.6s ease, opacity 0.6s ease;
  position: relative;
  z-index: 1;
}

.timeline-item .timeline-content p {  }
.timeline-item .timeline-content h3 { font-size: 1.75rem; font-family: var(--NHaasGroteskDSPro65Md); color: var(--Light); text-transform: inherit; letter-spacing: 0; }

.timeline-item.show { opacity:1; transform:translateY(0); }

/* Columnas: imagen, número, contenido */
.timeline-img, .timeline-content { width: 40%; }
.timeline-center { width: var(--center-width); display:flex; align-items:center; justify-content:center; }

/* Número centrado */
.timeline-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #162233;
  border: 1px solid var(--Primary);
  color: var(--Light);
  font-weight: 400;
  font-size: 1rem;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

/* Alternancia horizontal usando order */
.timeline-item:nth-of-type(odd) .timeline-img { order: 0; }
.timeline-item:nth-of-type(odd) .timeline-center { order: 1; }
.timeline-item:nth-of-type(odd) .timeline-content { order: 2; text-align: left; padding-right: 11%; }

.timeline-item:nth-of-type(even) .timeline-img { order: 2; }
.timeline-item:nth-of-type(even) .timeline-center { order: 1; }
.timeline-item:nth-of-type(even) .timeline-content { order: 0; text-align: left; padding-left: 11%; }

.timeline-img img { width: 100%; display:block; border-radius:10px; }
.timeline-content a.btnWhiteDos:link { background-color: transparent; border: 1px solid var(--Light); font-family: var(--Inter); font-size: 1rem; text-transform: initial; text-decoration: none; left: 0; bottom: 0; position: relative; color: var(--Light); transition: all .5s }
.timeline-content a.btnWhiteDos:visited { background-color: transparent; border: 1px solid var(--Light); color: var(--Light); }
.timeline-content a.btnWhiteDos:hover { background-color: var(--Light); border: 1px solid var(--Light); color: var(--Primary); }

/* Responsive mobile */
@media (max-width: 768px) {
  :root { --center-width: 56px; }
  .timeline { width: 95%; padding-left: 60px; padding-right: 20px; }
  .timeline-item { flex-direction: column; align-items: flex-start; margin: 80px 0; }
  .timeline-center { width: auto; order: 0; margin-left: -50px; }
  .timeline-img, .timeline-content { width: 100%; order: 1; }
  .timeline-item:nth-of-type(even) .timeline-img,
  .timeline-item:nth-of-type(even) .timeline-content { order: 1; text-align: left; padding-left: 0!important }
  .timeline-line { left:28px; transform:none; }
}


/* COMPROMISO */
.compromiso { padding-bottom: 6vw; padding-top: 6vw; }
.compromiso h4 { margin-bottom: 20px; }
.compromiso .texto { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; line-height: 2rem; padding-top: 5.5vw; color: var(--Primary); }
.compromiso .boton { text-align: right; }
.compromiso .leyenda { padding-right: 10vw; }


/* HOGAR */
.hogar { color: var(--Primary); background-color: var(--Light); padding-bottom: 6vw; padding-top: 6vw; }
.hogar .img1 { height: 35vh; }
.hogar .img1 .imgContain { height: 35vh; }
.hogar .img1 .imgContain .imagen { height: 35vh; }
.hogar .img2 { height: 35vh; position: relative; }
.hogar .img2 .imgContain { height: 35vh; }
.hogar .img2 .imgContain .imagen { height: 35vh; }
.hogar .img3 { height: 35vh; }
.hogar .img3 .imgContain { height: 35vh; }
.hogar .img3 .imgContain .imagen { height: 35vh; }
.marcaFlotante { position: absolute; top: 60%;left: 44%;margin: -50px 0 0 -50px;width: 200px;transform-origin: center; z-index: 10 }
.hogar .texto { font-family: var(--NHaasGroteskDSPro65Md); font-size: 3rem; line-height: 3rem; text-align: center; padding: 3vw 10vw 3vw 10vw; }


/* OTROS */
.otros { padding-bottom: 6vw; padding-top: 6vw; }
.otros h4 { margin-bottom: 20px; }
.otros .texto { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; line-height: 2rem; padding-top: 3vw; color: var(--Primary); }
.tab-pane .texto { border-radius: 20px; font-size: 1rem; font-family: var(--Inter); padding: 30px; color: var(--Black); line-height: 1.3rem; height: 70vh; }
.tab-pane .texto h2 { font-size: 1.75rem; }
.tab-pane .imagen { width: 100%; height: 70vh; border-radius: 20px; position: relative; }
.tab-pane .imagen .btn { position: absolute; bottom: 30px; right: 30px; background-color: var(--Light); border: none; }
.tab-pane .imagen .btn:hover { background-color: var(--PrimaryDark); border: none; }
.otros .nav .nav-item button { font-family: var(--Inter); font-size: 1rem; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; border-radius: 40px; transition: .5s all; position: relative; text-align: left; padding-top: 10px; border: 1px solid var(--Black); color: var(--Black); margin-right: 20px; }
.otros .nav .nav-item button:hover {  background-color: var(--Primary); border: 1px solid var(--Primary); }
.otros .nav .nav-item button.active { background-color: var(--Black); color: var(--White)!important; }


/* VIDEO */
.video { padding-bottom: 6vw; padding-top: 6vw; }
.video .rounded { border-radius: 30px!important; }
.video .imgVideo { position: relative; -webkit-display: flex; display: flex; }
.video .btn { position: absolute; background-color: var(--White); border: none; margin-top: 25%;
    margin-left: 35%; }
.video .texto1 { font-family: var(--NHaasGroteskDSPro65Md); font-size: 3rem; align-self: anchor-center; align-self: anchor-center; }
.video .texto2 { font-family: var(--NHaasGroteskDSPro65Md); font-size: 3rem; align-self: anchor-center; color: var(--Primary); }
 


/* FAQS */
.faqs { padding-bottom: 6vw; padding-top: 6vw; }
.faqs h4 { margin-bottom: 20px; }
.faqs .nav { width: 40%; }
.faqs .tab-content { width: 60%; }
.faqs .nav .nav-item button { color: var(--Black) !important; opacity: .4; background: transparent; text-align: left; }
.faqs .nav .nav-item button.active { color: var(--Black) !important; text-decoration: underline; opacity: 1; }
.faqs .nav .nav-item button.active::after {
  content: "";
  height: 100%;
  position: absolute;
  right: -1px;
  top: 0;
  border-radius: 5px 0 0 5px;
}

.accordion { width:100%; border: none; }
.accordion-item { border-bottom: none; border: none; }
.accordion-header {
  width:100%; background: transparent; border:none; outline:none; font-family: var(--NHaasGroteskDSPro65Md);
  cursor:pointer; padding:15px; font-size: 1.25rem; text-align: left; line-height: 1.5rem; border-bottom: 1px solid rgba(0,0,0,0.1);
  display:flex; justify-content:space-between; align-items:center;
}
.accordion-header span.text { width: 75%; color: var(--Black)!important; }
.accordion-header:hover { background: none; }
.accordion-icon { transition:transform 0.3s ease; font-size:20px; }
.accordion-header.active .accordion-icon { transform:rotate(45deg); }
.accordion-content {
  max-height: 0; width: 80%;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.3s ease;
  padding: 0 15px;
}

.accordion-content.open {
  padding: 15px;
}


/* GAL */
.galeria { height: 45vw; border-radius: 30px; }
.unaImagen { height: 45vw; border-radius: 30px; }
.slick-slider .slick-track, .slick-slider .slick-list {
    border-radius: 30px;
}
.unaImagen .degrade { background: linear-gradient(to top, rgba(0,0,0,0.4), transparent 100%); position: absolute; width: 100%; bottom: 0; left: 0; height: 200px; border-radius: 0 0 30px 30px; }
.unaImagen .texto { position: absolute; bottom: 40px; left: 40px; color: var(--White); z-index: 2; }
.unaImagen .texto .nombre { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.625rem }
.unaImagen .texto .ubicacion { font-family: var(--NHaasGroteskDSPro65Md); font-size: 0.625rem; letter-spacing: 2px; text-transform: uppercase; opacity: .7; }
.unaImagen img { border-radius: 30px; object-fit: cover; }




/* NOSOTROS */
.tituloSeccion { padding-top: 3vw; padding-bottom: 1.8vw; }
.tituloSeccion h1 { font-size: 3.375rem; }
.tituloSeccion h1 strong { font-weight: normal; color: var(--Primary); }
.heroNosotros { height: 43vw; position: relative; }
.heroNosotros .btn { position: absolute; bottom: 5vw; left: 5vw; }
.textoHero { padding-top: 7vw; padding-bottom: 17vw; font-size: 3rem; font-family: var(--NHaasGroteskDSPro65Md); color: #726A5A; line-height: 3.5rem; padding-right: 25vw; padding-left: 5vw; background-color: var(--Light); }
.equipo { margin-top: -5vw; }
.unEquipo .datos { margin-top: 40px; padding-right: 30%; }
.unEquipo h3 { font-size: 1.5rem; font-family: var(--NHaasGroteskDSPro65Md); line-height: 1rem }
.unEquipo h4 { font-size: 1.5rem; color: var(--Primary); font-family: var(--NHaasGroteskDSPro65Md); }
.unEquipo .imgContain { height: 70vh; }
.unEquipo .imgContain .imagen { height: 70vh; }
.unEquipo .btnBio a:link { color: var(--Black); text-decoration: none; transition: .5s all; margin-top: 20px; }
.unEquipo .btnBio a:visited { color: var(--Black); text-decoration: none; margin-top: 20px; }
.unEquipo .btnBio a:hover { opacity: .7; }
.global { padding-top: 6.25vw; font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; line-height: 2rem; }
.global .imgContain { height: 80vh; }
.global .imgContain .imagen { height: 80vh; }
.global h2 { font-size: 3rem; color: var(--Primary); margin-bottom: 50px; }
.global .globalTextos { padding: 12vw 2vw 0 6vw; }
.global .globalTextosDos { padding: 10vw 6vw 0 2vw; position: relative; }
.global .segundo { margin-top: 6vw; }
.global .globalTextosDos .btn { position: absolute; bottom: 2vw; }
.videoN .btn { position: absolute; background-color: var(--White); border: none; margin-top: 25%;
    margin-left: 44%; }


/* PROYECTOS */
.galProyectos .card {
  position: relative; transition: .5s all;
  width: 100%; max-width: 100%;
  height: 65vh;
  border-radius: 0px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.3s ease;
}
.galProyectos .card img {
  position: absolute; top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: filter 0.4s ease, transform 0.4s ease;
  filter: brightness(70%);
}
.galProyectos .card.light img {
  filter: brightness(100%);
  filter: contrast(69%) saturate(100%);
}
/* Hover / Active */
.galProyectos .card:hover img,
.galProyectos .card.active img {
  filter: brightness(50%);
  transform: scale(1.05);
}
.galProyectos .card h3 { position: absolute; top: 50px; left: 50px; font-family: var(--NHaasGroteskDSPro65Md); font-size: 2rem; color: var(--Light); line-height: 2rem; }
.galProyectos .detalles { position: absolute; color: var(--Light); bottom: 3vw; right: 4vw; display: flex; }
.galProyectos .detalles .unDetalle { margin-left: 30px; }
.galProyectos .detalles .unDetalle .texto { opacity: 1!important; }
.galProyectos .detalles .unDetalle h4 { text-transform: uppercase; font-size: 0.625rem!important; font-size: var(--NHaasGroteskDSPro65Md); opacity: 1; color: var(--Light); }
.galProyectos .card.light h3 { color: var(--Black)!important; } 
.galProyectos .card.light .detalles { color: var(--Black)!important; } 
.galProyectos .card.light .detalles .unDetalle h4 { color: var(--Black)!important; } 
.galProyectos .card.light .btnWhiteDos { color: var(--Black)!important; background-color: var(--Light); } 


.financia { background: rgba(164, 155, 139, 3); background: linear-gradient(90deg,rgba(164, 155, 139, 1) 0%, rgba(192, 186, 175, 1) 100%); text-align: center; color: var(--Light); padding: 30px 0; font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.2rem; }
.financia img { margin-left: 20px; }
footer { color: var(--White); padding-top: 6vw; padding-bottom: 6vw; }
footer h2 { color: var(--White); font-size: 3rem; }
footer h4 { color: var(--White); font-size: 1.125rem; }
footer .menuFooter a:link { color: var(--White); font-size: 1.125rem; text-decoration: none; transition: .5s all; display: block; line-height: 2rem; }
footer .menuFooter a:visited { color: var(--White); font-size: 1.125rem; text-decoration: none; }
footer .menuFooter a:hover { text-decoration: underline; opacity: .7; }
footer .contact { position: relative; }
footer .redes { position: absolute; bottom: 0; width: 80%; }
footer a:link { color: var(--Primary); font-size: 1.125rem; text-decoration: none; transition: .5s all; line-height: 2rem; }
footer a:visited { color: var(--Primary); font-size: 1.125rem; text-decoration: none; }
footer a:hover { text-decoration: underline; opacity: .7; }
footer .legales { color: var(--White); opacity: .5; font-size: 0.75rem; } 
footer .text-end img { margin-left: 10px; }
footer .redes { display: flex; }
footer .redesMob { display: none; }



.wpcf7-form { width: 100%; margin: 0 auto; margin-top: 0px; margin-bottom: 30px; transition: .5s all; background-color: var(--Light); border-radius: 20px; padding: 30px; }
.wpcf7-form input { width: 100%; border: none; border-bottom: 1px solid var(--Black); padding-bottom: 8px; background: transparent!important; color: var(--Black); outline: none; -webkit-border-radius: none!important; margin-bottom: 25px; opacity: 0.5; transition: .5s all; }
.wpcf7-form input:focus { opacity: 1; }
.wpcf7-form textarea:focus { opacity: 1; }
.wpcf7-form textarea { width: 100%; border: none; border-bottom: 1px solid var(--Black); padding-bottom: 8px; background: transparent!important; font-weight: 500; color: var(--Black); outline: none; -webkit-border-radius: none!important; height: 80px; opacity: 0.5; transition: .5s all; }
input[type="submit"] { font-family: var(--Inter); font-size: 1rem; width: 115px; padding: 13px 20px; border-radius: 30px; transition: .5s all; margin-top: 3%; position: relative; text-align: left; opacity: 1; border: 1px solid var(--Black); background: url(img/arrow_send.svg) 81% center no-repeat!important; }
input[type="submit"]:hover { transition: .5s all; }
label { color: var(--Black); font-size: 1rem; width: 100%; }

::placeholder { color: var(--Black); font-size: 1rem; opacity: .4; }
select { width: 100%; border: none; border-bottom: 1px solid var(--Black); padding-bottom: 8px; background: transparent!important; color: var(--Black); outline: none; -webkit-border-radius: none!important; margin-bottom: 15px; opacity: 1; transition: .5s all; padding-top: 5px; -webkit-appearance: none;
          -moz-appearance: none;
          appearance: none; }
span.wpcf7-form-control-wrap { display: block; width: 100%!important; }

.wpcf7-list-item { margin-top: 20px!important; margin-left: 0!important; }

.navCarrusel li { list-style: none; text-transform: uppercase; font-family: var(--HelveticaNeueMedium); font-size: 0.75rem; width: 50%; float: left; }
.carrousel .slick-slide, .carrouselDos .slick-slide { margin: 0 24px; }
.slick-dots {
    position: absolute;
    bottom: 50%;
    display: table-footer-group;
    width: 30px;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    right: 4vw;
}
.slick-dots li.slick-active button:before {
    opacity: .75;
    color: white;
}
.slick-dots li button:before {
    opacity: .25;
    color: white;
}
.navDestacado { position: relative; top: 50%; z-index: 2; }
.navDestacado li { list-style: none; }
.navDestacado .prevD { left: 2%; position: absolute; transition: .5s all; }
.navDestacado .nextD { right: 2%; position: absolute; transition: .5s all; }
.navDestacado .prevD:hover circle { fill: var(--PrimaryDark); transition: .5s all; }
.navDestacado .prevD:hover path { stroke: var(--Light); transition: .5s all; }
.navDestacado .nextD:hover circle { fill: var(--PrimaryDark); transition: .5s all; }
.navDestacado .nextD:hover path { stroke: var(--Light); transition: .5s all; }
.navCaracteristica { position: relative; top: 50%; z-index: 2; }
.navCaracteristica li { list-style: none; }
.navCaracteristica .prevC { left: -1%; position: absolute; transition: .5s all; }
.navCaracteristica .nextC { right: -1%; position: absolute; transition: .5s all; }
.navOtros { position: relative; top: 50%; z-index: 2; }
.navOtros li { list-style: none; }
.navOtros .prevO { left: -1%; position: absolute; transition: .5s all; }
.navOtros .nextO { right: -1%; position: absolute; transition: .5s all; }
.navGal { position: relative; top: 50%; z-index: 2; }
.navGal li { list-style: none; }
.navGal .prevG { left: 2%; position: absolute; transition: .5s all; }
.navGal .nextG { right: 2%; position: absolute; transition: .5s all; }
.navGal .prevG:hover circle { fill: var(--Light); transition: .5s all; }
.navGal .prevG:hover path { stroke: var(--PrimaryDark); transition: .5s all; }
.navGal .nextG:hover circle { fill: var(--Light); transition: .5s all; }
.navGal .nextG:hover path { stroke: var(--PrimaryDark); transition: .5s all; }
.navGalDos { position: relative; top: 50%; z-index: 2; }
.navGalDos li { list-style: none; }
.navGalDos .prevGa { left: 2%; position: absolute; transition: .5s all; }
.navGalDos .nextGa { right: 2%; position: absolute; transition: .5s all; }
.navGalDos .prevGa:hover circle { fill: var(--PrimaryDark); transition: .5s all; }
.navGalDos .prevGa:hover path { stroke: var(--Light); transition: .5s all; }
.navGalDos .nextGa:hover circle { fill: var(--PrimaryDark); transition: .5s all; }
.navGalDos .nextGa:hover path { stroke: var(--Light); transition: .5s all; }


@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    html { font-size: 100%; }
}

/* 1.25 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.25), 
(min-resolution: 120dpi){ 
    /*html { font-size: 52%; }*/
}

/* 1.3 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.3), 
(min-resolution: 124.8dpi){ 
    /*html { font-size: 52%; }*/
}

/* 1.5 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.5), 
(min-resolution: 144dpi){ 
    /*html { font-size: 50%; }*/
    
}


/* AJUSTE TIPO */
@media only screen and (min-width: 1920px) {
    html { font-size: 100%; }
} 
@media only screen and (max-width: 1368px) {
    html { font-size: 85%; }
}
@media only screen and (max-width: 1200px) {
    html { font-size: 82.25%; }
}
@media only screen and (max-width: 1024px) {
    html { font-size: 85%; }
} 
@media only screen and (max-width: 900px) {
    html { font-size: 85%; }
}
@media only screen and (max-width: 768px) {
    html { font-size: 85%; }
}
@media only screen and (max-width: 600px) {
    html { font-size: 78.5%; }
}


/* LAPTOP */
@media only screen and (min-width: 1900px) {
  .hero h1 {
    position: absolute;
    z-index: 1000;
    top: 9vw;
    left: 5vw;
    width: 40vw;
  }
  .DescMenu {
    color: var(--Black) !important;
    position: fixed;
    top: 20px;
    right: 18vw;
    z-index: 10;
  }
  .menu {
    top: 4vw;
  }
  .hero .bajada {
    width: 18vw;
  }
  .somos .texto {
    padding-top: 11vw;
    padding-bottom: 14.7vw;
    padding-right: 5vw;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 3.5rem;
    line-height: 4rem;
  }
  .somos .img1 { height: 30vh; }
  .somos .img1 .imgContain { height: 30vh; }
  .somos .img1 .imgContain .imagen { height: 30vh; }
  .somos .img {
    padding-top: 12.7vw;
  }
  .destacadoSlider .unSlide {
    width: 100vw;
    height: 70vh;
  }
  .card {
    height: 70vh;
  }
  .carrouselDos .card {
    height: 50vh;
  }
  .tab-pane .texto {
    height: 60vh;
  }
  .tab-pane .imagen {
    height: 60vh;
  }
  .unaImagen { height: 35vw;  }
  .galeria { height: 35vw; border-radius: 30px; }

}

@media only screen and (max-width: 1440px) {

}

/* LAPTOP */
@media only screen and (max-width: 1368px) {
  .hero .bajada {
    position: absolute;
    z-index: 1000;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 1.5rem;
    line-height: 1.8rem;
    color: var(--Light);
    font-weight: normal;
    width: 26vw;
    padding-left: 25px;
    border-left: 1px solid var(--Primary);
    right: 5vw;
    bottom: 3vw;
  }
  .hero .bajada {
    position: absolute;
    z-index: 1000;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 1.5rem;
    line-height: 1.8rem;
    color: var(--Light);
    font-weight: normal;
    width: 26vw;
    padding-left: 25px;
    border-left: 1px solid var(--Primary);
    right: 5vw;
    bottom: 3vw;
  }

}

@media only screen and (max-width: 1280px) {
  .DescMenu {
    color: var(--Black)!important;
    position: fixed;
    top: 20px;
    right: 24vw;
    z-index: 10;
    border: 1px solid var(--Black) !important;
    outline: 0;
    width: 150px !important;
    border-radius: 40px !important;
    text-align: left;
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: 1rem;
    text-decoration: none;
  }
  .destacadoSlider .unSlide {
    width: 100vw;
    height: 85vh;
  }
  .destacadoSlider .unSlide .titulo { position: absolute; font-size: 8rem; color: var(--Light); mix-blend-mode: normal; line-height: 8rem; top: 3vw; left: 4vw; }
  .modal-content .titulo {
    position: absolute;
    font-size: 8rem;
    color: #F7F7F8;
    mix-blend-mode: normal;
    line-height: 8rem;
    top: 3vw;
    left: 4vw;
  }

}

/* XL */
@media only screen and (max-width: 1220px) {

}

@media only screen and (max-width: 1181px) {
  .DescMenu {
        color: var(--Black) !important;
        position: fixed;
        top: 20px;
        right: 25vw;
        z-index: 10;
        border: 1px solid var(--Black) !important;
        outline: 0;
        width: 124px !important;
        border-radius: 40px !important;
        text-align: left;
        padding-left: 20px !important;
        padding-right: 20px !important;
        font-size: 1rem;
        text-decoration: none;
  }
  .hero h1 {
    position: absolute;
    z-index: 1000;
    top: 11vw;
    left: 5vw;
    color: var(--Light);
    width: 50vw;
  }
  .openMenu {
    color: var(--Black) !important;
    position: fixed;
    top: 20px;
    right: 4vw;
    z-index: 10;
    border: 1px solid var(--Black) !important;
    outline: 0;
    width: 190px !important;
    border-radius: 40px !important;
    text-align: left;
    padding-left: 20px !important;
    padding-right: 20px !important;
    font-size: 1rem;
  }
  .destacadoSlider .unSlide {
    width: 100vw;
    height: 70vh;
  }
  .modal-content .titulo {
    position: absolute;
    font-size: 7rem;
    color: #F7F7F8;
    mix-blend-mode: normal;
    line-height: 8rem;
    top: 3vw;
    left: 4vw;
  }
  .card {
    position: relative;
    transition: .5s all;
    width: 300px;
    max-width: 95%;
    height: 70vh;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s ease;
  }
  .carrousel .slick-slide, .carrouselDos .slick-slide {
    margin: 0 22px;
  }
  .carrouselDos .card {
    height: 47vh;
  }
  .tab-pane .imagen {
    width: 100%;
    height: 60vh;
    border-radius: 20px;
    position: relative;
  }
  .tab-pane .texto {
    border-radius: 20px;
    font-size: 1rem;
    font-family: var(--Inter);
    padding: 30px;
    color: var(--Black);
    line-height: 1.3rem;
    height: 60vh;
  }
}

@media only screen and (max-width: 1025px) {
  .tab-pane .texto {
    border-radius: 20px;
    font-size: 1rem;
    font-family: var(--Inter);
    padding: 30px;
    color: var(--Black);
    line-height: 1.3rem;
    height: 60vh;
  }
  .DescMenu {
        color: var(--Black) !important;
        position: fixed;
        top: 20px;
        right: 28vw;
        z-index: 10;
        border: 1px solid var(--Black) !important;
        outline: 0;
        width: 129px !important;
        border-radius: 40px !important;
        text-align: left;
        padding-left: 20px !important;
        padding-right: 20px !important;
        font-size: 1rem;
        text-decoration: none;
  }
      .hero .bajada {
        position: absolute;
        z-index: 1000;
        font-family: var(--NHaasGroteskDSPro65Md);
        font-size: 1.5rem;
        line-height: 1.8rem;
        color: var(--Light);
        font-weight: normal;
        width: 29vw;
        padding-left: 25px;
        border-left: 1px solid var(--Primary);
        right: 5vw;
        bottom: 3vw;
    }
  .carrouselDos .card {
    height: 62vh;
  }
  .compromiso .leyenda {
    padding-right: 5vw;
  }
  .galProyectos .card {
    position: relative;
    transition: .5s all;
    width: 100%;
    max-width: 100%;
    height: 55vh;
    border-radius: 0px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s ease;
  }

    
}

/* LG */
@media only screen and (max-width: 900px) {
   
}

/* MD */
@media only screen and (max-width: 768px) {
  .openMenu svg {
    position: absolute;
    right: 20px;
    top: 7px;
    transition: .5s all;
  }
  .hero h1 {
        position: absolute;
        z-index: 1000;
        top: 22vw;
        left: 5vw;
        color: var(--Light);
        width: 70vw;
  }
  .hero .bajada {
        position: absolute;
        z-index: 1000;
        font-size: 1.5rem;
        line-height: 1.8rem;
        width: 37vw;
        padding-left: 25px;
        right: 5vw;
        bottom: 10vw;
  }
  .hero .btn {
    position: absolute;
    z-index: 1000;
    bottom: 10vw;
    left: 5vw;
    background-color: var(--Light);
    color: var(--Black);
    border: none;
  }
  .somos .img {
    padding-top: 0;
  }
  .somos .texto {
    padding-top: 11vw;
    padding-bottom: 10.7vw;
    padding-right: 7vw;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 3.5rem;
    line-height: 4rem;
  }
  .destacados {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
  .destacadoSlider .unSlide {
        width: 100vw;
        height: 60vh;
  }
  .btnWhiteDos { left: 50px; bottom: 90px; }
  .destacadoSlider .unSlide .detalles {
    position: absolute;
    bottom: 4vw;
    right: 0;
    left: 50px;
    display: flex
  }
  .destacadoSlider .unSlide .detalles .unDetalle:first-child {
    padding-left: 0;
  }
  .compromiso .boton {
    text-align: left; margin-top: 30px;
  }
  .hogar .img1 { height: 35vh; }
  .hogar .img1 .imgContain { height: 35vh; }
  .hogar .img1 .imgContain .imagen { height: 35vh; }
  .hogar .img2 { height: 35vh; position: relative; margin-bottom: 30px; }
  .hogar .img2 .imgContain { height: 35vh; }
  .hogar .img2 .imgContain .imagen { height: 35vh; }
  .hogar .img3 { height: 35vh; }
  .hogar .img3 .imgContain { height: 35vh; }
  .hogar .img3 .imgContain .imagen { height: 35vh; }
  .hogar .texto { margin-top: 20px; }
  .tab-pane .texto {
        border-radius: 20px;
        font-size: 1rem;
        font-family: var(--Inter);
        padding: 30px 50% 0px 30px;
        color: var(--Black);
        line-height: 1.3rem;
        height: 23vh;
        margin-bottom: 20px;
  }
  .tab-pane .imagen {
        width: 100%;
        height: 50vh;
        border-radius: 20px;
        position: relative;
  }
  .video .texto2 {
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 3rem;
    align-self: anchor-center;
    color: var(--Primary);
    margin-top: 23px;
    margin-bottom: 20px;
  }
  .faqs .tab-content {
    width: 90%;
  }
  footer .redes {
    position: relative;
    bottom: 0;
    width: 100%;
  }
  .textoHero {
    padding-top: 7vw;
    padding-bottom: 17vw;
    font-size: 3rem;
    font-family: var(--NHaasGroteskDSPro65Md);
    color: #726A5A;
    line-height: 3.5rem;
    padding-right: 12vw;
    padding-left: 5vw;
    background-color: var(--Light);
  }
  .unEquipo .imgContain { height: 40vh; }
  .unEquipo .imgContain .imagen { height: 40vh; }
  .global {
    padding-top: 10vw;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 1.75rem;
    line-height: 2rem;
  }
  .global .imgContain { height: 50vh; }
  .global .imgContain .imagen { height: 50vh; }
  .revert { display: flex; flex-direction: column-reverse; }
  .global .globalTextos {
    padding: 4vw 2vw 4vw 2vw;
  }
  .global .globalTextosDos {
    padding: 6vw 6vw 4vw 2vw;
    position: relative;
  }
  .global .globalTextosDos .btn {
    position: relative;
    bottom: 0;
    margin-top: 30px;
  }
  .menu {
    background-color: var(--Light);
    width: 370px;
    border-radius: 20px;
    padding: 15px;
    position: fixed;
    right: 4vw;
    top: 9vw;
    z-index: 3001;
    display: none;
  }
  .modal-content .titulo {
    font-family: 'NHaasGroteskDSPro65Md';
    position: absolute;
    font-size: 8.75rem;
    color: #F7F7F8;
    mix-blend-mode: normal;
    line-height: 8rem;
    top: 11vw;
    left: 4vw;
  }
  footer .redes { display: none; }
  footer .redesMob { display: flex; }
  footer h4 { margin-top: 30px; }
  footer .legales { margin-top: 40px; }

  .galProyectos .detalles .unDetalle {
    margin-top: 15px;
  }
  .galProyectos .btnWhiteDos {
        left: 45px;
        bottom: 30px;
  }

}

/* SM */
@media only screen and (max-width: 576px) {
    .openMenu {
        color: var(--Black) !important;
        position: fixed;
        top: 20px;
        right: 4vw;
        z-index: 10;
        border: 1px solid var(--Black) !important;
        outline: 0;
        width: 100px !important;
        border-radius: 40px !important;
        text-align: left;
        padding-left: 20px !important;
        padding-right: 20px !important;
        font-size: 1rem;
    }
  header .marca {
    opacity: 1;
    transition: .5s all;
    margin-top: 18px;
    margin-left: 4vw;
  }
  .menu {
        background-color: var(--Light);
        width: 360px;
        border-radius: 20px;
        padding: 15px;
        position: fixed;
        right: 4vw;
        top: 16vw;
        z-index: 3001;
        display: none;
  }
  h1 {
    font-size: 4rem;
    line-height: 4rem;
  }
  .hero h1 {
        position: absolute;
        z-index: 1000;
        top: 31vw;
        left: 5vw;
        color: var(--Light);
        width: 70vw;
  }
  .hero .bajada {
        position: absolute;
        z-index: 1000;
        font-size: 1.5rem;
        line-height: 1.8rem;
        width: 78vw;
        padding-left: 25px;
        right: 0;
        bottom: 40vw;
        left: 5vw;
  }
  .btn {
    font-family: var(--Inter);
    font-size: 1.5rem;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    border-radius: 40px;
    transition: .5s all;
    position: relative;
    text-align: left;
    padding-top: 10px;
    border: 1px solid var(--Black);
    width: 89%;
  }
  .btn svg {
    width: 15px;
    margin-left: 0;
    right: 25px;
    position: absolute;
    top: 15px;
  }
  .hero .btn {
        position: absolute;
        z-index: 1000;
        bottom: 22vw;
        left: 5vw;
        background-color: var(--Light);
        color: var(--Black);
        border: none;
  }
  .somos .texto {
        padding-top: 11vw;
        padding-bottom: 10.7vw;
        padding-right: 7vw;
        font-family: var(--NHaasGroteskDSPro65Md);
        font-size: 3rem;
        line-height: 3.5rem;
  }
  .destacados .boton {
    text-align: left;
    margin-bottom: 30px;
    margin-top: 30px;
  }
      .destacados {
        padding-top: 15vw;
        padding-bottom: 10vw;
    }
  .card {
    position: relative;
    transition: .5s all;
    width: 300px;
    max-width: 95%;
    height: 50vh;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s ease;
  }
  .servicios .texto { font-family: var(--NHaasGroteskDSPro65Md); font-size: 1.75rem; line-height: 2rem; padding-left: 3vw; padding-top: 3vw; }
  .timeline { padding-top: 40px; padding-bottom: 40px; }
  .carrouselDos .card {
    height: 50vh;
  }
  .hogar .img1 { height: 20vh; }
  .hogar .img1 .imgContain { height: 20vh; }
  .hogar .img1 .imgContain .imagen { height: 20vh; }
  .hogar .img2 { height: 35vh; position: relative; margin-bottom: 20px; }
  .hogar .img2 .imgContain { height: 35vh; }
  .hogar .img2 .imgContain .imagen { height: 35vh; }
  .hogar .img3 { height: 20vh; }
  .hogar .img3 .imgContain { height: 20vh; }
  .hogar .img3 .imgContain .imagen { height: 20vh; }
  .hogar .texto { margin-top: 20px; }
  .marcaFlotante {
    position: absolute;
    top: 60%;
    left: 37%;
    margin: -50px 0 0 -50px;
    width: 200px;
    transform-origin: center;
    z-index: 10;
  }
  .hogar .texto {
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 3rem;
    line-height: 3rem;
    text-align: center;
    padding: 5vw 7vw 5vw 7vw;
  }
  .compromiso .boton .btn { width: 100%; }
  .destacados .btn { width: 100%; }
  .tab-pane .imagen {
        width: 100%;
        height: 40vh;
        border-radius: 20px;
        position: relative;
  }
  .tab-pane .texto {
        border-radius: 20px;
        font-size: 1rem;
        font-family: var(--Inter);
        padding: 30px 7% 0px 30px;
        color: var(--Black);
        line-height: 1.3rem;
        height: 50vh;
        margin-bottom: 20px;
  }
  .tab-pane .imagen .btn {
    position: absolute;
    bottom: 30px;
    right: 19px;
    background-color: var(--Light);
    border: none;
  }
  .unaImagen img {
    border-radius: 30px;
    object-fit: cover;
    height: 500px;
  }
  .unaImagen {
    border-radius: 30px;
    height: 500px;
  }
  .galeria { padding-left: 20px; padding-right: 20px; }
  .faqs .nav {
    width: 100%;
  }
  .faqs .tab-content {
        width: 100%;
  }
  .faqs .d-flex { display: block!important; }
  .faqs .flex-column {
    flex-direction: row!important; 
  }
  .video .btn {
    position: absolute;
    background-color: var(--White);
    border: none;
    align-self: normal;
    justify-self: normal;
    width: 50%;
    margin-top: 20%;
    margin-left: 20%;
  }
  .loading img {
    position: absolute;
    top: 50%;
    left: 40%;
    margin: -50px 0 0 -50px;
    width: 200px;
    transform-origin: center;
    animation: scale 1.5s infinite alternate;
  }
  .heroNosotros {
    height: 75vw;
    position: relative;
  }
  .textoHero {
        padding-top: 7vw;
        padding-bottom: 17vw;
        font-size: 2rem;
        font-family: var(--NHaasGroteskDSPro65Md);
        color: #726A5A;
        line-height: 2.5rem;
        padding-right: 7vw;
        padding-left: 5vw;
        background-color: var(--Light);
  }
  .unEquipo { margin-bottom: 40px; }
  .global .globalTextosDos .btn {
        position: relative;
        bottom: 0;
        margin-top: 30px;
        width: 100%;
  }
  .galProyectos .card {
        position: relative;
        transition: .5s all;
        width: 100%;
        max-width: 100%;
        height: 42vh;
        border-radius: 0px;
        overflow: hidden;
        cursor: pointer;
        transition: transform 0.3s ease;
  }
  .galProyectos .detalles {
    position: absolute;
    color: var(--Light);
    bottom: 7vw;
    right: 12vw;
  }
  .btnWhiteDos {
        left: 50px;
        bottom: 30px;
  }
  footer h2 {
    color: var(--White);
    font-size: 2.5rem;
    margin-bottom: 30px;
    margin-top: 20px;
  }
  .destacadoSlider .unSlide .titulo { position: absolute; font-size: 4rem; color: var(--Light); mix-blend-mode: normal; line-height: 8rem; top: 3vw; left: 4vw; }
  .destacadoSlider .unSlide .detalles {
        position: absolute;
        bottom: 4vw;
        right: 0;
        left: 20px;
        display: block;
  }
  .destacadoSlider .unSlide .detalles .unDetalle {
    padding-left: 0px;
    padding-right: 0;
    border-bottom: 1px solid var(--Primary);
    border-right: none;
    padding-bottom: 5px;
    padding-top: 7px;
    width: 93%;
    display: flex;
  }
  .destacadoSlider .unSlide .detalles .unDetalle:last-child { border-bottom: none; }
  .destacadoSlider .unSlide .detalles .unDetalle h4 {
    text-transform: uppercase;
    color: var(--Light);
    font-size: 0.625rem !important;
    font-size: var(--NHaasGroteskDSPro65Md);
    opacity: 1;
    margin-bottom: 0;
    width: 55%; padding-top: 4px;
  }
  .destacadoSlider .unSlide {
        width: 100vw;
        height: 65vh;
  }
  .btnWhiteDos {
        left: 20px;
        bottom: 175px;
  }
  .btnWhiteTour {
    background-color: rgba(255, 255, 255, 0);
    color: var(--White);
    border: 1px solid var(--White);
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 1rem;
    position: absolute;
    right: 225px;
    top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 7px;
    border-radius: 30px;
    padding-top: 7px;
    text-decoration: none;
    text-transform: initial;
    transition: all .5s;
  }
  .btnWhiteVideo {
      background-color: rgba(255, 255, 255, 0);
      color: var(--White);
      border: 1px solid var(--White);
      font-family: var(--NHaasGroteskDSPro65Md);
      font-size: 1rem;
      position: absolute;
      right: 140px;
      top: 20px;
      padding-left: 20px;
      padding-right: 20px;
      padding-bottom: 7px;
      border-radius: 30px;
      padding-top: 7px;
      text-decoration: none;
      text-transform: initial;
      transition: all .5s;
  }
  .btnWhitePlanta {
    background-color: rgba(255, 255, 255, 0);
    color: var(--White);
    border: 1px solid var(--White);
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 1rem;
    position: absolute;
    right: 25px;
    top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 7px;
    border-radius: 30px;
    padding-top: 7px;
    text-decoration: none;
    text-transform: initial;
    transition: all .5s;
}
  .galeria {
    height: 130vw;
    border-radius: 30px;
  }
  .timeline-item {
        flex-direction: column;
        align-items: flex-start;
        margin: 40px 0;
  }
  .timeline-item:nth-of-type(even) .timeline-content {
        order: 1;
        text-align: left;
        padding-left: 0 !important;
        margin-top: 40px;
  }
  .timeline-item .timeline-content h3:first-child {
    margin-top: -45px;
  }
  .nav-pills li { margin-bottom: 20px; }
  .galProyectos .card h3 {
    position: absolute;
    top: 35px;
    left: 35px;
    font-family: var(--NHaasGroteskDSPro65Md);
    font-size: 2rem;
    color: var(--Light);
    line-height: 2rem;
  }
  #exampleModalCenter .close {
    position: absolute;
    top: 120px;
    right: 25px;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
  }
  #exampleModalCenter .modal-content {
    position: relative;
    background: white!important;
    margin: 3% auto;
    padding: 0;
    width: 80%!important;
    max-width: 1200px;
    border-radius: 30px;
    height: 87%;
    overflow: hidden;
    border: none;
}

}

/* XS */
@media only screen and (max-width: 380px) {
    

}


@media (min-width: 768px) and (max-width: 991px) {

}