/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Version: 1.0.0
Description: Innova Tech Consulting — estados, animaciones y ajustes que ningún widget de Elementor da. El contenido y los colores viven en Elementor (Global Colors / Global Fonts).
*/

/* ==========================================================================
   Tokens no cubiertos por el kit (radios, sombras, movimiento) — tokens.css
   ========================================================================== */
:root {
  --r: 8px;
  --r-sm: 6px;
  --r-pill: 999px;
  --shadow-card: 0 6px 28px rgba(15, 23, 41, 0.055);
  --shadow-card-hover: 0 16px 40px rgba(15, 23, 41, 0.1);
  --shadow-float: 0 10px 34px rgba(15, 23, 41, 0.08);
  --shadow-header: 0 4px 24px rgba(15, 23, 41, 0.06);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 600ms;
  --dur-fast: 250ms;
  --dur-slow: 800ms;
  --c-hero-base: var(--e-global-color-herobase, #170b4e);
  --c-line-violet-hover: rgba(104, 40, 202, 0.38);
}

html { overflow-x: clip; scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img, svg, video { display: block; max-width: 100%; }
.measure, .e-con > .measure, .e-con-inner > .measure { max-width: 58ch !important; }
.measure-narrow, .e-con > .measure-narrow, .e-con-inner > .measure-narrow { max-width: 50ch !important; }
.encabezado.centrado > .measure-narrow, .page-hero-bloque > .measure-narrow { margin-inline: auto; }
.shrink-0 { flex-shrink: 0; }
.t-accent { color: var(--e-global-color-primario); }
.on-dark .t-accent { color: var(--e-global-color-violetatinte); }
.texto-145 { font-size: 14.5px !important; }

/* Los widgets ocupan su ancho natural dentro de columnas centradas */
.encabezado.centrado > .elementor-widget { width: 100%; }
.encabezado.centrado > .elementor-widget .elementor-widget-container p { margin-inline: auto; }
.page-hero-bloque > .elementor-widget { width: 100%; }
.page-hero-bloque .elementor-widget-text-editor p { margin-inline: auto; }

/* ==========================================================================
   Foco visible (base.css)
   ========================================================================== */
:focus-visible { outline: 2px solid var(--e-global-color-azul); outline-offset: 3px; border-radius: var(--r-sm); }
.on-dark :focus-visible { outline-color: #fff; }

/* ==========================================================================
   Botones (Button.jsx): icono que se desplaza 4px en hover, radio fijo
   ========================================================================== */
.elementor-button { transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.elementor-button .elementor-button-icon svg { width: 16px; height: 16px; transition: transform var(--dur-fast) var(--ease); }
.elementor-button:hover .elementor-button-icon svg { transform: translateX(4px); }
.elementor-button .elementor-button-icon { display: inline-flex; align-items: center; }
.btn-onband:hover .elementor-button-icon svg, .btn-onbandoutline:hover .elementor-button-icon svg { transform: translateX(4px); }

/* Enlace con subrayado que crece desde la izquierda (motion.css .link-underline) */
.link-underline .elementor-button, a.link-underline { position: relative; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.link-underline .elementor-button .elementor-button-icon svg { width: 15px; height: 15px; }
.link-underline .elementor-button::after, a.link-underline::after {
  content: ''; position: absolute; left: 0; bottom: -3px; height: 1px; width: 100%; background: currentColor;
  transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease);
}
.link-underline .elementor-button:hover::after, a.link-underline:hover::after,
.card-activa:hover .link-underline .elementor-button::after { transform: scaleX(1); }
.link-underline .elementor-button-content-wrapper { gap: 8px; }

/* ==========================================================================
   Tarjetas (motion.css .card / .card-lift / .card-activa)
   ========================================================================== */
.card { transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.card-lift:hover, .card-lift:focus-within {
  transform: translateY(-6px) scale(1.02);
  box-shadow: var(--shadow-card-hover) !important;
}
.card-lift:not(.card-color):not(.card-activa):hover { background-color: var(--e-global-color-tarjetahover) !important; border-color: var(--c-line-violet-hover) !important; }
.card-lift:hover .frame img, .card-lift:focus-within .frame img { transform: scale(1.06); }
.frame img { transition: transform var(--dur) var(--ease); }
.frame .elementor-widget-container, .frame figure { overflow: hidden; }
.frame img, .frame .elementor-widget-container img { width: 100%; object-fit: cover; }
.frame-16x9 img { aspect-ratio: 16 / 9; }
.frame-4x3 img { aspect-ratio: 4 / 3; }
.frame-3x4 img { aspect-ratio: 3 / 4; }
.frame-1x1 img { aspect-ratio: 1 / 1; }
.frame-fill, .frame-fill .elementor-widget-container, .frame-fill .elementor-widget-container img { height: 100%; }
.frame.elementor-widget-image { width: 100%; }
.frame .elementor-widget-container a { display: block; }

/* Tarjeta que es un enlace: morado solido e inversion a blanco en hover */
.card-activa:hover, .card-activa:focus-within { background-color: var(--e-global-color-primario) !important; border-color: var(--e-global-color-primario) !important; }
.card-activa:hover :is(h1, h2, h3, h4, p, span, a, li, svg):not(.btn *):not(.btn):not(.badge-portada):not(.badge-portada *),
.card-activa:focus-within :is(h1, h2, h3, h4, p, span, a, li, svg):not(.btn *):not(.btn):not(.badge-portada):not(.badge-portada *) { color: #fff !important; }
.card-activa:hover .elementor-icon, .card-activa:hover .js-svg svg { color: #fff !important; }
/* El resumen del producto llega sin <p>: el texto cuelga directo del contenedor del widget */
.card-activa:hover .elementor-widget-text-editor, .card-activa:hover .elementor-widget-text-editor .elementor-widget-container,
.card-activa:hover .elementor-icon-list-text, .card-activa:hover .elementor-icon-list-icon, .card-activa:hover .elementor-heading-title:not(.badge-portada *),
.card-activa:focus-within .elementor-widget-text-editor, .card-activa:focus-within .elementor-widget-text-editor .elementor-widget-container { color: #fff !important; }
.card-activa:hover .curso-precio .price, .card-activa:hover .curso-precio .woocommerce-Price-amount { color: #fff !important; }
.card-activa:hover .btn-primary .elementor-button, .card-activa:focus-within .btn-primary .elementor-button { background-color: #fff !important; color: var(--e-global-color-primario) !important; }
.card-activa:hover .btn-primary .elementor-button .elementor-button-text, .card-activa:hover .btn-primary .elementor-button .elementor-button-icon, .card-activa:hover .btn-primary .elementor-button svg { color: var(--e-global-color-primario) !important; }
.card-activa:hover .badge-portada .elementor-heading-title { color: var(--e-global-color-azulprofundo) !important; }
.card-activa:hover .btn-link .elementor-button::after { transform: scaleX(1); }

/* Tarjetas de color: al pasar el cursor intercambian morado/azul; el borde se aclara */
.card-color { border: 1px solid transparent !important; }
.card-color:hover, .card-color:focus-within { border-color: rgba(255, 255, 255, 0.45) !important; }
.card-color .icono-circulo { transition: background-color var(--dur-fast) var(--ease); }

/* ==========================================================================
   Iconos SVG dinamicos (inyectados en linea por site.js) e iconos lucide
   ========================================================================== */
.js-svg svg { width: 100%; height: auto; display: block; stroke: currentColor; fill: none; }
.servicio-card .js-svg svg, .servicio-card .js-svg img { width: 24px; height: 24px; }
.servicio-card .js-svg { flex: 0 0 24px; }
.servicio-fila .js-svg svg, .servicio-fila .js-svg img { width: 30px; height: 30px; }
.cat-card .js-svg svg, .cat-card .js-svg img { width: 30px; height: 30px; }
.e-con > .e-con, .e-con > .e-con-inner > .e-con { min-width: 0; }
.e-con > .elementor-widget-heading { min-width: 0; }
.icono-azul { color: var(--e-global-color-azul); }
.icono-morado { color: var(--e-global-color-primario); }
.icono-blanco { color: #fff; }
.elementor-icon svg { fill: none; }
.icono-circulo .elementor-widget-icon, .icono-circulo .elementor-widget-icon .elementor-widget-container { line-height: 0; }
.icono-circulo .elementor-icon { display: inline-flex; line-height: 0; }

/* ==========================================================================
   Eyebrow (Badge.jsx)
   ========================================================================== */
.eyebrow { width: auto !important; }
.eyebrow-regla { flex: 0 0 28px; }
.eyebrow .elementor-widget-heading { width: auto; }

/* ==========================================================================
   Cabecera (Header.jsx / PromoBar.jsx)
   ========================================================================== */
.js-header { position: fixed !important; top: 0; left: 0; right: 0; z-index: 100; width: 100%; }
.header-promo { height: 44px; overflow: hidden; transition: height var(--dur-fast) var(--ease); }
.header-promo > .e-con-inner { height: 44px; }
.js-header.is-compacta .header-promo, .js-header.is-sin-promo .header-promo { height: 0 !important; min-height: 0 !important; }
.header-nav { height: 68px; transition: height var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
@media (min-width: 1024px) { .header-nav { height: 88px; } }
.js-header.is-compacta .header-nav { height: 68px; box-shadow: var(--shadow-header); }
.header-nav > .e-con-inner { height: 100%; }
.promo-nuevo { font-family: Poppins, sans-serif; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; line-height: 1; padding: 4px 10px; border-radius: 999px; background: var(--e-global-color-primario); color: #fff; }
.promo-texto a { color: #fff; font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.4); text-underline-offset: 4px; white-space: nowrap; transition: text-decoration-color var(--dur-fast) var(--ease); }
.promo-texto a:hover { text-decoration-color: #fff; }
.promo-texto p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.promo-largo { display: none; }
@media (min-width: 640px) { .promo-largo { display: inline; } .promo-corto { display: none; } }
.promo-cerrar .elementor-icon { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 999px; transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); cursor: pointer; }
.promo-cerrar .elementor-icon:hover { background: rgba(255, 255, 255, 0.15); color: #fff !important; }
.logo-texto .t-accent { color: var(--e-global-color-primario); }
.logo-enlace { text-decoration: none; }

/* Menu principal (widget Nav Menu con el menu de WordPress) */
.nav-principal .elementor-nav-menu--main .elementor-item { transition: color var(--dur-fast) var(--ease); }
/* Chevron de submenu: el SVG real de lucide (chevron-down, trazo 2) por mascara; rota 180° al abrir */
.nav-principal .menu-item-has-children > a::after { content: ''; display: inline-block; position: static !important; transform: none; height: 15px !important; opacity: 1 !important; background: none; width: 15px; height: 15px; margin-left: 6px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat center / contain; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat center / contain; transition: transform var(--dur-fast) var(--ease); }
.nav-principal .elementor-nav-menu--main .menu-item-has-children:hover > a::after,
.nav-principal .elementor-nav-menu--main .menu-item-has-children:focus-within > a::after { transform: rotate(180deg); }
.nav-principal .elementor-nav-menu--main .elementor-item { display: inline-flex; align-items: center; }
/* Paneles desplegables: centrados bajo el item, con relleno superior que cierra el hueco */
.nav-principal .elementor-nav-menu--main .elementor-nav-menu--dropdown { margin-top: 16px !important; padding: 24px !important; width: 440px !important; min-width: 0 !important; max-width: none !important; left: 50% !important; transform: translateX(-50%); border-radius: var(--r) !important; }
.nav-principal .elementor-nav-menu--main .menu-consultoria .elementor-nav-menu--dropdown { width: 560px !important; column-count: 2; column-gap: 8px; }
.nav-principal .elementor-nav-menu--main .menu-consultoria .elementor-nav-menu--dropdown > li { break-inside: avoid; }
.nav-principal .elementor-nav-menu--main .menu-consultoria .elementor-nav-menu--dropdown > li.menu-vertodo { column-span: all; }
.nav-principal .elementor-nav-menu--main .elementor-nav-menu--dropdown li { border: 0 !important; }
.nav-principal .elementor-nav-menu--main .elementor-nav-menu--dropdown a.elementor-sub-item { border-radius: var(--r); display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.nav-principal .menu-item[class*="ico-"] > a::before { content: ''; flex: 0 0 17px; width: 17px; height: 17px; background-color: var(--e-global-color-primario); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; }
.nav-principal .menu-meta { margin-left: auto; font-size: 12px; font-weight: 400; color: var(--e-global-color-atenuado); }
.nav-principal .elementor-nav-menu--main .elementor-nav-menu--dropdown a.menu-vertodo, .nav-principal .elementor-nav-menu--main .menu-vertodo > a { margin-top: 16px; color: var(--e-global-color-azul) !important; font-weight: 600; background: transparent !important; position: relative; width: max-content; }
.nav-principal .elementor-nav-menu--main .menu-vertodo > a::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease); }
.nav-principal .elementor-nav-menu--main .menu-vertodo > a:hover::after { transform: scaleX(1); }

/* Boton Aula Virtual (ArrowUpRight con opacidad .6) */
.btn-aula .elementor-button { height: 44px; }
.btn-aula .elementor-button .elementor-button-icon svg { width: 14px; height: 14px; opacity: 0.6; }
.btn-aula .elementor-button:hover .elementor-button-icon svg { transform: none; }
.btn-aula .ico-laptop svg { width: 17px; height: 17px; }
.btn-aula-movil .elementor-button { height: 52px; width: 100%; }

/* Menu movil: panel a pantalla completa bajo la cabecera (Header.jsx #menu-movil) */
@media (max-width: 1023px) {
  .nav-principal .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="true"] { display: none !important; }
  .nav-principal .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"], .nav-principal .elementor-nav-menu--dropdown.elementor-nav-menu__container.elementor-active { position: fixed !important; top: var(--alto-cabecera, 68px) !important; left: 0 !important; right: 0 !important; bottom: 0 !important; width: 100% !important; max-height: none !important; overflow-y: auto; background: #fff !important; padding: 48px var(--gutter, 24px) 48px !important; box-shadow: none !important; margin: 0 !important; transform: none !important; border: 0 !important; border-radius: 0 !important; }
  .nav-principal .elementor-nav-menu__container > ul > li { border-bottom: 1px solid var(--e-global-color-linea) !important; }
  .nav-principal .elementor-nav-menu__container > ul > li:last-child, .nav-principal .elementor-nav-menu__container > ul > li.menu-cta { border-bottom: 0 !important; }
  .nav-principal .elementor-nav-menu__container > ul > li.menu-email { border-bottom: 0 !important; }
  .nav-principal .elementor-nav-menu__container > ul > li > a { display: flex !important; align-items: center; min-height: 56px; font-family: Poppins, sans-serif !important; font-size: 20px !important; font-weight: 600 !important; padding: 0 !important; color: var(--e-global-color-tinta) !important; background: transparent !important; border-radius: 0 !important; }
  .nav-principal .elementor-nav-menu__container > ul > li > a.elementor-item-active, .nav-principal .elementor-nav-menu__container > ul > li > a.highlighted.elementor-item-active { color: var(--e-global-color-azul) !important; }
  .nav-principal .elementor-nav-menu__container > ul > li.menu-item-has-children > a::after { margin-left: auto; width: 20px; height: 20px; }
  .nav-principal .elementor-nav-menu__container > ul > li > a.highlighted::after { transform: rotate(180deg); }
  .nav-principal .elementor-nav-menu__container .sub-menu { position: static !important; padding: 0 0 24px 12px !important; border: 0 !important; box-shadow: none !important; background: transparent !important; width: 100% !important; margin: 0 !important; }
  .nav-principal .elementor-nav-menu__container .sub-menu a { display: flex !important; align-items: center; min-height: 44px; font-family: Inter, sans-serif !important; font-size: 15px !important; font-weight: 400 !important; color: var(--e-global-color-cuerpo) !important; padding: 0 !important; background: transparent !important; }
  .nav-principal .elementor-nav-menu__container .sub-menu li { border: 0; }
  .nav-principal .menu-item[class*="ico-"] > a::before { display: none; }
  .nav-principal .menu-meta { display: none; }
  .nav-principal .elementor-nav-menu__container .menu-vertodo > a { color: var(--e-global-color-azul) !important; font-weight: 600 !important; }
  .nav-principal .elementor-menu-toggle { width: 44px; height: 44px; border-radius: 999px; margin: 0; }
  .header-nav .elementor-widget-nav-menu, .header-nav .elementor-widget-nav-menu > .elementor-widget-container { display: flex; align-items: center; height: 44px; }
  /* Aula Virtual (boton) y correo, como en el panel del React */
  .nav-principal .elementor-nav-menu__container > ul > li.menu-cta { border: 0; margin-top: 48px; }
  .nav-principal .elementor-nav-menu__container > ul > li.menu-cta > a { min-height: 52px; justify-content: center; border: 1px solid var(--e-global-color-primario); border-radius: var(--r) !important; font-size: 15px !important; padding: 0 20px !important; }
  .nav-principal .elementor-nav-menu__container > ul > li.menu-email { border: 0; margin-top: 24px; }
  .nav-principal .elementor-nav-menu__container > ul > li.menu-email > a { min-height: 0; font-family: Inter, sans-serif !important; font-size: 15px !important; font-weight: 400 !important; color: var(--e-global-color-cuerpo) !important; }
}
/* Con el menu abierto la promo se colapsa (Header.jsx: compacto = scrolled || open) */
.js-header.is-menu-abierto .header-promo { height: 0 !important; min-height: 0 !important; }
.nav-principal .elementor-menu-toggle svg { width: 20px; height: 20px; }
/* Con el menu abierto, el resto de la cabecera movil (Aula Virtual + correo) vive en el propio panel */
.menu-movil-extra { display: none; }



/* ==========================================================================
   Hero de Inicio (HeroSlider.jsx + RainbowBackdrop.jsx)
   ========================================================================== */
.hero-rainbow { position: relative; isolation: isolate; overflow: hidden; }
.rainbow-fondo { position: absolute; inset: 0; overflow: hidden; background: var(--c-hero-base); pointer-events: none; z-index: -1; }
.rainbow-barra { position: absolute; top: -10%; left: 0; width: 0; height: 120%; will-change: transform; animation: rainbow-desliza linear infinite; animation-duration: calc(46s - var(--i) * 0.9s); animation-delay: calc(var(--i) * -3.2s); }
.rainbow-barra:nth-child(6n + 1) { box-shadow: -130px 0 80px 40px var(--c-hero-base), -50px 0 50px 25px var(--e-global-color-violetasuave), 0 0 50px 25px var(--e-global-color-azul), 50px 0 50px 25px var(--e-global-color-violetasuave), 130px 0 80px 40px var(--c-hero-base); }
.rainbow-barra:nth-child(6n + 2) { box-shadow: -130px 0 80px 40px var(--c-hero-base), -50px 0 50px 25px var(--e-global-color-azul), 0 0 50px 25px var(--e-global-color-violetasuave), 50px 0 50px 25px var(--e-global-color-violetasuave), 130px 0 80px 40px var(--c-hero-base); }
.rainbow-barra:nth-child(6n + 3), .rainbow-barra:nth-child(6n + 4) { box-shadow: -130px 0 80px 40px var(--c-hero-base), -50px 0 50px 25px var(--e-global-color-violetasuave), 0 0 50px 25px var(--e-global-color-violetasuave), 50px 0 50px 25px var(--e-global-color-azul), 130px 0 80px 40px var(--c-hero-base); }
.rainbow-barra:nth-child(6n + 5) { box-shadow: -130px 0 80px 40px var(--c-hero-base), -50px 0 50px 25px var(--e-global-color-azul), 0 0 50px 25px var(--e-global-color-violetasuave), 50px 0 50px 25px var(--e-global-color-violetasuave), 130px 0 80px 40px var(--c-hero-base); }
.rainbow-barra:nth-child(6n) { box-shadow: -130px 0 80px 40px var(--c-hero-base), -50px 0 50px 25px var(--e-global-color-violetasuave), 0 0 50px 25px var(--e-global-color-azul), 50px 0 50px 25px var(--e-global-color-violetasuave), 130px 0 80px 40px var(--c-hero-base); }
@keyframes rainbow-desliza { from { transform: translate3d(-30vw, 0, 0) rotate(10deg); } to { transform: translate3d(130vw, 0, 0) rotate(10deg); } }
.rainbow-vineta-h { position: absolute; left: 0; bottom: 0; width: 100%; height: 0; box-shadow: 0 0 46vh 34vh var(--c-hero-base); }
.rainbow-vineta-v { position: absolute; left: 0; bottom: 0; width: 0; height: 100%; box-shadow: 0 0 32vw 22vw var(--c-hero-base); }
@media (max-width: 767px) { .rainbow-barra { animation: none; transform: translate3d(calc(var(--i) * 12vw - 20vw), 0, 0) rotate(10deg); } }
@media (prefers-reduced-motion: reduce) { .rainbow-barra { animation: none !important; transform: translate3d(calc(var(--i) * 9vw - 15vw), 0, 0) rotate(10deg) !important; } }
/* El velo del lado del texto va como overlay del contenedor (Elementor), por encima de las franjas */
.hero-rainbow > .e-con-inner, .hero-rainbow > .elementor-element { position: relative; z-index: 1; }
.hero-rainbow > .e-con-inner { position: relative; }

/* Composicion grafica: aro + persona + tarjetas flotantes */
.hero-grafico { position: relative; aspect-ratio: 1 / 1; width: 100%; max-width: 400px; margin-inline: auto; }
@media (min-width: 768px) { .hero-grafico { max-width: 460px; } }
@media (min-width: 1024px) { .hero-grafico { width: 108%; max-width: 540px; margin-right: -6%; } }
.hero-aro { position: absolute; inset: 0; }
.hero-aro .elementor-widget-container, .hero-aro svg, .hero-aro img { width: 100%; height: 100%; overflow: visible; }
.hero-aro-disco { animation: discoIn var(--dur-slow) var(--ease) both; transform-origin: center; animation-delay: 80ms; }
.hero-aro-trazo { stroke-dasharray: 302; animation: aroDibuja 1100ms var(--ease) both; animation-delay: 160ms; }
.hero-aro-trazo2 { stroke-dasharray: 302; animation: aroDibuja 1100ms var(--ease) both; animation-delay: 320ms; }
@keyframes aroDibuja { from { stroke-dashoffset: 302; } to { stroke-dashoffset: 0; } }
@keyframes discoIn { from { transform: scale(0.55); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes riseIn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes floatCardIn { from { opacity: 0; transform: translateY(18px) scale(0.96); } to { opacity: 1; transform: none; } }
@keyframes lineUp { from { transform: translateY(105%); } to { transform: none; } }
.hero-persona { position: absolute !important; left: 0; right: 0; bottom: 11%; margin: 0 auto; height: 80%; width: auto !important; max-width: none; animation: riseIn var(--dur) var(--ease) both; animation-delay: 260ms; }
.hero-persona.frame .elementor-widget-container, .hero-persona.frame img { height: 100% !important; width: auto !important; max-width: none; object-fit: contain !important; margin-inline: auto; aspect-ratio: auto; }
.hero-persona.frame .elementor-widget-container { overflow: visible; display: flex; justify-content: center; }
.hero-flotante { position: absolute !important; width: auto !important; box-shadow: var(--shadow-float); animation: floatCardIn var(--dur) var(--ease) both; }
.hero-flotante-izq { left: 0; top: 62%; animation-delay: 620ms; }
.hero-flotante-der { right: 0; top: 14%; animation-delay: 760ms; }
@media (min-width: 1024px) { .hero-flotante-izq { left: -10%; } }
.hero-texto { animation: riseIn var(--dur) var(--ease) both; }
.hero-texto .elementor-widget-heading { overflow: hidden; }
.hero-texto h1 { animation: lineUp var(--dur-slow) var(--ease) both; animation-delay: 120ms; }
.hero-texto .hero-lead { animation: riseIn var(--dur) var(--ease) both; animation-delay: 480ms; }
.hero-texto .hero-botones { animation: riseIn var(--dur) var(--ease) both; animation-delay: 580ms; }
@media (max-width: 767px) { .hero-texto h1, .hero-texto .hero-lead, .hero-texto .hero-botones, .hero-persona, .hero-flotante { animation-duration: 400ms; animation-delay: 0ms !important; } }

/* Controles del carrusel del hero: barras 32/16 × 3 y boton de pausa */
.hero-carrusel .swiper-pagination { position: absolute !important; left: 0 !important; bottom: 0 !important; top: auto !important; transform: none !important; display: flex; gap: 10px; align-items: center; justify-content: flex-start; width: auto !important; margin: 0; }
.hero-carrusel .swiper { overflow: hidden !important; }
.hero-carrusel .swiper-pagination { left: max(24px, calc((100% - 1290px) / 2)) !important; }
@media (min-width: 768px) { .hero-carrusel .swiper-pagination { left: max(32px, calc((100% - 1290px) / 2)) !important; } }
.hero-carrusel .swiper-pagination-bullet { width: 16px !important; height: 3px !important; border-radius: 999px; background: rgba(255, 255, 255, 0.35) !important; opacity: 1 !important; margin: 0 !important; transition: all var(--dur-fast) var(--ease); }
.hero-carrusel .swiper-pagination-bullet:hover { background: rgba(255, 255, 255, 0.7) !important; }
.hero-carrusel .swiper-pagination-bullet-active { width: 32px !important; background: #fff !important; }
.hero-carrusel .swiper-slide { height: auto; }
.hero-controles { position: absolute; left: 0; bottom: 0; }
.js-carrusel-pausa .elementor-icon, .js-video-pausa .elementor-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.4); color: #fff !important; cursor: pointer; transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.js-carrusel-pausa .elementor-icon:hover { border-color: #fff; background: rgba(255, 255, 255, 0.15); }
.js-carrusel-pausa .elementor-icon svg, .js-video-pausa .elementor-icon svg { width: 15px; height: 15px; }
.js-carrusel-pausa .ico-play, .js-video-pausa .ico-play { display: none; }
.js-carrusel-pausa.is-pausado .ico-play, .js-video-pausa.is-pausado .ico-play { display: block; }
.js-carrusel-pausa.is-pausado .ico-pause, .js-video-pausa.is-pausado .ico-pause { display: none; }
.js-video-pausa .elementor-icon { background: rgba(0, 0, 0, 0.2); border-color: rgba(255, 255, 255, 0.4); }
.js-video-pausa .elementor-icon:hover { background: #fff; color: var(--e-global-color-azulprofundo) !important; }

/* ==========================================================================
   Buscador (SearchBar.jsx): tarjeta montada sobre el hero, chips
   ========================================================================== */
.buscador-card { margin-top: -64px; }
@media (min-width: 1024px) { .buscador-card { margin-top: -80px; } }
.buscador-form .elementor-search-form { display: flex; gap: 12px; flex-direction: column; }
@media (min-width: 640px) { .buscador-form .elementor-search-form { flex-direction: row; } }
.buscador-form .elementor-search-form__container { position: relative; flex: 1 1 auto; border-radius: var(--r) !important; min-height: 52px; border: 1px solid var(--e-global-color-linea); background: #fff; }
.buscador-form .elementor-search-form__input { padding-left: 52px !important; font-family: Inter, sans-serif; font-size: 15px; }
.buscador-form .elementor-search-form__input::placeholder { color: var(--e-global-color-atenuado); opacity: 1; }
.buscador-form .elementor-search-form__icon { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--e-global-color-azul); }
.buscador-form .elementor-search-form__icon svg { width: 18px; height: 18px; fill: none; }
.buscador-form .elementor-search-form__submit { flex: 0 0 auto; height: 52px; padding: 0 32px; border-radius: var(--r) !important; font-family: Poppins, sans-serif; font-weight: 600; font-size: 15px; }
.buscador-form .elementor-search-form__container:focus-within { border-color: var(--e-global-color-azul) !important; box-shadow: none !important; }
.chips-tendencias .elementor-button { height: auto; padding: 8px 16px !important; border-radius: 999px !important; font-family: Inter, sans-serif; font-size: 13px; font-weight: 500; }
.chips-tendencias .elementor-button-icon { display: none; }

/* Buscador del listado de cursos (CoursesGrid.jsx) */
.buscador-cursos .elementor-search-form__container { border-radius: var(--r) !important; min-height: 44px; border: 1px solid var(--e-global-color-linea); background: #fff; }
.buscador-cursos .elementor-search-form__input { padding-left: 40px !important; font-size: 14px; }
.buscador-cursos .elementor-search-form__icon { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--e-global-color-atenuado); }
.buscador-cursos .elementor-search-form__icon svg { width: 16px; height: 16px; fill: none; }
.buscador-cursos .elementor-search-form__submit { display: none; }
.buscador-cursos .elementor-search-form__container:focus-within { border-color: var(--e-global-color-azul) !important; box-shadow: none !important; }
.buscador-cursos .elementor-search-form { position: relative; }

/* Filtro de categorias: chips pildora, activo morado */
.filtro-categorias .e-filter { gap: 8px; flex-wrap: wrap; }
.filtro-categorias .e-filter-item[data-filter="__all"] { order: -1; }
.filtro-categorias .e-filter-item { border-radius: 999px !important; height: 44px; display: inline-flex; align-items: center; padding: 0 20px !important; font-family: Poppins, sans-serif; font-size: 14px; font-weight: 600; transition: color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.filtro-categorias .e-filter-item:hover { border-color: var(--e-global-color-primario) !important; color: var(--e-global-color-primario) !important; }
.filtro-categorias .e-filter-item[aria-pressed="true"] { border-color: var(--e-global-color-primario) !important; }

/* ==========================================================================
   Numeros (Counters.jsx)
   ========================================================================== */
.numeros-banda { border-radius: var(--r); }
.numero-item .elementor-counter { display: flex; flex-direction: column; align-items: flex-start; }
.numero-item .elementor-counter-number-wrapper { white-space: nowrap; flex-wrap: nowrap; }
.numero-item .elementor-counter-number-wrapper { justify-content: flex-start; font-variant-numeric: tabular-nums; }
.numero-item .elementor-counter-title { text-align: left; margin-top: 4px; }
@media (min-width: 1024px) { .numero-item + .numero-item { border-left: 1px solid var(--e-global-color-lineafuerte); } }

/* ==========================================================================
   Beneficios (Benefits.jsx): collage y marca de agua
   ========================================================================== */
.collage { position: relative; }
.marca-agua { position: absolute !important; left: 38%; top: 50%; width: 150% !important; max-width: 900px; transform: translate(-50%, -50%); opacity: 0.1; pointer-events: none; z-index: 0; }
.marca-agua img { border-radius: 0; }
.collage-fotos { position: relative; z-index: 1; }

/* ==========================================================================
   Pasos (HowItWorks.jsx): video con filtro, velo degradado (overlay Elementor)
   ========================================================================== */
.pasos-video .elementor-background-video-container { filter: saturate(0.5) brightness(0.62) hue-rotate(-18deg); }
.pasos-video > .e-con-inner { position: relative; z-index: 1; }
.paso-num { color: var(--e-global-color-violetatinte); }
.paso-flecha { color: rgba(255, 255, 255, 0.4); }
.paso-flecha .elementor-icon { color: rgba(255, 255, 255, 0.4) !important; }
.pasos-pausa { position: absolute !important; right: 32px; top: 32px; z-index: 2; }
.pasos-video > .pasos-inner, .pasos-video > .pasos-pausa { position: relative; z-index: 1; }
/* El video de fondo cubre toda la seccion (Elementor lo dimensiona por JS y a veces queda corto) */
.pasos-video .elementor-background-video-container { inset: 0; width: 100%; height: 100%; }
.pasos-video .elementor-background-video-container video, .pasos-video .elementor-background-video-hosted { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover; transform: none !important; }
.paso-texto { max-width: 34ch; }

/* ==========================================================================
   Plataforma (VideoPlataforma.jsx)
   ========================================================================== */
.video-marco { position: relative; border-radius: var(--r); overflow: hidden; }
.video-marco .elementor-widget-video, .video-marco .elementor-wrapper, .video-marco video { width: 100%; }
.video-marco video { aspect-ratio: 16 / 9; object-fit: cover; }
.video-velo { position: absolute !important; inset: 0; pointer-events: none; background: linear-gradient(160deg, rgba(23, 11, 78, 0.82) 0%, rgba(23, 11, 78, 0.34) 34%, rgba(23, 11, 78, 0.18) 58%, rgba(23, 11, 78, 0.74) 100%); }
.video-logo { position: absolute !important; left: 32px; top: 32px; pointer-events: none; width: auto !important; }
.video-logo img { height: 30px; width: auto; border-radius: 0; }
.video-pausa-abajo { position: absolute !important; right: 32px; bottom: 32px; width: auto !important; }
.video-pausa-abajo .elementor-icon { background: rgba(0, 0, 0, 0.25); border-color: rgba(255, 255, 255, 0.45); }
.video-pausa-abajo .elementor-icon svg { width: 16px; height: 16px; }

/* ==========================================================================
   Carrusel de servicios (ConsultingHome.jsx) y de testimonios
   ========================================================================== */
.carrusel-servicios .swiper { position: static; }
.carrusel-servicios .swiper-wrapper { padding-block: 12px; }
.carrusel-servicios .elementor-swiper-button { position: absolute !important; top: auto !important; bottom: calc(100% + 68px) !important; transform: none !important; width: 44px; height: 44px; border-radius: 999px; border: 1px solid var(--e-global-color-linea); background: #fff; color: var(--e-global-color-tinta); display: inline-flex; align-items: center; justify-content: center; transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.carrusel-servicios .elementor-swiper-button:hover { border-color: var(--e-global-color-primario); color: var(--e-global-color-primario); }
.carrusel-servicios .elementor-swiper-button svg { width: 20px; height: 20px; fill: none; }
.elementor-widget-loop-carousel.carrusel-servicios .elementor-swiper-button-prev { left: auto !important; right: calc(var(--ancho-ver-todos, 155px) + 12px + 56px) !important; }
.elementor-widget-loop-carousel.carrusel-servicios .elementor-swiper-button-next { left: auto !important; right: calc(var(--ancho-ver-todos, 155px) + 12px) !important; }
.carrusel-servicios .swiper-button-disabled { opacity: 0.4; }
@media (max-width: 1023px) {
  .elementor-widget-loop-carousel.carrusel-servicios .elementor-swiper-button-prev { left: 0 !important; right: auto !important; }
  .elementor-widget-loop-carousel.carrusel-servicios .elementor-swiper-button-next { left: 56px !important; right: auto !important; }
  .consultorias-acciones { padding-left: 112px; }
}
@media (max-width: 639px) { .carrusel-servicios .elementor-swiper-button { display: none; } .consultorias-acciones { padding-left: 0; } }
.carrusel-servicios .swiper-pagination { position: static !important; left: auto !important; transform: none !important; width: 100% !important; margin-top: 40px; display: flex; gap: 4px; justify-content: center; }
.carrusel-servicios .swiper-pagination-bullet { width: 10px; height: 10px; border-radius: 999px; background: var(--e-global-color-lineafuerte) !important; opacity: 1 !important; margin: 0 16px !important; transition: all var(--dur-fast) var(--ease); }
.carrusel-servicios .swiper-pagination-bullet:hover { background: var(--e-global-color-primario) !important; }
.carrusel-servicios .swiper-pagination-bullet-active { width: 28px; background: var(--e-global-color-primario) !important; }
.carrusel-servicios .swiper-slide { height: auto; }
.carrusel-servicios .swiper-slide > .e-loop-item, .carrusel-servicios .swiper-slide > .e-loop-item > .e-con { height: 100%; }

.carrusel-testimonios .swiper { position: static; }
.carrusel-testimonios { position: relative; }
.carrusel-testimonios .swiper-wrapper { padding-block: 0; }
.carrusel-testimonios .elementor-swiper-button { width: 48px; height: 48px; border-radius: 999px; border: 1px solid var(--e-global-color-linea); background: #fff; color: var(--e-global-color-tinta); display: inline-flex; align-items: center; justify-content: center; transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.carrusel-testimonios .elementor-swiper-button:hover { border-color: var(--e-global-color-azul); color: var(--e-global-color-azul); }
.carrusel-testimonios .elementor-swiper-button svg { width: 20px; height: 20px; fill: none; }
.carrusel-testimonios .swiper-pagination { position: static !important; left: auto !important; transform: none !important; width: 100% !important; margin-top: 40px; display: flex; gap: 0; justify-content: center; align-items: center; }
.carrusel-testimonios .swiper-pagination-bullet { width: 10px; height: 10px; border-radius: 999px; background: var(--e-global-color-lineafuerte) !important; opacity: 1 !important; margin: 0 16px !important; transition: background-color var(--dur-fast) var(--ease); }
.carrusel-testimonios .swiper-pagination-bullet:hover { background: var(--e-global-color-azul) !important; }
.carrusel-testimonios .swiper-pagination-bullet-active { background: var(--e-global-color-azulprofundo) !important; }
@media (min-width: 640px) {
  .carrusel-testimonios .elementor-swiper-button { top: calc(50% - 44px); transform: translateY(-50%); }
  .carrusel-testimonios .elementor-swiper-button-prev { left: 0; }
  .carrusel-testimonios .elementor-swiper-button-next { right: 0; }
  .carrusel-testimonios .swiper { margin-inline: 72px; }
}
@media (min-width: 1024px) { .carrusel-testimonios .swiper { margin-inline: 88px; } }
@media (max-width: 639px) {
  .carrusel-testimonios .elementor-swiper-button { top: auto; bottom: 0; transform: none; }
  .carrusel-testimonios .elementor-swiper-button-prev { left: calc(50% - 130px); }
  .carrusel-testimonios .elementor-swiper-button-next { right: calc(50% - 130px); }
  .carrusel-testimonios .swiper-pagination { margin-top: 40px; min-height: 48px; }
}
.testimonio-card { overflow: hidden; }
.testimonio-foto { position: relative; align-self: stretch; min-height: 320px; }
.testimonio-foto .elementor-widget-image, .testimonio-foto .elementor-widget-container { position: absolute; inset: 0; }
.testimonio-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; aspect-ratio: auto; }
.testimonio-comillas h2, .testimonio-comillas span { line-height: 0.5 !important; }
@media (max-width: 639px) { .testimonio-foto { display: none !important; } }

/* ==========================================================================
   Tarjeta de curso (CourseCard.jsx)
   ========================================================================== */
.badge-portada { position: absolute !important; left: 12px; top: 12px; z-index: 2; width: auto !important; }
.badge-portada h4, .badge-portada span { display: inline-block; background: #fff; border-radius: 999px; padding: 6px 12px; box-shadow: var(--shadow-card); }
.curso-portada { position: relative; }
.curso-portada .elementor-widget-container { overflow: hidden; border-radius: var(--r-sm); }
.curso-titulo a { transition: color var(--dur-fast) var(--ease); }
.curso-titulo a:hover { color: var(--e-global-color-primario); }
.curso-meta .elementor-icon-list-icon svg { fill: none; }
.curso-meta .elementor-icon-list-items { flex-wrap: wrap; row-gap: 8px; }
.curso-rating svg { fill: var(--e-global-color-azul); }
.curso-pie { border-top: 1px solid var(--e-global-color-linea); }
.curso-tipo { font-size: 12px; line-height: 1; margin-top: 6px; }
.woocommerce .elementor-widget-woocommerce-product-price .price, .curso-precio .price { font-family: Poppins, sans-serif; font-weight: 700; font-size: 24px; line-height: 1; letter-spacing: -0.01em; color: var(--e-global-color-tinta); }
.curso-precio .price del { display: none; }
.curso-precio .woocommerce-Price-amount { font-family: inherit; }

/* Mosaico de categorias (Categories.jsx) */
.cat-card .js-svg { width: 30px; height: 30px; }
.cat-card .js-svg svg { width: 30px; height: 30px; }

/* ==========================================================================
   Ficha de curso (CourseDetailBody.jsx)
   ========================================================================== */
.curso-cabecera .breadcrumb-migas .woocommerce-breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 14px; color: #fff; }
.breadcrumb-migas .woocommerce-breadcrumb a { color: rgba(255, 255, 255, 0.94); position: relative; }
.breadcrumb-migas .woocommerce-breadcrumb a:hover { color: #fff; }
.breadcrumb-migas .woocommerce-breadcrumb a::after { content: ''; position: absolute; left: 0; bottom: -3px; height: 1px; width: 100%; background: currentColor; transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease); }
.breadcrumb-migas .woocommerce-breadcrumb a:hover::after { transform: scaleX(1); }
.breadcrumb-migas .woocommerce-breadcrumb .separador { display: inline-block; width: 14px; height: 14px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m9 18 6-6-6-6'/></svg>") no-repeat center / contain; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m9 18 6-6-6-6'/></svg>") no-repeat center / contain; }
@media (min-width: 1024px) {
  .curso-cabecera-bloque { max-width: calc(100% - 440px); }
  .curso-aside { margin-top: -380px !important; }
}
.curso-aside-card { overflow: hidden; }
.curso-aside-card .frame img { border-radius: 0; }
.curso-dl .fila-dato { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.curso-dl .elementor-icon-list-icon svg { fill: none; }
.curso-dl .elementor-icon-list-items { gap: 12px; }
.curso-dl .elementor-icon-list-item { justify-content: space-between; }
.curso-dl .elementor-icon-list-item .elementor-icon-list-text { flex: 1; }
.curso-dl .dato-valor { font-family: Poppins, sans-serif; font-weight: 600; color: var(--e-global-color-tinta); }
.curso-nota { border-top: 1px solid var(--e-global-color-linea); }
/* Boton de compra de WooCommerce con el estilo del proyecto */
.curso-comprar .elementor-add-to-cart form.cart { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.curso-comprar .elementor-add-to-cart .single_add_to_cart_button { width: 100%; height: 52px; border-radius: var(--r); font-family: Poppins, sans-serif; font-weight: 600; font-size: 15px; display: inline-flex; align-items: center; justify-content: center; }
.curso-comprar .quantity { display: none; }
.curso-comprar .added_to_cart { display: none; }

/* Acordeon del temario (CourseDetailBody.jsx · Modulo) */
/* Acordeon del temario (CourseDetailBody.jsx · Modulo) */
.temario-modulo { 
    margin-bottom: 15px; 
}

.temario-cabecera { 
    background-image: linear-gradient(112deg, #001C69 0%, #6828CA 100%);
    border-radius: 50px; 
    padding: 15px 30px;
    display: flex; 
    align-items: center; 
    justify-content: center; 
    cursor: pointer; 
    position: relative; 
    /* Usamos 'filter' para animar el degradado sutilmente */
    transition: filter var(--dur-fast) var(--ease); 
}

/* Brillo extra al pasar el cursor */
.temario-cabecera:hover {
    filter: brightness(1.2); 
}

.temario-lista .temario-cabecera h3.temario-titulo,
.temario-cabecera h3.temario-titulo { 
    margin: 0; 
    font-family: Poppins, sans-serif; 
    font-size: 16px; 
    font-weight: 500; 
    line-height: 1.4; 
    letter-spacing: 0; 
    color: #ffffff; 
    text-align: center;
}

.temario-der { 
    position: absolute; 
    right: 25px;
    display: flex; 
    align-items: center; 
    gap: 16px; 
}

.temario-dur { 
    font-family: var(--e-global-typography-meta-font-family, Inter), sans-serif; 
    font-size: var(--e-global-typography-meta-font-size, 14px); 
    font-weight: var(--e-global-typography-meta-font-weight, 400); 
    line-height: var(--e-global-typography-meta-line-height, 1.5); 
    color: #ffffff; 
}

.temario-cabecera .elementor-icon { display: inline-flex; }
.temario-cabecera .elementor-icon svg { 
    width: 18px; 
    height: 18px; 
    display: block; 
    fill: #ffffff; 
    stroke: #ffffff;
}

.temario-cuerpo p:last-child { margin-bottom: 0; }
.temario-cabecera .ico-minus { display: none; }
.temario-modulo.is-abierto .temario-cabecera .ico-minus { display: block; }
.temario-modulo.is-abierto .temario-cabecera .ico-plus { display: none; }

/* =========================================================
   ANIMACIÓN DE APERTURA FLUIDA
   ========================================================= */

/* 1. Evitamos que el navegador oculte el elemento de golpe si JavaScript le añade el atributo [hidden] */
.temario-cuerpo[hidden] { 
    display: grid !important; 
}

/* 2. Preparamos el contenedor principal cerrado (altura 0 y transparente) */
.temario-cuerpo {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    padding: 0 !important;
    transition: grid-template-rows var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

/* 3. El contenedor interno (la lista) que se revelará */
.temario-cuerpo > div {
    overflow: hidden;
    padding: 0 15px; /* Espaciado lateral */
    transition: padding var(--dur) var(--ease);
}

/* 4. Estado Abierto: Altura natural (1fr) y opacidad completa */
.temario-modulo.is-abierto .temario-cuerpo {
    grid-template-rows: 1fr;
    opacity: 1;
}

/* 5. Añadimos el padding vertical solo al abrir para que la animación sea perfecta */
.temario-modulo.is-abierto .temario-cuerpo > div {
    padding-top: 20px;
    padding-bottom: 32px;
}

/* Listas con check azul (aprendizajes, requisitos, lecciones) */
.lista-check ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.lista-check.lista-2col ul { gap: 12px; }
@media (min-width: 640px) { .lista-check.lista-2col ul { grid-template-columns: 1fr 1fr; } }
.lista-check.lista-compacta ul { gap: 10px; }
.lista-check li { position: relative; padding-left: 27px; font-size: 15px; line-height: 1.625; }
.lista-check li::before { content: ''; position: absolute; left: 0; top: 4px; width: 17px; height: 17px; background-color: var(--e-global-color-azul); -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6 9 17l-5-5'/></svg>") no-repeat center / contain; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6 9 17l-5-5'/></svg>") no-repeat center / contain; }
.lista-check.lista-compacta li::before { width: 16px; height: 16px; }
/* Lista con punto azul (ContactInstitutional.jsx, LegalBody.jsx) */
.lista-punto ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lista-punto li { position: relative; padding-left: 18px; }
.lista-punto li::before { content: ''; position: absolute; left: 0; top: 0.7em; width: 6px; height: 6px; border-radius: 999px; background: var(--e-global-color-azul); }
.lista-punto.lista-16 li { font-size: 16px; line-height: 1.65; }
.lista-punto.lista-16 li::before { top: 0.75em; }
/* Chips (ServicesList.jsx detalle) */
.chips ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { background: var(--e-global-color-pastel); color: var(--e-global-color-azulprofundo); border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 500; line-height: 1.5; }

/* ==========================================================================
   Consultoria: filas alternas (ServicesList.jsx)
   ========================================================================== */
.servicios-lista .elementor-loop-container { display: block; }
.servicios-lista .e-loop-item { display: block; }
.servicios-lista .e-loop-item:nth-child(even) .servicio-fila { background-color: var(--e-global-color-fondoalterno); }
.servicios-lista .e-loop-item:nth-child(even) .servicio-fila-grid { flex-direction: row-reverse; }
@media (max-width: 1023px) { .servicios-lista .e-loop-item:nth-child(even) .servicio-fila-grid { flex-direction: column; } }
.servicios-lista .e-loop-item { scroll-margin-top: 104px; }
.servicio-num { letter-spacing: 0.08em; }
.servicio-fila-grid > .e-con { min-width: 0; }

/* ==========================================================================
   Formulario con etiquetas flotantes y linea inferior (ContactFormSection.jsx)
   ========================================================================== */
.form-flotante .elementor-field-group { position: relative; padding-top: 0; }
.form-flotante .elementor-field-group > label { position: absolute; left: 0; top: 24px; font-size: 15px; color: var(--e-global-color-atenuado); pointer-events: none; transition: all var(--dur-fast) var(--ease); margin: 0; z-index: 1; }
.form-flotante .elementor-field-group:focus-within > label, .form-flotante .elementor-field-group.filled > label { top: 0; font-size: 13px; }
.form-flotante .elementor-field-group:focus-within > label { color: var(--e-global-color-azul); }
.form-flotante .elementor-field-group > label .elementor-mark-required::after { color: var(--e-global-color-azul); }
.form-flotante .elementor-field { padding: 24px 0 10px !important; background: transparent !important; border-radius: 0 !important; box-shadow: none !important; }
.form-flotante .elementor-field::placeholder { color: transparent !important; opacity: 0; }
.form-flotante .elementor-field:focus { border-bottom: 2px solid var(--e-global-color-azul) !important; outline: none; }
.form-flotante .elementor-field-type-select .elementor-field { appearance: none; -webkit-appearance: none; padding-right: 24px !important; }
.form-flotante .elementor-select-wrapper .select-caret-down-wrapper { display: none; }
.form-flotante .elementor-select-wrapper::after { content: ''; position: absolute; right: 0; top: 30px; width: 16px; height: 16px; pointer-events: none; background-color: var(--e-global-color-atenuado); -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat center / contain; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat center / contain; }
.form-flotante .elementor-select-wrapper { position: relative; }
.form-flotante .elementor-field-textual.elementor-size-sm { font-size: 15px; }
.form-flotante .elementor-field-group.elementor-field-type-submit { margin-top: 0; }
.form-flotante .elementor-button { width: 100%; height: 52px; border-radius: var(--r) !important; }
.form-flotante .elementor-button .elementor-button-icon svg { width: 16px; height: 16px; }
.form-flotante .elementor-message { font-size: 15px; line-height: 1.6; }
.form-flotante .elementor-message-success::before { display: none; }
.form-flotante textarea.elementor-field { resize: vertical; }
.form-titulo { max-width: 22ch; }
.form-foto { position: relative; align-self: stretch; min-height: 400px; height: auto !important; }
.form-foto .elementor-widget-container { position: absolute; inset: 0; border-radius: var(--r); overflow: hidden; }
.form-foto img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; }
.contacto-fila { align-items: stretch; }

/* ==========================================================================
   Valores (Values.jsx): numero como marca de agua tipografica
   ========================================================================== */
.valor-card { position: relative; overflow: hidden; }
.valor-num { position: absolute !important; right: 12px; top: -12px; width: auto !important; pointer-events: none; }
.valor-num h4, .valor-num span, .valor-num div { font-family: Poppins, sans-serif !important; font-size: 86px !important; font-weight: 700; line-height: 1 !important; letter-spacing: -0.04em; color: var(--e-global-color-lavado) !important; }
.valor-texto { position: relative; z-index: 1; }

/* Mision y vision */
.mv-bloque { border-top: 1px solid rgba(255, 255, 255, 0.25); }

/* ==========================================================================
   Legales (LegalBody.jsx): indice y articulos
   ========================================================================== */
.legal-toc .elementor-toc__header { border: 0 !important; padding: 0 0 24px !important; }
.legal-toc .elementor-toc__header-title { font-family: Inter, sans-serif; font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--e-global-color-atenuado); font-weight: 400; }
.legal-toc .elementor-toc__body { padding: 0 !important; }
.legal-toc .elementor-toc__list-wrapper { border-left: 1px solid var(--e-global-color-linea); }
.legal-toc .elementor-toc__list-item { margin: 0; }
.legal-toc .elementor-toc__list-item-text { display: flex; align-items: center; min-height: 44px; margin-left: -1px; padding-left: 16px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.375; color: var(--e-global-color-cuerpo); transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.legal-toc .elementor-toc__list-item-text:hover { color: var(--e-global-color-azul); text-decoration: none; }
.legal-toc .elementor-toc__list-item-text.elementor-item-active { border-color: var(--e-global-color-azul); color: var(--e-global-color-azul); font-weight: 600; }
.legal-toc .elementor-toc__list-item-text-wrapper { padding: 0; }
.legal-toc .elementor-toc__list-item-text-wrapper::before { display: none; }
.legal-toc .elementor-toc__spinner-container { display: none; }
.legal-articulo { border-bottom: 1px solid var(--e-global-color-linea); }
.legal-articulo:last-of-type { border-bottom: 0; }
.legal-articulo h2 { scroll-margin-top: 104px; }
.legal-articulo .elementor-widget-text-editor p + p { margin-top: 24px; }

/* ==========================================================================
   Pie de pagina (Footer.jsx)
   ========================================================================== */
.footer-enlaces .elementor-nav-menu--layout-vertical .elementor-nav-menu > li > a { padding: 5px 0; font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, 0.94); position: relative; width: max-content; }
.footer-enlaces .elementor-nav-menu a::after { content: ''; position: absolute; left: 0; bottom: 2px; height: 1px; width: 100%; background: currentColor; transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease); }
.footer-enlaces .elementor-nav-menu a:hover { color: #fff; }
.footer-enlaces .elementor-nav-menu a:hover::after { transform: scaleX(1); }
.footer-enlaces .elementor-nav-menu .elementor-item.elementor-item-active { color: rgba(255, 255, 255, 0.94); }
.footer-legal-menu .elementor-nav-menu--layout-horizontal .elementor-nav-menu > li > a { font-size: 14px; padding: 0; }
.footer-legal-menu .elementor-nav-menu--layout-horizontal .elementor-nav-menu > li { margin-right: 24px; }
.footer-legal-menu .elementor-nav-menu--layout-horizontal .elementor-nav-menu { flex-wrap: wrap; row-gap: 8px; }
.footer-redes .elementor-icon { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.25); color: #fff; transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.footer-redes .elementor-icon:hover { background: #fff; border-color: #fff; color: var(--e-global-color-indigo) !important; }
.footer-redes .elementor-icon svg { width: 17px; height: 17px; }
/* Elementor 4 mete la sangria del texto como padding del icono: con box-sizing border-box el SVG se colapsaba a 3px */
.footer-contacto .elementor-icon-list-icon { width: 17px; box-sizing: content-box; flex: 0 0 auto; }
.footer-contacto .elementor-icon-list-icon svg { width: 17px !important; height: 17px !important; min-width: 17px; margin: 0 !important; color: #fff; fill: none !important; stroke: currentColor; }
/* El glifo de WhatsApp (relleno) va en su verde, como en Footer.jsx (`text-whatsapp`) */
.footer-contacto .elementor-icon-list-icon svg[fill="currentColor"] { color: var(--e-global-color-whatsapp); fill: currentColor !important; stroke: none; }
.footer-contacto .elementor-icon-list-item { align-items: flex-start; }
.footer-contacto .elementor-icon-list-icon { margin-top: 4px; }
.footer-contacto a { position: relative; }
.footer-contacto a:hover { color: #fff !important; }
.footer-contacto .link-whatsapp a:hover { color: var(--e-global-color-whatsapp) !important; }
.footer-conversemos .elementor-button { height: 48px; }
.footer-conversemos .elementor-button:hover { background: #fff !important; color: var(--e-global-color-indigo) !important; }
.footer-legal { border-top: 1px solid rgba(255, 255, 255, 0.18); }
.footer-servicios .elementor-loop-container { display: grid; gap: 10px; }
.footer-servicios .e-loop-item a { font-size: 15px; color: rgba(255, 255, 255, 0.94); position: relative; width: max-content; display: inline-block; }
.footer-servicios .e-loop-item a::after { content: ''; position: absolute; left: 0; bottom: 2px; height: 1px; width: 100%; background: currentColor; transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease); }
.footer-servicios .e-loop-item a:hover { color: #fff; }
.footer-servicios .e-loop-item a:hover::after { transform: scaleX(1); }
.footer-servicios .e-loop-item, .footer-servicios .e-loop-item > .e-con { padding: 0 !important; }
.footer-servicios .elementor-widget-heading { width: auto; }

/* ==========================================================================
   Paginas de WooCommerce (carrito, finalizar compra, mi cuenta): tipografia
   y colores del proyecto sobre los bloques nativos
   ========================================================================== */
.woocommerce-cart .site-main, .woocommerce-checkout .site-main, .woocommerce-account .site-main, .page-template-elementor_header_footer .wc-block-components-notices { font-family: Inter, sans-serif; }
/* Las paginas que genera WooCommerce (y la 404 del tema) empiezan bajo la cabecera fija */
body.woocommerce-cart .site-main, body.woocommerce-checkout .site-main, body.woocommerce-account .site-main, body.woocommerce-cart #content, body.woocommerce-checkout #content, body.woocommerce-account #content { padding-top: 164px; }
@media (min-width: 1024px) { body.woocommerce-cart .site-main, body.woocommerce-checkout .site-main, body.woocommerce-account .site-main, body.woocommerce-cart #content, body.woocommerce-checkout #content, body.woocommerce-account #content { padding-top: 232px; } }
.woocommerce-cart .elementor-location-header + *, .woocommerce-checkout .elementor-location-header + * { padding-top: 0; }
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout, .woocommerce-account .woocommerce, .woocommerce-order-received .woocommerce, .wc-block-components-notices { max-width: 1290px; margin-inline: auto; padding-inline: 32px; padding-bottom: 96px; }
@media (max-width: 767px) { .wp-block-woocommerce-cart, .wp-block-woocommerce-checkout, .woocommerce-account .woocommerce, .woocommerce-order-received .woocommerce { padding-inline: 24px; } }
.wc-block-components-button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button, .woocommerce button.button, .woocommerce a.button, .woocommerce .button { background: var(--e-global-color-primario) !important; color: #fff !important; border-radius: var(--r) !important; font-family: Poppins, sans-serif !important; font-weight: 600 !important; font-size: 15px !important; }
.wc-block-components-button:hover, .woocommerce button.button:hover, .woocommerce a.button:hover { background: var(--e-global-color-primariohover) !important; }
.wc-block-components-product-name, .wc-block-components-totals-item__label, .wc-block-components-title, .wc-block-components-checkout-step__title, .woocommerce h2, .woocommerce h3, .entry-title { font-family: Poppins, sans-serif; color: var(--e-global-color-tinta); }
.wc-block-components-checkout-step__title, .woocommerce-account h2, .woocommerce-order-received h2 { font-size: 22px; font-weight: 700; }
.wc-block-components-text-input input, .wc-block-components-textarea, .woocommerce-input-wrapper .input-text, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea { border-radius: var(--r); border-color: var(--e-global-color-linea); font-family: Inter, sans-serif; }
.wc-block-components-text-input.is-active input, .wc-block-components-text-input input:focus { border-color: var(--e-global-color-azul); box-shadow: none; }
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-MyAccount-navigation a { color: var(--e-global-color-cuerpo); }
.woocommerce-MyAccount-navigation .is-active a { color: var(--e-global-color-azul); font-weight: 600; }
.woocommerce-info, .woocommerce-message, .woocommerce-error { border-top-color: var(--e-global-color-primario); }
.woocommerce-info::before, .woocommerce-message::before { color: var(--e-global-color-primario); }
.wc-block-components-order-summary-item__quantity, .wc-block-components-product-badge { border-color: var(--e-global-color-linea); }
.woocommerce a { color: var(--e-global-color-azul); }
.woocommerce-order-received .woocommerce-thankyou-order-received { font-family: Poppins, sans-serif; font-weight: 600; font-size: 20px; color: var(--e-global-color-tinta); }
.woocommerce table.shop_table { border-color: var(--e-global-color-linea); border-radius: var(--r); }

/* ==========================================================================
   Revelado al entrar en vista (motion.css + reveal.js del React). Los estados
   ocultos solo existen bajo .reveal-ready, que pone site.js: sin JS todo se ve.
   Atributos: data-reveal="up|up-sm|left|right|zoom|fade|wipe|draw",
   data-reveal-delay, data-reveal-stagger, data-reveal-lines, data-reveal-group.
   ========================================================================== */
.reveal-ready [data-reveal] { opacity: 0; will-change: transform, opacity; transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease); transition-delay: var(--reveal-delay, 0ms); }
.reveal-ready [data-reveal='up'] { transform: translateY(32px); }
.reveal-ready [data-reveal='up-sm'] { transform: translateY(20px); }
.reveal-ready [data-reveal='left'] { transform: translateX(-28px); }
.reveal-ready [data-reveal='right'] { transform: translateX(28px); }
.reveal-ready [data-reveal='zoom'] { transform: scale(0.96); }
.reveal-ready [data-reveal='fade'] { transform: none; }
/* Filas pares de servicios (ServicesList.jsx: invertido → right) */
.reveal-ready .servicios-lista .e-loop-item:nth-child(even) [data-reveal='left']:not(.is-revealed) { transform: translateX(28px); }
.reveal-ready [data-reveal].is-revealed { opacity: 1; transform: none; }

/* Linea de titulo: cada linea sube desde su propia mascara */
.line-mask { display: block; overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.reveal-ready .line-mask > span { display: block; transform: translateY(105%); transition: transform var(--dur-slow) var(--ease); transition-delay: var(--reveal-delay, 0ms); }
.reveal-ready .line-mask.is-revealed > span, .reveal-ready [data-reveal-lines].is-revealed .line-mask > span { transform: none; }

/* Barrido de las bandas degradadas. El recorte va sobre los hijos, nunca sobre el nodo observado
   (recortado a cero no intersecta). Como en Elementor el degradado lo pinta el propio contenedor,
   se traslada a un ::before que si se puede recortar. */
.reveal-ready [data-reveal='wipe'] { opacity: 1; }
.reveal-ready [data-reveal='wipe'] > * { clip-path: inset(0 100% 0 0); transition: clip-path var(--dur-slow) var(--ease); transition-delay: var(--reveal-delay, 0ms); }
.reveal-ready [data-reveal='wipe'].is-revealed > * { clip-path: inset(0 0 0 0); }
.reveal-ready .on-dark[data-reveal='wipe'] { background: none !important; position: relative; isolation: isolate; }
.reveal-ready .on-dark[data-reveal='wipe']::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(112deg, var(--e-global-color-azulprofundo) 0%, var(--e-global-color-primario) 100%); clip-path: inset(0 100% 0 0); transition: clip-path var(--dur-slow) var(--ease); }
.reveal-ready .on-dark[data-reveal='wipe'].is-revealed::before { clip-path: inset(0 0 0 0); }

/* Linea que se dibuja de izquierda a derecha */
.reveal-ready [data-reveal='draw'] { opacity: 1; transform: scaleX(0); transform-origin: left center; transition: transform 900ms var(--ease); transition-delay: var(--reveal-delay, 0ms); }
.reveal-ready [data-reveal='draw'].is-revealed { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal-ready [data-reveal], .reveal-ready [data-reveal].is-revealed, .reveal-ready .line-mask > span, .reveal-ready [data-reveal='wipe'] > *, .reveal-ready [data-reveal='wipe']::before, .reveal-ready [data-reveal='draw'] { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* Movil: entradas mas cortas y sin escalonado */
@media (max-width: 767px) {
  .reveal-ready [data-reveal], .reveal-ready .line-mask > span { transition-duration: 400ms; transition-delay: 0ms !important; }
  .reveal-ready [data-reveal='up'], .reveal-ready [data-reveal='left'], .reveal-ready [data-reveal='right'], .reveal-ready .servicios-lista .e-loop-item:nth-child(even) [data-reveal='left']:not(.is-revealed) { transform: translateY(20px); }
}
}

/* Enlace "Saltar al contenido" del tema, con el estilo del React (.skip-link) */
.skip-link { left: 24px; top: -100px; z-index: 100; background: #fff; color: var(--e-global-color-tinta); padding: 12px 20px; border-radius: var(--r); box-shadow: var(--shadow-float); font-weight: 600; transition: top var(--dur-fast) var(--ease); }
.skip-link:focus-visible { top: 24px; }

/* ==========================================================================
   Complementos
   ========================================================================== */
/* Los loop items de un grid llenan la celda (equal height) */
.e-loop-item > .e-con.card, .e-loop-item > .e-con.curso-card { height: 100%; }
.elementor-loop-container.elementor-grid .e-loop-item { display: flex; flex-direction: column; }
.elementor-loop-container.elementor-grid .e-loop-item > .e-con { flex: 1 1 auto; }
/* Velo del hero sobre las franjas (HeroSlider.jsx): 4 paradas exactas */
.hero-rainbow::after { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(95deg, rgba(23, 11, 78, 0.93) 0%, rgba(23, 11, 78, 0.82) 38%, rgba(23, 11, 78, 0.34) 70%, rgba(23, 11, 78, 0) 100%); }
.hero-rainbow > .e-con-inner { position: relative; z-index: 1; }
.hero-pausa { position: absolute !important; left: calc(var(--container-default-padding-left, 32px) + 100px); bottom: 96px; z-index: 3; }
.cta-texto { min-width: 0; }
@media (min-width: 1354px) { .hero-pausa { left: calc((100% - 1290px) / 2 + 100px); } }
/* Aro del hero: disco con zoom y dos trazos que se dibujan */
.hero-aro circle:nth-of-type(1) { animation: discoIn var(--dur-slow) var(--ease) both; transform-origin: center; animation-delay: 80ms; }
.hero-aro circle:nth-of-type(2) { stroke-dasharray: 302; animation: aroDibuja 1100ms var(--ease) both; animation-delay: 160ms; }
.hero-aro circle:nth-of-type(3) { stroke-dasharray: 302; animation: aroDibuja 1100ms var(--ease) both; animation-delay: 320ms; }
.hero-aro img, .hero-aro svg { aspect-ratio: 1 / 1; }
/* Items del menu que solo existen en el panel movil */
@media (min-width: 1024px) { .nav-principal .menu-solo-movil { display: none !important; } }
@media (max-width: 1023px) {
  .nav-principal .elementor-nav-menu--dropdown > li.menu-cta { border: 0; margin-top: 48px; }
  .nav-principal .elementor-nav-menu--dropdown > li.menu-cta > a { min-height: 52px; justify-content: center; border: 1px solid var(--e-global-color-primario); border-radius: var(--r); font-size: 15px; padding: 0 20px !important; }
  .nav-principal .elementor-nav-menu--dropdown > li.menu-email { border: 0; margin-top: 24px; }
  .nav-principal .elementor-nav-menu--dropdown > li.menu-email > a { min-height: 0; font-family: Inter, sans-serif; font-size: 15px; font-weight: 400; color: var(--e-global-color-cuerpo); }
}
/* Boton Aula Virtual: contenedor-enlace que invierte en hover */
.btn-aula { transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); text-decoration: none; }
.btn-aula:hover * , .btn-aula:hover .elementor-icon { color: #fff !important; }
.btn-aula .elementor-widget-icon .elementor-widget-container, .btn-aula .elementor-icon { line-height: 0; display: inline-flex; }
.btn-aula .ico-arriba .elementor-icon { opacity: 0.6; }
/* Enlace "Ver servicio" dentro de la tarjeta (span, no enlace) */
.link-underline-span { position: relative; width: max-content; }
.link-underline-span::after { content: ''; position: absolute; left: 0; bottom: -3px; height: 1px; width: 100%; background: var(--e-global-color-azul); transform: scaleX(0); transform-origin: left center; transition: transform var(--dur-fast) var(--ease); }
.card-activa:hover .link-underline-span::after { background: #fff; transform: scaleX(1); }
.link-underline-span .elementor-icon svg { transition: transform var(--dur-fast) var(--ease); }
.card-activa:hover .link-underline-span .elementor-icon svg { transform: translateX(4px); }
/* Pie de la tarjeta de curso pegado abajo */
.curso-pie { margin-top: auto !important; }
/* Widget de contador: numero y titulo apilados a la izquierda */
.numero-item .elementor-counter .elementor-counter-number-wrapper { justify-content: flex-start; }
.numero-item .elementor-counter-title { text-align: left; }
/* Imagenes de proporcion libre */
.frame-auto img { aspect-ratio: auto; }
.frame-auto .elementor-widget-container { overflow: visible; }
/* Contenedores-enlace de Elementor no llevan subrayado */
a.e-con, a.e-con:hover { text-decoration: none; }
/* Tarjetas de color: titulos y textos en blanco */
.card-color h3, .card-color p { color: #fff; }
.card-color p { color: rgba(255, 255, 255, 0.94); }

/* Los hijos de una fila nunca fuerzan su ancho de contenido (evita scroll horizontal) */
.e-con > .e-con, .e-con-inner > .e-con, .e-con > .elementor-widget, .e-con-inner > .elementor-widget { min-width: 0; }
/* Indice legal sin caja */
.legal-toc .elementor-widget-container, .legal-toc .elementor-toc__body { border: 0 !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; }

/* Elementor fuerza envolver en movil (--flex-wrap-mobile: wrap) desde la direccion de la fila:
   en movil cada fila envuelve solo si su ajuste "Envolver" es wrap (como en el React) */
.e-con.e-flex { --flex-wrap-mobile: var(--flex-wrap, nowrap) !important; }
/* Contenedores-enlace y de ancho natural en filas */
.header-nav .logo-enlace { width: auto !important; flex: 0 0 auto !important; }
/* El boton mide su contenido (como el <a> del React), no se estira */
.elementor-widget__width-auto .elementor-button { width: auto; }
.elementor-widget__width-auto .elementor-button-text, .elementor-button .elementor-button-text { flex: 0 0 auto; }
/* ==========================================================================
   Modificadores para iconos de relleno (fill-based)
   ========================================================================== */
.icono-relleno svg,
.js-svg.icono-relleno svg,
.elementor-icon.icono-relleno svg {
  fill: currentColor !important;
  stroke: none !important;
}
/* Forzar relleno sólido y ajustar tamaño para el icono del Loop de Categorías */
.elementor-element-8f865f9.js-svg svg,
.elementor-element-8f865f9.js-svg svg * {
  fill: currentColor !important;
  stroke: none !important;
}

.elementor-element-8f865f9.js-svg svg {
  width: 35px !important;
  height: 35px !important;
}

/* ==========================================================================
   Forzar Iconos del Menú Desplegable (Cursos y Consultoría)
   ========================================================================== */

/* --- Cursos --- */
ul.elementor-nav-menu li.ico-bi > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/machine-learning.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/machine-learning.svg') !important;
}

ul.elementor-nav-menu li.ico-ia > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/artificial-intelligence-chip.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/artificial-intelligence-chip.svg') !important;
}

ul.elementor-nav-menu li.ico-diplomado > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/graduation.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/graduation.svg') !important;
}

/* ==========================================================================
   Iconos del Menú Desplegable - Consultoría
   ========================================================================== */

ul.elementor-nav-menu li.ico-inteligencia-artificial > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/artificial-intelligence-chip.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/artificial-intelligence-chip.svg') !important;
}

ul.elementor-nav-menu li.ico-business-intelligence > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/machine-learning.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/machine-learning.svg') !important;
}

ul.elementor-nav-menu li.ico-transformacion-digital > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/interaction.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/interaction.svg') !important;
}

ul.elementor-nav-menu li.ico-desarrollo-web > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/coding.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/coding.svg') !important;
}

ul.elementor-nav-menu li.ico-integracion-de-sistemas > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/data-processing.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/data-processing.svg') !important;
}

ul.elementor-nav-menu li.ico-consultoria-tecnologica > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/operator.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/operator.svg') !important;
}

ul.elementor-nav-menu li.ico-gestion-y-analisis-de-datos > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/data-management.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/data-management.svg') !important;
}

ul.elementor-nav-menu li.ico-diseno-ux-ui > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/website-layout.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/website-layout.svg') !important;
}

ul.elementor-nav-menu li.ico-capacitacion-tecnologica > a::before {
  -webkit-mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/online-training.svg') !important;
  mask-image: url('https://innovatechconsulting.pe/wp-content/uploads/2026/09/online-training.svg') !important;
}

