/* HAACI · Página HAACI / Nosotros [haaci_nosotros]
   Se apoya en assets/inicio/inicio.css (variables, banner, secciones, banda, marquesina). */

.haaci-nos{overflow-x:clip}
/* banner más bajo que el de Inicio */
.hn-hero{padding:clamp(60px,7.5vw,104px) 0 calc(clamp(40px,4.6vw,64px) + var(--onda-hero))}
.hn-hero .hi-hero-foto{background-position:center 42%}
.hn-hero::before{
  background:
    radial-gradient(44% 70% at 50% 50%, rgba(16,28,17,.66) 0%, rgba(16,28,17,.40) 58%, rgba(16,28,17,.10) 100%),
    linear-gradient(180deg, rgba(16,28,17,.06) 0%, rgba(16,28,17,.26) 100%)}
.hn-hero h1{max-width:none}
.hn-hero .hi-sub{max-width:56ch}

/* Acerca de: texto + ruta Conocer · Desarrollar · Aplicar */
.hn-acerca-grid{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:clamp(28px,5vw,64px); align-items:center}
.hn-acerca{max-width:66ch}
.hn-ruta{list-style:none; margin:0!important; padding:0!important; position:relative; display:grid; gap:10px; --k:0; width:100%; max-width:390px; justify-self:end}
.hn-ruta .paso{position:relative; z-index:1; display:flex; gap:12px; align-items:flex-start; margin:0; padding:11px 14px 11px 12px; border-radius:9px; background:#fff; border:1px solid var(--linea);
  box-shadow:0 10px 26px -24px rgba(0,0,0,.45); transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s, border-color .5s, background .5s; cursor:default}
.hn-ruta .ico{flex:0 0 38px; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:var(--v-suave); color:var(--v-txt); position:relative; transition:background .5s, color .5s, transform .5s}
.hn-ruta .ico svg{width:19px; height:19px}
.hn-ruta .ico::after{content:""; position:absolute; inset:-4px; border-radius:50%; border:2px solid var(--v); opacity:0; transform:scale(.8)}
.hn-ruta .num{display:block; font-size:9.5px; font-weight:800; letter-spacing:.14em; color:var(--suave); transition:color .5s}
.hn-ruta h3{font-size:13.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-top:1px!important; transition:color .5s}
.haaci-nos .hn-ruta p{font-size:12.5px; line-height:1.5; margin-top:2px}
.hn-ruta .paso.hecho .ico{background:#E4EFCB}
.hn-ruta .paso.activo{transform:translateX(-6px); border-color:rgba(152,183,55,.6); box-shadow:0 20px 40px -24px rgba(95,139,33,.75); background:linear-gradient(120deg,#fff 55%,var(--v-suave))}
.hn-ruta .paso.activo .ico{background:var(--v); color:#fff; transform:scale(1.06)}
.hn-ruta .paso.activo .ico::after{animation:hn-onda 1.6s ease-out infinite}
.hn-ruta .paso.activo .num,.hn-ruta .paso.activo h3{color:var(--v-txt)}
.hn-ruta .riel{position:absolute; z-index:0; left:31px; top:30px; bottom:30px; width:2px; background:var(--linea); list-style:none; margin:0!important}
.hn-ruta .riel i{position:absolute; left:0; top:0; width:100%; height:calc(var(--k) * 50%); background:var(--v); transition:height .9s cubic-bezier(.4,0,.2,1)}
.hn-ruta .riel i::after{content:""; position:absolute; left:50%; bottom:-5px; width:10px; height:10px; margin-left:-5px; border-radius:50%; background:var(--v); box-shadow:0 0 0 5px rgba(152,183,55,.25)}
@keyframes hn-onda{0%{opacity:.7; transform:scale(.85)} 100%{opacity:0; transform:scale(1.35)}}

/* Nuestro enfoque: profesional al frente con los logros a los lados */
.hn-retrato{position:relative; justify-self:center; width:min(100%,315px); aspect-ratio:1/1.08; margin-block:-10px; isolation:isolate}
.hn-retrato .disco{position:absolute; z-index:-2; left:9%; right:9%; bottom:0; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#C4DA7A 0%,#A8C84A 38%,#98B737 62%,#7F9C28 100%); box-shadow:0 30px 60px -30px rgba(95,139,33,.75)}
.hn-retrato .aro{position:absolute; z-index:-3; left:50%; bottom:38%; border-radius:50%; border:1px solid rgba(152,183,55,.35); transform:translate(-50%,50%)}
.hn-retrato .aro.a1{width:98%; aspect-ratio:1}
.hn-retrato .aro.a2{width:108%; aspect-ratio:1; border-style:dashed; border-color:rgba(169,169,169,.45); animation:hn-girar 60s linear infinite}
.hn-retrato .recorte{position:absolute; z-index:0; left:9%; right:9%; bottom:0; aspect-ratio:1/1.35; overflow:hidden;
  border-radius:0 0 50% 50% / 0 0 37% 37%}
.hn-retrato .persona{position:absolute; left:47%; bottom:0; height:100%; width:auto!important; max-width:none!important; transform:translateX(-50%)}
.hn-retrato .chip{position:absolute; z-index:2; display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.96); color:var(--tinta); font-size:11px; font-weight:700; padding:7px 11px 7px 8px; border-radius:99px;
  box-shadow:0 12px 26px -14px rgba(0,0,0,.45); white-space:nowrap; animation:hn-flota 6s ease-in-out infinite; backdrop-filter:blur(6px)}
.hn-retrato .chip svg{width:15px; height:15px; padding:2.5px; border-radius:50%; background:var(--v); color:#fff; flex:0 0 15px}
.hn-retrato .chip{right:-12%}
.hn-retrato .c1{top:46%}
.hn-retrato .c2{top:60%; right:-18%; animation-delay:-2s}
.hn-retrato .c3{top:74%; animation-delay:-4s}
@keyframes hn-flota{0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)}}
@keyframes hn-girar{to{transform:translate(-50%,50%) rotate(360deg)}}
.haaci-nos .hn-acerca p + p{margin-top:14px}

/* cifras, sin rejilla */
.hn-cifras{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(20px,3vw,44px); margin-top:clamp(44px,5.5vw,72px)}
.hn-cifra{text-align:center; position:relative; padding:6px 8px}
.hn-cifra + .hn-cifra::before{content:""; position:absolute; left:calc(clamp(20px,3vw,44px) / -2); top:14%; bottom:14%; width:1px;
  background:linear-gradient(to bottom,transparent,var(--linea) 22%,var(--linea) 78%,transparent)}
.hn-cifra b{display:block; font-size:clamp(30px,3.8vw,44px); font-weight:800; color:var(--v-txt); font-variant-numeric:tabular-nums; line-height:1}
.hn-cifra b.txt{font-size:clamp(19px,2.3vw,27px); letter-spacing:.01em; line-height:1.4}
.hn-cifra span{display:block; font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--suave); margin-top:10px}
.hn-cifras .rv-in:nth-child(2){transition-delay:.1s} .hn-cifras .rv-in:nth-child(3){transition-delay:.2s} .hn-cifras .rv-in:nth-child(4){transition-delay:.3s}

/* Nuestro enfoque */
.hn-enfoque{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(24px,5vw,56px); align-items:center}
/* Galería */
.hn-albumes{display:flex; gap:8px; flex-wrap:wrap; margin-top:22px}
.hn-album{font-family:inherit; font-size:12px; font-weight:600; padding:8px 15px; border-radius:99px; border:1px solid var(--linea); background:#fff; color:var(--texto); cursor:pointer; display:inline-flex; gap:8px; align-items:center; transition:.15s; line-height:1.4; text-transform:none; letter-spacing:.01em}
.hn-album:hover{border-color:var(--v); color:var(--v-txt)}
.hn-album[aria-pressed="true"]{background:var(--v); border-color:var(--v); color:#fff}
.hn-album .n{font-size:10.5px; opacity:.8; font-variant-numeric:tabular-nums}
.hn-carr{position:relative; margin-top:22px}
.hn-carr-t{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x proximity; scroll-behavior:smooth; padding:4px 2px 10px; scrollbar-width:none}
.hn-carr-t::-webkit-scrollbar{display:none}
.hn-carr::after{content:""; position:absolute; top:0; right:0; bottom:10px; width:46px; pointer-events:none; background:linear-gradient(90deg,transparent,var(--papel-2)); opacity:0; transition:.2s}
.hn-carr[data-fin="no"]::after{opacity:1}
.hn-carr-b{position:absolute; top:calc(50% - 5px); transform:translateY(-50%); width:40px; height:40px; border-radius:50%; border:1px solid var(--linea); background:#fff; color:var(--tinta); cursor:pointer; display:grid; place-items:center; z-index:3; box-shadow:0 3px 12px -4px rgba(0,0,0,.25); font:inherit; font-size:20px; line-height:1; padding:0}
.hn-carr-b:hover{border-color:var(--v); color:var(--v-txt)}
.hn-carr-b[disabled]{opacity:.3; cursor:default}
.hn-carr-b.prev{left:-18px} .hn-carr-b.next{right:-18px}
.hn-foto{flex:0 0 auto; width:300px; scroll-snap-align:start; position:relative; aspect-ratio:4/3; border:0; padding:0; border-radius:var(--r); overflow:hidden; cursor:zoom-in; background:#ddd; box-shadow:0 8px 22px -16px rgba(0,0,0,.5); transition:box-shadow .2s}
.hn-foto[hidden]{display:none}
.hn-foto img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .45s ease}
.hn-foto:hover{box-shadow:0 14px 30px -14px rgba(0,0,0,.55)}
.hn-foto:hover img{transform:scale(1.05)}
.hn-foto .cap{position:absolute; left:0; right:0; bottom:0; padding:26px 12px 10px; font-size:12px; font-weight:600; line-height:1.35; color:#fff; text-align:left; background:linear-gradient(to top,rgba(10,16,10,.78),transparent)}
.haaci-nos .hn-hint{display:none; font-size:11.5px; color:var(--suave); margin-top:4px}

/* visor */
.hn-visor{position:fixed; inset:0; z-index:100000; background:rgba(10,14,10,.9); display:grid; place-items:center; padding:24px; font-family:'Montserrat',Arial,sans-serif}
.hn-visor-c{background:#fff; border-radius:6px; max-width:860px; width:100%; padding:18px; text-align:center}
.hn-visor-c img{width:100%; max-height:70vh; object-fit:contain; border-radius:4px; display:block}
.hn-visor-c h3{font-size:16px; font-weight:700; color:#333; margin:14px 0 0}
.hn-visor-c .cnt{font-size:11.5px; color:#8f8f8f; margin:6px 0 0}
.hn-visor-c .nav{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:16px}
.hn-visor .hi-btn{display:inline-flex; font-family:inherit; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:11px 18px; border-radius:3px; border:2px solid #E6E6E6; background:#fff; color:#333; cursor:pointer}
.hn-visor .hi-btn.p{background:#98B737; border-color:#98B737; color:#fff}

/* avales */
.hn-avales .hi-marq{padding-block:6px}
.hn-avales .hi-marq .cliente{width:170px; height:100px; margin:0 20px}
.haaci-nos .hn-avales .hi-marq .cliente img{width:auto!important; height:auto!important; max-width:100%!important; max-height:92px!important; object-fit:contain}

@media (max-width:900px){
  .hn-cifras{grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:28px}
  .hn-cifra:nth-child(3)::before{display:none}
  .hn-carr-b{display:none}
  .haaci-nos .hn-hint{display:block}
  .hn-foto{width:250px}
  .hn-avales .hi-marq .cliente{width:120px; height:74px; margin:0 12px}
  .haaci-nos .hn-avales .hi-marq .cliente img{max-height:68px!important}
}
@media (max-width:980px){
  .hn-acerca-grid{grid-template-columns:1fr}
  .hn-ruta{justify-self:start; max-width:460px}
  .hn-ruta .paso.activo{transform:translateY(-3px)}
}
@media (max-width:820px){
  .hn-enfoque{grid-template-columns:1fr}
  .hn-retrato{margin-top:6px; width:min(100%,280px)}
  .hn-retrato .persona{left:44%}
  .hn-retrato .chip{right:-2%; font-size:10px; padding:6px 9px 6px 7px}
  .hn-retrato .chip svg{width:13px; height:13px; flex-basis:13px}
  .hn-retrato .c1{top:50%} .hn-retrato .c2{top:63%; right:-5%} .hn-retrato .c3{top:76%}
}
@media (prefers-reduced-motion: reduce){
  .hn-retrato *,.hn-ruta *{animation:none!important; transition:none!important}
}