/* HAACI · Banner por área (ficha del curso, catálogo /courses/ y páginas de área)
   Reutiliza el banner del rediseño (assets/inicio/inicio.css: .hi-hero, onda, animaciones)
   con texto a la izquierda, movimiento continuo de la foto y un barrido de luz. */
.haaci-ini.ha-cabecera{background:transparent; font-size:15px}
.ha-hero{text-align:left; padding:clamp(50px,6.2vw,88px) 0 calc(clamp(30px,3.6vw,50px) + var(--onda-hero)); min-height:clamp(250px,26vw,380px)}
.ha-hero .hi-hero-foto{animation:ha-ken 30s ease-in-out infinite alternate; background-position:center 38%}
.ha-hero::before{background:
  linear-gradient(90deg,rgba(14,26,15,.86) 0%,rgba(14,26,15,.66) 38%,rgba(14,26,15,.28) 72%,rgba(14,26,15,.12) 100%),
  linear-gradient(180deg,rgba(14,26,15,.12) 0%,rgba(14,26,15,.34) 100%)}
.ha-luz{position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(112deg,transparent 30%,rgba(201,226,126,.0) 40%,rgba(201,226,126,.20) 47%,rgba(255,255,255,.14) 50%,rgba(201,226,126,.0) 58%,transparent 70%);
  background-size:260% 100%; animation:ha-luz 9s 1.2s ease-in-out infinite; mix-blend-mode:screen}
.ha-in{max-width:1200px}
.ha-hero .hi-eyebrow{margin-bottom:12px; text-shadow:0 1px 10px rgba(6,12,7,.6)}
.haaci-ini .ha-titulo{margin:0; color:#fff; font-size:clamp(28px,4.2vw,52px); font-weight:800; text-transform:uppercase; line-height:1.06; max-width:22ch;
  padding-left:clamp(14px,1.6vw,20px); border-left:5px solid var(--v); text-shadow:0 2px 18px rgba(6,12,7,.55); text-wrap:balance}
.ha-titulo span{display:block; animation:hi-sube .85s .25s cubic-bezier(.2,.8,.2,1) both}
.haaci-ini .ha-sub{max-width:64ch; margin-top:14px; color:rgba(255,255,255,.9); font-size:15px; line-height:1.65; text-shadow:0 1px 12px rgba(6,12,7,.6); animation:hi-aparece .9s .55s both}
.haaci-ini .ha-chips{list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 0!important; padding:0!important}
.ha-chips li{display:flex; align-items:center; gap:8px; margin:0; padding:8px 15px 8px 12px; border-radius:99px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); font-size:13px; font-weight:600; color:#fff; line-height:1.3; animation:hi-aparece .7s calc(.75s + var(--i,0) * .12s) both}
.ha-chips svg{flex:0 0 17px; width:17px; height:17px; color:#C9E27E}
.ha-migas{padding-top:4px; padding-bottom:6px}
.ha-migas .breadcrumbs-wrapper,.ha-migas #breadcrumbs,.ha-migas .thim-breadcrumbs{margin:0!important; padding:6px 0!important; border:0!important; background:transparent!important; font-size:13px}
@keyframes ha-ken{0%{transform:scale(1.06) translate3d(-1.4%,0,0)} 100%{transform:scale(1.17) translate3d(1.4%,-1.6%,0)}}
@keyframes ha-luz{0%{background-position:125% 0} 55%,100%{background-position:-45% 0}}
@media (max-width:820px){
  .ha-hero{min-height:0; padding-top:42px}
  .haaci-ini .ha-chips{gap:8px}
  .ha-chips li{font-size:12px; padding:7px 12px 7px 10px}
}
@media (prefers-reduced-motion: reduce){
  .ha-hero .hi-hero-foto,.ha-luz,.ha-titulo span,.ha-sub,.ha-chips li{animation:none!important}
}

/* =====================================================================
   Variables del estilo nuevo (solo body.haaci-estilo-nuevo)
   ===================================================================== */
body.haaci-estilo-nuevo{--v:#98B737; --v-osc:#7F9C28; --v-txt:#5F8B21; --v-suave:#F1F7E7; --tinta:#333; --texto:#666; --suave:#8f8f8f; --linea:#E6E6E6}

/* Ficha: el diseño original del tema, solo con etiquetas de categoría y botones animados */
.haaci-ctx-curso .course-meta-single .course-categories label{font-size:10.5px!important; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--suave)!important}
.haaci-ctx-curso .course-meta-single .course-categories .value{display:flex; flex-wrap:wrap; gap:6px; margin-top:4px; font-size:0!important}
.haaci-ctx-curso .course-meta-single .course-categories .value a{font-size:11.5px!important; font-weight:600; color:var(--v-txt)!important; background:var(--v-suave); border:1px solid rgba(152,183,55,.35); border-radius:99px; padding:3px 11px; text-decoration:none!important}
.haaci-ctx-curso .course-meta-single .course-categories .value a:hover{background:var(--v); color:#fff!important}
.haaci-ctx-curso .lp-course-buttons{gap:10px!important}
.haaci-ctx-curso .lp-course-buttons .lp-button{border-radius:99px!important; padding:12px 22px!important; height:auto!important; line-height:1.2!important; font-size:12px!important; font-weight:700!important; letter-spacing:.06em!important;
  text-transform:uppercase; transition:transform .15s, box-shadow .2s, background .2s!important; box-shadow:0 10px 22px -14px rgba(95,139,33,.9)}
.haaci-ctx-curso .lp-course-buttons .lp-button:hover{transform:translateY(-2px)}
.haaci-ctx-curso .lp-course-buttons .button-form-contact{background:#fff!important; color:var(--v-txt)!important; border:1.5px solid var(--v)!important; box-shadow:none}
.haaci-ctx-curso .lp-course-buttons .button-form-contact:hover{background:var(--v-suave)!important}
.haaci-ctx-curso .lp-course-buttons .button-form-course{background:var(--v)!important; color:#fff!important; border:1.5px solid var(--v)!important; animation:ha-pulso 2.8s 2s ease-out infinite}
.haaci-ctx-curso .lp-course-buttons .button-form-course:hover{background:var(--v-osc)!important; border-color:var(--v-osc)!important}
@keyframes ha-pulso{0%{box-shadow:0 0 0 0 rgba(152,183,55,.6)} 70%{box-shadow:0 0 0 14px rgba(152,183,55,0)} 100%{box-shadow:0 0 0 0 rgba(152,183,55,0)}}
html body.haaci-ctx-curso #lp-single-course .lp-course-buttons .lp-button.button-form-contact{background:#fff!important; background-image:none!important; color:var(--v-txt)!important; border:1.5px solid var(--v)!important; box-shadow:none!important}
html body.haaci-ctx-curso #lp-single-course .lp-course-buttons .lp-button.button-form-contact:hover{background:var(--v-suave)!important}
html body.haaci-ctx-curso #lp-single-course .lp-course-buttons .lp-button.button-form-course{background:var(--v)!important; background-image:none!important; color:#fff!important; border:1.5px solid var(--v)!important}
html body.haaci-ctx-curso #lp-single-course .lp-course-buttons .lp-button.button-form-course:hover{background:var(--v-osc)!important; border-color:var(--v-osc)!important}
@media (max-width:767px){ .haaci-ctx-curso .lp-course-buttons .lp-button{flex:1 1 auto} }
@media (prefers-reduced-motion: reduce){ .haaci-ctx-curso .lp-course-buttons .button-form-course{animation:none!important} }

/* v1.9.26 */
.ha-migas{display:flex; flex-wrap:wrap; align-items:center; gap:4px 0; font-size:12.5px; color:var(--suave); padding-top:10px; padding-bottom:10px}
.ha-migas a,.ha-migas span{display:inline-flex; align-items:center}
.ha-migas a{color:var(--texto)!important; text-decoration:none!important}
.ha-migas a:hover{color:var(--v-txt)!important}
.ha-migas > * + *::before{content:""; width:6px; height:6px; margin:0 10px; border-right:1.5px solid #b9bdb4; border-top:1.5px solid #b9bdb4; transform:rotate(45deg); display:inline-block}
.ha-migas span:last-child{color:var(--v-txt); font-weight:600}
body.haaci-estilo-nuevo .breadcrumbs-wrapper{display:none!important}

/* La onda del banner termina en blanco (sin franja gris) · sin chips */
.ha-cabecera .hi-onda-hero{color:#fff}
.ha-cabecera{overflow:hidden}
.ha-chips{display:none!important}
/* (3-oct) Varias categorías: LearnPress las envuelve en span.cat-links → el espacio entre etiquetas va ahí */
.haaci-ctx-curso .course-meta-single .course-categories .value .cat-links{display:flex; flex-wrap:wrap; gap:6px}
.haaci-ctx-curso .course-meta-single .course-categories .value a{text-transform:none!important}
