/* ===== Variables & helpers ===== */
:root{
  --pad-y: 110px;          /* padding vertical base de secciones */
	--pad-ym: 45px;          /* padding vertical mitad base de secciones */
  --slant-h: 16vw;          /* altura del "tapón" inclinado */
  --slant: -4deg;          /* inclinación superior por defecto */
  --slant-inv: 4deg;       /* inclinación inferior (inversa) */
  --dark: #202020;
  --rust: #A22D10;
}
html,body{scroll-behavior:smooth}
.py-6{padding-block:4.5rem}
.object-fit-cover{object-fit:cover}

/* ===== Core: secciones con diagonales usando pseudo-elementos ===== */
/*
  .sec        -> base común (positioning)
  .s-XXX      -> define fondo, paddings y qué bordes son diagonales
  Para cada borde:
    ::before  -> tapa el borde superior (skewY(var(--slant)))
    ::after   -> tapa el borde inferior (skewY(var(--slant-inv)))
  Los pseudo-elementos usan background: inherit, por lo que copian el fondo
  (color / imagen) de la sección y "muerden" la vecina generando la oblicua.
*/
.sec{
  position: relative;
  isolation: isolate; /* asegura stacking limpio para los pseudo */
}

/* Tapa superior */
.sec.diag-top::before{
  content: "";
  position: absolute;
  left: -1px; right: -1px;
  top: calc(-0.1 * var(--slant-h));
  height: var(--slant-h);
  transform: skewY(var(--slant));
  transform-origin: top left;
  pointer-events: none;
}

/* Tapa inferior */
.sec.diag-bottom::after{
  content: "";
  position: absolute;
  left: -1px; right: -1px;
  bottom: calc(-1 * var(--slant-h));
  height: var(--slant-h);
 transform: skewY(var(--slant));
  transform-origin: bottom left;
  pointer-events:none;

}

.parrafo p { line-height:1.5;letter-spacing: -1.1%;font-weight: 400; }
.separador img {width:100%}
/* ===== Secciones concretasHOME  ===== */
@media (min-width:768px){	 
	.s-hero, .hero-overlay{  min-height: 1014px;}
	.s-nosotrosb4 {  min-height: 1000px;}
	.s-parallax, .parallax-overlay {  min-height: 1544px;}
	.s-tit_dpto{  min-height: 390px;}
	.s-hero h1, .marque h1, .s-parallax h1, .s-tit_dpto h1 { font-size:90px; }
	.s-nosotrosb4 h1  { font-size:64px; }
	.s-impacto  .container{padding-top: 180px;}
	.s-proyectos .container{padding-top: 90px; padding-bottom:180px}
	.pre_saber  .container{padding-bottom:180px}
	.cont_proyectos, .cont_impacto,  .cont_nosotrosb5, .cont_infoDpto.texto2, .cont_contacto { margin-bottom:120px!important;}
	.s-nosotros .cont_btn, .s-proyectos .cont_btn, .number-counters {margin-top: 120px!important;}
	.s-proyectos .cont_btn {margin-top: 80px!important;}
	.marque  { gap:3rem; }
	.marque .parrafo p { font-size:20px; }
	.s-parallax h3 { font-size:24px; }
}
@media only screen and (max-width: 767.99px) {	
  	:root{  --pad-y: 55px; 	--pad-ym: 17px;   }
	.s-hero, .hero-overlay{  min-height: 800px;}
	.s-nosotrosb4 {  min-height: 500px;}
	.s-parallax, .parallax-overlay {  min-height: 772px;}
	.s-tit_dpto{  min-height: 320px;}
	.s-hero h1, .marque h1, .s-parallax h1, .s-tit_dpto h1  { font-size:50px; }    
	.s-nosotrosb4 h1  { font-size:41px; }
	.s-impacto  .container{padding-top: 90px;}
	.s-proyectos .container{padding-top: 90px;padding-bottom:90px}
	.pre_saber  .container{padding-bottom:90px}
	.cont_proyectos,  .cont_impacto,  .cont_nosotrosb5, .cont_infoDpto.texto2, .cont_contacto  { margin-bottom:60px!important;}
	.s-nosotros .cont_btn, .number-counters {margin-top: 60px!important;}
	.s-proyectos .cont_btn {margin-top: 40px!important;}
	.marque  { gap:1rem; }
	.marque .parrafo p { font-size:18px; }
	.s-parallax h3 { font-size:20px; }
}

/* DEPARTAMENTOS - INVERSIONES */
.s-tit_dpto{
  margin-top: 100px; 
  display: flex;
  align-items: end; 
 background: #EFEFEE; color:#232323;
}
.s-tit_dpto h1 {  line-height:1.22; font-weight:400; }

.s-tit_dpto.s-inversiones{  align-items: center!important;}
.s-inversiones h1 {  line-height:1.22; font-weight:400; }

.s-tit_dpto .titulo { gap: 40px}
.pre_saber {  background: #EFEFEE;  padding: var(--pad-y) 0;}
.pre_saber::after {  background: #A22D10;}

.cont_infoDpto {  max-width: 1155px;  margin: 0 auto;}
.cont_infoDpto h1 { line-height:1.1875}
.cont_infoDpto h3 {line-height: 1.5;  letter-spacing: -1.1%;  font-weight: 400;}
.cont_infoDpto p {line-height: 1.5;  letter-spacing: -1.1%;  font-weight: 400;margin-top: 1em;}
.cont_infoDpto .parrafo {  max-width: 620px;  padding-top: 0.85em;}

/* lista sin viñetas */
.lista-caracteristicas{
  list-style: none;
  margin: 0;
  padding: 0; max-width:462px;
}

/* cada ítem con línea inferior */
.lista-caracteristicas li{
  padding: 1.3rem 0;             
  border-bottom: 1px solid  #838383;  
  line-height:1.5;letter-spacing: -1.1%;font-weight: 400;
  color: rgba(0, 0, 0, 0.8);
}

.cont_botones {flex-direction: row; gap:26px}
.cont_botones button { width:189px}
.s-tit_dpto .titulo img.aparicio {width: 190px;}
.s-tit_dpto .titulo img.orellanos { width:290px}

@media (min-width:768px) {	
	.cont_infoDpto {gap: 3rem;}
	.cont_infoDpto h1 {text-align: right; font-size:64px}
	.cont_infoDpto h3 { font-size:32px}
	.cont_infoDpto p { font-size:20px}
	.cont_caracs {justify-content: end; margin-bottom:100px}
	.caracs { gap: 28px}
	.lista-caracteristicas li{height: 103px;  display: flex;  align-items: center; font-size:20px;   }
}	

@media only screen and (max-width:767.99px) {
	.cont_infoDpto {gap: 1rem;}
	.cont_infoDpto h1 { font-size:41px}
	.cont_infoDpto h3 { font-size:21px}
	.cont_infoDpto p { font-size:18px}
	.cont_caracs {justify-content: center; margin-bottom:50px}
	.lista-caracteristicas li{ font-size:18px;   }
	
}
@media only screen and (max-width: 575.99px) {	
	.s-tit_dpto .titulo { gap: 20px}
	.s-tit_dpto .titulo img.c1 { width:70px}
	.s-tit_dpto .titulo img.aparicio { width:66px}
	.s-tit_dpto .titulo img.orellanos { width:110px}
	.s-tit_dpto .titulo img.c2 { width:120px}
	.s-tit_dpto{  min-height: 220px!important;}
	.s-tit_dpto h1  { font-size:35px!important;}
	.s-tit_dpto.s-inversiones h1  { font-size:50px!important;}
	.cont_botones {flex-direction: column}
}

/* HERO  */
.s-hero{
  padding-top: 80px; /* despeje para navbar fija */
  display: flex;
  align-items: center; 
  background-size: cover!important; background-position:center!important; background-repeat:no-repeat!important;
}
.hero-overlay { background: linear-gradient(180deg, rgba(5, 5, 5, 0.42) 36.69%, rgba(5, 5, 5, 0.83) 104.73%); width: 100%; display: flex;  align-items: center;}


.s-hero.nosotros { background-image: url(../images/hero_nosotros.jpg);}

.s-hero.home::after{  background: var(--dark)!important;}
.s-hero.nosotros::after{  background: #EFEFEE;}


.s-hero h1 {  line-height:1.066; margin-bottom:0.55em}



/* NOSOTROS: */
.s-nosotros{
  padding: var(--pad-y) 0;
  background: var(--dark);
}
.s-nosotrosb1{
  padding: var(--pad-y) 0 var(--pad-ym) 0;
  background:#EFEFEE;
}
.s-nosotrosb5{
  padding: var(--pad-y) 0;
  background:#EFEFEE;
}

.nb2-imagen::before{  background: #EFEFEE;}

.nb2-imagen::after{
  background: #EFEFEE;
}

.s-nosotrosb4{
  padding: var(--pad-y) 0;
  background: var(--rust);
}
.s-nosotrosb4 h1 {  line-height:1.2656; }
.s-nosotrosb4::before{  background: #EFEFEE;}

.s-nosotrosb4::after{background: #EFEFEE;}
/*.s-nosotros::after{  
  bottom: 0!important;
  background: #EFEFEE!important;
  transform-origin: bottom right!important;
}*/

.cont_nosotros {  max-width: 1055px;  margin: 0 auto;}
.cont_nosotrosb1 {  max-width: 1210px;  margin: 0 auto;}
.cont_nosotrosb3 {  max-width: 935px;  margin: 0 auto;}
.cont_nosotrosb5 {  max-width: 1042px;  margin: 0 auto;}
.cont_proyectos, .proyectos_home {  max-width: 1104px;  margin: 0 auto ;}
.cont_impacto {  max-width: 964px;  margin: 0 auto;}
.cont_nosotros .parrafo, .cont_proyectos .parrafo { max-width:515px;padding-top: 1.5em;}
.cont_nosotrosb1 .parrafo, .cont_nosotrosb5 .parrafo { max-width:643px;padding-top: 0;}
.cont_nosotrosb3 .parrafo { max-width:613px;padding-top: 0;}
.cont_nosotrosb1 .parrafo p, .cont_nosotrosb3 .parrafo p, .cont_nosotrosb5 .parrafo p {margin-bottom: 1em;}
.cont_impacto .parrafo { max-width:449px;padding-top: 1.5em;}
 
/* PROYECTOS */
.s-proyectos{
  padding: var(--pad-y) 0;
  background: #EFEFEE;
}
.s-proyectos::before{  background: var(--dark);}
.s-proyectos::after{  background: #A22D10;}
.proyectos_home article { width:318px}
.proyectos_home article .estado {background: #A22D10; color:#FFFEFA; font-size:16px; padding: 8px; text-align:center; width:140px; height:40px; }
.proyectos_home article .estado.noshow {background: transparent;}
.proyectos_home article .nombre { color:#050505; font-size:32px;line-height: 1; font-weight:400 }
.proyectos_home article .filtros {  display: flex;  flex-direction: row;  gap: 1rem;}
.proyectos_home article .filtros .badge { border-radius:20px; border: 1px solid  #232324;color:#232324; font-size:16px;line-height: 1;font-family: 'Inter', sans-serif; font-weight:400; padding: 10px 30px}
@media only screen and (max-width: 360px){
	.proyectos_home article { width:290px}
	.proyectos_home article .filtros .badge {padding: 10px 20px;}
}
@media (min-width:1200px) {	
	.proyectos_home { justify-content: space-between }
}	

@media only screen and (max-width:1199.99px) {
	.proyectos_home { justify-content: center; gap:3rem }
	
}
/* IMPACTO */
.s-impacto{
   padding: var(--pad-y) 0;
  background: #EFEFEE;
  color: #050505;
}
.s-impacto::before{
   background: var(--dark);
}


.number-counters{  max-width: 1278px;  margin: 0 auto;}
.number-counters article {display: flex;  width:284px}
.impact-box{ display: flex;  flex-direction: column;flex: 1 1 auto; }
.counters-item {font-weight: 400; line-height: 1.2; color: #A22D10; border-bottom:1px solid #AAAAAA; margin-bottom:20px}
.impact-box h4{ font-weight: 400;line-height: 1.2;letter-spacing: -0.48px;margin-bottom:12px}
.impact-box p{ font-weight: 300;line-height: 1.56;}
.impact-box a {  padding-top: 20px;  margin-top: auto;  align-self: flex-start;}

@media (min-width:1200px) {	
	.number-counters { justify-content: space-between; gap:1rem }
}	

@media only screen and (max-width:1199.99px) {
	.number-counters { justify-content: center;flex-wrap: wrap; gap:3rem }
	
}

@media (min-width:768px) {	
	.s-hero.home { background-image: url(../images/hero.jpg);}
	.number-counters article {min-height:378px;}
	.counters-item {font-size: 60px;}
	.impact-box h4 {font-size: 24px;}
	.impact-box p {font-size: 21px;}
}	

@media only screen and (max-width:767.99px) {
	.s-hero.home { background-image: url(../images/hero_mob.jpg);}
	.counters-item {font-size: 34px;}
	.impact-box h4 {font-size: 16px;}
	.impact-box p {font-size: 14px;}
	
}


/* PARALLAX  */
.s-parallax{
  background: url(../images/home_parallax.jpg);
  background-size: cover; background-position:center; background-repeat:no-repeat;background-attachment: fixed !important;
}
.s-parallax::before{  background: #EFEFEE;}

.s-parallax::after{
  background: #EFEFEE;
}
.parallax-overlay { background: linear-gradient(180deg, rgba(5, 5, 5, 0.31) -1.36%, rgba(5, 5, 5, 0.87) 81.71%); width: 100%;  display: flex;  align-items: center; }
.parallax-overlay .pos_text {  text-align: center;  max-width:1026px;margin: 0 auto; padding-top:calc(0.5 * var(--slant-h));}
.parallax-overlay .pos_text h1 {  line-height:1.12;letter-spacing: -1.1%; margin-bottom:0.55em}
.parallax-overlay .pos_text h3 {  line-height:1.5; letter-spacing: -1.1%;}

/* saber */
.s-saber{
  padding: var(--pad-y) 0;
  background:#A22D10;
  color: #EFEFEE;	
  display: flex;
  align-items: center;
}

.cont_saber {  max-width: 1060px;  margin: 0 auto;}
.cont_saber h1 { line-height:1.1875}
.cont_saber p {line-height: 1.5;  letter-spacing: -1.1%;  font-weight: 400;}
.cont_saber .parrafo {  max-width: 620px;  padding-top: 0.85em;}
@media (min-width:768px) {	
	.s-saber {   min-height: 800px; }
	.cont_saber {gap: 3rem;}
	.cont_saber h1 {text-align: right; font-size:64px}
	.cont_saber p { font-size:20px; margin-top:10px}
	.s-saber .cont_btn {    margin-top:120px;  }
}	

@media only screen and (max-width:767.99px) {
	.s-saber {   min-height: 400px; }
	.cont_saber {gap: 1rem;}
	.cont_saber h1 { font-size:41px}
	.cont_saber p { font-size:18px}
	.s-saber .cont_btn {    margin-top: 60px;  }
	
}
/*===	Contact Us === */

.s-contacto{
  padding: calc(var(--pad-y) + 114px) 0 var(--pad-ym) 0;
  background:#EFEFEE;
  color: #050505;
}

.s-contacto::after{
  background: rgba(5, 5, 5, 0.25);
  bottom:0!important;
  height: 2px!important;  left: 30px!important;
  right: 30px!important;

}
.cont_contacto {  max-width: 1155px;  margin: 0 auto;}
.cont_contacto h1 { line-height:1}
.cont_contacto p {line-height: 1.5;  letter-spacing: -1.1%;  font-weight: 400; max-width: 459px;  padding-top: 0.85em;}
.contact-form { width:100%;  max-width: 536px;}
.contact-form .form-control {border-radius: 4px; background-color: transparent;border: 1px solid #79747E; box-shadow: none; margin-top: 20px;
height: 56px;}
.contact-form textarea { resize: none!important; height: 190px !important;}
.contact-form .boton { margin-top:25px;}
.contact-form .form-control.error {border-bottom-color: #c0392b;}
label.error { color: #c0392b; font-weight: normal; text-transform: capitalize;display: block; font-size: .8rem;}

#form-response {    margin-top: 15px;}
@media (min-width:768px) {	
	.cont_contacto {gap: 3rem;}
	.cont_contacto h1 {text-align: right; font-size:64px}
	.cont_contacto p { text-align: right;font-size:32px}
}	

@media only screen and (max-width:767.99px) {
	.cont_contacto {gap: 1rem;}
	.cont_contacto h1 { font-size:41px}
	.cont_contacto p { font-size:21px}
	
}

/*===	desarrollos === */

.s-desarrollos{
  padding: calc(var(--pad-y) + 114px) 0;
  background:#EFEFEE;
  color: #050505;
}

.s-desarrollos h1 {  line-height: 1.22;}
.s-desarrollos .titulo .titulo-item {  width: fit-content;}
/* Contenedor de filtros */
.filtros{  gap: 1.5rem;/* separación entre "Estado" y "Tipo" */}

/* Label chiquito, como en el ejemplo */
.filtro-label{
  font-size: 13px;
  color: #000;
  white-space: nowrap;
}

/* Select visualmente igual al mock: plano, borde finito */
.filtro-select{
  width: 125px;                 
  padding: 0.45rem 2rem 0.45rem 0.75rem;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.4);
  background-color: #EFEFEE;
  font-size:12.39px;
  color: #000;
  box-shadow: none;
}

/* Flecha estándar, sin estilos raros de Bootstrap */
.filtro-select:focus{
  border-color: #111;
  box-shadow: none;
}
.proyectos_desarrollo {  max-width: 1280px;  margin: 0 auto ;}

.proyectos_desarrollo article { width:299px; position:relative; transition: opacity .35s ease, transform .35s ease;  transform-origin: center;}
.proyectos_desarrollo article.is-visible {   opacity: 1;  transform: scale(1);}
.proyectos_desarrollo article.is-hiding {  opacity: 0;  transform: scale(.97);}
.proyectos_desarrollo article .image { max-height: 350px;}
.proyectos_desarrollo article .nombre{  position: absolute;  bottom: 0;  z-index: 10;  height: 51px; background: linear-gradient(180deg, rgba(16, 16, 16, 0) 0%, rgba(16, 16, 16, 0.78) 100%); width:100%}
.proyectos_desarrollo article .nombre h4 { color:#fff; font-size:26.58px;line-height: 1.1587; font-weight:400; padding-left: 20px;}
.proyectos_desarrollo article .filtros {  display: flex;  flex-direction: row;  gap: 1rem;}
@media only screen and (max-width: 360px){
	.proyectos_desarrollo article { width:290px}
}
@media (min-width:1440px) {	
	.proyectos_desarrollo { justify-content: start;gap: 28px; }
}	
@media only screen and (max-width:1439.99px) {
	.proyectos_desarrollo { justify-content: center;gap: 28px; }
	
}
@media (min-width:768px) {	
	.s-desarrollos .titulo { margin-bottom: 120px}
	.s-desarrollos h1 { font-size:90px}
}	
@media (min-width:576px) {	
	.filtros {padding-bottom: 20px;}
	
	.wa-float { bottom:40px}
}	

@media only screen and (max-width:767.99px) {
	.s-desarrollos .titulo { margin-bottom: 60px}
	.s-desarrollos h1 { font-size:50px}
}

@media only screen and (max-width:575.99px) {
	.filtros{    justify-content: flex-start;gap: .5rem;  }
  .filtro{    width: 100%;  }	
}
/*===== Footer =====*/

footer { padding: 100px 0}
footer .container { position:relative}
.footer {  background-color: #EFEFEE; }
.cont_footer { margin: 0 auto;display: flex }
.cont_footer .contacto{display: flex; flex-direction: column}
.cont_footer h4 { font-family: "Inter", sans-serif; font-size:16px; margin-bottom:2.75em; color:#969696}
.cont_footer .contacto div { font-family: "Inter", sans-serif; font-size:32px; line-height:1.35; color:#050505}


.cont_footer .list_menu{display: flex;  justify-content: space-between; gap:1rem;flex-direction: row }
.cont_footer .list_menu ul li { font-size:16px; margin-bottom:20px; color:#050505 ;}
.cont_footer .list_menu ul li a { color:#050505 ;}
.cont_footer .list_menu ul li a:hover { color:#A22D10;}

.cm { position: absolute;  bottom: 5px;  right: 15px;font-size: .8rem;   color: #969696;}
.copyright { position: relative;  bottom: -70px;text-align: center; font-size: .9rem;   color: #050505;}
footer p  {  transition: all .3s;  position: relative;  z-index: 3;}
footer p a {  color: #050505;  }

@media (min-width:1200px) {	
	.cont_footer { justify-content: space-between; gap:1rem;flex-direction: row }
	.cont_footer .list_menu { width:55%}
}	

@media only screen and (max-width:1199.99px) {
	.cont_footer { justify-content: center;flex-wrap: wrap; gap:3rem; flex-direction: column }
	
}
@media only screen and (max-width:575.99px) {
	.cont_footer .list_menu{ justify-content: center;flex-wrap: wrap; gap:3rem; flex-direction: column }
	.cont_footer .contacto div { font-size:20px}
	.wa-float { bottom:75px}
	
}



/**/
#back-top { bottom: 20px; position: fixed; left: max(25px, calc((100vw - 1440px) / 2 + 25px));;  z-index: 9;color: #ccc;}

/* 
---------------------------------------------
WhatsApp
--------------------------------------------- 
*/
/* Botón flotante WhatsApp */
.wa-float {
  position: fixed;
  right: max(22px, calc((100vw - 1440px) / 2 + 22px));
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #25D366;                /* color base (fallback si no carga el SVG) */
  box-shadow: 0 8px 24px rgba(0,0,0,.18), 0 2px 6px rgba(0,0,0,.12);
  z-index: 9999;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}

.wa-float img {
  width: 34px;
  height: 34px;
  display: block;
}

/* Hover / Focus */
.wa-float:hover,
.wa-float:focus-visible {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 12px 28px rgba(0,0,0,.22), 0 4px 10px rgba(0,0,0,.14);
  outline: none;
}
.wa-float-disp {
  position: fixed;
  right: max(84px, calc((100vw - 1440px) / 2 + 84px));
  bottom: clamp(14px, 2vw, 22px);
width: 199px;
height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
 color:#F5F5F5;
border-radius: 60px;
background: #363636;
font-size:16px;
 box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.25);
  z-index: 9999;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease;
}
/* Animación de “latido” sutil (respeta reduce motion) */
@media (prefers-reduced-motion: no-preference) {
  .wa-float {
    animation: wa-pulse 2.2s ease-in-out infinite;
  }
  @keyframes wa-pulse {
    0%, 100% { transform: none; }
    50%      { transform: scale(1.04); }
  }
}

/* Tamaño reducido en pantallas muy chicas */
@media (max-width:575.98px){
  .wa-float { width: 44px; height: 44px; }
  .wa-float img { width: 30px; height: 30px; }
	.wa-float-disp {height: 40px;}
}