/* Nosotros — la página menos SaaS del sitio.
   Sin capturas, sin tarjetas con iconos, sin flechas: aquí no hay CTA de hero.
   El recurso propio es la tipografía a escala de manifiesto y el isotipo
   usado como elemento gráfico, no como logotipo. */

/* --- hero --- */
.hero-n{position:relative;overflow:hidden;padding:clamp(70px,11vw,150px) 0 clamp(64px,9vw,120px)}
.hero-n .wrap{position:relative;z-index:2}
.hero-n h1{max-width:19ch;font-size:clamp(2.3rem,5.6vw,4.3rem);line-height:1.03}
.hero-n .texto-l{margin-top:30px;max-width:54ch;color:#C4D4E1;font-size:clamp(1.08rem,1.6vw,1.25rem)}
.rotulo-n{font-size:.98rem;font-weight:600;color:var(--mint);letter-spacing:-.01em;margin-bottom:20px}
.firma-marca{margin-top:clamp(44px,6vw,80px);padding-top:22px;border-top:1px solid rgba(255,255,255,.14);
  font-size:1.02rem;color:#8CA4B8}
.isotipo{position:absolute;right:-11%;top:50%;transform:translateY(-50%);width:min(620px,58vw);
  opacity:.13;pointer-events:none;z-index:1}

/* --- manifiesto --- */
.manifiesto{font-size:clamp(2.1rem,6.4vw,4.6rem);font-weight:700;letter-spacing:-.032em;line-height:1.02;
  max-width:16ch}
.manifiesto-medio{font-size:clamp(1.8rem,4.6vw,3.3rem);font-weight:700;letter-spacing:-.028em;line-height:1.08;
  max-width:20ch}
.acento{color:var(--teal-texto)}
.s-navy .acento,.s-teal-n .acento{color:var(--mint)}

/* --- verbos de la vida en una organización --- */
.verbos{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:clamp(30px,4vw,48px)}
.verbos span{padding:11px 20px;border:1px solid var(--linea);border-radius:99px;font-size:1.04rem;color:#3D5163;background:#fff}

/* --- principios --- */
.principios{display:grid;gap:0;border-top:2px solid var(--navy)}
.principio{padding:26px 0;border-bottom:1px solid var(--linea)}
.principio h3{font-size:clamp(1.5rem,3vw,2.05rem);letter-spacing:-.026em;font-stretch:106%}
.principio p{margin-top:12px;font-size:1.04rem;line-height:1.5;color:var(--gris);max-width:44ch}

/* --- territorio teal de la página --- */
.s-teal-n{background:#08403E;color:#fff}
.s-teal-n .texto,.s-teal-n .texto-l,.s-teal-n .mini{color:#A9CFC9}

/* --- pares del tagline --- */
.pares{display:grid;gap:0;border-top:1px solid rgba(255,255,255,.16)}
.par-t{padding:24px 0;border-bottom:1px solid rgba(255,255,255,.16)}
.par-t b{display:block;font-weight:700;font-size:clamp(1.6rem,3.4vw,2.4rem);letter-spacing:-.028em;font-stretch:106%}
.par-t span{font-size:1.06rem;color:#8CA4B8}

/* --- de irregular a alineado --- */
.desorden{display:grid;gap:10px;max-width:520px}
.desorden span{padding:13px 18px;background:#fff;border:1px solid var(--linea);border-radius:var(--radio-s);
  font-size:.99rem;color:#3D5163}
.desorden span:nth-child(1){margin-left:0}
.desorden span:nth-child(2){margin-left:26px}
.desorden span:nth-child(3){margin-left:9px}
.desorden span:nth-child(4){margin-left:38px}
.desorden span:nth-child(5){margin-left:17px}

/* --- modelo alrededor de la organización --- */
.modelo{max-width:820px;margin:0 auto}
.fig .centro{fill:#082238;stroke:#082238}
.fig .centro-et{font-family:inherit;font-size:18px;font-weight:700;fill:#fff}

/* --- equipo --- */
.equipo{display:grid;gap:0;border-top:1px solid var(--linea)}
.equipo p{padding:20px 0;border-bottom:1px solid var(--linea);font-size:1.06rem;line-height:1.55;max-width:60ch;color:var(--gris)}
.equipo b{color:var(--navy);font-weight:600}

/* --- cierre propio --- */
.cierre-n{background:#051828;color:#fff;position:relative;overflow:hidden}
.cierre-n::before{content:"";position:absolute;inset:auto -20% -60% -20%;height:70%;
  background:linear-gradient(100deg,#0F8F83,#28C789);opacity:.18;filter:blur(70px)}
.cierre-n .wrap{position:relative;z-index:2}
.cierre-n h2{max-width:18ch;font-size:clamp(2rem,4.6vw,3.3rem)}
.cierre-n .texto-l{margin-top:24px;color:#B9CCDB}
.ctas-n{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(34px,4.6vw,54px)}
.tagline-final{margin-top:clamp(40px,5vw,66px);padding-top:22px;border-top:1px solid rgba(255,255,255,.14);
  font-size:1.1rem;color:#8CA4B8}

@media (min-width:720px){
  .principios{grid-template-columns:repeat(3,1fr);column-gap:38px}
  .principio{border-bottom:0}
  .pares{grid-template-columns:1fr 1fr;column-gap:44px}
}
@media (min-width:900px){
  .par-t{padding:28px 0}
}