:root{
  --c-primary:#009462;
  --c-secondary:#00188A;
  --g-primary: linear-gradient(90deg, #009462 0%, #00188A 100%);
    --c-green-deep:#03875A;
  --g-green-soft: linear-gradient(180deg, #03875A 0%, #009462 100%);
  --c-accent:#009FE3;

}

/* Base */
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:"Kanit", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:#111;
  background:#fff;
}
a{ color:inherit; }

/* ===== Header ===== */

/* ===== NAV underline (NX único) ===== */
.nx-nav__link{
  position: relative;
  text-decoration: none;
}

/* underline base apagado */
.nx-nav__link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;              /* ajusta altura */
  height:2px;
  border-radius:999px;
  background: var(--c-secondary, #00188A);
  opacity:0;
  transform: scaleX(.35);
  transform-origin:left center;
  transition: opacity .16s ease, transform .22s ease;
  pointer-events:none;
}

/* hover */
@media (hover:hover){
  .nx-nav__link:hover::after{
    opacity:.65;
    transform: scaleX(1);
  }
}

/* activo */
.nx-nav__link.nxNavActiveX9::after{
  opacity:1;
  transform: scaleX(1);
}

/* opcional: refuerzo de texto activo */
.nx-nav__link.nxNavActiveX9{
  font-weight:700;
}

/* ===== Barra animada (NX único) ===== */
#nxNav .nx-nav__list{
  position:relative;
}

#nxNav .nxNavBarX9{
  position:absolute;
  left:0;
  bottom:-10px;             /* misma altura que el ::after */
  height:2px;
  width:24px;
  border-radius:999px;
  background: var(--c-secondary, #00188A);
  opacity:0;
  transition: transform .22s ease, width .22s ease, opacity .18s ease;
  pointer-events:none;
}

/* si usás la barra animada, apagá el ::after en desktop para evitar doble línea */
@media (min-width:981px){
  .nx-nav__link::after{ display:none; }
}
























.nx-header{
  background:#fff;
  border-bottom:1px solid rgba(0,24,138,.14);
}


.nx-brand{ display:inline-flex; align-items:center; flex:0 0 auto; }
.nx-brand img{ width:203px; height:61px; display:block; }

.nx-burger{
  display:none;
  width:44px;height:44px;
  border:0;background:transparent;
  color:var(--c-secondary, #00188A);
  padding:8px;border-radius:10px;
  cursor:pointer;
}
.nx-burger svg{ width:100%; height:100%; display:block; }

.nx-nav{ flex:1 1 auto; }
.nx-nav__panel{ display:block; }
.nx-nav__list{
  list-style:none;
  margin:0;padding:0;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:clamp(18px, 2.5vw, 54px);
}

.nx-nav__link:hover{ opacity:.85; }
.nx-nav__link.is-active::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:6px;
  height:4px;
  border-radius:999px;
  background: var(--g-primary);
}

.nx-nav__close{
  display:none;
  width:44px;height:44px;
  border:0;background:transparent;
  color:var(--c-secondary, #00188A);
  padding:8px;border-radius:10px;
  cursor:pointer;
}
.nx-nav__close svg{ width:100%; height:100%; display:block; }





.nx-header__inner{
  max-width:1920px;
  margin:0 auto;
  padding:32px clamp(16px, 4vw, 80px); /* antes 14px => +8px */
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.nx-nav__link{
  font-family:"Kanit", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:20px; /* antes 22px */
  font-weight:400;
  color:var(--c-secondary, #00188A);
  text-decoration:none;
  text-transform:uppercase;
  line-height:1;
  display:inline-block;
  position:relative;
  padding:12px 0 18px;
  white-space:nowrap;
}
@media (min-width: 981px) and (max-width: 1440px){
  .nx-header__inner{
    padding:34px clamp(16px, 4vw, 80px); /* +12px vs 22px */
  }

  .nx-nav__link{
    font-size:18px; /* se achica un tantín */
  }

  .nx-nav__list{
    gap:clamp(14px, 1.8vw, 40px); /* un poco menos separación */
  }
}














@media (max-width: 980px){
  .nx-burger{ display:inline-flex; align-items:center; justify-content:center; }
  .nx-nav{
    position:fixed;
    inset:0;
    z-index:999;
    background:rgba(0,0,0,.10);
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
  }
  .nx-nav__panel{
    position:absolute;
    inset:0;
    background:#fff;
    transform:translateX(100%);
    transition:transform .22s ease;
    padding:22px 18px 22px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .nx-nav__close{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    align-self:flex-end;
  }
  .nx-nav__list{
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:14px;
    padding-top:10px;
  }
  .nx-nav__link{ font-size:22px; padding:10px 0; }
  .nx-nav__link.is-active::after{ bottom:-6px; height:4px; }

  .nx-nav.nx-nav--open{ opacity:1; pointer-events:auto; }
  .nx-nav.nx-nav--open .nx-nav__panel{ transform:translateX(0); }

  html.nx-nav-open, body.nx-nav-open{ overflow:hidden; }
}




/* === NAV underline “móvil” (una sola barrita) === */
.nx-nav__list{
  position:relative; /* necesario para posicionar la barrita */
}

/* mata el underline viejo por-link */
.nx-nav__link.is-active::after{
  content:none !important;
}

/* barrita única */
.nx-nav__indicator{
  position:absolute;
  left:0;
  bottom:6px;             /* mismo “bottom” que usabas */
  height:4px;
  border-radius:999px;
  background: var(--g-primary);
  width:0;
  transform: translateX(0);
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    width .28s cubic-bezier(.2,.8,.2,1);
  will-change: transform, width;
  pointer-events:none;
}

/* en mobile no aplica (menú vertical) */
@media (max-width: 980px){
  .nx-nav__indicator{ display:none; }
}























/* ===== HOME / HERO (slider) ===== */
.nx-hero{
  position:relative;
  width:100%;
  min-height: 750px;

  overflow:hidden;
  background:#111;
}

.nx-hero__bg{
  position:absolute;
  inset:0;
}
.nx-hero__bgLayer{
  position:absolute;
  inset:0;
  background-size: cover;
  background-position: var(--nx-hero-pos, 50% 50%);
  background-repeat: no-repeat;
  transform: scale(1.02);
  opacity:0;
  transition:opacity .45s ease;
  will-change:opacity;
}


.nx-hero__bgLayer.is-active{ opacity:1; }

.nx-hero__overlay{
  position:absolute;
  inset:0;
  /* overlay tipo captura: más oscuro a la izquierda */
  background:
    linear-gradient(90deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.30) 55%, rgba(0,0,0,.12) 100%),
    linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,0) 55%);
}

.nx-hero__inner{
  position:relative;
  z-index:2;
  max-width:1920px;
  margin:0 auto;
  padding: clamp(32px, 5vw, 70px) clamp(16px, 4vw, 80px);
}

.nx-hero__title{
  margin:0;
  color:#fff;
  font-weight:600;
  font-size:55px;
  line-height:1.12;
  max-width: 820px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}

.nx-hero__nav{
  margin-top: 28px;
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
}

.nx-hero__count{
  font-size:18px;
  letter-spacing:.5px;
  display:flex;
  align-items:baseline;
  gap:0;
  min-width:92px;
}
.nx-hero__countNow{ font-weight:600; }
.nx-hero__countSep{ opacity:.9; }
.nx-hero__countTotal{ opacity:.9; }

.nx-hero__arrow{
  width:34px;
  height:34px;
  border:0;
  background:transparent;
  color:#fff;
  cursor:pointer;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  opacity:.95;
}
.nx-hero__arrow:hover{ opacity:.8; }
.nx-hero__arrow svg{ width:24px; height:24px; display:block; }

.nx-hero__rule{
  margin-top: 12px;
  height:1px;
  width: min(560px, 82vw);
  background: rgba(255,255,255,.35);
  position:relative;
  overflow:hidden;
}

.nx-hero__ruleFill{
  position:absolute;
  left:0; top:0; bottom:0;
  width:33.333%;
  background: rgba(255,255,255,.92);
  transform-origin:left center;
  transition: width .35s ease;
}


.nx-hero__more{
  display:inline-block;
  margin-top: 22px;
  font-weight:600;
  font-size:16px;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#89BD40;
  text-decoration:none;
}
.nx-hero__more:hover{ text-decoration:underline; }

.nx-hero__bottom{
  position:absolute;
  left:0; right:0; bottom:0;
  height:18px;
  background:#fff;
  z-index:3;
}

/* Mobile (inventado prolijo, sin romper desktop) */
@media (max-width: 980px){
  .nx-hero{
    min-height: clamp(520px, 74vh, 780px);
  }
  .nx-hero__title{
    font-size: clamp(30px, 6vw, 44px);
    max-width: 92vw;
  }
  .nx-hero__rule{
    width: min(520px, 90vw);
  }
}


/* ===== HOME / CARDS VERDES + TEXTO ===== */
.nx-cards{
  background:#fff;
  padding: 54px 0 40px;
}

.nx-cards__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

.nx-cards__grid{
  display:flex;
  justify-content:center;
  gap: 36px;
  flex-wrap:nowrap;
}

.nx-card{
  width:562px;
  height:320px;
  border-radius:28px;
  background: var(--g-green-soft);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 22px 28px;
  text-align:center;
}

.nx-card__txt{
  margin:0;
  color:#fff;
  font-size:32px;
  font-weight:400;
  line-height:1.22;
}

.nx-card__txt strong{
  font-weight:700;
}

.nx-cards__lead{
   margin: 60px 0 25px; /* +15px arriba y +15px abajo */
  font-size:25px;
  font-weight:600;
  line-height:1.35;
  color:#111;
  max-width: 1720px;
}

.nx-cards__lead strong{
  font-weight:700;
}

/* Responsive: más “horizontales” para ver los 3 sin que sea eterno */
@media (max-width: 980px){
  .nx-cards{ padding: 34px 0 26px; }

  .nx-cards__grid{
    flex-direction:column;
    gap: 18px;
  }

  .nx-card{
    width:100%;
    height:auto;
    min-height: 150px; /* horizontalito */
    padding: 18px 18px;
    border-radius:22px;
  }

  .nx-card__txt{
    font-size: clamp(18px, 4.2vw, 26px);
  }

  .nx-cards__lead{
    font-size: clamp(16px, 3.8vw, 22px);
    margin-top: 22px;
  }
}


/* ===== HOME / MISIÓN + ALCANCE ===== */
.nx-msn{
  background:#fff;
  padding: 28px 0 46px;
}

.nx-msn__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

.nx-msn__grid{
  display:flex;
  gap: 46px;
  align-items:stretch;
}

.nx-msn__media{
  margin:0;
  flex:0 0 auto;
}

.nx-msn__media img{
  width:559px;
  height:465px;
  display:block;
  object-fit:cover;
  border-radius:28px;
}

.nx-msn__content{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  position:relative;
}

/* separador 1px arriba solo del lado derecho (no cruza la imagen) */
.nx-msn__topline{
  height:1px;
  background: var(--c-secondary, #00188A);
  width:100%;
  margin-top: 6px;
  margin-bottom: 26px;
}

.nx-msn__cols{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 66px;
}

.nx-msn__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.nx-msn__title{
  flex:1 1 auto;
}

.nx-msn__icon{
  flex:0 0 auto;
  margin-left:auto;
}

.nx-msn__title{
  margin:0;
  font-weight:300;
  color: var(--c-accent, #009FE3);
  font-size:32px;
  line-height:1.1;
}

.nx-msn__icon{
  width:46px;
  height:46px;
  display:block;
}

.nx-msn__p{
  margin:0 0 14px;
  font-size:18px;
  line-height:1.55;
  color:#111;
}

/* botón tipo iPhone */
.nx-msn__cta{
  margin-top:auto;
  align-self:flex-end;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  border:1px solid rgba(0,0,0,.25);
  border-radius:999px;
  padding: 10px 84px 10px 26px; /* 🔥 reserva espacio para la bola */
  text-decoration:none;
  background:#fff;
  overflow:hidden;
  min-width: 248px;
  margin-bottom: 6px; /* lo levanta un pelo */
}

.nx-msn__ctaTxt{
  position:relative;
  z-index:2;
  font-weight:700;
  color: var(--c-accent, #009FE3);
  font-size:22px;
  letter-spacing:.3px;
  transition: color .28s ease;
}

.nx-msn__ctaDot{
  position:absolute;
  right:10px;
  top:50%;
  width:54px;
  height:54px;
  border-radius:999px;
  background: var(--c-accent, #009FE3);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform: translateY(-50%);
  z-index:3;
  transition: transform .45s cubic-bezier(.2,.9,.2,1);
}


.nx-msn__ctaIco{
  width:26px;
  height:26px;
  display:block;
  transition: transform .45s cubic-bezier(.2,.9,.2,1);
}

/* Hover pro: la bola pasa por encima del texto + giro */
.nx-msn__cta:hover .nx-msn__ctaDot{
  transform: translate(-130px, -50%) rotate(360deg);
}


.nx-msn__cta:hover .nx-msn__ctaIco{
  transform: rotate(-360deg);
}

/* opcional: cuando la bola pasa por encima, texto se vuelve blanco */
.nx-msn__cta:hover .nx-msn__ctaTxt{
  color:#fff;
}


.nx-msn__ctaTxt{
  font-weight:700;
  color: var(--c-accent, #009FE3);
  font-size:22px;
  letter-spacing:.3px;
}

.nx-msn__ctaDot{
  width:54px;
  height:54px;
  border-radius:999px;
  background: var(--c-accent, #009FE3);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  line-height:1;
  transition: transform .22s ease;
}



/* Responsive */
@media (max-width: 980px){
  .nx-msn__grid{
    flex-direction:column;
    gap: 18px;
  }

  .nx-msn__media img{
    width:100%;
    height:auto;
    aspect-ratio: 559 / 465;
  }

  .nx-msn__cols{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .nx-msn__cta{
    align-self:flex-start;
    margin-top: 18px;
  }
}

/* ===== HOME / QUÉ HACEMOS ===== */
.nx-qh{
  background:#fff;
  padding: 34px 0 54px;
}

.nx-qh__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

/* caja azul grande (sin “apagar” el texto: background con pseudo-element) */
.nx-qh__box{
  position:relative;
  max-width:1727px;
  min-height:514px;
  margin:0 auto;
  border-radius:41px;
  overflow:hidden;

  display:flex;
  align-items:stretch;
  gap: 42px;
  padding: 34px 40px;
}

.nx-qh__box::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, #0083C9 0%, #00A1E1 100%);
  opacity:.2;
  pointer-events:none;
}

.nx-qh__left,
.nx-qh__media{
  position:relative;
  z-index:1;
}

.nx-qh__left{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
}

.nx-qh__title{
  margin:0 0 18px;
  color:#009FE3;
  font-size:55px;
  font-weight:700;
  line-height:1.05;
}

.nx-qh__cols{
  display:grid;
  grid-template-columns: 1.25fr 1fr; /* 01 más ancho */
  gap: 44px;
  align-items:start;
}

.nx-qh__kicker{
  display:flex;
  align-items:baseline;
  gap: 12px;
  margin-bottom: 12px;
}





.nx-qh__num{
  color:#00A1E1;
  font-size:33px;
  font-weight:300;
  line-height:1;
}

.nx-qh__lbl{
  color:#009FE3;
  font-size:33px;
  font-weight:500;
  letter-spacing:.3px;
  text-transform:uppercase;
  white-space:nowrap;
}


.nx-qh__p{
  margin:0;
  color:#111;
  font-size:25px;
  line-height:1.45;
  max-width: 560px;
}

.nx-qh__cta{
  margin-top: 22px;
  align-self:flex-start;
}

.nx-qh__media{
  flex:0 0 620px;
  display:flex;
  align-items:center;
}

.nx-qh__media img{
  width:100%;
  height:100%;
  max-height: 446px;
  object-fit:cover;
  border-radius:28px;
  display:block;
}

/* Responsive */
@media (max-width: 980px){
  .nx-qh__box{
    min-height:auto;
    flex-direction:column;
    padding: 22px 18px;
    gap: 18px;
  }

  .nx-qh__cols{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .nx-qh__media{
    flex:0 0 auto;
  }

  .nx-qh__media img{
    max-height:none;
    aspect-ratio: 16 / 9;
    height:auto;
  }
}
  .nx-qh__kicker{
    align-items:flex-start;   /* en vez de baseline */
    flex-wrap:wrap;           /* permite bajar a otra línea */
    row-gap:6px;
  }

  .nx-qh__lbl{
    white-space:normal;       /* quita el nowrap */
    line-height:1.1;
  }
}
/* Pantallas bajas (720p / Mac 13"): compactar sin cambiar el diseño */
@media (max-height: 820px) and (min-width: 981px){
  .nx-qh__box{
    padding: 26px 34px;
    gap: 34px;
  }

  .nx-qh__media img{
    max-height: 400px;
  }

  .nx-qh__p{
    font-size:22px; /* baja leve para que respire y no rompa */
    line-height:1.4;
  }
}





/* ===== FOOTER ===== */
.nx-footer{
  position:relative;
  background:#021A76;
  color:#fff;
  overflow:hidden;
}



.nx-footer__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  margin:0 auto;
  padding: 54px clamp(16px, 4vw, 80px);
}
.nx-footer__inner::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url("/assets/img/home/lineasfooter.png");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  pointer-events:none;
  z-index:0;
}

.nx-footer__top{
  position:relative;
  z-index:1;
}


.nx-footer__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 40px;
}

.nx-footer__brand{
  font-size:34px;
  font-weight:400;
  letter-spacing:.5px;
  line-height:1;
}

.nx-footer__contact{
  text-align:right;
  min-width: 320px;
}

.nx-footer__title{
  font-size:26px;
  font-weight:700;
  letter-spacing:.3px;
  margin:0 0 14px;
}

.nx-footer__row{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 14px;
  color:#fff;
  text-decoration:none;
  margin: 10px 0;
}

.nx-footer__txt{
  font-size:16px;
  font-weight:500;
}

.nx-footer__ico{
  width:34px;
  height:34px;
  border-radius:999px;
  background:#009462;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.nx-footer__ico svg{
  width:18px;
  height:18px;
  display:block;
}

.nx-footer__bottom{
  background:#fff;
  color: rgba(0,0,0,.35);
  text-align:center;
  padding: 14px 16px;
  font-weight:600;
}

/* Responsive */
@media (max-width: 980px){
  .nx-footer__top{
    flex-direction:column;
    align-items:flex-start;
  }

  .nx-footer__contact{
    text-align:left;
    min-width: 0;
  }

  .nx-footer__row{
    justify-content:flex-start;
  }
}

/*QUE HACEMOS */ 
/* ===== QUE HACEMOS / HERO ===== */
/* ===== QUE HACEMOS / HERO ===== */
.nx-qhHero{
  position:relative;
  width:100%;
  height:812px;
  background:url("/assets/img/que-hacemos/heroquehacemos.png") center/cover no-repeat;
  overflow:hidden;

  /* ✅ esto es lo que lo baja SIEMPRE */
  display:flex;
  align-items:flex-end;
}

/* overlay igual */
.nx-qhHero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.55) 60%,
    rgba(0,0,0,.78) 100%
  );
  pointer-events:none;
}

.nx-qhHero__inner{
  /* ✅ NO absolute: así no se “pierde” en responsive */
  position:relative !important;
  z-index:1;

  width:min(1920px, 100%);
  margin:0 auto;

  padding: 0 clamp(16px, 4vw, 80px) 64px;

  display:flex;
  flex-direction:column;
  gap:22px;
}

/* Responsive */
@media (max-width: 980px){
  .nx-qhHero{
    height: min(812px, 100svh);
  }

  .nx-qhHero__inner{
    padding-bottom: 22px; /* ajustá a gusto */
  }

  .nx-qhHero__card{
    width: min(615px, 92vw);
    height:auto;
    padding: 22px 20px;
    --nx-qhHeadH: 56px;
  }

  .nx-qhHero__num{ font-size:44px; }
  .nx-qhHero__lbl{ font-size:24px; }
  .nx-qhHero__p{ font-size:18px; }
}


.nx-qhHero__title{
  margin:0;
  color:#fff;
  font-size:58px;
  font-weight:600; /* semibold */
  line-height:1.05;
}
.nx-qhHero__card{
  width:615px;
  height:341px;
  border-radius:32px;
  padding: 28px 26px;
  background: linear-gradient(90deg, #03875A 0%, #009462 100%);
  color:#fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);

  /* mismo “header height” conceptual que el bloque 02 */
  --nx-qhHeadH: 78px;
}

.nx-qhHero__kicker{
  display:flex;
  gap:14px;

  min-height: var(--nx-qhHeadH);
  margin-bottom: 16px;

  /* igual que 02: asentado abajo */
  align-items:flex-end;
}

.nx-qhHero__num{
  font-size:56px;          /* ✅ igual jerarquía que 02 */
  font-weight:300;
  line-height:1;
  letter-spacing:-0.5px;
  color:#fff;
}

.nx-qhHero__lbl{
  font-size:30px;          /* ✅ igual jerarquía que 02 */
  font-weight:600;
  line-height:1.05;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#fff;
}

.nx-qhHero__p{
  margin:0;
  font-size:18px;          /* ✅ mismo cuerpo que el texto del card 02 */
  font-weight:300;
  line-height:1.6;
  max-width: 520px;
  color:#fff;
}

/* Responsive */
@media (max-width: 980px){
  .nx-qhHero__card{
    width: min(615px, 92vw);
    height:auto;
    padding: 22px 20px;
    --nx-qhHeadH: 56px;
  }
  .nx-qhHero__num{ font-size:44px; }
  .nx-qhHero__lbl{ font-size:24px; }
  .nx-qhHero__p{ font-size:18px; }
}

@media (max-width: 980px){

  /* que el hero se adapte al alto real del teléfono */
  .nx-qhHero{
    height: min(812px, 100svh);
  }
  @supports (height: 100dvh){
    .nx-qhHero{ height: min(812px, 100dvh); }
  }

  /* baja el stack (titulo + card) más cerca del borde inferior */
  .nx-qhHero__inner{
    padding-bottom: 28px; /* antes 64px */
  }

  /* (opcional pero recomendado) para que no se coma espacio arriba */
  .nx-qhHero__title{
    font-size: 38px;
  }
}

/* ===== QUE HACEMOS / SERVICIOS BLOQUE ===== */
/* ===== QUE HACEMOS / SERVICIOS BLOQUE (FIX BOCETO) ===== */
.nx-serv{
  background:#fff;
  padding: 42px 0;

  /* ALTURA RESERVADA DEL “HEADER” (sirve para alinear textos) */
  --nx-serv-headH: 78px;
}

.nx-serv__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

/* ✅ ancho como el resto de cajas “pro” */
.nx-serv__wrap{
  background:#009462;
  border-radius:32px;

  width:100%;
  max-width:1751px;          /* <-- igual criterio que otras cajas */
  margin: 0 auto;

  padding: 34px 40px;
  display:grid;
  grid-template-columns: 420px 1fr;
  gap: 34px;
  align-items:stretch;
}

/* Card izquierdo */
.nx-serv__card{
  background: rgba(255,255,255,.26);
  border-radius:26px;
  padding: 28px 26px;
  color:#fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
}

/* ✅ “02 SERVICIOS” más grande (jerarquía) */
.nx-serv__kicker{
  display:flex;
  gap: 14px;

  /* clave para alinear el arranque del texto con las columnas */
  min-height: var(--nx-serv-headH);
  margin-bottom: 16px;

  /* deja el título “sentado” abajo como el boceto */
  align-items:flex-end;
}

.nx-serv__num{
  font-size:56px;
  font-weight:300;
  line-height:1;
  color:#fff;
}

.nx-serv__lbl{
  font-size:30px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#fff;
}

/* texto del card izquierdo */
.nx-serv__p{
  margin:0;
  font-size:18px;
  font-weight:300;
  line-height:1.6;
  color:#fff;
}

/* Columnas derechas */
.nx-serv__cols{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(26px, 3vw, 86px);

  /* ✅ alinea “ENERGÍA SOLAR…” con el “02 SERVICIOS”
     (mismo “offset” visual que el padding del card) */
  padding: 28px 0 0;
  align-content:start;
}

/* ✅ títulos de columnas más chicos que “02 SERVICIOS” */
.nx-serv__h{
  margin:0 0 16px;
  color:#fff;

  font-size:24px;
  font-weight:800;
  letter-spacing:.8px;
  line-height:1.05;
  text-transform:uppercase;

  /* clave para que los P arranquen alineados */
  min-height: var(--nx-serv-headH);
  display:flex;
  align-items:flex-end;
}

.nx-serv__t{
  margin:0;
  color:#fff;

  font-size:18px;
  font-weight:400;
  line-height:1.6;

  max-width: 320px;
}

/* Responsive */
@media (max-width: 980px){
  .nx-serv{
    --nx-serv-headH: 56px;
    padding: 34px 0;
  }

  .nx-serv__wrap{
    padding: 24px 18px;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .nx-serv__cols{
    grid-template-columns: 1fr;
    row-gap: 16px;
    padding: 0;
  }

  .nx-serv__num{ font-size:44px; }
  .nx-serv__lbl{ font-size:24px; }

  .nx-serv__h{
    min-height: unset;
    font-size:22px;
    margin-bottom: 10px;
  }

  .nx-serv__t{
    max-width:none;
  }
}


/* ===== QUE HACEMOS / VIDEO ===== */
.nx-qhVideo{
  background:#fff;
  padding: 44px 0 10px;
}
.nx-qhVideo__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

/* MISMO ANCHO que el contenido (sin max-width raro) + ALTO FIJO */
.nx-qhVideo__frame{
  width:100%;
  position:relative;
  border-radius:32px;
  overflow:hidden;
  background:#000;
  height:514px;              /* <- clava el tamaño como tu diseño */
}

.nx-qhVideo__video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

/* Play grande centrado */
.nx-qhVideo__play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:118px;
  height:118px;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.92);
  cursor:pointer;
  display:grid;
  place-items:center;
  z-index:3;
  box-shadow: 0 18px 40px rgba(0,0,0,.30);
}

.nx-qhVideo__playRing{
  position:absolute;
  inset:8px;
  border-radius:999px;
  border:3px solid rgba(0,0,0,.12);
}

.nx-qhVideo__playIcon{
  width:40px;
  height:40px;
  background:url("/assets/img/que-hacemos/flechavideo.png") center/contain no-repeat;
  transform: translateX(2px);
}

.nx-qhVideo__frame.is-playing .nx-qhVideo__play{
  opacity:0;
  pointer-events:none;
  transition: opacity .18s ease;
}

/* Mobile */
@media (max-width: 980px){
  .nx-qhVideo__frame{
    height:auto;
    aspect-ratio: 16 / 9;
    border-radius:24px;
  }
}

.nx-qhVideo__mute{
  position:absolute;
  right:18px;
  bottom:18px;
  height:44px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.55);
  background:rgba(0,0,0,.28);
  color:#fff;
  cursor:pointer;
  z-index:3;
  display:flex;
  align-items:center;
  gap:10px;
  backdrop-filter: blur(6px);
}

.nx-qhVideo__muteTxt{
  font-size:14px;
  font-weight:600;
  letter-spacing:.2px;
}

.nx-qhVideo__mute[aria-pressed="false"]{
  background:rgba(0,0,0,.42);
}


/* ===== PROPUESTA DE VALOR / HERO ===== */
.nx-pvHero{
  position:relative;
  width:100%;
  height:842px; /* mismo alto que hero */
  background:url("/assets/img/propuesta-de-valor/herovalor.jpg") center/cover no-repeat;
  overflow:hidden;
}

.nx-pvHero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg,
    rgba(0,0,0,.62) 0%,
    rgba(0,0,0,.38) 38%,
    rgba(0,0,0,0) 70%
  );
  pointer-events:none;
}

.nx-pvHero__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  height:100%;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 14px;
}

.nx-pvHero__kicker{
  margin:0;
  color:#fff;
  font-size:32px;
  font-weight:600;
  line-height:1.1;
}

.nx-pvHero__title{
  margin:0;
  color:#fff;
  font-size:28px;
  font-weight:300;
  line-height:1.25;
  max-width: 680px;
}

/* Responsive */
@media (max-width: 980px){
  .nx-pvHero{
    height:720px;
  }
  .nx-pvHero__kicker{ font-size:26px; }
  .nx-pvHero__title{ font-size:22px; }
}

/* Pantallas bajas (720p / Mac 13") */
@media (max-height: 820px) and (min-width: 981px){
  .nx-pvHero{ height:760px; }
}

/* ===== PROPUESTA DE VALOR / BENEFICIOS ===== */

/* FIX: igualar “altura” de textos (izq vs der) */
/* === FIX definitivo: centrar/igualar el texto derecho === */

/* 1) El grid NO debe centrar verticalmente */
.nx-pvProp__box{
  align-items: stretch !important;
}

/* 2) Forzar que las 3 columnas ocupen el alto del box */
.nx-pvProp__left,
.nx-pvProp__sep,
.nx-pvProp__right{
  height: 100%;
}

/* 3) Centrado real del contenido derecho (ya con altura real) */
.nx-pvProp__right{
  display:flex;
  align-items:flex-start;
  justify-content:center;   /* ← esto lo centra verticalmente */
}

/* 4) La línea debe acompañar el alto */
.nx-pvProp__sep{
  align-self: stretch;
  height: auto;
  margin: 8px 0;
}

/* ===== PROPUESTA DE VALOR / NUESTRA PROPUESTA ===== */
/* ===== PROPUESTA DE VALOR / NUESTRA PROPUESTA ===== */
.nx-pvProp{
  background:#fff;
  padding: 34px 0 24px;
}

.nx-pvProp__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

/* caja principal (mismo ancho visual + mismo radius) */
.nx-pvProp__box{
  width:100%;
  border-radius:32px;
  overflow:hidden;
  position:relative;
  min-height:410px;
  padding: 34px 40px;
  display:grid;
  grid-template-columns: 520px 56px 1fr; /* ajustado para que el texto derecho caiga donde toca */
  align-items:center;
  gap: 10px;
  border:0;
  outline:0;

  background: url("/assets/img/propuesta-de-valor/propuesta.jpg") center/cover no-repeat;
}

/* oscurece SOLO el lado izquierdo (como la referencia) */
.nx-pvProp__box::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg,
    rgba(0,0,0,.72) 0%,
    rgba(0,0,0,.58) 38%,
    rgba(0,0,0,.18) 54%,
    rgba(0,0,0,0) 62%
  );
  pointer-events:none;
}

.nx-pvProp__left,
.nx-pvProp__sep,
.nx-pvProp__right{
  position:relative;
  z-index:1;
}

.nx-pvProp__title{
  margin:0 0 18px;
  color:#009FE3;
  font-size:34px;
  font-weight:700;
  line-height:1.1;
}

.nx-pvProp__list{
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap: 16px;
}

.nx-pvProp__item{
  display:flex;
  align-items:center;
  gap: 14px;
  color:#fff;
  font-size:16px;
  font-weight:700;
  letter-spacing:.4px;
}

.nx-pvProp__ico{
  width:26px;
  height:26px;
  object-fit:contain;
  flex:0 0 auto;
}

/* separador vertical + “llave” */
.nx-pvProp__sep{
  height: 170px;
  width: 1px;
  background: rgba(255,255,255,.70);
  justify-self:center;
  position:relative;
  border-radius:2px;
}

.nx-pvProp__sep::before{
  content:"";
  display:none;
}

/* bloque derecho: centrado vertical y corrido un poco a la derecha */
.nx-pvProp__right{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left: 28px;
}

.nx-pvProp__note{
  margin:0;
  color:#fff;
  font-size:16px;
  font-weight:600;
  line-height:1.35;
  max-width:320px;
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
}
.nx-pvProp__left{ justify-content:flex-start; }
.nx-pvProp__right{ align-items:flex-start; }
/* Responsive */
@media (max-width: 980px){
  .nx-pvProp__box{
    grid-template-columns: 1fr;
    padding: 26px 20px;
    gap: 16px;
    min-height: 360px;
  }

  .nx-pvProp__sep{
    width:100%;
    height:1px;
    background: rgba(255,255,255,.55);
  }

  .nx-pvProp__sep::before{
    content:"";
    display:none;
  }

  .nx-pvProp__right{
    padding-left:0;
  }

  .nx-pvProp__note{
    max-width:none;
  }
}

/* ===== QUIENES SOMOS / HERO ===== */
.nx-qsHero{
  position:relative;
  width:100%;
  height:842px; /* mismo alto que tus heros */
  background:url("/assets/img/quienes-somos/quienessomos.jpg") center/cover no-repeat;
  overflow:hidden;
}

.nx-qsHero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg,
    rgba(0,0,0,.22) 0%,
    rgba(0,0,0,.12) 45%,
    rgba(0,0,0,0) 70%
  );
  pointer-events:none;
}

.nx-qsHero__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  height:100%;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-bottom: clamp(18px, 4vh, 56px);
}

.nx-qsHero__title{
  margin:0 0 22px;
  color:#fff;
  font-size:42px;
  font-weight:600;
  line-height:1.1;
}

/* cards */
.nx-qsHero__cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  align-items:stretch;
}

.nx-qsHero__card{
  border-radius:28px;
  background: linear-gradient(90deg, #03875A 0%, #009462 100%);
  color:#fff;
  min-height: 220px;
  padding: 28px 30px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow: 0 14px 34px rgba(0,0,0,.16);
}

.nx-qsHero__cardP{
  margin:0;
  color:#fff;
  font-size:20px;
  font-weight:400;
  line-height:1.35;
}

.nx-qsHero__cardP strong{
  font-weight:700;
  font-size:24px;
  line-height:1.15;
}

/* responsive */
@media (max-width: 1100px){
  .nx-qsHero{
    height:720px;
  }
  .nx-qsHero__cards{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .nx-qsHero__card{
    min-height: 150px;
    padding: 20px 18px;
    border-radius:22px;
  }
  .nx-qsHero__cardP{ font-size:16px; }
  .nx-qsHero__cardP strong{ font-size:20px; }
}

/* pantallas bajas (720p / Mac 13") */
@media (max-height: 820px) and (min-width: 1101px){
  .nx-qsHero{
    height:760px;
  }
}



/* =========================
   HERO CONTACTO
========================= */


/* ===== CONTACTO / HERO ===== */
.nx-ctHero{
  position:relative;
  width:100%;
  height:842px; /* mismo alto que tus heros */
  background:url("/assets/img/contacto/herocontacto.png") center/cover no-repeat;
  overflow:hidden;
}

/* overlay similar al resto (oscurece para legibilidad) */
.nx-ctHero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.28) 55%, rgba(0,0,0,.10) 100%),
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 55%);
  pointer-events:none;
}

.nx-ctHero__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  height:100%;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:18px;
}

.nx-ctHero__title{
  margin:0;
  color:#fff;
  font-size:58px;
  font-weight:600;
  line-height:1.05;
  max-width: 820px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}

.nx-ctHero__lead{
  margin:0;
  color:#fff;
  font-size:22px;
  font-weight:300;
  line-height:1.55;
  max-width: 720px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}

/* Responsive */
@media (max-width: 980px){
  .nx-ctHero{ height:720px; }
  .nx-ctHero__title{ font-size:42px; }
  .nx-ctHero__lead{ font-size:18px; }
}

/* Pantallas bajas (720p / Mac 13") */
@media (max-height: 820px) and (min-width: 981px){
  .nx-ctHero{ height:760px; }
}


/* ===== CONTACTO / FORM BLOQUE ===== */
.nx-cf{
  background:#fff;
  padding: 46px 0 70px;
}

.nx-cf__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

.nx-cf__grid{
  display:grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 38px;
  align-items:stretch;
}

/* Izquierda (imagen) */
.nx-cf__media{
  position:relative;
  border-radius:32px;
  overflow:hidden;
  min-height: 520px;
  box-shadow: 0 14px 34px rgba(0,0,0,.12);
}

.nx-cf__mediaBg{
  position:absolute;
  inset:0;
  background:url("/assets/img/contacto/formcontacto.jpg") center/cover no-repeat;
}

.nx-cf__media::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    /* leve oscurecido general (opcional pero ayuda) */
    linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.20) 100%),
    /* gradiente fuerte abajo: 60% en el borde inferior */
    linear-gradient(
      180deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 45%,
      rgba(0,0,0,.30) 70%,
      rgba(0,0,0,.75) 100%
    );
  pointer-events:none;
}

/* Reemplazá este bloque */
.nx-cf__mediaTxt{
  position:absolute;
  left:50%;
  bottom:32px;
  transform:translateX(-50%);
  width:100%;
  padding:0 32px;
  text-align:center;

  color:#fff;
  font-size: clamp(26px, 2.2vw, 44px);
  font-weight:600;
  line-height:1.05;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
/* Derecha (card celeste) */
.nx-cf__card{
  background:#CFE9F6;
  border-radius:32px;
  padding: 34px 34px 28px;
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
}

.nx-cf__form{
  display:flex;
  flex-direction:column;
  gap: 18px;
}

.nx-cf__field{ display:flex; flex-direction:column; gap:10px; }

.nx-cf__label,
.nx-cf__legend{
  color: var(--c-secondary, #00188A);
  font-size: 14px;
  font-weight:700;
  letter-spacing:.2px;
}

.nx-cf__req{ color:#d61b1b; }

.nx-cf__input{
  width:100%;
  border:0;
  border-bottom: 1px solid rgba(0,24,138,.45);
  background: transparent;
  padding: 10px 4px 12px;
  outline:none;
  color:#111;
  font-size: 14px;
}

.nx-cf__input:focus{
  border-bottom-color: rgba(0,24,138,.85);
}

.nx-cf__fieldset{
  border:0;
  padding: 0;
  margin: 2px 0 0;
  display:flex;
  flex-direction:column;
  gap: 10px;
}

.nx-cf__radio{
  display:flex;
  align-items:center;
  gap:10px;
  color:#111;
  font-size: 13px;
  font-weight:500;
}

.nx-cf__radio input{
  width:14px;
  height:14px;
  accent-color: var(--c-secondary, #00188A);
}

.nx-cf__field--msg{ margin-top: 2px; }

.nx-cf__textarea{
  width:100%;
  min-height: 120px;
  resize: vertical;
  border:0;
  border-radius:10px;
  padding: 12px 12px;
  outline:none;
  font-size: 14px;
  color:#111;
  background:#fff;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}

.nx-cf__textarea:focus{
  box-shadow: inset 0 0 0 2px rgba(0,24,138,.25);
}

/* Botón “ENVIAR” */
.nx-cf__submit{
  margin-top: 8px;
  align-self:flex-start;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  border:1px solid rgba(0,24,138,.45);
  border-radius:999px;
  padding: 10px 78px 10px 22px; /* espacio para la bola */
  background: transparent;
  cursor:pointer;
  overflow:hidden;
}

.nx-cf__submitTxt{
  color: var(--c-secondary, #00188A);
  font-size: 12px;
  font-weight:800;
  letter-spacing:.8px;
}

.nx-cf__submitDot{
  position:absolute;
  right:10px;
  top:50%;
  width:34px;
  height:34px;
  border-radius:999px;
  background: #0A7EC2;
  transform: translateY(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.nx-cf__submitArrow{
  width:16px;
  height:16px;
  background: url("/assets/img/que-hacemos/flechavideo.png") center/contain no-repeat;
  transform: rotate(-90deg); /* para que quede como “flecha a la derecha” si tu asset apunta arriba */
  filter: brightness(0) invert(1);
}

/* Hover */
.nx-cf__submit:hover{ opacity:.92; }

/* Responsive */
@media (max-width: 980px){
  .nx-cf{ padding: 34px 0 54px; }
  .nx-cf__grid{ grid-template-columns: 1fr; gap: 18px; }
  .nx-cf__media{ min-height: 360px; }
  .nx-cf__card{ padding: 24px 18px 20px; }
  .nx-cf__mediaTxt{ font-size: 22px; left:18px; bottom:18px; }
}



/* ===== ÚLTIMOS DESARROLLOS / HERO ===== */
.nx-udHero{
  position:relative;
  width:100%;
  height:842px; /* igual a tus heros */
  background:url("/assets/img/ultimos-desarrollos/ultimoshero.jpg") center/cover no-repeat;
  overflow:hidden;
}

/* overlay como tus heros (oscuro a la izquierda + leve arriba) */
.nx-udHero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.30) 55%, rgba(0,0,0,.12) 100%),
    linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,0) 55%);
  pointer-events:none;
}

.nx-udHero__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  height:100%;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:14px;
}

.nx-udHero__title{
  margin:0;
  color:#fff;
  font-size:58px;
  font-weight:600;
  line-height:1.05;
  max-width: 820px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}

.nx-udHero__lead{
  margin:0;
  color:#fff;
  font-size:22px;
  font-weight:300;
  line-height:1.55;
  max-width: 720px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}

/* Responsive */
@media (max-width: 980px){
  .nx-udHero{ height:720px; }
  .nx-udHero__title{ font-size:42px; }
  .nx-udHero__lead{ font-size:18px; }
}

/* Pantallas bajas (720p / Mac 13") */
@media (max-height: 820px) and (min-width: 981px){
  .nx-udHero{ height:760px; }
}


/* ===== ÚLTIMOS DESARROLLOS / BOTONES CATEGORÍA ===== */
.nx-udCats{
  background:#fff;
  padding: 28px 0 40px;
}

.nx-udCats__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
}

.nx-udCats__row{
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 26px;
  flex-wrap:wrap;
}

.nx-udCats__btn{
  width:285px;
  height:58px;
  border:2px solid #009FE3;
  border-radius:999px;
  background:#fff;
  color:#009FE3;
  text-decoration:none;

  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap: 18px;
  padding: 0 28px;

  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

.nx-udCats__ico{
  width:58px;
  height:28px;
  object-fit:contain;
  display:block;
  flex:0 0 auto;
}

.nx-udCats__txt{
  font-size:24px;
  font-weight:400;
  line-height:1;
  white-space:nowrap;
}

/* hover */
.nx-udCats__btn:hover{
  background: rgba(0,159,227,.08);
}

/* Responsive */
@media (max-width: 980px){
  .nx-udCats{ padding: 18px 0 26px; }
  .nx-udCats__row{ gap: 14px; }
  .nx-udCats__btn{
    width: min(392px, 92vw);
    height: 86px;
    padding: 0 20px;
  }
  .nx-udCats__ico{ width:64px; height:48px; }
  .nx-udCats__txt{ font-size: clamp(22px, 5vw, 34px); }
}




/* ===== ÚLTIMOS DESARROLLOS / CINTAS (MARQUEE SUAVE) ===== */
.nx-tape{
  background:#fff;
  padding: 26px 0 70px;
}

.nx-tape__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 80px);
  display:flex;
  flex-direction:column;
  gap: 22px;
}

/* viewport */
.nx-tape__viewport{
  width:100%;
  overflow:hidden;
}

/* loop: por defecto PAUSADO, corre solo cuando estás hover en la sección */
.nx-tape__loop{
  display:flex;
  width:max-content;
  gap: 26px;
  padding: 4px 0;
  will-change: transform;
  animation: nxTapeLeft var(--nx-tape-dur, 28s) linear infinite;
  animation-play-state: paused;
}

/* hover en toda la sección => ambas cintas corren */
.nx-tape:hover .nx-tape__loop{
  animation-play-state: running;
}

/* cinta B al revés (derecha) */
.nx-tape__lane--b .nx-tape__loop{
  animation-name: nxTapeRight;
}

/* tarjeta */
.nx-tape__item{
  flex:0 0 auto;
  width: min(680px, 78vw);
  border-radius:32px;
  overflow:hidden;
  position:relative;
  display:block;
  text-decoration:none;
  box-shadow: 0 14px 34px rgba(0,0,0,.12);
  background:#000;
  aspect-ratio: 680 / 360;
}

.nx-tape__img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transform: scale(1.001);
  transition: transform .35s ease;
}

/* overlay “cortina verde” + texto + botón */
.nx-tape__ov{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,148,98,.88) 100%);
  opacity:0;
  transform: translateY(24%);
  transition: opacity .22s ease, transform .28s ease;
  pointer-events:none;
}

.nx-tape__ovInner{
  position:absolute;
  left:24px;
  right:24px;
  bottom:22px;
  display:flex;
  align-items:center                                            ;
  justify-content:space-between;
  gap: 16px;
}

.nx-tape__ovTitle{
  color:#fff;
  font-size: 28px;
  font-weight:600;
  line-height:1.05;
  text-shadow: 0 2px 14px rgba(0,0,0,.25);
}

.nx-tape__ovBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  padding: 0 18px;
  border-radius:999px;
  background:#fff;
  color: var(--c-primary, #009462);
  font-size:14px;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}

/* hover por imagen */
.nx-tape__item:hover .nx-tape__img{ transform: scale(1.03); }
.nx-tape__item:hover .nx-tape__ov{
  opacity:1;
  transform: translateY(0);
}

/* animaciones (seamless: -50% porque duplicamos el set) */
@keyframes nxTapeLeft{
  from{ transform: translateX(0); }
  to  { transform: translateX(-50%); }
}
@keyframes nxTapeRight{
  from{ transform: translateX(-50%); }
  to  { transform: translateX(0); }
}

/* Accesibilidad: reduce motion */
@media (prefers-reduced-motion: reduce){
  .nx-tape__loop{ animation: none !important; transform:none !important; }
}

/* Responsive */
@media (max-width: 980px){
  .nx-tape{ padding: 18px 0 46px; }
  .nx-tape__inner{ gap: 14px; }
  .nx-tape__loop{ gap: 14px; }
  .nx-tape__item{
    width: min(86vw, 680px);
    border-radius:24px;
  }
  .nx-tape__ovTitle{ font-size: 22px; }
}

/* FIIIIIIIIIXXXXXXXXXXXXXXXXXXXXX PROYECTOSSSSSSSSSSSSSSSSSSSSSSS*/
/* ===== ÚLTIMOS DESARROLLOS / CINTAS (AUTO + HOVER COMO CAPTURA) ===== */
/* === OVERLAY: por defecto OCULTO (no pegado) === */

/* Overlay: por defecto invisible */
.nx-tape__ov{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transform:none;
  transition: opacity .18s ease;
  /* cortina verde suave (como screenshot) */
  background: rgba(0,148,98,.35);
}

/* Contenido abajo */
.nx-tape__ovInner{
  position:absolute;
  left:26px;
  right:26px;
  bottom:22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
          text-align:center;   
          transform: translateY(-14px); 
}

/* Título abajo izq */
.nx-tape__ovTitle{
  margin:0;
  color:#fff;
  font-size:30px;
  font-weight:600;
  line-height:1;
  text-shadow: 0 2px 14px rgba(0,0,0,.25);
}

/* Pill abajo der: “VER PROYECTO” */
.nx-tape__ovBtn{
  height:36px;
  padding:0 18px;
  border-radius:999px;

  background: rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.35);
  color:#fff;

  font-size:13px;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;

  box-shadow:none;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Mostrar SOLO en hover real (evita hover “pegado” en touch) */
@media (hover:hover) and (pointer:fine){
  .nx-tape__item:hover .nx-tape__img{ transform: scale(1.03); }
  .nx-tape__item:hover .nx-tape__ov{ opacity:1; }
  .nx-tape__item:hover .nx-tape__ovBtn{ background: rgba(255,255,255,.16); }
}

/* Keyboard */
.nx-tape__item:focus-visible .nx-tape__ov{ opacity:1; }


/* FIIIIIIIIINNNNNNNNNNNNN PROYECTOSSSSSSSSSSSSSSSSSSSSSSS*/















/* ===== PROPUESTA DE VALOR / BENEFICIOS (LIMPIO) ===== */
/* ===== PROPUESTA DE VALOR / BENEFICIOS (ALIGN + 410x411) ===== */

.nx-ben{
  background:#fff;
  padding: 46px 0 70px; /* aire abajo */
}

.nx-ben__inner{
  max-width:1920px;
  margin:0 auto;
  padding: 0 clamp(16px, 4vw, 90px);
}

.nx-ben__title{
  margin:0 0 22px;
  color:#00188A;
  font-size:58px;
  font-weight:600;
  line-height:1.05;
}

/* centrado y sin tirarse a la izquierda */
.nx-ben__grid{
  display:grid;
  grid-template-columns: repeat(4, 410px);
  gap: 35px;
  justify-content:center;
  align-items:stretch;
}

/* CARD EXACTA 410x411 */
.nx-ben__card{
  width:410px;
  height:411px;
  border-radius:22px;
  background: linear-gradient(90deg, #03875A 0%, #009462 100%);
  color:#fff;
  padding: 34px 28px 26px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  box-shadow: 0 14px 34px rgba(0,0,0,.14);
}

/* icono fijo para que arranque todo igual */
.nx-ben__icon{
  width:96px;
  height:96px;
  object-fit:contain;
  margin: 2px 0 18px;
}

/* ✅ TÍTULO ALINEADO: misma altura reservada para todos */
.nx-ben__h{
  margin:0;
  color:#fff;
  font-size:34px;
  font-weight:800;
  letter-spacing:.6px;
  line-height:1.05;
  text-transform:uppercase;

  min-height: 108px;           /* reserva espacio (2–3 líneas) */
  display:flex;
  align-items:center;          /* centra el texto dentro del bloque */
  justify-content:center;
}

/* ✅ PÁRRAFO ARRANCA SIEMPRE EN EL MISMO Y */
.nx-ben__p{
  margin: 16px 0 0;
  color:#fff;
  font-size:24px;
  font-weight:400;
  line-height:1.25;
  max-width: 330px;
}

/* 2x2 en pantallas más chicas */
@media (max-width: 1760px){
  .nx-ben__grid{
    grid-template-columns: repeat(2, 410px);
  }
}

/* Mobile: carrusel horizontal */
@media (max-width: 980px){
  .nx-ben__title{ font-size:42px; }

  .nx-ben__grid{
    grid-auto-flow: column;
    grid-auto-columns: 410px;
    grid-template-columns: unset;
    overflow-x:auto;
    overscroll-behavior-x: contain;
    scroll-snap-type:x mandatory;
    gap: 20px;
    justify-content:flex-start;
    padding-bottom: 10px;
  }

  .nx-ben__card{
    scroll-snap-align: start;
  }
}

/* ✅ SOLO agregado: video full-cover dentro de cada layer */
/* Video de fondo dentro de cada layer */
.nx-hero__bgVideo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;              /* por defecto oculto */
}

/* Cuando el layer es video, mostramos el video */
.nx-hero__bgLayer.is-video .nx-hero__bgVideo{
  display:block;
}

/* Y el layer NO debe tener background-image */
.nx-hero__bgLayer.is-video{
  background-image:none !important;
}



.nx-hero__bgVideo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
}

.nx-hero__bgLayer.is-video{
  background-image:none !important; /* evita “negro”/conflictos cuando es video */
}



















/* =========================================================
   GLOBAL TYPE SYSTEM — pegar al FINAL de main.css
   Objetivo: unificar H1/H2/H3/P en todo el sitio
========================================================= */

/* Tokens */
:root{
  --fs-h1: clamp(40px, 3.2vw, 58px);
  --fs-h2: clamp(32px, 2.6vw, 48px);
  --fs-h3: clamp(22px, 1.8vw, 32px);

  --fs-p: 18px;          /* texto base */
  --lh-p: 1.55;

  --fs-small: 14px;
  --lh-tight: 1.15;
}

/* Base global */
body{
  font-size: var(--fs-p);
  line-height: var(--lh-p);
}

/* Headings globales */
h1, .nx-h1{
  font-size: var(--fs-h1) !important;
  line-height: var(--lh-tight) !important;
  font-weight: 600;
  margin: 0;
}

h2, .nx-h2{
  font-size: var(--fs-h2) !important;
  line-height: 1.1 !important;
  font-weight: 600;
  margin: 0;
}

h3, .nx-h3{
  font-size: var(--fs-h3) !important;
  line-height: 1.15 !important;
  font-weight: 600;
  margin: 0;
}

/* Párrafos globales: esto es lo que te está fallando */
p{
  font-size: var(--fs-p) !important;
  line-height: var(--lh-p) !important;
}

/* Texto “pequeño” consistente */
small, .nx-small{
  font-size: var(--fs-small) !important;
  line-height: 1.35 !important;
}



/*fixxxx beneficios foto banner/*************  
/* ✅ PATCH: misma altura real en ambos lados */
.nx-pvProp__box{
  align-items: stretch;  /* antes: center */
}

/* que la columna izquierda también pueda estirarse y alinear contenido */
.nx-pvProp__left{
  display:flex;
  flex-direction:column;
  justify-content:center; /* si lo querés arriba: flex-start */
  height:100%;
}

/* separador: NO fijo, que estire a la misma altura */
.nx-pvProp__sep{
  height:auto;           /* antes: 170px */
  align-self:stretch;
  margin: 16px 0;        /* para que no toque bordes */
}

/* derecha: que ocupe el alto y no “flote” */
.nx-pvProp__right{
  height:100%;
  align-items:flex-start; /* opcional; si lo querés centrado dejalo en center */
}






/* FIX final: el texto derecho queda centrado vertical */
.nx-pvProp__box{
  align-items: stretch !important;
}

.nx-pvProp__sep{
  height: auto !important;
  align-self: stretch !important;
  margin: 16px 0 !important;
}

.nx-pvProp__right{
  height: 100% !important;
  align-self: stretch !important;
  display: flex !important;
  align-items: center !important;        /* <-- esto lo desclava */
  justify-content: flex-start !important;
}





/****************FIG QUE HACEMOOOOSSSSSSSSSSSS************/
/* REEMPLAZAR COMPLETO */
.nx-qhHero__inner{
  position:relative;
  z-index:1;
  max-width:1920px;
  height:100%;
  margin:0 auto;

  /* antes estaba “abajo”; en el boceto va arriba */
  padding: 64px clamp(16px, 4vw, 80px) 0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:18px;
}

/* REEMPLAZAR COMPLETO */
.nx-qhHero__card{
  /* mismo “volumen” que el card 02 (boceto) */
  width: 520px;
  min-height: 240px;   /* en vez de height fijo gigante */
  height: auto;

  border-radius:32px;
  padding: 26px 28px;
  background: linear-gradient(90deg, #03875A 0%, #009462 100%);
  color:#fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
}

/* REEMPLAZAR COMPLETO */
.nx-qhHero__kicker{
  display:flex;
  gap:14px;
  align-items:center;   /* en el boceto NO va “pegado abajo” */
  margin-bottom: 12px;
}

/* AJUSTE (opcional pero ayuda a que calce igual) */
.nx-qhHero__p{
  max-width: 460px;
}


/* el contenedor del hero tiene que ser el referente */
.nx-qhHero{
  position: relative !important;
  /* si tu hero no tiene altura, poné esto: */

}

.nx-qhHero__inner{
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: auto !important;
padding-bottom: clamp(90px, 9vw, 160px);
  height: auto !important;     /* NO 100% */
  margin: 0 auto !important;
}









/* =========================================================
   EXCEPCIONES (NO tocar tamaños de UI/diseño específico)
   Acá listamos lo que SÍ debe mantener tamaños propios
========================================================= */

/* HERO home */
.nx-hero__title{ font-size:55px !important; line-height:1.12 !important; }

/* Cards grandes (home) */
.nx-card__txt{ font-size:32px !important; line-height:1.22 !important; }
.nx-cards__lead{ font-size:22px !important; line-height:1.45 !important; } /* antes 25: más parejo */

/* “Qué hacemos” box */
.nx-qh__title{ font-size:55px !important; line-height:1.05 !important; }
.nx-qh__lbl{ font-size:28px !important; } /* antes 33: esto te estaba disparando todo */

/* Heros internos (mantener look) */
.nx-qhHero__title,
.nx-ctHero__title,
.nx-udHero__title{ font-size:58px !important; line-height:1.05 !important; }

/* Textos UI (labels, forms, nav) */
.nx-nav__link{ font-size:18px !important; }
.nx-cf__label, .nx-cf__legend{ font-size:14px !important; }
.nx-cf__input, .nx-cf__textarea{ font-size:14px !important; }

/* Mobile */
@media (max-width: 980px){
  :root{ --fs-p: 16px; }

  .nx-hero__title{ font-size: clamp(30px, 6vw, 44px) !important; }
  .nx-cards__lead{ font-size: clamp(16px, 3.8vw, 20px) !important; }
}
























/* Igualar espacio arriba/abajo del bloque de video */
.nx-qhVideo{
  padding-top: 48px !important;
  padding-bottom: 48px !important;
  margin-top: 0 !important;
}

/* Por si el inner trae padding propio */
.nx-qhVideo__inner{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Quitar “aire extra” que viene desde SERVICIOS hacia abajo */
.nx-serv{
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}


















/* ✅ Mobile: centrar y acomodar el card + contenido */
@media (max-width: 980px){

  .nx-qhHero__card{
    width: min(92vw, 615px) !important;
    height: auto !important;
    margin: 0 auto !important;
    align-self: center !important;
    box-sizing: border-box !important;
    padding: 22px 20px !important;
  }

  .nx-qhHero__kicker{
    flex-wrap: wrap !important;
    gap: 10px 12px !important;
    min-height: 0 !important;
    margin-bottom: 14px !important;
    align-items: center !important;
  }

  .nx-qhHero__lbl{
    white-space: normal !important; /* clave para que no se salga */
    line-height: 1.1 !important;
  }

  .nx-qhHero__p{
    max-width: 100% !important;
    word-break: normal !important;
  }
}


/* =========================
   CONTACTO — FIX MEDIA + RESPONSIVE
========================= */

/* contenedor general */
.nx-cf{ padding: clamp(18px, 3vw, 34px) 0; }
.nx-cf__inner{ width:min(1200px, calc(100% - 36px)); margin:0 auto; }

/* grid desktop: imagen + card */
.nx-cf__grid{
  display:grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: clamp(14px, 2vw, 24px);
  align-items: stretch;
}

/* ===== MEDIA (izq) ===== */
.nx-cf__media{
  position:relative;
  border-radius: 28px;
  overflow:hidden;
  min-height: 520px;              /* clave para que “se vea” */
  box-shadow: 0 16px 40px rgba(0,0,0,.10);
  background: #0b2f6b;            /* fallback */
}

/* la “imagen” */
.nx-cf__mediaBg{
  position:absolute; inset:0;
  background-repeat:no-repeat;
  background-size: cover;          /* clave */
  background-position: center;     /* clave */
  transform: translateZ(0);
}

/* overlay para legibilidad del texto */
.nx-cf__media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.18) 60%, rgba(0,0,0,0) 100%),
    linear-gradient(0deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,0) 55%);
  pointer-events:none;
}

/* texto encima */
.nx-cf__mediaTxt{
  position:absolute;
  left: clamp(16px, 3vw, 28px);
  bottom: clamp(16px, 3vw, 26px);
  z-index: 2;
  color:#fff;
  font-weight: 700;
  line-height: 1.06;
  text-shadow: 0 14px 28px rgba(0,0,0,.25);
  font-size: clamp(22px, 2.2vw, 32px);
}

/* ===== CARD (der) ===== */
.nx-cf__card{
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(0,131,201,.10), rgba(0,161,225,.10));
  border: 1px solid rgba(0,131,201,.16);
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
  padding: clamp(16px, 2.2vw, 24px);
}

/* inputs no se deformen en grid */
.nx-cf__input,
.nx-cf__textarea{
  width:100%;
  box-sizing:border-box;
}

/* =========================
   RESPONSIVE
========================= */

/* Tablet: apila */
@media (max-width: 980px){
  .nx-cf__grid{
    grid-template-columns: 1fr;
  }
  .nx-cf__media{
    min-height: 360px;
  }
}

/* Mobile: media con ratio fijo + texto más contenido */
@media (max-width: 640px){
  .nx-cf__media{
    min-height: 0;
    aspect-ratio: 16 / 10; /* para que siempre se vea bien */
    border-radius: 22px;
  }
  .nx-cf__mediaTxt{
    left: 16px;
    bottom: 16px;
    font-size: 22px;
  }
  .nx-cf__card{ border-radius: 22px; }
}