/* HAACI · Página Certificaciones [haaci_certificaciones]
   Se apoya en assets/inicio/inicio.css (variables, banner, botones, banda). */
.haaci-cert{overflow-x:clip}
.hce-hero{padding:clamp(62px,7.6vw,108px) 0 calc(clamp(40px,4.6vw,64px) + var(--onda-hero))}
.hce-hero .hi-hero-foto{background-position:right 30%; animation:hce-ken 30s ease-in-out infinite alternate}
@media (min-width:821px){
  .hce-hero{text-align:left}
  .hce-hero::before{background:linear-gradient(90deg,rgba(14,26,15,.84) 0%,rgba(14,26,15,.62) 36%,rgba(14,26,15,.18) 62%,rgba(14,26,15,.05) 100%)}
  .haaci-cert .hce-hero .hi-hero-in > *{margin-left:0!important; margin-right:auto!important; max-width:600px}
  .hce-hero h1{font-size:clamp(30px,3.8vw,52px)}
  .hce-hero .hce-cta,.hce-hero .hi-pie{justify-content:flex-start}
}
.hce-hero h1{max-width:none}
.hce-cta{justify-content:center; margin-top:26px; animation:hi-aparece .9s 1s both}
.ha-luz{position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(112deg,transparent 30%,rgba(201,226,126,.2) 47%,rgba(255,255,255,.14) 50%,transparent 64%); background-size:260% 100%; animation:hce-luz 9s 1.2s ease-in-out infinite; mix-blend-mode:screen}
@keyframes hce-ken{0%{transform:scale(1.04)} 100%{transform:scale(1.13) translate3d(-1.2%,-1%,0)}}
@keyframes hce-luz{0%{background-position:125% 0} 55%,100%{background-position:-45% 0}}
.hi-btn.pulso{animation:hce-pulso 2.6s 2.2s ease-out infinite}
@keyframes hce-pulso{0%{box-shadow:0 0 0 0 rgba(152,183,55,.7)} 70%{box-shadow:0 0 0 16px rgba(152,183,55,0)} 100%{box-shadow:0 0 0 0 rgba(152,183,55,0)}}
html{scroll-behavior:smooth}
#hce-programas{scroll-margin-top:90px}

/* qué incluye */
.haaci-cert .hce-incluye{list-style:none; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(14px,2vw,24px); margin-top:34px!important}
.hce-incluye li{margin:0; background:#fff; border:1px solid var(--linea); border-radius:14px; padding:24px 20px; box-shadow:0 16px 34px -30px rgba(0,0,0,.45); transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s}
.hce-incluye li:hover{transform:translateY(-5px); box-shadow:0 24px 40px -28px rgba(20,30,15,.5)}
.hce-incluye .ic,.hce-tipo .ic,.hce-prog .ic{display:grid; place-items:center; border-radius:50%; background:var(--v-suave); color:var(--v-txt); box-shadow:inset 0 0 0 1px rgba(152,183,55,.3)}
.hce-incluye .ic{width:56px; height:56px; margin-bottom:16px}
.hce-incluye .ic svg{width:26px; height:26px}
.hce-incluye h3{font-size:15px; font-weight:800; text-transform:uppercase; letter-spacing:.02em}
.haaci-cert .hce-incluye p{font-size:14px; margin-top:6px}

/* tipos */
.hce-tipos{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:26px}
.hce-tipo{display:flex; gap:12px; align-items:flex-start; padding:16px; border-radius:12px; background:var(--papel-2); border:1px solid var(--linea)}
.hce-tipo .ic{flex:0 0 42px; width:42px; height:42px}
.hce-tipo .ic svg{width:21px; height:21px}
.hce-tipo h3{font-size:13.5px; font-weight:800; text-transform:uppercase; display:flex; gap:6px; align-items:center}
.hce-tipo h3 small{font-size:11px; font-weight:700; color:#fff; background:var(--v); border-radius:99px; padding:1px 8px}
.haaci-cert .hce-tipo p{font-size:12.5px; line-height:1.55; margin-top:4px}

/* filtros */
.hce-filtros{display:flex; flex-wrap:wrap; gap:12px 18px; justify-content:space-between; align-items:center; margin:28px 0 20px}
.hce-filtros .chips{display:flex; flex-wrap:wrap; gap:8px}
.hce-filtros .chip{font-family:inherit; font-size:12.5px; font-weight:700; text-transform:none; letter-spacing:.01em; padding:8px 14px; border-radius:99px; border:1px solid var(--linea); background:#fff; color:var(--tinta); cursor:pointer; transition:.15s; line-height:1.2; box-shadow:none; margin:0}
.hce-filtros .chip span{display:inline-block; margin-left:4px; font-size:11px; color:var(--suave)}
.hce-filtros .chip:hover{border-color:var(--v); color:var(--v-txt)}
.hce-filtros .chip.on{background:var(--v); border-color:var(--v); color:#fff}
.hce-filtros .chip.on span{color:rgba(255,255,255,.85)}
.hce-filtros .buscar{display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--linea); border-radius:99px; padding:4px 6px 4px 14px; min-width:min(100%,330px); margin:0}
.hce-filtros .buscar svg{width:18px; height:18px; color:var(--v-txt); flex:0 0 18px}
.haaci-cert .hce-filtros .buscar input{border:0!important; background:transparent!important; box-shadow:none!important; font-family:inherit; font-size:14px; padding:8px 6px; margin:0; height:auto; flex:1; min-width:0; outline:none}
.hce-filtros .buscar:focus-within{border-color:var(--v); box-shadow:0 0 0 3px rgba(152,183,55,.18)}

/* programas */
.hce-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.hce-prog{position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--linea); border-radius:14px; padding:18px 18px 16px; box-shadow:0 14px 30px -28px rgba(0,0,0,.5); transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s, border-color .25s}
.hce-prog::before{content:""; position:absolute; left:18px; right:18px; top:0; height:3px; border-radius:0 0 3px 3px; background:var(--v); transform:scaleX(.18); transform-origin:left; transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.hce-prog:hover{transform:translateY(-5px); box-shadow:0 24px 42px -28px rgba(20,30,15,.55); border-color:rgba(152,183,55,.55)}
.hce-prog:hover::before{transform:scaleX(1)}
.hce-prog[hidden]{display:none}
.hce-prog .top{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.hce-prog .ic{width:34px; height:34px}
.hce-prog .ic svg{width:17px; height:17px}
.hce-prog .tipo{font-size:10.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--v-txt)}
.hce-prog .norma{margin-left:auto; font-size:11px; font-weight:700; color:var(--tinta); background:var(--papel-2); border:1px solid var(--linea); border-radius:99px; padding:2px 9px}
.hce-prog h3{font-size:14px; font-weight:800; text-transform:uppercase; line-height:1.35; margin-top:12px!important; flex:1}
.hce-prog h3 a{color:var(--tinta)!important; text-decoration:none!important}
.hce-prog h3 a:hover{color:var(--v-txt)!important}
.haaci-cert .hce-prog .fecha{display:flex; gap:7px; align-items:center; font-size:12.5px; color:var(--suave); margin-top:12px; padding-top:11px; border-top:1px solid var(--linea)}
.hce-prog .fecha svg{width:15px; height:15px; flex:0 0 15px}
.haaci-cert .hce-prog .fecha.si{color:var(--tinta); font-weight:700}
.hce-prog .fecha.si svg{color:var(--v-txt)}
.haaci-cert .hce-prog .meta{font-size:12px; color:var(--suave); margin-top:3px}
.hce-prog .acc{display:flex; gap:8px; margin-top:14px}
.hce-prog .acc .hi-btn{flex:1; padding:10px 12px; font-size:11px; border-radius:99px}
.hce-vacio{text-align:center; margin-top:22px}
.hce-mas{text-align:center; margin-top:28px}
.hce-mas .hi-btn{min-width:260px}

/* pasos */
.haaci-cert .hce-pasos{list-style:none; margin:30px 0 0!important; padding:0!important; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(16px,2.4vw,30px); position:relative}
.hce-pasos::before{content:""; position:absolute; left:28px; right:28px; top:27px; height:2px; background:linear-gradient(90deg,var(--v),rgba(152,183,55,.15)); z-index:0}
.hce-pasos li{position:relative; z-index:1; margin:0}
.hce-pasos .n{display:grid; place-items:center; width:56px; height:56px; border-radius:50%; background:#fff; border:2px solid var(--v); color:var(--v-txt); font-size:20px; font-weight:800; box-shadow:0 10px 24px -16px rgba(95,139,33,.9); margin-bottom:14px}
.hce-pasos li:last-child .n{background:var(--v); color:#fff}
.hce-pasos h3{font-size:15px; font-weight:800; text-transform:uppercase}
.haaci-cert .hce-pasos p{font-size:14px; margin-top:6px}

/* certificado verificable */
.hce-verif{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:clamp(26px,5vw,70px); align-items:center}
.haaci-cert .hce-lista{list-style:none; margin-top:18px!important; display:flex; flex-direction:column; gap:10px}
.hce-lista li{display:flex; align-items:center; gap:10px; margin:0; font-weight:600; color:var(--tinta); font-size:14px}
.hce-lista svg{width:22px; height:22px; color:var(--v-txt); flex:0 0 22px}
.hce-diploma{position:relative; justify-self:center; width:min(100%,440px); aspect-ratio:1.414/1; background:#fff; border-radius:10px; overflow:hidden; padding:22px 26px;
  box-shadow:0 30px 60px -30px rgba(20,30,15,.55), inset 0 0 0 1px var(--linea); transform:rotate(-2.5deg); animation:hce-flota 7s ease-in-out infinite}
.hce-diploma::before{content:""; position:absolute; right:-40px; top:-30px; width:180px; height:120%; background:linear-gradient(160deg,var(--v) 0%,#6d8f24 60%,var(--oro-2) 100%); transform:skewX(-18deg); opacity:.95}
.hce-diploma::after{content:""; position:absolute; inset:9px; border:1.5px solid rgba(184,137,46,.55); border-radius:6px; pointer-events:none}
.hce-diploma .d-cab{position:relative; display:flex; flex-direction:column}
.hce-diploma .d-logo{font-size:22px; font-weight:800; color:#4d4d4d; letter-spacing:.02em}
.hce-diploma .d-sub{font-size:7px; letter-spacing:.14em; text-transform:uppercase; color:var(--suave)}
.haaci-cert .hce-diploma .d-otorga{position:relative; margin-top:16px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--suave)}
.haaci-cert .hce-diploma .d-tit{position:relative; font-size:18px; font-weight:800; color:var(--v-txt); text-transform:uppercase; line-height:1.15; max-width:62%; margin-top:2px}
.hce-diploma .d-linea{position:relative; display:block; height:6px; border-radius:6px; background:#EEF1EA; margin-top:10px; max-width:58%}
.hce-diploma .d-linea.l1{margin-top:16px; max-width:52%; background:#DDE6CF}
.hce-diploma .d-linea.l3{max-width:40%}
.hce-diploma .d-pie{position:absolute; left:26px; right:26px; bottom:20px; display:flex; justify-content:space-between; align-items:flex-end}
.hce-diploma .d-sello{width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 35% 30%,var(--oro-3),var(--oro-2) 55%,var(--oro)); color:#fff; box-shadow:0 8px 16px -8px rgba(184,137,46,.9)}
.hce-diploma .d-sello svg{width:26px; height:26px}
.hce-diploma .d-qr{position:relative; width:58px; height:58px; background:#fff; border-radius:8px; display:grid; place-items:center; color:#222; box-shadow:0 6px 16px -8px rgba(0,0,0,.4)}
.hce-diploma .d-qr svg{width:44px; height:44px}
.hce-diploma .d-brillo{position:absolute; inset:0; background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 48%,transparent 60%); background-size:250% 100%; animation:hce-luz 6s 1s ease-in-out infinite}
@keyframes hce-flota{0%,100%{transform:rotate(-2.5deg) translateY(0)} 50%{transform:rotate(-1.5deg) translateY(-9px)}}

/* preguntas (mismo estilo que Membresías) */
.hce-faq{margin-top:22px; max-width:900px}
.hce-faq details{border-bottom:1px solid var(--v); padding:18px 2px}
.hce-faq details:first-child{border-top:1px solid var(--v)}
.hce-faq summary{cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:14px; align-items:center; font-size:15px; font-weight:700; color:var(--tinta)}
.hce-faq summary::-webkit-details-marker{display:none}
.hce-faq summary::after{content:"+"; flex:0 0 28px; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--v-suave); color:var(--v-txt); font-size:18px; font-weight:600}
.hce-faq details[open] summary::after{content:"−"; background:var(--v); color:#fff}
.haaci-cert .hce-faq p{margin-top:10px; font-size:14.5px; max-width:80ch}

@media (max-width:1000px){
  .haaci-cert .hce-incluye,.hce-tipos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hce-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .haaci-cert .hce-pasos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hce-pasos::before{display:none}
}
@media (max-width:820px){
  .hce-hero .hi-hero-foto{background-image:var(--hero-m); background-position:center 30%}
  .hce-verif{grid-template-columns:1fr}
}
@media (max-width:600px){
  .haaci-cert .hce-incluye,.hce-tipos,.hce-grid,.haaci-cert .hce-pasos{grid-template-columns:1fr}
  .hce-filtros .chips{flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; -webkit-overflow-scrolling:touch}
  .hce-filtros .chip{white-space:nowrap}
}
@media (prefers-reduced-motion: reduce){ .hce-hero .hi-hero-foto,.ha-luz,.hce-diploma,.hce-diploma .d-brillo,.hi-btn.pulso{animation:none} }

@media (max-width:1100px) and (min-width:761px){ .haaci-cert .hce-incluye{grid-template-columns:repeat(3,minmax(0,1fr))} }
