/* ==========================================================================
   CRM Go — estilos del tema
   Base visual: macri.com.ar (secciones con esquinas redondeadas, botones en
   píldora, azul noche) + Manual de Identidad Macri 2025.
   ========================================================================== */

:root {
	--noche: #14153C;
	--noche-2: #1C1E52;
	--azul: #1B5FA1;
	--azul-claro: #5AB0EA;
	--cian: #00FFFF;
	--cian-ui: #21ECF8;
	--gris: #B4B0B2;
	--niebla: #F3F4F8;
	--blanco: #FFFFFF;
	--texto-suave: #4A4D6E;
	--en-oscuro-suave: rgba(255, 255, 255, .72);
	--borde: rgba(20, 21, 60, .1);
	--degradado: linear-gradient(120deg, var(--azul) 0%, var(--cian) 100%);

	--ancho: 1240px;
	--margen: clamp(16px, 4vw, 40px);
	--radio-sec: clamp(28px, 4vw, 56px);
	--radio-card: 20px;
	--sec-pad: clamp(72px, 10vw, 140px);
	--sombra: 0 24px 60px -24px rgba(20, 21, 60, .28);
	--ease: cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; overflow-x: clip; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; overflow-x: clip; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks > .sitio-pie { margin-block-start: clamp(16px, 2vw, 24px); }
img { max-width: 100%; height: auto; display: block; }
:where(.home) p { margin-block: 0; }
a { text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 6px; }
.sec--noche :focus-visible, .hero :focus-visible, .cierre :focus-visible, .pie :focus-visible { outline-color: var(--cian); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Contenedor de 12 columnas, mismos márgenes a ambos lados */
.wrap { width: min(var(--ancho), 100% - 2 * var(--margen)); margin-inline: auto; }
.wrap--texto { max-width: 820px; padding-block: 140px 96px; }
.grilla { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: clamp(16px, 2.5vw, 32px); row-gap: 32px; }
.grilla__titulo { grid-column: 1 / span 5; }
.grilla__cuerpo { grid-column: 7 / span 6; }
.grilla__mitad { grid-column: span 6; }
.grilla--centro { align-items: center; }
.grilla > * > * + *, .kit__cabeza > * + * { margin-top: 20px; }
@media (max-width: 900px) {
	.grilla__titulo, .grilla__cuerpo, .grilla__mitad { grid-column: 1 / -1; }
}

/* Secciones: alternan blanco y azul noche, con esquinas grandes como macri.com.ar */
.sec { padding-block: var(--sec-pad); position: relative; }
.sec--noche { background: var(--noche); color: var(--blanco); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.sec--noche p { color: var(--en-oscuro-suave); }
.sec--noche strong { color: var(--blanco); }
.sec h2 { max-width: 18ch; }
.texto-grande { font-size: var(--wp--preset--font-size--grande); line-height: 1.55; }
.sec p { max-width: 62ch; }

/* Etiqueta en píldora azul noche para numerar secciones (manual) */
.is-style-etiqueta {
	display: inline-flex; align-items: center; gap: .5em;
	background: var(--noche); color: var(--blanco) !important;
	font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	padding: .45em 1.1em; border-radius: 0 999px 999px 0; margin-left: calc(-1 * var(--margen));
	padding-left: var(--margen);
}
.sec--noche .is-style-etiqueta, .hero .is-style-etiqueta { background: var(--blanco); color: var(--noche) !important; }

/* Títulos con degradado azul a cian */
.is-style-degradado { background: var(--degradado); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.sec--noche .is-style-degradado { background: linear-gradient(120deg, var(--azul-claro) 0%, var(--cian) 70%); -webkit-background-clip: text; background-clip: text; }

/* Botones en píldora */
.wp-block-buttons { gap: 12px; }
.wp-element-button, .boton { transition: background-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); }
.wp-block-button__link:hover, .boton:hover { transform: translateY(-2px); }
.is-style-secundario .wp-block-button__link { background: transparent; color: var(--azul); box-shadow: inset 0 0 0 2px var(--azul); }
.is-style-secundario .wp-block-button__link:hover { background: var(--azul); color: var(--blanco); }
.is-style-claro .wp-block-button__link { background: var(--cian-ui); color: var(--noche); }
.is-style-claro .wp-block-button__link:hover { background: var(--blanco); color: var(--noche); }
.is-style-contorno-claro .wp-block-button__link { background: transparent; color: var(--blanco); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55); }
.is-style-contorno-claro .wp-block-button__link:hover { background: var(--blanco); color: var(--noche); }
.boton {
	display: inline-flex; align-items: center; justify-content: center; white-space: nowrap;
	background: var(--azul); color: var(--blanco); text-decoration: none; font-weight: 600;
	padding: .8em 1.6em; border-radius: 999px; line-height: 1.2;
}
.boton:hover { background: var(--noche); color: var(--blanco); }
.boton--claro { background: var(--cian-ui); color: var(--noche); }
.boton--claro:hover { background: var(--blanco); color: var(--noche); }
.boton--chico { padding: .6em 1.2em; font-size: .9375rem; }

/* Marcadores de pendientes: visibles a propósito */
.pendiente {
	background: #FFF3B0; color: #5A4300; border: 1px dashed #C9A100;
	border-radius: 6px; padding: .05em .35em; font-weight: 600; font-size: .92em;
}
.sec--noche .pendiente, .hero .pendiente { background: #FFF3B0; color: #5A4300; }

/* Iconos de módulos */
[class*="ico-"] { --ico: none; }
.ico-cuentas-y-contactos { --ico: url(../icons/cuentas-y-contactos.svg); }
.ico-tratativas { --ico: url(../icons/tratativas.svg); }
.ico-tareas { --ico: url(../icons/tareas.svg); }
.ico-omnicanal { --ico: url(../icons/omnicanal.svg); }
.ico-crm-go-live { --ico: url(../icons/crm-go-live-logo.webp); }
.ico-multidimensional { --ico: url(../icons/multidimensional.svg); }
.ico-sucursales { --ico: url(../icons/sucursales.svg); }
.ico-importador-desde-excel { --ico: url(../icons/importador-desde-excel.svg); }
.ico-mensajes { --ico: url(../icons/mensajes.svg); }
.ico-administracion { --ico: url(../icons/administracion.svg); }
.ico-presupuestos { --ico: url(../icons/presupuestos.svg); }
.ico-adjuntos { --ico: url(../icons/adjuntos.svg); }
.ico-visualizacion-de-cuentas-corrientes { --ico: url(../icons/visualizacion-de-cuentas-corrientes.svg); }
.ico-proveedores { --ico: url(../icons/proveedores.svg); }
.ico-pedidos-de-servicio { --ico: url(../icons/pedidos-de-servicio.svg); }
.ico-horas { --ico: url(../icons/horas.svg); }
.ico-series { --ico: url(../icons/series.svg); }
.ico-llamados { --ico: url(../icons/llamados.svg); }
.ico-mails { --ico: url(../icons/mails.svg); }
.ico-proyectos-y-oportunidades { --ico: url(../icons/proyectos-y-oportunidades.svg); }
.ico-notas { --ico: url(../icons/notas.svg); }
.ico-mapas { --ico: url(../icons/mapas.svg); }
.ico-acopios { --ico: url(../icons/acopios.svg); }
.ico-indicadores { --ico: url(../icons/indicadores.svg); }
.ico-carrito { --ico: url(../icons/carrito.svg); }
.ico-acceso-web { --ico: url(../icons/acceso-web.svg); }
.ico-ia { --ico: url(../icons/ia.svg); }

/* ==========================================================================
   Encabezado
   ========================================================================== */

.hdr__in {
	width: min(1320px, 100% - 2 * var(--margen)); margin-inline: auto;
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
	background: rgba(255, 255, 255, .96); border-radius: 999px; padding: 10px 10px 10px 26px;
	box-shadow: 0 10px 40px -18px rgba(0, 0, 0, .45);
}
.hdr__logo img { width: 118px; height: auto; }
.hdr__nav { display: flex; align-items: center; gap: 12px; }
.hdr__menu { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.hdr__link {
	display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .9688rem; font-weight: 500;
	color: var(--noche); text-decoration: none; background: none; border: 0; cursor: pointer;
	padding: 10px 14px; border-radius: 999px; transition: background-color .2s;
}
.hdr__link:hover, .hdr__link[aria-expanded="true"] { background: var(--niebla); color: var(--noche); }
.chev { width: 11px; transition: transform .25s var(--ease); }
[aria-expanded="true"] > .chev { transform: rotate(180deg); }
.hdr__burger { display: none; }

/* Desplegable de módulos en dos bloques */
.hdr__item--mega { position: static; }
.mega {
	position: absolute; left: 50%; top: calc(100% + 10px); translate: -50% 0;
	width: min(1100px, 100vw - 2 * var(--margen));
	background: var(--blanco); border-radius: 28px; box-shadow: var(--sombra), 0 0 0 1px var(--borde);
	padding: 28px 28px 0; overflow: hidden;
	opacity: 0; visibility: hidden; transform: translateY(-8px);
	transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s .25s;
}
.hdr__item--mega.is-open .mega, .no-js .hdr__item--mega:focus-within .mega {
	opacity: 1; visibility: visible; transform: none; transition-delay: 0s;
}
.mega__in { display: grid; grid-template-columns: 1fr 2fr; gap: 32px; }
.mega__titulo { margin: 0 0 12px; font-weight: 800; color: var(--noche); display: flex; flex-direction: column; }
.mega__titulo span { font-weight: 400; font-size: .8125rem; color: var(--texto-suave); }
.mega__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.mega__col--doble .mega__lista { grid-template-columns: 1fr 1fr; column-gap: 16px; }
.mega__lista a {
	display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 12px;
	color: var(--noche); text-decoration: none; font-size: .9375rem; line-height: 1.25;
}
.mega__lista a:hover { background: var(--niebla); }
.mega__lista img { width: 28px; height: 28px; flex: none; }
.mega__pie {
	display: block; margin: 20px -28px 0; padding: 16px 28px; background: var(--niebla);
	color: var(--azul); font-weight: 600; text-decoration: none;
}
.mega__pie:hover { background: var(--noche); color: var(--blanco); }

@media (max-width: 1023px) {
	.hdr__in { padding: 8px 8px 8px 20px; border-radius: 26px; flex-wrap: wrap; }
	.hdr__burger {
		display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%;
		border: 0; background: var(--niebla); cursor: pointer;
	}
	.hdr__burger-lineas, .hdr__burger-lineas::before, .hdr__burger-lineas::after {
		display: block; width: 20px; height: 2px; background: var(--noche); border-radius: 2px; content: ""; position: relative; transition: transform .25s var(--ease);
	}
	.hdr__burger-lineas::before { position: absolute; top: -6px; }
	.hdr__burger-lineas::after { position: absolute; top: 6px; }
	.hdr__burger[aria-expanded="true"] .hdr__burger-lineas { background: transparent; }
	.hdr__burger[aria-expanded="true"] .hdr__burger-lineas::before { transform: translateY(6px) rotate(45deg); }
	.hdr__burger[aria-expanded="true"] .hdr__burger-lineas::after { transform: translateY(-6px) rotate(-45deg); }
	.hdr__nav { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; padding: 8px 4px 12px; max-height: calc(100dvh - 110px); overflow-y: auto; }
	.hdr.is-open .hdr__nav { display: flex; }
	.hdr__menu { flex-direction: column; align-items: stretch; }
	.hdr__link { width: 100%; justify-content: space-between; padding: 14px; font-size: 1.0625rem; }
	.mega {
		position: static; translate: none; width: auto; box-shadow: none; padding: 4px 0 0;
		display: none; opacity: 1; visibility: visible; transform: none; border-radius: 0;
	}
	.hdr__item--mega.is-open .mega { display: block; }
	.mega__in { grid-template-columns: 1fr; gap: 18px; padding-inline: 6px; }
	.mega__col--doble .mega__lista { grid-template-columns: 1fr; }
	.mega__pie { margin: 12px 0 0; border-radius: 14px; }
	.boton--demo { margin-top: 8px; }
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
	position: relative; overflow: hidden; color: var(--blanco);
	background:
		radial-gradient(80% 60% at 85% 0%, rgba(27, 95, 161, .55), transparent 70%),
		radial-gradient(60% 50% at 0% 100%, rgba(0, 255, 255, .14), transparent 70%),
		var(--noche);
	border-radius: 0 0 var(--radio-sec) var(--radio-sec);
	padding-top: clamp(130px, 14vw, 170px);
}
.hero__texto { width: min(980px, 100% - 2 * var(--margen)); margin-inline: auto; text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero__etiqueta { margin: 0 0 22px; border-radius: 999px !important; padding: .5em 1.2em !important; background: rgba(255, 255, 255, .16) !important; color: #FFFFFF !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28); }
.hero__titulo { margin: 0; font-size: clamp(2.125rem, 1.2rem + 3.6vw, 4rem); letter-spacing: 0; line-height: 1.06; text-wrap: balance; }
.h1-a, .h1-b { display: inline-block; }
.h1-b { background: linear-gradient(100deg, #FFFFFF 10%, var(--cian) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__bajada { margin-top: 22px; max-width: 60ch; font-size: var(--wp--preset--font-size--grande); color: var(--en-oscuro-suave); }
.hero__botones { margin-top: 32px; justify-content: center; }
.hero__confianza {
	list-style: none; padding: 0; margin: 26px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px;
	font-size: .9375rem; color: var(--en-oscuro-suave);
}
.hero__confianza li { display: inline-flex; align-items: center; gap: 8px; }
.hero__confianza li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 12px var(--cian); }

.hero { padding-bottom: var(--sec-pad); }
.secuencia { position: relative; }
/* La escena arranca siempre debajo del título y la bajada: el H1 nunca queda tapado. */
.hero__escena { position: relative; margin-top: clamp(56px, 8vw, 104px); perspective: 1400px; }
.fondo-escena { position: absolute; inset: 0; pointer-events: none; }
.hero__gigante {
	position: absolute; left: 0; right: 0; top: 40%; margin-top: -.4em; text-align: center; white-space: nowrap; pointer-events: none; user-select: none;
	font-family: var(--wp--preset--font-family--titulos); font-weight: 600; letter-spacing: -.04em; line-height: .8;
	font-size: clamp(6rem, 25vw, 23rem);
	background: linear-gradient(180deg, rgba(90, 176, 234, .85) 0%, rgba(0, 255, 255, .25) 75%, rgba(0, 255, 255, .05) 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.mosaico { display: none; }

/* Grupo de dispositivos: notebook al centro, tablet y celular apenas por delante */
.hero { container-type: inline-size; overflow-x: clip; }
.secuencia { --nb: min(820px, 100cqw - 2 * var(--margen) - 32px); }
.dispositivos { position: relative; width: var(--nb); margin-inline: auto; padding-bottom: 12%; z-index: 1; transform-style: preserve-3d; }
.notebook { position: relative; width: 100%; z-index: 1; transform-origin: 50% 100%; }
.notebook__pantalla {
	position: relative; aspect-ratio: 16 / 10.2; border-radius: 22px 22px 6px 6px; padding: 2.2%;
	background: linear-gradient(180deg, #2A2C4E, #0B0C24); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .18) inset, 0 40px 90px -30px rgba(0, 0, 0, .8);
}
.notebook__pantalla::before { content: ""; position: absolute; top: 1%; left: 50%; width: 8px; height: 8px; translate: -50% 0; border-radius: 50%; background: #3A3D63; }
.notebook::after {
	content: ""; display: block; height: clamp(12px, 2vw, 20px); margin-inline: -7%;
	background: linear-gradient(180deg, #D7DAE6 0%, #9EA3B8 55%, #6E7390 100%);
	border-radius: 2px 2px 18px 18px; box-shadow: 0 24px 40px -14px rgba(0, 0, 0, .6);
	clip-path: polygon(0 0, 100% 0, 98% 100%, 2% 100%);
}

/* Pantallas: la captura llena el rectángulo, recortada arriba a la izquierda, nunca estirada ni deformada */
.notebook__pantalla, .tablet__pantalla { overflow: hidden; }
.notebook__pantalla > *, .tablet__pantalla > *, .telefono__pantalla > * { margin: 0 !important; }
.notebook__captura, .tablet__captura { position: absolute; background: #fff; overflow: hidden; }
.notebook__captura { inset: 2.2%; border-radius: 10px; }
.tablet__captura { inset: 0; }
.notebook__captura img, .tablet__captura img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }

/* Tablet: marco parejo, pantalla rectangular */
.tablet { background: #0C0D22; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .16) inset, 0 40px 80px -28px rgba(0, 0, 0, .85); will-change: transform; }
.tablet { position: absolute; z-index: 2; left: 0; bottom: -6%; width: 56%; padding: 12px; border-radius: 24px; }
.is-escenario .tablet { left: -14%; bottom: -10%; width: 64%; }
.tablet__pantalla { position: relative; aspect-ratio: 2360 / 1640; border-radius: 10px; }

/* Celular: proporción real 9:19,5, pantalla rectangular con esquinas redondeadas y la isla arriba */



/* El celular muestra la captura completa, ajustada al ancho, con margen interno */


.telefono--viaja { position: absolute; z-index: 3; right: 0; bottom: -10%; width: clamp(130px, 22%, 200px); }
.is-escenario .telefono--viaja { right: -9%; bottom: -14%; width: clamp(124px, 24%, 170px); }

/* Tarjetas de vidrio */
.vidrio {
	position: absolute; z-index: 4; display: flex; align-items: center; gap: 12px; width: 250px; padding: 12px 16px 12px 12px; border-radius: 18px;
	color: var(--en-oscuro-suave); font-size: .8125rem; line-height: 1.35;
	background: linear-gradient(140deg, rgba(34, 36, 88, .8), rgba(20, 21, 60, .78));
	border: 1px solid rgba(255, 255, 255, .2);
	backdrop-filter: blur(28px) saturate(1.3); -webkit-backdrop-filter: blur(28px) saturate(1.3);
	box-shadow: 0 24px 50px -24px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .25);
	will-change: transform;
}
.vidrio__ico { width: 40px; height: 40px; flex: none; border-radius: 12px; background: rgba(255, 255, 255, .92) var(--ico) center / 24px no-repeat; }
.vidrio__txt { display: flex; flex-direction: column; }
.vidrio__txt strong { color: var(--blanco); font-size: .9375rem; }
/* Sin escenario fijo (pantallas bajas, tablet y celular): las tarjetas van debajo de los dispositivos, sin tapar capturas */
.vidrios { display: grid; grid-template-columns: repeat(2, minmax(0, 260px)); justify-content: center; gap: 12px; position: absolute; left: 0; right: 0; top: calc(100% + 32px); }
.vidrios .vidrio { position: relative; width: auto; }
.dispositivos:has(.vidrios) { margin-bottom: 190px; }
@media (max-width: 900px) {
	.vidrio { font-size: .75rem; padding: 10px 12px 10px 10px; }
	.vidrio__ico { width: 34px; height: 34px; background-size: 20px; }

	.tablet { left: -4%; bottom: -8%; width: 62%; padding: 6px; border-radius: 14px; }
	.tablet__pantalla { border-radius: 6px; }

}

@media (max-width: 900px) {




}

/* Texto multiplataforma: siempre debajo de los dispositivos */
.multi { position: relative; z-index: 2; width: min(780px, 100% - 2 * var(--margen)); margin: clamp(72px, 9vw, 120px) auto 0; text-align: center; }
.multi__frase { font-family: var(--wp--preset--font-family--titulos); font-weight: 600; font-size: clamp(1.5rem, 1rem + 1.6vw, 2.25rem); line-height: 1.15; letter-spacing: 0; color: var(--blanco); text-wrap: balance; }
.multi__nota { margin-top: 12px !important; color: var(--en-oscuro-suave); font-size: .9375rem; }

/* Escritorio con movimiento: la secuencia queda fija y las capas se superponen */
.secuencia.is-escenario { height: calc(100vh - var(--alto-menu, 64px)); --nb: min(640px, 44cqw, (100vh - var(--alto-menu, 64px) - 420px) * 1.55); }
.is-escenario .hero__escena { position: absolute; inset: 0; margin: 0; z-index: 2; pointer-events: none; }
/* Centrado sin translate (GSAP anima el transform): mitad del ancho y mitad del alto de la notebook */
.is-escenario .dispositivos { position: absolute; left: calc(50% - var(--nb) / 2); top: calc(40% - var(--nb) * .32 - 10px); width: var(--nb); padding: 0; }
.is-escenario .hero__gigante { top: 40%; }
.ciclo { container-type: inline-size; }
.is-escenario .mosaico { display: block; position: absolute; inset: 0; }
.is-escenario .multi { position: absolute; left: 0; right: 0; bottom: 4vh; margin: 0 auto; width: min(780px, 90%); }
.is-escenario .ciclo { position: absolute; inset: 0; padding: 0; display: flex; align-items: center; z-index: 1; }
.is-escenario .ciclo__grilla { width: min(var(--ancho), 100% - 2 * var(--margen)); }
.is-escenario .ciclo__telefono { visibility: hidden; }
.is-escenario + * { margin-top: 0; }
.hero:has(.is-escenario) { padding-bottom: 0; }

/* Íconos de fondo: pocos y tenues, para no competir con los dispositivos */
.tesela {
	position: absolute; width: 60px; height: 60px; border-radius: 18px; translate: -50% -50%;
	background: var(--ico) center / 30px no-repeat, linear-gradient(140deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .04));
	border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
	box-shadow: 0 18px 36px -20px rgba(0, 0, 0, .7); will-change: transform;
}

/* ==========================================================================
   ¿Qué es? + datos + frase
   ========================================================================== */
.datos { display: grid; grid-template-columns: repeat(3, 1fr); align-items: start; gap: clamp(16px, 2.5vw, 32px); margin-top: clamp(56px, 7vw, 96px); }
.dato { padding-top: 22px; border-top: 2px solid var(--noche); }
.dato__numero {
	font-family: var(--wp--preset--font-family--titulos); font-weight: 600; line-height: 1; letter-spacing: 0;
	font-size: clamp(2.5rem, 1.2rem + 3.2vw, 4.25rem); color: var(--azul); white-space: nowrap;
}
.dato__texto { margin-top: 12px; color: var(--texto-suave); }
@media (max-width: 760px) { .datos { grid-template-columns: 1fr; } }

.frase { background: var(--noche); color: var(--blanco); padding-block: clamp(96px, 16vw, 220px); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); text-align: center; overflow: hidden; }
.frase__texto {
	width: min(1100px, 100% - 2 * var(--margen)); margin-inline: auto !important; max-width: none !important;
	font-family: var(--wp--preset--font-family--titulos); font-weight: 600; letter-spacing: 0; line-height: 1.1;
	font-size: clamp(2.125rem, 1rem + 4.6vw, 4.75rem); text-wrap: balance; color: var(--blanco) !important;
}
.frase__texto .palabra { display: inline-block; }

/* ==========================================================================
   Integración CRM ⇄ ERP
   ========================================================================== */
.integracion { background: var(--niebla); border-radius: var(--radio-sec); margin: clamp(16px, 2vw, 24px) clamp(0px, 1vw, 12px) 0; }
.flujo { display: grid; grid-template-columns: 1fr 1.25fr 1fr; align-items: center; gap: 0; }
.flujo__caja {
	position: relative; z-index: 1; aspect-ratio: 1; border-radius: 28px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px;
	padding: 18px; text-align: center; font-size: .875rem; line-height: 1.35; box-shadow: var(--sombra);
}
.flujo__caja--crm { background: var(--blanco); color: var(--texto-suave); }
.flujo__caja--crm img { width: 80%; max-width: 120px; }
.flujo__caja--erp { background: var(--noche); color: var(--en-oscuro-suave); }
.flujo__caja--erp strong { color: var(--blanco); font-size: 1.5rem; font-weight: 600; line-height: 1; }
.flujo__filas { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.flujo__fila { position: relative; display: grid; place-items: center; height: 34px; }
.flujo__linea { position: absolute; inset: 50% -4px auto; height: 2px; background: linear-gradient(90deg, var(--azul), var(--cian)); overflow: hidden; }
.flujo__punto { position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 10px var(--cian); }
.flujo__dato { position: relative; background: var(--blanco); color: var(--noche); font-size: .8125rem; font-weight: 600; padding: 6px 12px; border-radius: 999px; box-shadow: 0 0 0 1px var(--borde); white-space: nowrap; }
@media (prefers-reduced-motion: no-preference) {
	.flujo__punto { animation: viaje 2.6s linear infinite; }
	.flujo__fila:nth-child(2n) .flujo__punto { animation-direction: reverse; animation-delay: -.9s; }
	.flujo__fila:nth-child(3) .flujo__punto { animation-delay: -1.7s; }
}
@keyframes viaje { from { transform: translateX(0); } to { transform: translateX(var(--viaje, 260px)); } }
@media (max-width: 560px) {
	.flujo { grid-template-columns: 1fr; gap: 10px; justify-items: center; }
	.flujo__caja { aspect-ratio: auto; width: 100%; padding: 22px; flex-direction: row; }
	.flujo__caja--crm img { width: 96px; }
	.flujo__filas { grid-template-columns: 1fr 1fr; width: 100%; }
	.flujo__linea { display: none; }
}

/* ==========================================================================
   Ciclo comercial (dentro del hero) con el celular fijo
   ========================================================================== */
.ciclo { position: relative; color: var(--blanco); padding-top: var(--sec-pad); }
.ciclo p { color: var(--en-oscuro-suave); }
.ciclo__grilla { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: clamp(16px, 2.5vw, 32px); row-gap: 32px; align-items: center; }
.ciclo__cabeza { grid-column: 1 / span 4; }
.ciclo__cabeza > * + * { margin-top: 18px; }
.ciclo__cabeza h2 { font-size: clamp(1.875rem, 1rem + 2.4vw, 2.875rem); }
.ciclo__bajada { font-size: var(--wp--preset--font-size--grande); }
.ciclo__grilla .pasos { grid-column: 5 / span 5; }
.ciclo__lugar-telefono { grid-column: 10 / span 3; display: flex; justify-content: center; align-self: start; position: sticky; top: 110px; }
.ciclo__telefono { width: clamp(150px, 22cqw, 240px); }
@media (max-width: 1100px) {
	.ciclo__cabeza { grid-column: 1 / -1; }
	.ciclo__grilla .pasos { grid-column: 1 / span 7; }
	.ciclo__lugar-telefono { grid-column: 9 / span 4; }
}
@media (max-width: 767px) {
	.ciclo__grilla .pasos { grid-column: 1 / -1; }
	.ciclo__lugar-telefono { display: none; }
}
.pasos { counter-reset: paso; margin: 0; padding: 0 0 0 58px; position: relative; isolation: isolate; display: grid; gap: clamp(14px, 1.8vw, 22px); }
.pasos > * { margin-block-start: 0 !important; }
/* La línea va por detrás de los círculos y centrada respecto de ellos */
.pasos::before, .pasos::after { content: ""; position: absolute; z-index: 0; left: 19px; top: 20px; bottom: var(--fin-linea, 20px); width: 2px; border-radius: 2px; background: rgba(255, 255, 255, .14); }
.pasos::after { background: linear-gradient(180deg, var(--cian), var(--azul-claro)); transform-origin: top; transform: scaleY(var(--avance, 1)); }
.paso { counter-increment: paso; position: relative; font-size: 1rem; line-height: 1.45; color: var(--en-oscuro-suave); transition: opacity .4s var(--ease), color .4s; }
.paso > * + * { margin-top: 4px !important; }
.paso__titulo { margin: 0; font-size: clamp(1.125rem, .9rem + .7vw, 1.375rem); font-weight: 600; color: var(--blanco); line-height: 1.25; padding-top: 8px; }
.paso__texto { color: var(--en-oscuro-suave) !important; }
.paso::before {
	content: counter(paso); position: absolute; left: -58px; top: 0; width: 40px; height: 40px; border-radius: 50%;
	display: grid; place-items: center; font-weight: 800; font-size: .9375rem; z-index: 2;
	background: var(--noche); color: var(--cian); box-shadow: inset 0 0 0 2px rgba(0, 255, 255, .5);
	transition: background-color .4s, color .4s, transform .4s var(--ease);
}
.ciclo.is-pasos .paso { opacity: .5; }
.ciclo.is-pasos .paso.is-on { opacity: 1; }
.ciclo.is-pasos .paso.is-on::before { background: var(--cian); color: var(--noche); transform: scale(1.08); }
.paso__telefono { display: none; }

/* Celular: cada paso completo, todos al 100 %, con la captura del paso en un teléfono chico y centrado */
@media (max-width: 767px) {
	.hero { padding-bottom: 64px; }
	.ciclo { padding-top: 72px; }
	.pasos { gap: 40px; }
	.ciclo .paso { opacity: 1 !important; }
	.paso__telefono { display: flex; justify-content: center; margin-top: 18px !important; }
	.paso__telefono .telefono { width: clamp(160px, 46vw, 210px); }





}

/* ==========================================================================
   Explorador del Kit Básico (pieza central)
   ========================================================================== */
.kit__cabeza { margin-bottom: clamp(40px, 5vw, 64px); }
.kit__cabeza h2 { max-width: 20ch; }
.explorador > * + * { margin-top: 0; }
/* Sin JavaScript: lista con todos los módulos */
.explorador__item { display: grid; grid-template-columns: 5fr 7fr; gap: 32px; align-items: center; padding-block: 40px; border-top: 1px solid var(--borde); }
.explorador__nombre { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; font-size: 1.5rem; }
.explorador__nombre::before { content: ""; width: 44px; height: 44px; flex: none; background: var(--ico) center / contain no-repeat; }
.explorador__texto > * + * { margin-top: 14px; }
.explorador__texto p { color: var(--texto-suave); }
.resuelve { background: var(--niebla); padding: 12px 16px; border-radius: 14px; color: var(--noche) !important; font-size: .9375rem; }
.resuelve strong { color: var(--azul); text-transform: uppercase; font-size: .75rem; letter-spacing: .08em; margin-right: 4px; }
.explorador__link a { font-weight: 600; text-decoration: none; }
.explorador__link a:hover { text-decoration: underline; }
.explorador__media { margin: 0; }
.captura { margin: 0; border-radius: var(--radio-card); overflow: hidden; box-shadow: var(--sombra), 0 0 0 1px var(--borde); background: #fff; }
.captura img { width: 100%; }
.captura--libre { box-shadow: none; background: transparent; border-radius: 0; }

/* Con JavaScript: píldoras a la izquierda, escenario a la derecha */
.explorador.is-tabs { display: grid; grid-template-columns: minmax(280px, 4fr) 8fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.explorador.is-tabs .explorador__item { display: block; padding: 0; border: 0; }
.explorador.is-tabs .explorador__item + .explorador__item { margin-top: 8px; }
.explorador.is-tabs .explorador__nombre { margin: 0; font-size: 1rem; }
.explorador.is-tabs .explorador__nombre::before { display: none; }
.pildora {
	display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; cursor: pointer;
	font: inherit; font-weight: 700; font-size: 1.0625rem; color: var(--noche);
	background: var(--niebla); border: 0; border-radius: 999px; padding: 8px 18px 8px 8px;
	transition: background-color .25s var(--ease), color .25s var(--ease), border-radius .25s var(--ease);
}
.pildora::before { content: ""; width: 38px; height: 38px; flex: none; border-radius: 50%; background: var(--blanco) var(--ico) center / 24px no-repeat; }
.pildora:hover { background: #E7E9F2; }
.is-activo .pildora { background: var(--noche); color: var(--blanco); border-radius: 24px 24px 0 0; }
.explorador.is-tabs .explorador__texto { background: var(--noche); color: var(--blanco); border-radius: 0 0 24px 24px; padding: 4px 22px 22px; font-size: .9688rem; }
.explorador.is-tabs .explorador__texto p { color: var(--en-oscuro-suave); }
.explorador.is-tabs .resuelve { background: rgba(255, 255, 255, .07); color: var(--blanco) !important; }
.explorador.is-tabs .resuelve strong { color: var(--cian); }
.explorador.is-tabs .explorador__link a { color: var(--cian-ui); }
.explorador__escenario { position: sticky; top: 100px; display: grid; }
.explorador__escenario > .explorador__media { grid-area: 1 / 1; align-self: center; }
.explorador__escenario > .explorador__media[hidden] { display: block; visibility: hidden; opacity: 0; pointer-events: none; }
@media (max-width: 900px) {
	.explorador__item { grid-template-columns: 1fr; gap: 20px; padding-block: 28px; }
	.explorador.is-tabs { display: block; }
	.explorador.is-tabs .explorador__media { margin-top: 12px; }
}

/* Omnicanal: los canales llegan a una sola bandeja */
.omni { position: relative; }
.omni__burbujas { position: absolute; right: -12px; top: 12%; list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; justify-items: end; }
.omni__burbujas li {
	background: var(--blanco); color: var(--noche); font-size: .8125rem; font-weight: 700; padding: 8px 14px 8px 12px;
	border-radius: 16px 16px 4px 16px; box-shadow: 0 12px 30px -12px rgba(20, 21, 60, .45), 0 0 0 1px var(--borde);
	display: flex; align-items: center; gap: 8px;
}
.omni__burbujas li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--azul); }
.omni__burbujas li:nth-child(2)::before { background: var(--azul-claro); }
.omni__burbujas li:nth-child(3)::before { background: var(--noche); }
.omni__burbujas li:nth-child(4)::before { background: var(--cian); box-shadow: 0 0 0 1px var(--azul); }
@media (max-width: 600px) { .omni__burbujas { position: static; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); margin-top: 12px; } }

/* Tablero que se arma por partes (Multidimensional) */
.tablero { background: var(--blanco); border-radius: var(--radio-card); padding: clamp(16px, 2.5vw, 28px); box-shadow: var(--sombra), 0 0 0 1px var(--borde); }
.tablero__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.tablero__kpi { background: var(--niebla); border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 2px; }
.tablero__kpi span { font-size: .75rem; color: var(--texto-suave); }
.tablero__kpi strong { font-size: clamp(1.125rem, .8rem + 1vw, 1.625rem); font-weight: 600; color: var(--noche); }
.tablero__kpi em { font-style: normal; font-size: .75rem; font-weight: 700; color: var(--azul); }
.tablero__graficos { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; margin-top: 16px; align-items: end; }
.tablero__barras { height: 190px; display: flex; align-items: flex-end; gap: 8%; padding: 12px; border-radius: 14px; background: linear-gradient(180deg, transparent 0 24%, var(--borde) 24% calc(24% + 1px), transparent 0 49%, var(--borde) 49% calc(49% + 1px), transparent 0 74%, var(--borde) 74% calc(74% + 1px), transparent 0); }
.tablero__barras i { flex: 1; height: var(--h); border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, var(--azul-claro), var(--azul)); transform-origin: bottom; }
.tablero__barras i:nth-child(6) { background: linear-gradient(180deg, var(--cian), var(--azul)); }
.tablero__torta { aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--azul) 0 52%, var(--azul-claro) 0 78%, var(--cian) 0 90%, var(--noche) 0); -webkit-mask: radial-gradient(circle, transparent 38%, #000 39%); mask: radial-gradient(circle, transparent 38%, #000 39%); }
.tablero__nota { margin-top: 12px !important; font-size: .75rem; color: var(--texto-suave); text-align: right; }

/* ==========================================================================
   Franja de adicionales y chips de módulos
   ========================================================================== */
.adicionales { background: var(--niebla); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.chips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.chips li { margin: 0; }
.chips a {
	display: flex; align-items: center; gap: 12px; height: 100%; padding: 10px 16px 10px 10px; border-radius: 16px;
	background: var(--blanco); color: var(--noche); font-weight: 600; font-size: .9688rem; line-height: 1.25; text-decoration: none;
	box-shadow: 0 0 0 1px var(--borde); transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.chips a::before { content: ""; width: 36px; height: 36px; flex: none; background: var(--ico) center / contain no-repeat; }
.chips li a:hover { transform: translateY(-3px); box-shadow: 0 0 0 1px var(--azul), 0 16px 30px -18px rgba(20, 21, 60, .5); }
.chips--chicos { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.chips--chicos a { font-size: .875rem; background: var(--niebla); box-shadow: none; }
.chips--chicos a::before { width: 28px; height: 28px; }
@media (max-width: 480px) { .chips { grid-template-columns: 1fr; } }

/* ==========================================================================
   ¿Para qué empresas? (selector por rubro)
   ========================================================================== */
.selector { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.selector__item { background: var(--blanco); border-radius: var(--radio-card); padding: 28px; box-shadow: 0 0 0 1px var(--borde); }
.selector__nombre { margin: 0 0 12px; font-size: 1.25rem; }
.selector__panel > * + * { margin-top: 14px; }
.selector__panel p { color: var(--texto-suave); }
.selector__sub { font-size: .75rem !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--azul) !important; }
.selector.is-tabs { display: block; }
.selector__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.selector__tab {
	font: inherit; font-weight: 600; font-size: .9688rem; cursor: pointer; border: 0; padding: 12px 20px; border-radius: 999px;
	background: var(--niebla); color: var(--noche); transition: background-color .25s, color .25s;
}
.selector__tab:hover { background: #E7E9F2; }
.selector__tab[aria-selected="true"] { background: var(--noche); color: var(--blanco); }
.selector__tab .pendiente { font-size: .75em; }
.selector.is-tabs .selector__item { padding: clamp(24px, 3vw, 40px); background: var(--niebla); box-shadow: none; }
.selector.is-tabs .selector__item[hidden] { display: none; }
.selector.is-tabs .selector__nombre { font-size: 1.75rem; }
.selector.is-tabs .chips--chicos a { background: var(--blanco); }
@media (max-width: 760px) { .selector { grid-template-columns: 1fr; } }

/* ==========================================================================
   Testimonios (carrusel horizontal)
   ========================================================================== */
.testimonios { overflow: hidden; }
.carrusel { margin-top: clamp(40px, 5vw, 64px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 8px; }
.carrusel::-webkit-scrollbar { display: none; }
.carrusel__pista { display: flex; gap: 20px; width: max-content; padding-inline: max(var(--margen), (100vw - var(--ancho)) / 2); }
.carrusel.is-scrub { overflow: visible; }
.testimonio {
	scroll-snap-align: center; width: min(520px, 82vw); margin: 0; flex: none; display: flex; flex-direction: column; justify-content: space-between; gap: 28px;
	background: rgba(255, 255, 255, .06); border-radius: 28px; padding: clamp(24px, 3vw, 40px); border: 1px solid rgba(255, 255, 255, .1);
}
.testimonio p { font-size: var(--wp--preset--font-size--grande); line-height: 1.5; color: var(--blanco) !important; }
.testimonio p::before { content: "“"; display: block; font-family: var(--wp--preset--font-family--titulos); font-size: 4rem; line-height: .6; height: .4em; color: var(--cian); }
.testimonio cite { font-style: normal; font-size: .9375rem; color: var(--en-oscuro-suave); display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.testimonio cite strong { color: var(--blanco); }

/* ==========================================================================
   Capacitación + novedades
   ========================================================================== */
.apoyos { display: grid; gap: 14px; }
.apoyos > * + * { margin-top: 0 !important; }
.apoyo { display: grid; grid-template-columns: 52px 1fr; column-gap: 18px; align-items: start; padding: 22px; border-radius: var(--radio-card); background: var(--niebla); }
.apoyo::before { content: ""; grid-row: span 2; width: 52px; height: 52px; border-radius: 16px; background: var(--blanco) var(--ico) center / 30px no-repeat; }
.apoyo h3 { margin: 0 0 4px; font-size: 1.125rem; }
.apoyo p { color: var(--texto-suave); }
.novedades-home { margin-top: clamp(56px, 7vw, 96px); }
.novedades-home__cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.novedades-home__cabeza h3 { margin: 0; font-size: 1.5rem; }
.novedades-home__cabeza a { font-weight: 600; text-decoration: none; }
.novedades-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.novedades-lista > li {
	position: relative; display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: var(--radio-card);
	background: var(--blanco); box-shadow: 0 0 0 1px var(--borde); transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.novedades-lista > li:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px var(--azul), var(--sombra); }
.novedad__fecha { font-size: .8125rem; font-weight: 600; color: var(--azul); }
.novedad__titulo { margin: 0; font-size: 1.125rem; line-height: 1.3; }
.novedad__titulo a { color: var(--noche); text-decoration: none; }
.novedad__titulo a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
@media (max-width: 760px) { .novedades-lista { grid-template-columns: 1fr; } }

/* ==========================================================================
   Preguntas frecuentes
   ========================================================================== */
.faq { background: var(--niebla); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.faq__lista { display: grid; gap: 10px; }
.faq__lista > * + * { margin-top: 0 !important; }
.wp-block-details { background: var(--blanco); border-radius: 18px; padding: 0; box-shadow: 0 0 0 1px var(--borde); }
.wp-block-details summary {
	list-style: none; cursor: pointer; padding: 20px 60px 20px 24px; position: relative; font-weight: 700; font-size: 1.0625rem; line-height: 1.35;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: ""; position: absolute; right: 20px; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%;
	background: var(--niebla) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%2314153C' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px no-repeat;
	transition: transform .3s var(--ease), background-color .3s;
}
.wp-block-details[open] summary::after { transform: rotate(45deg); background-color: var(--cian-ui); }
.wp-block-details > p { padding: 0 24px 22px; color: var(--texto-suave); }

/* ==========================================================================
   Cierre "Pedí una demo"
   ========================================================================== */
.cierre { position: relative; overflow: hidden; color: var(--blanco); background: var(--noche); border-radius: var(--radio-sec); margin: clamp(16px, 2vw, 24px) clamp(0px, 1vw, 12px) 0; padding-block: clamp(96px, 12vw, 170px); text-align: center; isolation: isolate; }
.cierre__fondo { position: absolute; inset: 0; z-index: -1; }
.cierre__degradado {
	position: absolute; inset: -40% -60%; background:
		radial-gradient(40% 50% at 30% 40%, rgba(27, 95, 161, .95), transparent 70%),
		radial-gradient(35% 45% at 70% 60%, rgba(0, 255, 255, .55), transparent 70%),
		radial-gradient(30% 40% at 50% 20%, rgba(90, 176, 234, .5), transparent 70%);
}
.cierre__arcos { position: absolute; width: min(900px, 140vw); right: -18%; top: 50%; translate: 0 -50%; color: rgba(0, 255, 255, .22); }
@media (prefers-reduced-motion: no-preference) {
	.cierre__degradado { animation: deriva 18s ease-in-out infinite alternate; }
	.cierre__arcos { animation: giro 90s linear infinite; }
}
@keyframes deriva { from { transform: translate3d(-6%, -4%, 0) scale(1); } to { transform: translate3d(6%, 5%, 0) scale(1.12); } }
@keyframes giro { to { transform: rotate(360deg); } }
.cierre__in { display: flex; flex-direction: column; align-items: center; }
.cierre h2 { max-width: 22ch; margin: 0 auto; }
.cierre p { margin-top: 20px; color: rgba(255, 255, 255, .85); }
.cierre .wp-block-buttons { justify-content: center; margin-top: 34px; }

/* Separador: línea cian con el pulso "M" */
.pulso { width: min(var(--ancho), 100% - 2 * var(--margen)); margin: 0 auto; color: var(--cian); height: 44px; }
.pulso svg { width: 100%; height: 100%; overflow: visible; }

/* ==========================================================================
   Pie
   ========================================================================== */
.sitio-pie { margin-top: clamp(16px, 2vw, 24px); }
.pie { position: relative; overflow: hidden; background: var(--noche); color: var(--en-oscuro-suave); border-radius: var(--radio-sec) var(--radio-sec) 0 0; padding: clamp(56px, 7vw, 88px) 0 28px; }
.pie__arcos {
	position: absolute; width: 640px; aspect-ratio: 1; left: -260px; bottom: -320px; border-radius: 50%; pointer-events: none;
	box-shadow: 0 0 0 2px rgba(0, 255, 255, .1), 0 0 0 60px rgba(255, 255, 255, .015), 0 0 0 62px rgba(0, 255, 255, .08), 0 0 0 120px rgba(255, 255, 255, .012), 0 0 0 122px rgba(0, 255, 255, .06);
}
.pie__in { position: relative; width: min(var(--ancho), 100% - 2 * var(--margen)); margin-inline: auto; display: grid; grid-template-columns: 1.2fr .8fr .9fr .8fr 1fr 1.2fr; gap: 32px; }
.pie a { color: var(--blanco); text-decoration: none; }
.pie a:hover { color: var(--cian-ui); }
.pie__logo { display: inline-block; background: var(--blanco); border-radius: 18px; padding: 12px 18px; }
.pie__logo img { width: 120px; }
.pie__marca p { margin: 18px 0 22px; max-width: 32ch; }
.pie__marca .boton:hover { color: var(--noche); }
.pie__titulo { color: var(--blanco); font-weight: 800; margin: 0 0 14px; }
.pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pie address { font-style: normal; line-height: 1.9; }
.pie__redes { display: flex !important; gap: 10px !important; margin-top: 18px !important; }
.pie__redes a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.pie__redes svg { width: 18px; height: 18px; }
.pie__base { position: relative; width: min(var(--ancho), 100% - 2 * var(--margen)); margin: 48px auto 0; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .12); display: flex; justify-content: space-between; gap: 16px 40px; flex-wrap: wrap; font-size: .875rem; }
.pie__macri, .pie__legal { margin: 0; }
.pie__macri a { font-weight: 700; }
.pie__legal { max-width: 70ch; }
@media (max-width: 1100px) { .pie__in { grid-template-columns: 1fr 1fr 1fr; } .pie__marca { grid-column: 1 / -1; } }
@media (max-width: 700px) { .pie__in { grid-template-columns: 1fr 1fr; } .pie__contacto { grid-column: 1 / -1; } }
.pie__canal { color: var(--cian-ui) !important; font-weight: 600; }

/* Botón flotante de WhatsApp */
.wa-flotante {
	position: fixed; right: 20px; bottom: 20px; z-index: 70; width: 56px; height: 56px; border-radius: 50%;
	display: grid; place-items: center; background: #25D366; color: #fff; box-shadow: 0 12px 30px -10px rgba(0, 0, 0, .45);
	transition: transform .25s var(--ease);
}
.wa-flotante:hover { transform: scale(1.06); color: #fff; }
.wa-flotante svg { width: 30px; height: 30px; }

/* Páginas internas (hasta rediseñarlas) */
.pagina { padding-bottom: 40px; }
.pagina h1 { font-size: clamp(2rem, 1.2rem + 3vw, 3.25rem); }
.novedades-grilla { list-style: none; padding: 0; display: grid; gap: 12px; }
.wrap > .wp-block-query-title, .wrap > h1 { padding-top: 140px; }

/* ==========================================================================
   Estados iniciales de la animación
   Solo si el usuario no pidió reducir movimiento. Si GSAP no carga,
   la animación CSS "mostrar" deja el hero visible a los 2,2 s.
   ========================================================================== */
.js-motion .anim-hero :is(.hero__etiqueta, .hero__botones, .hero__confianza, .dispositivos, .vidrio--1, .hero__gigante) {
	opacity: 0; animation: mostrar 0s 2.2s forwards;
}
.js-motion.gsap-ok .anim-hero :is(.hero__etiqueta, .hero__botones, .hero__confianza, .dispositivos, .vidrio--1, .hero__gigante) { animation: none; }
@keyframes mostrar { to { opacity: 1; } }

/* Separadores entre secciones */
.pulso { margin-top: clamp(48px, 6vw, 80px); }
.pulso + .sec { padding-top: clamp(48px, 6vw, 88px); }

/* ==========================================================================
   Se adapta a tu empresa (por necesidad) — /modulos/
   ========================================================================== */
.necesidades__cabeza { margin-bottom: clamp(32px, 4vw, 56px); }
.selector__escenario { display: grid; }
.selector__escenario:empty { display: none; }
.selector__escenario > .selector__media { grid-area: 1 / 1; }
.selector__escenario > .selector__media[hidden] { display: block; visibility: hidden; opacity: 0; }
.selector__media .pantalla-pendiente { aspect-ratio: 4 / 3; }
.selector .selector__item .selector__media { margin-top: 18px; }
.chips li > span {
	display: flex; align-items: center; gap: 12px; height: 100%; padding: 10px 16px 10px 10px; border-radius: 16px;
	background: var(--blanco); color: var(--noche); font-weight: 600; font-size: .875rem; line-height: 1.25; box-shadow: 0 0 0 1px var(--borde);
}
.chips li > span::before { content: ""; width: 28px; height: 28px; flex: none; background: var(--ico) center / contain no-repeat; }
.selector__panel .wp-block-buttons { margin-top: 18px; }

/* ==========================================================================
   Lo usan empresas de todos los rubros
   ========================================================================== */
.rubros__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.rubros__lista li > * {
	display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 999px; font-weight: 600; font-size: 1rem;
	background: var(--niebla); color: var(--noche); text-decoration: none;
}
.rubros__lista .rubro--link a { background: var(--noche); color: var(--blanco); transition: background-color .25s var(--ease), transform .25s var(--ease); }
.rubros__lista .rubro--link a:hover { background: var(--azul); transform: translateY(-2px); }
.rubros__cierre { margin-top: 22px !important; font-size: var(--wp--preset--font-size--grande); }

/* ==========================================================================
   Páginas de sector
   ========================================================================== */
.hero--pagina { padding-top: clamp(150px, 15vw, 200px); padding-bottom: clamp(88px, 10vw, 140px); }
.hero--pagina .hero__titulo { font-size: clamp(2.125rem, 1.2rem + 3.4vw, 3.75rem); }
.hero__arcos {
	position: absolute; width: 900px; aspect-ratio: 1; right: -380px; top: -300px; border-radius: 50%; pointer-events: none;
	box-shadow: 0 0 0 2px rgba(0, 255, 255, .12), 0 0 0 70px rgba(255, 255, 255, .015), 0 0 0 72px rgba(0, 255, 255, .09), 0 0 0 140px rgba(255, 255, 255, .012), 0 0 0 142px rgba(0, 255, 255, .06);
}
.problemas__grilla { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.problemas__grilla > * + * { margin-top: 0 !important; }
.problema { grid-column: span 2; background: var(--niebla); border-radius: var(--radio-card); padding: 26px; display: flex; flex-direction: column; gap: 12px; }
.problema:nth-child(4), .problema:nth-child(5) { grid-column: span 3; }
.problema__numero { font-family: var(--wp--preset--font-family--titulos); font-weight: 600; font-size: 2rem; line-height: 1; color: var(--azul); }
.problema p { color: var(--texto-suave); }
.problema strong { color: var(--noche); }
@media (max-width: 900px) { .problemas__grilla { grid-template-columns: 1fr; } .problema, .problema:nth-child(4), .problema:nth-child(5) { grid-column: auto; } }

.ciclo--sin-telefono { background: var(--noche); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); padding-block: clamp(56px, 8vh, 96px); }
.ciclo--sin-telefono .ciclo__grilla .pasos { grid-column: 6 / span 7; }
@media (max-width: 1100px) { .ciclo--sin-telefono .ciclo__grilla .pasos { grid-column: 1 / -1; } }

.destacados__lista > * + * { margin-top: 0; }
.destacado { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(24px, 4vw, 64px); align-items: center; padding-block: clamp(40px, 5vw, 64px); border-top: 1px solid var(--borde); }
.destacado:nth-child(even) .destacado__texto { order: 2; }
.destacado__texto > * + * { margin-top: 14px; }
.destacado__nombre { display: flex; align-items: center; gap: 14px; margin: 0; font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); }
.destacado__nombre::before { content: ""; width: 48px; height: 48px; flex: none; background: var(--ico) center / contain no-repeat; }
.destacado__bajada { font-weight: 700; color: var(--azul); }
.destacado__texto p { color: var(--texto-suave); }
.destacado__texto .resuelve { color: var(--noche); }
.etiquetas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.etiquetas li { font-size: .8125rem; font-weight: 600; padding: 6px 12px; border-radius: 999px; background: var(--niebla); color: var(--noche); }
@media (max-width: 900px) { .destacado { grid-template-columns: 1fr; } .destacado:nth-child(even) .destacado__texto { order: 0; } }

.principales__caja { background: var(--niebla); border-radius: var(--radio-sec); padding: clamp(32px, 5vw, 64px); }
.principales__caja > * + * { margin-top: 18px; }
.principales__caja h2 { margin: 0; }
.principales__caja p { color: var(--texto-suave); font-size: var(--wp--preset--font-size--grande); }

/* Implementación */
/* Flex centrado: la última fila incompleta queda al medio (5 = 3+2 o 4+1 centrado). */
.implementacion__grilla { --cols: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.implementacion__grilla > * { flex: 0 0 calc((100% - (var(--cols) - 1) * 14px) / var(--cols)); }
@media (min-width: 560px) { .implementacion__grilla { --cols: 2; } }
@media (min-width: 900px) { .implementacion__grilla { --cols: 3; } }
@media (min-width: 1280px) { .implementacion__grilla { --cols: 4; } }
.implementacion__grilla > * + * { margin-top: 0 !important; }
.implementacion__grilla .apoyo { grid-template-columns: 1fr; row-gap: 14px; }
.implementacion__grilla .apoyo::before { grid-row: auto; }
.implementacion__nota { margin-top: 24px !important; color: var(--texto-suave); }

/* Clientes: ocultos al público hasta confirmar */
.borrador-oculto { display: none; }
body.logged-in .borrador-oculto { display: block; outline: 2px dashed #C9A100; outline-offset: -12px; }
.clientes__grilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.clientes__grilla > * + * { margin-top: 0 !important; }
.cliente { background: var(--blanco); border-radius: var(--radio-card); padding: 24px; box-shadow: 0 0 0 1px var(--borde); }
.cliente > * + * { margin-top: 8px; }
.cliente__logo { height: 64px; border-radius: 12px; display: grid; place-items: center; background: linear-gradient(160deg, #EEF5FC, #D9E9F8); color: var(--azul); font-size: .75rem; letter-spacing: .04em; margin-bottom: 14px; }
.cliente__nombre { margin: 0; font-size: 1.125rem; }
.cliente__lugar { font-size: .875rem; font-weight: 600; color: var(--azul); }
.cliente p { color: var(--texto-suave); }
.clientes__cierre { margin-top: 24px !important; color: var(--texto-suave); }

/* Páginas armadas con secciones (módulos, sectores): sin título automático */
.pagina--secciones { padding-bottom: 0; }

/* Las columnas de una grilla no llevan el margen superior que WordPress agrega entre bloques: quedan niveladas */
:is(.grilla, .ciclo__grilla, .datos, .selector, .problemas__grilla, .implementacion__grilla, .clientes__grilla, .apoyos, .faq__lista, .destacado, .flujo, .necesidades__cabeza) > * { margin-block-start: 0 !important; }
.dato { display: grid; grid-template-rows: auto 1fr; align-content: start; }
.dato__numero { height: 1.1em; line-height: 1.1; display: flex; align-items: flex-end; margin: 0; }
.dato__texto { margin-top: 14px !important; }

/* ==========================================================================
   Video de taller con carga diferida
   ========================================================================== */
.video-taller { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(20px, 3vw, 40px); align-items: center; margin-top: clamp(24px, 3vw, 40px); }
.video-taller > * { margin-block-start: 0 !important; }
.video-taller__miniatura { position: relative; margin: 0; aspect-ratio: 16 / 9; border-radius: var(--radio-card); overflow: hidden; background: var(--noche); box-shadow: var(--sombra); }
.video-taller__miniatura a { display: block; height: 100%; }
.video-taller__miniatura img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.video-taller__miniatura a::after {
	content: ""; position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; translate: -50% -50%; border-radius: 50%;
	background: rgba(20, 21, 60, .78) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23fff'/%3E%3C/svg%3E") 55% 50% / 30px no-repeat;
	backdrop-filter: blur(6px); box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); transition: transform .3s var(--ease), background-color .3s;
}
.video-taller__miniatura a:hover img { transform: scale(1.03); }
.video-taller__miniatura a:hover::after { transform: scale(1.08); background-color: rgba(27, 95, 161, .9); }
.video-taller__miniatura iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-taller__texto > * + * { margin-top: 10px !important; }
.video-taller__titulo { margin: 0; font-size: 1.25rem; }
.video-taller__resumen { color: var(--texto-suave); }
.video-taller__link a { font-weight: 600; text-decoration: none; }
@media (max-width: 800px) { .video-taller { grid-template-columns: 1fr; } }

/* Variante tarjeta, para el carrusel de la home */
.video-taller--tarjeta { grid-template-columns: 1fr; align-items: start; margin: 0; gap: 16px; width: min(380px, 78vw); flex: none; scroll-snap-align: start; }
.video-taller--tarjeta .video-taller__miniatura a::after { width: 56px; height: 56px; background-size: 24px; }
.video-taller--tarjeta .video-taller__titulo { font-size: 1.0625rem; }
.video-taller--tarjeta .video-taller__resumen { font-size: .9375rem; }

.talleres { margin-top: clamp(56px, 7vw, 96px); }
.talleres__cabeza { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.talleres__cabeza h3 { margin: 0; font-size: 1.5rem; }
.talleres__flechas { display: flex; gap: 8px; }
.talleres__flecha { width: 46px; height: 46px; border-radius: 50%; border: 0; cursor: pointer; font-size: 1.125rem; background: var(--niebla); color: var(--noche); transition: background-color .2s, color .2s; }
.talleres__flecha:hover { background: var(--noche); color: var(--blanco); }
.talleres__flecha:disabled { opacity: .35; cursor: default; background: var(--niebla); color: var(--noche); }
.talleres__pista { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 12px; margin-top: 0 !important; }
.talleres__pista::-webkit-scrollbar { display: none; }
.talleres__pista > * { margin-block-start: 0 !important; }
.talleres__canal { flex: none; width: min(300px, 70vw); align-self: stretch; scroll-snap-align: start; display: flex; flex-direction: column; justify-content: center; gap: 16px; padding: 28px; border-radius: var(--radio-card); background: var(--niebla); }
.talleres__canal p { color: var(--texto-suave); }
.videos-sec h2 { margin: 0; }

/* Escenario fijo: cuatro tarjetas, dos a cada lado y simétricas, fuera de los dispositivos y con 24 px de margen al borde */
.is-escenario .dispositivos { margin-bottom: 0; }
.is-escenario .vidrios { display: block; position: absolute; inset: 0; top: 0; }
.vidrio { box-sizing: border-box; }
.is-escenario .vidrios .vidrio { position: absolute; width: min(240px, calc((100cqw - var(--nb)) / 2 - var(--nb) * .14 - 56px)); }
.is-escenario .vidrio--1, .is-escenario .vidrio--3 { right: calc(100% + var(--nb) * .14 + 20px); }
.is-escenario .vidrio--2, .is-escenario .vidrio--4 { left: calc(100% + var(--nb) * .09 + 20px); }
.is-escenario .vidrio--1, .is-escenario .vidrio--2 { top: 18%; }
.is-escenario .vidrio--3, .is-escenario .vidrio--4 { top: 58%; }

/* Íconos de los módulos: bien visibles, simétricos alrededor de los dispositivos */
.tesela {
	width: 60px; height: 60px; margin: -30px 0 0 -30px; translate: none !important; border-radius: 18px;
	background: var(--ico) center / 34px no-repeat, linear-gradient(150deg, rgba(255, 255, 255, .96), rgba(226, 238, 250, .9));
	border: 1px solid rgba(255, 255, 255, .7); box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .7), inset 0 1px 0 #fff;
}
/* Arriba, en un arco suave; abajo, a los costados y lejos del botón de WhatsApp */
.tesela:nth-child(1) { left: 25%; top: 19%; } .tesela:nth-child(2) { left: 35%; top: 13.5%; } .tesela:nth-child(3) { left: 45%; top: 10.5%; }
.tesela:nth-child(4) { left: 55%; top: 10.5%; } .tesela:nth-child(5) { left: 65%; top: 13.5%; } .tesela:nth-child(6) { left: 75%; top: 19%; }
.tesela:nth-child(7) { left: 8%; top: 68%; } .tesela:nth-child(8) { left: 17%; top: 78%; } .tesela:nth-child(9) { left: 9%; top: 85%; }
.tesela:nth-child(10) { left: 92%; top: 68%; } .tesela:nth-child(11) { left: 83%; top: 78%; } .tesela:nth-child(12) { left: 91%; top: 85%; }
@media (prefers-reduced-motion: no-preference) {
	.is-escenario .tesela { animation: flotar 3.6s ease-in-out infinite alternate; }
	.is-escenario .tesela:nth-child(3n+2) { animation-duration: 4.2s; animation-delay: -1.3s; }
	.is-escenario .tesela:nth-child(3n) { animation-duration: 3.2s; animation-delay: -2.1s; }
}
@keyframes flotar { from { translate: 0 -5px; } to { translate: 0 5px; } }

/* ==========================================================================
   Franja de clientes que se desplaza sola
   ========================================================================== */
.clientes__aviso { margin-bottom: 18px !important; }
.marquesina {
	position: relative; margin-top: clamp(32px, 4vw, 56px); display: flex; overflow: hidden; padding-block: 92px 12px; margin-block-start: clamp(-60px, -4vw, -40px) !important;
	-webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.marquesina__pista { list-style: none; margin: 0; padding: 0 12px 0 0; display: flex; gap: 12px; flex: none; }
.logo-cliente {
	position: relative; flex: none; display: grid; place-items: center; min-width: 200px; height: 76px; padding: 0 28px; border-radius: 18px; cursor: default;
	background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); outline-offset: 2px;
}
.logo-cliente__nombre { font-weight: 800; font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; color: rgba(255, 255, 255, .86); white-space: nowrap; }
.logo-cliente__info {
	position: absolute; left: 50%; bottom: calc(100% + 10px); translate: -50% 6px; width: 260px; padding: 12px 14px; border-radius: 14px; z-index: 2;
	background: var(--blanco); color: var(--texto-suave); font-size: .8125rem; line-height: 1.4; text-align: left;
	box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .7); opacity: 0; visibility: hidden; pointer-events: none;
	transition: opacity .2s var(--ease), translate .2s var(--ease), visibility 0s .2s;
}
.logo-cliente__info strong { display: block; color: var(--noche); margin-bottom: 4px; }
.logo-cliente:is(:hover, :focus-visible) { background: rgba(255, 255, 255, .12); border-color: rgba(0, 255, 255, .4); }
.logo-cliente:is(:hover, :focus-visible) .logo-cliente__info { opacity: 1; visibility: visible; translate: calc(-50% + var(--corrimiento, 0px)) 0; transition-delay: 0s; }
@media (prefers-reduced-motion: no-preference) {
	.marquesina__pista { animation: marquesina 48s linear infinite; }
	.marquesina:is(:hover, :focus-within) .marquesina__pista { animation-play-state: paused; }
}
@keyframes marquesina { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
	.marquesina { -webkit-mask: none; mask: none; }
	.marquesina__pista { flex-wrap: wrap; flex: 1; justify-content: center; padding: 0 var(--margen); }
	.marquesina__pista--copia { display: none; }
}
.testimonios .carrusel { margin-top: clamp(24px, 3vw, 40px); }

/* ==========================================================================
   Celular (menos de 768 px): sin superposiciones, sin pin, un solo dispositivo
   ========================================================================== */
@media (max-width: 767px) {
	.hero__botones { flex-direction: column; align-items: stretch; width: 100%; }
	.hero__botones .wp-block-button, .hero__botones .wp-block-button__link { width: 100%; }
	.hero__escena { margin-top: 48px; }
	.hero__gigante, .fondo-escena, .mosaico { display: none !important; }
	.dispositivos { width: auto; padding: 0 var(--margen); margin: 0; display: flex; flex-direction: column; align-items: center; }
	.dispositivos:has(.vidrios) { margin-bottom: 0; }
	.notebook, .tablet { display: none !important; }
	.telefono--viaja { position: relative; right: auto; bottom: auto; width: clamp(200px, 60vw, 280px); }


	.vidrios { position: relative; top: auto; left: auto; right: auto; width: 100%; max-width: 420px; margin-top: 28px; grid-template-columns: 1fr; }
	.vidrios .vidrio { width: 100%; }
	.vidrio--3, .vidrio--4 { display: none !important; }
	.multi { margin-top: 48px; }
}

/* Etiqueta del hero: texto claro sobre fondo oscuro (gana sobre el estilo general de etiqueta) */
.hero .hero__etiqueta { color: #FFFFFF !important; background: rgba(255, 255, 255, .16) !important; }


/* Sin escenario fijo (tablet, o escritorio bajo): tablet y celular se anclan a la altura de la notebook
   y las tarjetas van debajo, en el flujo, sin encimarse con nada */
.secuencia:not(.is-escenario) .dispositivos { padding-bottom: 0; }
.secuencia:not(.is-escenario) .tablet { top: calc(var(--nb) * .34); bottom: auto; }
.secuencia:not(.is-escenario) .telefono--viaja { top: calc(var(--nb) * .26); bottom: auto; }
.secuencia:not(.is-escenario) .vidrios { position: relative; top: auto; left: auto; right: auto; margin-top: calc(var(--nb) * .14 + 36px); }
.secuencia:not(.is-escenario) .dispositivos:has(.vidrios) { margin-bottom: 0; }
@media (max-width: 767px) {
	.secuencia:not(.is-escenario) .telefono--viaja { top: auto; }
	.secuencia:not(.is-escenario) .vidrios { margin-top: 28px; }
}

/* Marcador limpio mientras llegan las capturas y fotos */
.pantalla-pendiente {
	position: relative; display: grid; place-content: center; justify-items: center; gap: 6px; text-align: center; aspect-ratio: 16 / 10;
	width: 100%; padding: 24px; border-radius: var(--radio-card); color: var(--noche);
	background:
		linear-gradient(rgba(27, 95, 161, .07) 1px, transparent 1px) 0 0 / 100% 36px,
		linear-gradient(160deg, #EEF5FC 0%, #D9E9F8 100%);
	box-shadow: 0 0 0 1px rgba(27, 95, 161, .12) inset;
}
.pantalla-pendiente::before { content: ""; width: 64px; height: 64px; margin-bottom: 6px; border-radius: 18px; background: var(--blanco) var(--ico) center / 38px no-repeat; box-shadow: 0 10px 24px -12px rgba(27, 95, 161, .5); }
.pantalla-pendiente:not([class*="ico-"])::before { display: none; }
.pantalla-pendiente__nombre { font-weight: 800; font-size: clamp(1rem, .8rem + .8vw, 1.375rem); }
.pantalla-pendiente__nota { font-size: .8125rem; color: var(--azul); letter-spacing: .04em; }


.paso { z-index: 1; }

/* ==========================================================================
   Componente único de celular: se usa en todo el sitio
   - Proporción bloqueada 9:19,5; el tamaño se define solo por el ancho.
   - Dibuja su propia barra de estado con la isla; la captura va debajo, ajustada al ancho.
   ========================================================================== */
:where(.telefono) { position: relative; }
.telefono { container-type: inline-size; aspect-ratio: 9 / 19.5; height: auto !important; padding: 0 !important; background: none; border-radius: 0; box-shadow: none; will-change: transform; }
.telefono__pantalla {
	position: absolute; inset: 0; aspect-ratio: auto; box-sizing: border-box; overflow: hidden;
	border: 3.4cqw solid #0C0D22; border-radius: 15cqw; background: #fff;
	box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .18), 0 40px 80px -28px rgba(0, 0, 0, .85);
}
.telefono__pantalla::before {
	content: "9:41"; position: absolute; z-index: 2; left: 0; right: 0; top: 0; height: 12cqw; padding-left: 9cqw;
	display: flex; align-items: center; font: 600 4.4cqw/1 -apple-system, "SF Pro Text", "Noto Sans", sans-serif; color: #0C0D22;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 62 12'%3E%3Cg fill='%230C0D22'%3E%3Crect x='0' y='8' width='3' height='4' rx='1'/%3E%3Crect x='5' y='6' width='3' height='6' rx='1'/%3E%3Crect x='10' y='3' width='3' height='9' rx='1'/%3E%3Crect x='15' y='0' width='3' height='12' rx='1'/%3E%3Cpath d='M30 3.2a10 10 0 0 1 8 3.4l-1.4 1.4a8 8 0 0 0-13.2 0L22 6.6a10 10 0 0 1 8-3.4zm0 3.6a6 6 0 0 1 4.4 1.9L30 12l-4.4-3.3A6 6 0 0 1 30 6.8z'/%3E%3Crect x='42' y='1.5' width='17' height='9' rx='2.5' fill='none' stroke='%230C0D22' stroke-width='1.2'/%3E%3Crect x='44' y='3.5' width='12' height='5' rx='1.2'/%3E%3Crect x='60' y='4.5' width='1.6' height='3' rx='.8'/%3E%3C/g%3E%3C/svg%3E") right 8cqw center / 19cqw auto no-repeat;
}
.telefono__pantalla::after { content: ""; position: absolute; z-index: 3; top: 2.4cqw; left: 50%; width: 30cqw; height: 8.4cqw; translate: -50% 0; border-radius: 999px; background: #0C0D22; }
.telefono__captura { position: absolute !important; inset: 12cqw 0 0 0; margin: 0; background: #fff; overflow: hidden; }
.telefono__captura img { width: 100%; height: 100%; object-fit: contain; object-position: top center; }
.telefono__pantalla > .pantalla-pendiente { position: absolute; inset: 12cqw 0 0 0; width: auto; aspect-ratio: auto; border-radius: 0; padding: 5cqw; box-shadow: none; }
.telefono__pantalla > .pantalla-pendiente::before { width: 18cqw; height: 18cqw; border-radius: 5cqw; background-size: 11cqw; }
.telefono__pantalla .pantalla-pendiente__nombre { font-size: 6.2cqw; word-break: break-word; }
.telefono__pantalla .pantalla-pendiente__nota { font-size: 4.6cqw; }

/* Pantallas de cada paso dentro del celular del ciclo: se cruzan con un fundido */
.pantalla-paso { position: absolute !important; inset: 12cqw 0 0 0; z-index: 1; opacity: 0; transition: opacity .35s var(--ease); background: #fff; }
.pantalla-paso.is-on { opacity: 1; }
.pantalla-paso > .pantalla-pendiente { position: absolute; inset: 0; width: auto; aspect-ratio: auto; border-radius: 0; padding: 5cqw; box-shadow: none; }
.pantalla-paso .telefono__captura { inset: 0; }

/* ==========================================================================
   Frase con post-its
   ========================================================================== */
.frase { position: relative; isolation: isolate; margin-inline: max(12px, 1vw) !important; }
.frase__escena { position: relative; z-index: 2; width: min(1100px, 100% - 2 * var(--margen)); margin-inline: auto; }
.frase__escena .frase__texto { width: 100%; position: relative; z-index: 1; }
.frase__texto .palabra { display: inline-block; }

.postit { position: absolute; display: block; aspect-ratio: 1; }
.postit__papel {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12%;
	font-family: Caveat, "Comic Sans MS", cursive; font-weight: 600; line-height: 1.1; color: rgba(20, 21, 60, .82);
	background: linear-gradient(180deg, rgba(0, 0, 0, .05) 0 9%, transparent 9%), var(--papel, #FFF3A3);
	border-radius: 2px 2px 6px 3px; box-shadow: 0 2px 3px rgba(0, 0, 0, .18), 0 10px 22px -12px rgba(0, 0, 0, .6);
	transform-origin: 50% 0;
}
.postit__sombra { position: absolute; left: 6%; right: 6%; top: 10%; bottom: -3%; background: rgba(0, 0, 0, .55); filter: blur(12px); opacity: .35; transform-origin: 50% 0; }
.postit--c1 { --papel: #FFF3A3; } .postit--c2 { --papel: #FFC9DE; } .postit--c3 { --papel: #C8F2C2; } .postit--c4 { --papel: #BFE6FF; } .postit--c5 { --papel: #FFD8A8; }

/* Capa de adelante: tapa la frase. Solo aparece si GSAP cargó (si la animación no corre, la frase nunca queda tapada). */
.postits--frente { position: absolute; inset: -28px -20px; z-index: 3; display: none; perspective: 900px; }
.gsap-ok .postits--frente { display: block; }
.postit--frente { width: 27%; }
.postit--frente .postit__papel { font-size: clamp(1.25rem, .8rem + 1.2vw, 2rem); }
.postit--frente:nth-child(1) { left: 0; top: -4%; rotate: -5deg; }
.postit--frente:nth-child(2) { left: 25%; top: 6%; rotate: 3deg; }
.postit--frente:nth-child(3) { left: 50%; top: -6%; rotate: -2deg; }
.postit--frente:nth-child(4) { left: 73%; top: 4%; rotate: 4deg; }
.postit--frente:nth-child(5) { left: 12%; top: 30%; rotate: 2deg; }
.postit--frente:nth-child(6) { left: 58%; top: 28%; rotate: -4deg; }

/* Capa de atrás: más chicos, desenfocados y con velo, repartidos sin tapar el centro */
.postits--fondo { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.postits--fondo::after { content: ""; position: absolute; inset: 0; background: rgba(20, 21, 60, .38); }
.postit--fondo { --w: clamp(84px, 11vw, 170px); width: var(--w); left: min(var(--x), calc(100% - var(--w) - 20px)); top: min(var(--y), calc(100% - var(--w) - 16px)); filter: blur(2.5px); opacity: .45; }
.postit--fondo .postit__papel { font-size: clamp(.95rem, .7rem + .6vw, 1.3rem); }
.postit--fondo .postit__sombra { display: none; }
.postit--fondo:nth-child(1) { --x: 2%; --y: 6%; rotate: -8deg; }
.postit--fondo:nth-child(2) { --x: 22%; --y: 3%; rotate: 6deg; }
.postit--fondo:nth-child(3) { --x: 66%; --y: 4%; rotate: -5deg; }
.postit--fondo:nth-child(4) { --x: 86%; --y: 10%; rotate: 7deg; }
.postit--fondo:nth-child(5) { --x: 6%; --y: 44%; rotate: 5deg; }
.postit--fondo:nth-child(6) { --x: 89%; --y: 46%; rotate: -6deg; }
.postit--fondo:nth-child(7) { --x: 3%; --y: 80%; rotate: -3deg; }
.postit--fondo:nth-child(8) { --x: 28%; --y: 84%; rotate: 8deg; }
.postit--fondo:nth-child(9) { --x: 62%; --y: 86%; rotate: -7deg; }
.postit--fondo:nth-child(10) { --x: 86%; --y: 80%; rotate: 4deg; }

@media (max-width: 767px) {
	.postit--frente:nth-child(n+5), .postit--fondo:nth-child(n+5) { display: none; }
	.postits--frente { inset: -14px 0; }
	.postit--frente { width: 50%; aspect-ratio: 1 / .82; }
	.postit--frente:nth-child(1) { left: 1%; top: -2%; }
	.postit--frente:nth-child(2) { left: 49%; top: 2%; }
	.postit--frente:nth-child(3) { left: 3%; top: 42%; }
	.postit--frente:nth-child(4) { left: 47%; top: 46%; }
	.postit--fondo:nth-child(1) { --x: 2%; --y: 3%; }
	.postit--fondo:nth-child(2) { --x: 76%; --y: 4%; }
	.postit--fondo:nth-child(3) { --x: 4%; --y: 82%; }
	.postit--fondo:nth-child(4) { --x: 74%; --y: 80%; }
}
/* Reducir movimiento: la frase directa, sin post-its */
@media (prefers-reduced-motion: reduce) { .postits { display: none !important; } }

/* Botón de WhatsApp: siempre flotante abajo a la derecha; en el celular, un poco más chico */
@media (max-width: 767px) { .wa-flotante { width: 48px; height: 48px; right: 14px; bottom: 14px; } .wa-flotante svg { width: 26px; height: 26px; } }

/* Escenario fijo desde 960 px: los pasos siempre en tres columnas para que entren en la pantalla */
.is-escenario .ciclo__cabeza { grid-column: 1 / span 4; }
.is-escenario .ciclo__grilla .pasos { grid-column: 5 / span 5; }
.is-escenario .ciclo__lugar-telefono { grid-column: 10 / span 3; display: flex; }
.is-escenario .ciclo__cabeza h2 { font-size: clamp(1.625rem, .8rem + 2vw, 2.875rem); }
.is-escenario .paso__texto { font-size: .9375rem; }
@media (max-width: 1279px) {
	.is-escenario .vidrio { font-size: .75rem; gap: 10px; padding: 10px 12px 10px 10px; }
	.is-escenario .vidrio__txt strong { font-size: .8125rem; }
	.is-escenario .vidrio__ico { width: 32px; height: 32px; background-size: 20px; }
}

/* Arco de arriba: nunca debajo de la barra fija, aunque la pantalla sea baja */
.tesela:nth-child(1), .tesela:nth-child(6) { top: max(19%, 150px); }
.tesela:nth-child(2), .tesela:nth-child(5) { top: max(13.5%, 112px); }
.tesela:nth-child(3), .tesela:nth-child(4) { top: max(10.5%, 104px); }
/* Entre 960 y 1279 px: la frase más angosta y sin los dos íconos de abajo más cercanos al centro */
@media (max-width: 1279px) {
	.is-escenario .multi { width: min(780px, 70%); }
	.is-escenario .tesela:nth-child(8), .is-escenario .tesela:nth-child(11) { display: none; }
}
.ciclo--sin-telefono { container-type: normal; }
.ciclo .is-style-etiqueta { background: var(--blanco); color: var(--noche) !important; }
/* La caja azul se dibuja como fondo con margen: así, al fijar la sección, el ancho fijo coincide con la pantalla */
.ciclo--sin-telefono { background: none; margin-inline: 0; border-radius: 0; position: relative; isolation: isolate; }
.ciclo--sin-telefono::before { content: ""; position: absolute; z-index: -1; inset: 0 clamp(0px, 1vw, 12px); background: var(--noche); border-radius: var(--radio-sec); }

/* ==========================================================================
   Ficha de módulo (plantilla)
   ========================================================================== */
.hero--ficha { padding-top: clamp(124px, 12vw, 168px); padding-bottom: clamp(72px, 9vw, 120px); }
.ficha__hero { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(32px, 5vw, 80px); align-items: center; position: relative; z-index: 1; }
.ficha__hero > * { margin-block-start: 0 !important; }
.ficha__hero-texto > * + * { margin-top: 18px !important; }
.ficha__hero-texto .hero__etiqueta { margin: 0; }
.ficha__titulo { font-size: clamp(2rem, 1.2rem + 2.6vw, 3.5rem); text-wrap: balance; }
.ficha__hero-texto .hero__bajada { margin-inline: 0; }
.ficha__hero-texto .hero__botones { justify-content: flex-start; margin-top: 28px !important; }
.migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; font-size: .875rem; color: var(--en-oscuro-suave); }
.migas li + li::before { content: "›"; margin-right: 6px; color: rgba(255, 255, 255, .45); }
.migas a { color: var(--blanco); text-decoration: none; }
.migas a:hover { color: var(--cian-ui); }
.ficha__icono { display: block; width: 72px; height: 72px; border-radius: 20px; background: var(--blanco) var(--ico) center / 44px no-repeat; box-shadow: 0 16px 32px -16px rgba(0, 0, 0, .6); }
.ficha__resuelve { max-width: 56ch; padding: 16px 20px; border-radius: 16px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(0, 255, 255, .28); color: var(--blanco) !important; font-size: 1.0625rem; line-height: 1.5; }
.ficha__resuelve strong { display: block; color: var(--cian-ui); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 4px; }
.ficha__hero-media { display: flex; justify-content: center; width: auto; padding: 0; margin: 0; perspective: 1400px; }
.ficha__telefono { width: clamp(200px, 20vw, 290px); }
.ficha__hero-media .notebook { width: 100%; }
@media (max-width: 899px) {
	.ficha__hero { grid-template-columns: 1fr; }
	.ficha__hero-media { margin-top: 24px !important; }
	.ficha__telefono { width: clamp(200px, 56vw, 270px); }
}
@media (max-width: 767px) {
	.ficha__hero-texto .hero__botones { flex-direction: column; align-items: stretch; }
	.ficha__hero-texto .hero__botones .wp-block-button__link { width: 100%; }
}

/* Antes y después */
.antes-despues__grilla { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.antes-despues__grilla > * { margin-block-start: 0 !important; }
.antes, .despues { border-radius: var(--radio-card); padding: clamp(24px, 3vw, 40px); }
.antes { background: var(--niebla); }
.despues { background: var(--noche); color: var(--blanco); }
.antes-despues__etiqueta { font-size: .75rem !important; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 18px !important; }
.antes .antes-despues__etiqueta { color: var(--texto-suave); }
.despues .antes-despues__etiqueta { color: var(--cian-ui); }
.antes__lista, .despues__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; font-size: var(--wp--preset--font-size--grande); line-height: 1.4; }
.antes__lista li { position: relative; padding-left: 34px; color: var(--noche); transition: opacity .5s var(--ease), color .5s; }
.antes__lista li::before { content: "✕"; position: absolute; left: 0; top: 0; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; font-size: .75rem; background: #E6E7EF; color: var(--texto-suave); }
/* Tachado de texto real: cruza todos los renglones del ítem */
.antes__lista li { text-decoration: line-through; text-decoration-color: transparent; text-decoration-thickness: 2px; transition: opacity .5s var(--ease), text-decoration-color .5s var(--ease); }
.antes__lista li.is-tachado { opacity: .78; text-decoration-color: var(--texto-suave); }
.despues__lista li { position: relative; padding-left: 34px; }
.despues__lista li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; font-size: .8125rem; font-weight: 800; background: var(--cian-ui); color: var(--noche); }
@media (max-width: 767px) { .antes-despues__grilla { grid-template-columns: 1fr; } }

/* Funciones con la captura fija */
.funciones__grilla { display: grid; grid-template-columns: 1fr; gap: 32px; }
.funciones__grilla > * { margin-block-start: 0 !important; }
.funciones__notebook { width: min(100%, 720px); margin-inline: auto; }
.funciones__notebook .notebook__pantalla > .funciones__zoom { position: absolute; inset: 2.2%; border-radius: 10px; overflow: hidden; }
.funciones__zoom > .pantalla-pendiente { position: absolute; inset: 0; aspect-ratio: auto; border-radius: 0; will-change: transform; }
.funciones__lista { display: grid; gap: 16px; }
.funciones__lista > * { margin-block-start: 0 !important; }
.funcion { padding: 22px 24px; border-radius: var(--radio-card); background: var(--niebla); transition: opacity .4s var(--ease), background-color .4s; }
.funcion > * + * { margin-top: 8px !important; }
.funcion__numero { font-family: var(--wp--preset--font-family--titulos); font-weight: 600; color: var(--azul); font-size: .9375rem; }
.funcion__titulo { margin: 0; font-size: 1.25rem; }
.funcion p:not(.funcion__numero) { color: var(--texto-suave); }
@media (min-width: 1200px) and (min-height: 700px) {
	.funciones__grilla { grid-template-columns: 7fr 5fr; gap: clamp(40px, 5vw, 80px); align-items: start; }
	.funciones__media { position: sticky; top: calc(50vh - 220px); }
	.funciones__lista { gap: 0; }
	.funcion { min-height: 0; display: flex; flex-direction: column; justify-content: center; background: none; padding: 36px 0 36px 28px; border-left: 0; position: relative; }
	.funcion::before { content: ""; position: absolute; left: 0; top: 50%; width: 3px; height: 64px; translate: 0 -50%; border-radius: 3px; background: var(--borde); transition: background-color .4s; }
	.funciones.is-activa .funcion { opacity: .72; }
	.funciones.is-activa .funcion.is-on { opacity: 1; }
	.funciones.is-activa .funcion.is-on::before { background: var(--cian-ui); }
}

/* También resuelve: tarjetas desplegables */
.desplegables { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; align-items: start; }
.desplegables > * { margin-block-start: 0 !important; }
.desplegable { background: var(--niebla); border-radius: var(--radio-card); }
.desplegable__titulo { margin: 0; font-size: 1.125rem; padding: 20px 24px; }
.desplegable__cuerpo { padding: 0 24px 22px; }
.desplegable__cuerpo p { color: var(--texto-suave); }
.desplegable__boton {
	all: unset; box-sizing: border-box; width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px; cursor: pointer; font: inherit; font-weight: 800;
}
.desplegable__boton:focus-visible { outline: 3px solid var(--azul); outline-offset: 6px; border-radius: 6px; }
.desplegable__boton::after {
	content: ""; flex: none; width: 28px; height: 28px; border-radius: 50%;
	background: var(--blanco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%2314153C' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px no-repeat;
	transition: transform .3s var(--ease), background-color .3s;
}
.desplegable__boton[aria-expanded="true"]::after { transform: rotate(45deg); background-color: var(--cian-ui); }
.desplegable.is-js .desplegable__titulo { padding: 0; }
.desplegable.is-js .desplegable__boton { padding: 20px 24px; }
@media (max-width: 767px) { .desplegables { grid-template-columns: 1fr; } }

/* Se conecta con: caja azul noche con los arcos del logo y el mapa de módulos */
.tambien { padding-bottom: clamp(48px, 6vw, 88px); }
.conecta {
	position: relative; overflow: hidden; isolation: isolate; color: var(--blanco);
	margin: 0 clamp(0px, 1vw, 12px); border-radius: var(--radio-sec); padding-block: clamp(64px, 8vw, 112px);
	background: radial-gradient(70% 80% at 85% 20%, rgba(27, 95, 161, .55), transparent 70%), radial-gradient(50% 60% at 0% 100%, rgba(0, 255, 255, .12), transparent 70%), var(--noche);
}
.conecta__arcos {
	position: absolute; z-index: -1; width: 760px; aspect-ratio: 1; left: -300px; top: -260px; border-radius: 50%; pointer-events: none;
	box-shadow: 0 0 0 2px rgba(0, 255, 255, .1), 0 0 0 60px rgba(255, 255, 255, .015), 0 0 0 62px rgba(0, 255, 255, .07), 0 0 0 120px rgba(255, 255, 255, .012), 0 0 0 122px rgba(0, 255, 255, .05);
}
.conecta__grilla { display: grid; grid-template-columns: 4fr 8fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.conecta__grilla > * { margin-block-start: 0 !important; }
.conecta__texto > * + * { margin-top: 16px !important; }
.conecta h2 { color: var(--blanco); margin: 0; }
.conecta p { color: var(--en-oscuro-suave); }
@media (max-width: 899px) { .conecta__grilla { grid-template-columns: 1fr; } }

.mapa { position: relative; width: min(100%, 560px); aspect-ratio: 1; margin-inline: auto; }
.mapa__lineas { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.mapa__linea { stroke: var(--cian); stroke-width: .35; stroke-linecap: round; opacity: .55; transition: opacity .3s, stroke-width .3s; }
.mapa__linea.is-hover { opacity: 1; stroke-width: .7; }
.mapa__luz { fill: #fff; opacity: 0; filter: drop-shadow(0 0 1.2px var(--cian)); }
.mapa__enlace { stroke: rgba(255, 255, 255, .28); stroke-width: .25; stroke-linecap: round; stroke-dasharray: 1.4 1.6; }
.mapa__enlace--lejos { stroke: rgba(0, 255, 255, .16); stroke-dasharray: none; }
@media (prefers-reduced-motion: no-preference) {
	.gsap-ok .mapa__red { opacity: 0; transition: opacity .9s ease; }
	.gsap-ok .mapa.is-red .mapa__red { opacity: 1; }
	.mapa.is-red .mapa__enlace:not(.mapa__enlace--lejos) { animation: mapa-corre 6s linear infinite; }
}
@keyframes mapa-corre { to { stroke-dashoffset: -6; } }
.conecta__cta { margin-top: 28px !important; }
/* Círculo central: disco blanco con el icono centrado y el nombre debajo; el centro del disco es el centro del mapa */
.mapa__centro { position: absolute; left: 50%; top: 50%; width: 0; height: 0; z-index: 2; }
.mapa__disco {
	position: absolute; left: -48px; top: -48px; width: 96px; height: 96px; border-radius: 50%;
	background: #fff var(--ico) center / 52px no-repeat; box-shadow: 0 0 0 8px rgba(0, 255, 255, .12), 0 18px 40px -14px rgba(0, 0, 0, .6);
}
.mapa__brillo { position: absolute; left: -90px; top: -90px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, rgba(0, 255, 255, .35), transparent 65%); opacity: .6; pointer-events: none; }
.mapa__nombre { position: absolute; top: 62px; left: 0; translate: -50% 0; white-space: nowrap; font-weight: 800; font-size: 1rem; color: var(--blanco); text-align: center; }
.mapa__nodos { list-style: none; margin: 0; padding: 0; }
.mapa__nodo { position: absolute; left: var(--x); top: var(--y); width: 0; height: 0; z-index: 3; }
.mapa__nodo a {
	box-sizing: border-box; position: absolute; left: 0; top: 0; translate: -50% -50%; display: flex; align-items: center; gap: 8px; width: max-content; max-width: 180px;
	padding: 8px 14px 8px 8px; border-radius: 999px; background: var(--blanco); color: var(--noche); font-weight: 700; font-size: .875rem; line-height: 1.2; text-decoration: none; cursor: pointer;
	box-shadow: 0 14px 30px -14px rgba(0, 0, 0, .7); transition: scale .25s var(--ease), box-shadow .25s var(--ease);
}
.mapa__nodo a::before { content: ""; width: 30px; height: 30px; flex: none; background: var(--ico) center / contain no-repeat; }
.mapa__nodo a:hover, .mapa__nodo a:focus-visible { scale: 1.05; box-shadow: 0 0 0 2px var(--cian), 0 18px 34px -14px rgba(0, 0, 0, .7); }

/* Celular: lista vertical, el módulo central arriba y los relacionados unidos por una línea */
@media (max-width: 767px) {
	.mapa { aspect-ratio: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 0; width: 100%; }
	.mapa__lineas { display: none; }
	.mapa__centro { position: relative; left: auto; top: auto; width: auto; height: auto; display: flex; align-items: center; gap: 14px; padding-bottom: 20px; }
	.mapa__disco { position: relative; left: auto; top: auto; width: 64px; height: 64px; background-size: 36px; box-shadow: 0 0 0 6px rgba(0, 255, 255, .12); }
	.mapa__brillo { display: none; }
	.mapa__nombre { position: static; translate: none; }
	.mapa__nodos { position: relative; width: 100%; display: grid; gap: 12px; padding-left: 32px; }
	.mapa__nodos::before { content: ""; position: absolute; left: 31px; top: -20px; bottom: 24px; width: 2px; background: linear-gradient(180deg, var(--cian), rgba(0, 255, 255, .25)); translate: -50% 0; }
	.mapa__nodo { position: relative; left: auto; top: auto; width: auto; height: auto; padding-left: 28px; }
	.mapa__nodo::before { content: ""; position: absolute; left: -1px; top: 50%; width: 28px; height: 2px; background: rgba(0, 255, 255, .5); }
	.mapa__nodo a { position: relative; translate: none; max-width: none; width: 100%; }
}

/* Módulo anterior / siguiente */
.ficha__nav { padding-block: clamp(40px, 5vw, 64px) 8px; }
.nav-modulos { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.nav-modulos__link {
	box-sizing: border-box; display: flex; flex-direction: column; gap: 2px; min-width: min(280px, 100%); padding: 18px 22px 18px 74px; position: relative; border-radius: var(--radio-card);
	background: var(--niebla); color: var(--noche); text-decoration: none; transition: background-color .25s, transform .25s var(--ease);
}
.nav-modulos__link::before { content: ""; position: absolute; left: 20px; top: 50%; translate: 0 -50%; width: 40px; height: 40px; background: var(--ico) center / contain no-repeat; }
.nav-modulos__link span { font-size: .8125rem; color: var(--texto-suave); }
.nav-modulos__link strong { font-size: 1.0625rem; }
.nav-modulos__link--sig { margin-left: auto; text-align: right; padding: 18px 74px 18px 22px; }
.nav-modulos__link--sig::before { left: auto; right: 20px; }
.nav-modulos__link:hover { background: #E7E9F2; transform: translateY(-2px); }
@media (max-width: 599px) { .nav-modulos__link { flex: 1 1 100%; } }
.funciones__zoom .pantalla-pendiente__nombre, .funciones__zoom .pantalla-pendiente__nota { visibility: hidden; }
.funciones__aviso { position: absolute; left: 50%; bottom: 8%; translate: -50% 0; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 18px; border-radius: 14px; background: rgba(255, 255, 255, .92); box-shadow: 0 10px 24px -14px rgba(20, 21, 60, .5); text-align: center; font-size: .875rem; color: var(--noche); white-space: nowrap; }
.funciones__aviso span { font-size: .75rem; color: var(--azul); }

.funciones { padding-bottom: clamp(48px, 6vw, 96px); }
.mapa__nombre { padding: 3px 12px; border-radius: 999px; background: var(--noche); box-shadow: 0 0 0 1px rgba(0, 255, 255, .25); }
@media (max-width: 767px) { .mapa__nombre { background: none; box-shadow: none; padding: 0; } }

/* ==========================================================================
   Tipografía: títulos principales Noto Sans; títulos secundarios Libre Caslon itálica; texto Noto Sans (300 a 800)
   ========================================================================== */
.is-style-secundario, :where(h1, h2, h3, h4, .frase__texto, .multi__frase, .dato__numero) em {
	font-family: var(--wp--preset--font-family--secundaria); font-style: italic; font-weight: 400; letter-spacing: 0;
}
h1.is-style-secundario, h2.is-style-secundario, h3.is-style-secundario, h4.is-style-secundario { font-weight: 400; line-height: 1.2; }
p.is-style-secundario { font-size: var(--wp--preset--font-size--grande); color: inherit; }
.cierre .cierre__firma { margin-top: 26px; color: var(--cian-ui) !important; font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem); }

/* Texto: Noto Sans Regular para el cuerpo y Light para los textos grandes de introducción (como en la lámina de marca) */
body { font-weight: 400; }
.texto-grande, .hero__bajada, .ficha__intro, .ciclo__bajada, .multi__nota, .principales__caja p, .rubros__cierre { font-weight: 300; }

/* Título principal del hero: más grueso, como estaba (pedido de Sofi) */
.hero .hero__titulo { font-weight: 900; letter-spacing: -.015em; }

/* ==========================================================================
   Menú superior: uno solo, fijo en todas las páginas
   - Escritorio (≥ 1024): siempre visible; después de 80 px se compacta (88 → 64 px) con fondo translúcido y desenfoque.
   - Tablet y celular: se oculta al bajar y reaparece al subir (salvo con el menú abierto).
   - Con la barra de administración de WordPress, se ubica debajo de ella (--tope-admin, lo calcula el JS).
   ========================================================================== */
html { scroll-padding-top: calc(var(--alto-menu, 88px) + 16px); }
.sitio-header { position: relative; z-index: 90; }
.hdr { position: fixed; left: 0; right: 0; top: var(--tope-admin, 0px); z-index: 90; padding-top: 12px; transition: padding .3s var(--ease), transform .35s var(--ease); }
.hdr__in { min-height: 76px; box-sizing: border-box; transition: min-height .3s var(--ease), background-color .3s, box-shadow .3s, padding .3s; }
.hdr__logo img { transition: width .3s var(--ease); }
.hdr.is-compacto { padding-top: 6px; }
.hdr.is-compacto .hdr__in { min-height: 58px; padding-top: 6px; padding-bottom: 6px; background: rgba(255, 255, 255, .78); backdrop-filter: saturate(1.6) blur(16px); -webkit-backdrop-filter: saturate(1.6) blur(16px); box-shadow: 0 10px 30px -16px rgba(20, 21, 60, .45), 0 0 0 1px rgba(20, 21, 60, .06); }
.hdr.is-compacto .hdr__logo img { width: 92px; }
.hdr.is-compacto .boton--demo { padding: .62em 1.3em; }
@media (max-width: 1023px) {
	.hdr { padding-top: 8px; }
	.hdr__in { min-height: 62px; }
	.hdr.is-oculto:not(.is-open) { transform: translateY(calc(-100% - var(--tope-admin, 0px) - 8px)); }
}
@media (prefers-reduced-motion: reduce) { .hdr, .hdr__in, .hdr__logo img { transition: none; } }

/* Fotos de las necesidades (/modulos/) */
.selector__foto { margin: 0; aspect-ratio: 4 / 3; border-radius: var(--radio-card); overflow: hidden; box-shadow: var(--sombra); }
.selector__foto img { width: 100%; height: 100%; object-fit: cover; }

/* Hero de sector con foto */
.hero--con-foto .hero__con-foto { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(32px, 5vw, 72px); align-items: center; position: relative; z-index: 1; }
.hero--con-foto .hero__con-foto > * { margin-block-start: 0 !important; }
.hero--con-foto .hero__texto { width: auto; margin: 0; text-align: left; align-items: flex-start; }
.hero--con-foto .hero__botones, .hero--con-foto .hero__confianza { justify-content: flex-start; }
.hero__foto { margin: 0; width: auto; padding: 0; perspective: 1400px; }
.hero__foto-img { margin: 0; aspect-ratio: 4 / 5; border-radius: 28px; overflow: hidden; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .12); }
.hero__foto-img img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 899px) {
	.hero--con-foto .hero__con-foto { grid-template-columns: 1fr; }
	.hero__foto-img { aspect-ratio: 4 / 3; }
}
@media (max-width: 767px) {
	.hero--con-foto .hero__botones { width: 100%; flex-direction: column; align-items: stretch; }
	.hero--con-foto .hero__botones .wp-block-button__link { width: 100%; }
}

/* Pie: logo blanco directo sobre el azul noche */
.pie__logo { background: none; padding: 0; border-radius: 0; }
.pie__logo img { width: 140px; }

/* Con sesión iniciada WordPress agrega la clase admin-bar: el menú arranca debajo de su barra aunque el JS todavía no haya medido */
.admin-bar { --tope-admin: 32px; }
@media (max-width: 782px) { .admin-bar { --tope-admin: 46px; } }

/* Menú completo desde 1024 px: los textos nunca se parten en dos renglones */
.hdr__link, .hdr .boton--demo { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1279px) {
	.hdr__in { gap: 12px; padding-left: 20px; }
	.hdr__link { padding: 10px 9px; font-size: .9063rem; }
	.hdr__nav { gap: 8px; }
}
@media (max-width: 1099px) {
	.is-escenario .vidrio--1, .is-escenario .vidrio--2 { top: 0; }
	.is-escenario .vidrio--3, .is-escenario .vidrio--4 { top: 62%; }
}
@media (max-width: 1099px) { .is-escenario .tesela:nth-child(7), .is-escenario .tesela:nth-child(10) { display: none; } }
/* Nombre de la captura pendiente: siempre dentro del marco, en varias líneas si hace falta. */
.notebook__pantalla > .pantalla-pendiente { box-sizing: border-box; padding-inline: 8%; text-align: center; }
.notebook__pantalla .pantalla-pendiente__nombre { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-wrap: balance; }
/* Funciones con un documento real (PDF): la hoja ocupa el ancho y se desplaza hasta la zona de cada función. */
.funciones__zoom > .funciones__documento { position: absolute; left: 0; top: 0; width: 100%; background: #fff; transform-origin: 0 0; will-change: transform; }
.funciones__documento > * { margin: 0 !important; }
.funciones__documento img { display: block; width: 100%; height: auto; }

/* ===== /modulos/: mapa del circuito ===== */
.circuito { position: relative; margin-top: 8px; }
.circuito__etapas { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px; counter-reset: none; }
.etapa { position: relative; padding: 22px 20px; border-radius: var(--radio-card); background: rgba(255, 255, 255, .06); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset; }
.etapa > * { margin: 0; }
.etapa__num { font-size: .8125rem; font-weight: 700; letter-spacing: .08em; color: var(--cian) !important; }
.etapa__titulo { margin-top: 4px !important; font-size: 1.25rem; color: var(--blanco); max-width: none; }
.etapa__texto { margin-top: 6px !important; font-size: .9375rem; line-height: 1.5; }
.etapa__mods { list-style: none; padding: 0; margin: 14px 0 0 !important; display: grid; gap: 6px; }
.etapa__mods li, .circuito__control li { margin: 0; }
/* Flecha entre etapas: abajo en pantallas chicas, a la derecha en escritorio. */
.etapa__flecha { position: absolute; left: 50%; bottom: -26px; width: 32px; height: 24px; margin-left: -16px; transform: rotate(90deg); overflow: visible; }
.etapa__trazo, .etapa__punta { fill: none; stroke: var(--cian); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.etapa__trazo { stroke-dasharray: 1; stroke-dashoffset: 0; }
.etapa__enlace { display: none; }

/* Link de módulo con icono; "Resuelve" en un globo al pasar el mouse o con el teclado. */
.chip-mod { position: relative; display: flex; align-items: center; gap: 10px; padding: 7px 10px 7px 7px; border-radius: 12px; color: var(--blanco); text-decoration: none; font-size: .9375rem; line-height: 1.25; transition: background-color .25s; }
.chip-mod::before { content: ""; flex: none; width: 32px; height: 32px; border-radius: 9px; background: var(--blanco) var(--ico) center / 20px no-repeat; }
.chip-mod:hover, .chip-mod:focus-visible { background: rgba(255, 255, 255, .12); }
.chip-mod__resuelve { position: absolute; z-index: 5; left: 0; bottom: calc(100% + 8px); width: min(260px, 80vw); padding: 12px 14px; border-radius: 14px; background: var(--blanco); color: var(--noche); font-size: .8125rem; line-height: 1.45; box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .55); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s, transform .2s, visibility 0s .2s; pointer-events: none; }
.chip-mod__resuelve strong { color: var(--azul) !important; }
.chip-mod:hover .chip-mod__resuelve, .chip-mod:focus-visible .chip-mod__resuelve { opacity: 1; visibility: visible; transform: none; transition: opacity .2s, transform .2s; }
@media (hover: none) { .chip-mod__resuelve { clip: rect(0 0 0 0); clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; padding: 0; } }

/* Tareas al centro y módulos de control */
.circuito__centro { margin-top: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 18px 22px; border-radius: var(--radio-card); background: linear-gradient(120deg, rgba(0, 255, 255, .16), rgba(27, 95, 161, .35)); box-shadow: 0 0 0 1px rgba(0, 255, 255, .35) inset; }
.circuito__centro p { margin: 0; max-width: 52ch; }
.chip-mod--centro { font-size: 1.125rem; font-weight: 700; }
.chip-mod--centro::before { width: 44px; height: 44px; border-radius: 12px; background-size: 28px; box-shadow: 0 0 0 6px rgba(0, 255, 255, .18); }
.circuito__control { margin-top: 20px; padding-top: 18px; border-top: 1px dashed rgba(255, 255, 255, .2); }
.circuito__control-titulo { margin: 0 0 10px; font-size: .8125rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--en-oscuro-suave); }
.circuito__control ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 6px 12px; }

@media (min-width: 720px) and (max-width: 1099px) {
	.circuito__etapas { grid-template-columns: 1fr 1fr; gap: 20px; }
	.etapa__flecha { display: none; }
	.etapa:last-child { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
	.circuito__etapas { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 26px; }
	.etapa { display: flex; flex-direction: column; padding: 20px 16px; }
	.etapa__flecha { left: auto; right: -28px; bottom: auto; top: 30px; margin: 0; transform: none; width: 30px; height: 16px; }
	/* Cada etapa baja una línea punteada hasta Tareas. */
	.etapa__enlace { display: block; position: absolute; left: 50%; top: 100%; width: 0; height: 28px; border-left: 2px dashed rgba(0, 255, 255, .45); }
	.chip-mod { font-size: .875rem; }
	/* Globo dentro de la pantalla en las columnas de los bordes. */
	.etapa:nth-child(n+4) .chip-mod__resuelve { left: auto; right: 0; }
	.circuito__centro { justify-content: center; text-align: center; }
}

/* ===== /modulos/: las 24 tarjetas ===== */
.todos-modulos__cabeza + .tarjetas-mod { margin-top: 28px !important; }
.tarjetas-mod + .todos-modulos__cabeza { margin-top: clamp(64px, 8vw, 104px) !important; }
.tarjetas-mod { --cols: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.tarjetas-mod > * { flex: 0 0 calc((100% - (var(--cols) - 1) * 16px) / var(--cols)); margin: 0 !important; }
@media (min-width: 600px) { .tarjetas-mod { --cols: 2; } }
@media (min-width: 900px) { .tarjetas-mod { --cols: 3; } }
@media (min-width: 1200px) { .tarjetas-mod { --cols: 4; } }
.tarjeta-mod { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 22px 22px 24px; border-radius: var(--radio-card); background: var(--niebla); transition: transform .3s var(--ease), box-shadow .3s, background-color .3s; }
.tarjeta-mod > * { margin: 0 !important; }
.tarjeta-mod::before { content: ""; width: 52px; height: 52px; margin-bottom: 8px; border-radius: 14px; background: var(--blanco) var(--ico) center / 30px no-repeat; box-shadow: 0 10px 24px -14px rgba(27, 95, 161, .55); }
.tarjeta-mod__nombre { font-size: 1.125rem; max-width: none; }
.tarjeta-mod__nombre a { color: var(--noche); text-decoration: none; }
.tarjeta-mod__nombre a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.tarjeta-mod__nombre a:focus-visible { outline: none; }
.tarjeta-mod:has(a:focus-visible) { outline: 3px solid var(--azul); outline-offset: 3px; }
.tarjeta-mod__bajada { color: var(--noche); font-size: .9375rem; line-height: 1.45; }
.tarjeta-mod__resuelve { margin-top: auto !important; padding-top: 10px; border-top: 1px solid rgba(20, 21, 60, .1); font-size: .8125rem; line-height: 1.45; color: var(--texto-suave); }
.tarjeta-mod__resuelve strong { color: var(--azul); }
.tarjeta-mod:hover { transform: translateY(-4px); background: var(--blanco); box-shadow: 0 22px 44px -24px rgba(20, 21, 60, .45), 0 0 0 1px rgba(27, 95, 161, .18) inset; }
@media (prefers-reduced-motion: reduce) { .tarjeta-mod, .chip-mod__resuelve { transition: none; } .tarjeta-mod:hover { transform: none; } }

/* ===== Persona con el arco de Macri (cierre y contacto) ===== */
/* La caja mide 1 × 1.2: el círculo ocupa el ancho y queda abajo; la persona se recorta con el círculo y la cabeza asoma por arriba. */
.persona-arco { position: relative; width: min(100%, 420px); aspect-ratio: 1 / 1.2; margin-inline: auto; }
.persona-arco__circulo { position: absolute; left: 0; right: 0; bottom: 0; aspect-ratio: 1; border-radius: 50%; overflow: hidden;
	background:
		radial-gradient(circle at 30% 30%, rgba(0, 255, 255, .35), transparent 55%),
		radial-gradient(rgba(255, 255, 255, .22) 1.2px, transparent 1.6px) 0 0 / 14px 14px,
		linear-gradient(160deg, #2A7BD0 0%, #1B5FA1 45%, #14153C 100%); }
.persona-arco__arco { position: absolute; left: -7%; right: -7%; bottom: -5.8%; width: 114%; aspect-ratio: 1; overflow: visible; }
.persona-arco__recorte { position: absolute; inset: 0;
	-webkit-mask: linear-gradient(#000 0 0) top / 100% 58.4% no-repeat, radial-gradient(closest-side, #000 99.4%, transparent 100%) bottom / 100% 83.34% no-repeat;
	mask: linear-gradient(#000 0 0) top / 100% 58.4% no-repeat, radial-gradient(closest-side, #000 99.4%, transparent 100%) bottom / 100% 83.34% no-repeat; }
.persona-arco__recorte img { position: absolute; left: 50%; bottom: 0; width: 80%; height: auto; margin-left: -40%; }
.persona-arco__puntos { position: absolute; left: 4%; bottom: 14%; display: flex; gap: 9px; }
.persona-arco__puntos i { width: 11px; height: 11px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 10px rgba(0, 255, 255, .6); }

/* ===== Cierre con persona (mismo recurso que macri.com.ar) ===== */
.cierre { text-align: left; padding-block: clamp(72px, 9vw, 120px); background: linear-gradient(100deg, var(--noche) 0%, #17224F 40%, #1B5FA1 100%); }
.cierre__in { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.cierre__in > * { margin: 0 !important; }
.cierre__persona { width: min(78%, 360px); margin-inline: auto !important; }
.cierre__texto { display: flex; flex-direction: column; align-items: center; text-align: center; }
.cierre h2 { margin: 0; }
@media (min-width: 960px) {
	.cierre__in { grid-template-columns: 5fr 7fr; gap: clamp(40px, 6vw, 96px); }
	.cierre__persona { width: 100%; max-width: 420px; }
	.cierre__texto { align-items: flex-start; text-align: left; }
	.cierre h2 { margin: 0; }
	.cierre .wp-block-buttons { justify-content: flex-start; }
}

/* ===== Quién está detrás: datos de Macri y Asociados ===== */
.detras__datos { --cols: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: clamp(32px, 4vw, 48px) !important; }
.detras__datos > * { flex: 0 0 calc((100% - (var(--cols) - 1) * 16px) / var(--cols)); margin: 0 !important; }
@media (min-width: 560px) { .detras__datos { --cols: 2; } }
@media (min-width: 1100px) { .detras__datos { --cols: 4; } }
.dato-macri { position: relative; min-height: 150px; padding: 26px 24px 24px; border-radius: 16px; background: #CFE5F5; color: var(--noche); }
.dato-macri::after { content: ""; position: absolute; top: 18px; right: 18px; width: 44px; height: 44px; background: var(--noche); -webkit-mask: var(--linea) center / contain no-repeat; mask: var(--linea) center / contain no-repeat; opacity: .85; }
.dato-macri > * { margin: 0 !important; max-width: none !important; }
.dato-macri__num { margin-top: 30px !important; font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3rem); font-weight: 800; line-height: 1; letter-spacing: -.02em; }
.dato-macri__num strong { color: var(--noche); font-variant-numeric: tabular-nums; }
.dato-macri__txt { margin-top: 8px !important; font-size: 1rem; line-height: 1.35; color: #2B3366; }
.dato-macri--trayectoria { --linea: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='24' cy='19' r='11'/%3E%3Cpath d='M24 13l1.8 3.7 4 .6-2.9 2.8.7 4L24 22.2l-3.6 1.9.7-4-2.9-2.8 4-.6z'/%3E%3Cpath d='M17 28l-3 14 6-3 4 5 0 0M31 28l3 14-6-3-4 5'/%3E%3C/svg%3E"); }
.dato-macri--empresas { --linea: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='14' width='36' height='26' rx='3'/%3E%3Cpath d='M18 14v-4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v4M6 25h36M22 25v3h4v-3'/%3E%3C/svg%3E"); }
.dato-macri--puestos { --linea: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='38' height='28' rx='3'/%3E%3Ccircle cx='17' cy='23' r='4.5'/%3E%3Cpath d='M10 33c1.5-3.5 4-5 7-5s5.5 1.5 7 5M28 21h9M28 26h9M28 31h6M19 11V7h10v4'/%3E%3C/svg%3E"); }
.dato-macri--desarrollos { --linea: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='34' height='28' rx='3'/%3E%3Cpath d='M5 14h34M16 21l-4 4 4 4M26 21l4 4-4 4'/%3E%3Ccircle cx='37' cy='36' r='6'/%3E%3Cpath d='M37 28v2M37 42v2M29 36h2M43 36h2'/%3E%3C/svg%3E"); }

/* Foto en la cabecera de capacitación (home) */
.implementacion__cabeza { display: grid; gap: 28px; align-items: center; max-width: none; }
.implementacion__cabeza > * { margin: 0 !important; }
.implementacion__cabeza-texto > * + * { margin-top: 20px !important; }
.implementacion__foto img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 24px; box-shadow: 0 30px 60px -32px rgba(20, 21, 60, .55); }
@media (min-width: 900px) { .implementacion__cabeza { grid-template-columns: 6fr 5fr; gap: clamp(32px, 5vw, 72px); } }

/* ===== /integracion-con-tu-erp/ ===== */
.hero--integracion .hero__titulo { max-width: 16ch; }
.hero__persona { margin: 0 !important; display: flex; justify-content: center; align-self: end; }
.hero__persona-in { position: relative; width: min(100%, 420px); }
.hero__persona-in img { position: relative; z-index: 1; display: block; width: 100%; height: auto; -webkit-mask: linear-gradient(#000 82%, transparent); mask: linear-gradient(#000 82%, transparent); }
.hero__persona-halo { position: absolute; left: 6%; right: 6%; bottom: 6%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 40% 35%, rgba(0, 255, 255, .35), rgba(27, 95, 161, .45) 45%, transparent 70%); }
@media (max-width: 899px) { .hero__persona-in { width: min(70%, 320px); } }

/* Los dos bloques */
.union { position: relative; display: grid; grid-template-columns: 1fr; gap: 0; align-items: stretch; }
.union__bloque { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: clamp(24px, 3vw, 40px); border-radius: 28px; min-height: 160px; }
.union__bloque span { font-size: .9375rem; line-height: 1.4; }
.union__bloque--crm { background: var(--blanco); color: var(--texto-suave); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); }
.union__bloque--crm img { width: clamp(120px, 14vw, 170px); height: auto; }
.union__bloque--erp { background: linear-gradient(150deg, #1C1E52, #14153C); color: var(--en-oscuro-suave); box-shadow: 0 0 0 1px rgba(255, 255, 255, .14) inset, 0 30px 60px -30px rgba(0, 0, 0, .6); }
.union__bloque--erp strong { color: var(--blanco); font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); font-weight: 700; line-height: 1; }
.union__conector { position: relative; display: grid; place-items: center; min-height: 64px; }
.union__linea { position: absolute; left: 50%; top: 0; bottom: 0; width: 3px; margin-left: -1.5px; background: linear-gradient(180deg, var(--azul-claro, #3B8BD9), var(--cian)); border-radius: 3px; }
.union__nudo { position: relative; z-index: 1; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 0 8px rgba(0, 255, 255, .18), 0 0 30px rgba(0, 255, 255, .5); }
.union__nudo svg, .etiqueta-dato svg, .quien__sync svg { width: 24px; height: 24px; fill: none; stroke: var(--noche); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.anim-union { margin-top: clamp(48px, 7vw, 96px) !important; position: relative; z-index: 1; }
@media (min-width: 768px) {
	.union { grid-template-columns: 1fr minmax(120px, .9fr) 1fr; }
	.union__bloque { min-height: 210px; }
	.union__linea { left: -2px; right: -2px; top: 50%; bottom: auto; width: auto; height: 3px; margin: -1.5px 0 0; background: linear-gradient(90deg, var(--azul-claro, #3B8BD9), var(--cian)); }
}

/* ¿Qué información comparten? */
.comparte__grilla { display: grid; gap: 40px; }
.comparte__grilla > * { margin: 0 !important; }
.comparte__texto > * + * { margin-top: 20px !important; }
.comparte__datos { display: grid; gap: 14px; margin-top: 28px !important; }
.comparte__dato { padding: 20px 22px; border-radius: var(--radio-card); background: var(--niebla); }
.comparte__dato > * { margin: 0 !important; }
.comparte__paso { font-size: .8125rem; font-weight: 700; letter-spacing: .06em; color: var(--azul); }
.comparte__titulo { margin-top: 6px !important; font-size: 1.25rem; max-width: none; }
.comparte__dato p:last-child { margin-top: 8px !important; }
.union--escena .union__bloque { min-height: 120px; }
.union__etiquetas { display: none; list-style: none; margin: 0; padding: 0; }
.etiqueta-dato { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 10px 12px; border-radius: 999px; background: var(--cian); color: var(--noche); font-weight: 600; font-size: .9375rem; white-space: nowrap; box-shadow: 0 10px 30px -10px rgba(0, 255, 255, .7); }
.etiqueta-dato svg { width: 18px; height: 18px; flex: none; }
/* Sección fija (≥ 1200 × 700, la activa JavaScript con .is-fija): texto a la izquierda, escena a la derecha, una etiqueta por tramo. */
.comparte.is-fija { padding-block: 0; }
.comparte.is-fija .comparte__grilla { grid-template-columns: 5fr 6fr; align-items: center; gap: clamp(40px, 5vw, 80px); min-height: calc(100vh - var(--alto-menu, 64px)); padding-block: 32px; box-sizing: border-box; }
.comparte.is-fija .comparte__datos { position: relative; display: block; min-height: 190px; }
.comparte.is-fija .comparte__dato { position: absolute; inset: 0 0 auto; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .45s var(--ease), transform .45s var(--ease), visibility 0s .45s; }
.comparte.is-fija .comparte__dato.is-on { opacity: 1; visibility: visible; transform: none; transition: opacity .45s var(--ease), transform .45s var(--ease); }
.comparte.is-fija .union { grid-template-columns: 1fr; gap: 0; }
.comparte.is-fija .union__carril { min-height: 220px; }
.comparte.is-fija .union__linea { left: 50%; right: auto; top: 0; bottom: 0; width: 3px; height: auto; margin: 0 0 0 -1.5px; background: linear-gradient(180deg, var(--azul), var(--cian)); }
.comparte.is-fija .union__etiquetas { display: block; position: absolute; inset: 0; }
.comparte.is-fija .etiqueta-dato { position: absolute; left: 50%; top: 50%; translate: -50% -50%; opacity: 0; scale: .85; transition: opacity .35s, scale .35s; }
.comparte.is-fija .etiqueta-dato.is-on { opacity: 1; scale: 1; animation: vaiven 2.6s ease-in-out infinite alternate; }
@keyframes vaiven { from { transform: translateY(calc(var(--viaje, 70px) * -1)); } to { transform: translateY(var(--viaje, 70px)); } }
.comparte__progreso { display: none; }
.comparte.is-fija .comparte__progreso { display: flex; gap: 8px; margin-top: 20px; }
.comparte__progreso i { width: 28px; height: 4px; border-radius: 4px; background: rgba(20, 21, 60, .15); transition: background-color .3s; }
.comparte__progreso i.is-on { background: var(--azul); }
@media (prefers-reduced-motion: reduce) { .comparte.is-fija .etiqueta-dato.is-on { animation: none; } }

/* ¿Quién trabaja dónde? */
.quien__grilla { display: grid; gap: 28px; align-items: center; }
.quien__grilla > * { margin: 0 !important; }
.quien__lado { padding: clamp(22px, 3vw, 32px); border-radius: 28px; background: var(--niebla); }
.quien__lado > * + * { margin-top: 14px !important; }
.quien__lado h3 { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.625rem); max-width: none; }
.quien__lado--erp { background: var(--noche); color: var(--en-oscuro-suave); }
.quien__lado--erp h3 { color: var(--blanco); }
.quien__lado--erp p { color: var(--en-oscuro-suave); }
.quien__notebook { margin-top: 22px !important; }
.quien__medio { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.quien__medio > * { margin: 0 !important; }
.quien__sync { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 0 10px rgba(0, 255, 255, .16); }
.quien__sync svg { width: 30px; height: 30px; }
.quien__frase { font-size: clamp(1.25rem, 1.05rem + .8vw, 1.75rem); font-weight: 600; line-height: 1.2; color: var(--noche); max-width: 14ch !important; }
.quien__frase em { font-family: var(--wp--preset--font-family--secundaria, 'Libre Caslon Text', serif); font-style: italic; font-weight: 400; color: var(--azul); }
@media (min-width: 1024px) { .quien__grilla { grid-template-columns: 1fr 200px 1fr; } }
/* Ilustración genérica del ERP */
.erp-ilus { margin-top: 22px !important; border-radius: 14px; overflow: hidden; background: #F4F6FA; box-shadow: 0 24px 50px -24px rgba(0, 0, 0, .7); }
.erp-ilus__barra { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: #E3E8F0; }
.erp-ilus__barra i { width: 9px; height: 9px; border-radius: 50%; background: #B8C2D3; }
.erp-ilus__barra span { margin-left: 10px; font-size: .75rem; font-weight: 600; color: #56607A; }
.erp-ilus__cuerpo { display: grid; grid-template-columns: 22% 1fr; min-height: 220px; }
.erp-ilus__menu { display: grid; align-content: start; gap: 12px; padding: 16px 12px; background: #DDE3EE; }
.erp-ilus__menu i { height: 8px; border-radius: 4px; background: #B4BED0; }
.erp-ilus__menu i:first-child { background: #1B5FA1; }
.erp-ilus__tabla { display: grid; align-content: start; gap: 9px; padding: 14px; }
.erp-ilus__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 6px; }
.erp-ilus__kpis span { display: grid; gap: 6px; padding: 8px; border-radius: 8px; background: var(--blanco); }
.erp-ilus__kpis b { font-size: .6875rem; color: #56607A; font-weight: 600; }
.erp-ilus__kpis i { height: 10px; width: 70%; border-radius: 4px; background: #1B5FA1; }
.erp-ilus__fila { display: grid; grid-template-columns: 1fr 22% 18%; gap: 8px; padding: 7px 8px; border-radius: 6px; background: var(--blanco); }
.erp-ilus__fila i { height: 7px; border-radius: 4px; background: #C9D1DF; }
.erp-ilus__fila i:first-child { width: var(--w); }

/* CRM separado vs. CRM Go */
.comparativa { width: 100%; border-collapse: separate; border-spacing: 0 10px; }
.comparativa thead th { padding: 0 20px 6px; text-align: left; font-size: 1rem; color: var(--texto-suave); }
.comparativa thead th.comparativa__crmgo { color: var(--azul); }
.comparativa tbody th, .comparativa tbody td { padding: 20px; vertical-align: top; background: var(--niebla); text-align: left; }
.comparativa tbody th { width: 22%; border-radius: 18px 0 0 18px; font-size: 1.0625rem; color: var(--noche); }
.comparativa tbody td:last-child { border-radius: 0 18px 18px 0; background: #E3F1FB; color: var(--noche); }
.comparativa td { line-height: 1.5; }
.comparativa__icono { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-right: 12px; border-radius: 50%; font-size: .9375rem; font-weight: 700; vertical-align: -6px; }
.comparativa__icono--no { background: #FDE2E2; color: #B42318; }
.comparativa__icono--si { background: var(--cian); color: var(--noche); }
@media (max-width: 767px) {
	.comparativa, .comparativa tbody, .comparativa tr, .comparativa th, .comparativa td { display: block; width: auto !important; }
	.comparativa thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.comparativa tr { margin-bottom: 14px; border-radius: 18px; overflow: hidden; }
	.comparativa tbody th { border-radius: 0; padding-bottom: 6px; }
	.comparativa tbody td { border-radius: 0 !important; padding-top: 10px; }
	.comparativa tbody td::before { content: attr(data-col); display: block; margin-bottom: 6px; font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-suave); }
}
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* En el celular la captura del vendedor se mantiene (la regla general oculta las notebooks). */
@media (max-width: 767px) { .quien .quien__notebook { display: block !important; } }

/* Tarjeta flotante como fila de agenda (no notificación): título chico y una fila con hora y tarea. */
.vidrio--agenda { flex-direction: column; align-items: stretch; gap: 8px; padding: 12px 14px; }
.vidrio__agenda-titulo { display: flex; align-items: center; gap: 8px; font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cian-ui); }
.vidrio__agenda-titulo::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center / contain no-repeat; }
.vidrio__fila { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; background: rgba(255, 255, 255, .1); border-left: 3px solid var(--cian); }
.vidrio__fila b { color: var(--blanco); font-size: .875rem; font-variant-numeric: tabular-nums; }
.vidrio__fila span:last-child { color: var(--blanco); }
.vidrio__check { width: 14px; height: 14px; border-radius: 4px; border: 1.6px solid rgba(255, 255, 255, .6); }
.despues__lista a { color: var(--cian-ui); text-underline-offset: 3px; }
.despues__lista a:hover { color: var(--blanco); }

/* ===== Tareas: ¿Cómo es el día a día con la agenda? ===== */
.agenda-dia__grilla { display: grid; gap: 36px; }
.agenda-dia__grilla > * { margin: 0 !important; }
.agenda-dia__texto > * + * { margin-top: 18px !important; }
.agenda-dia__ejemplo { display: inline-block; padding: 8px 14px; border-radius: 10px; background: var(--niebla); font-size: .9375rem; }
.agenda-dia__pasos { display: grid; gap: 12px; }
.agenda-paso { padding: 16px 18px; border-radius: 16px; background: var(--niebla); }
.agenda-paso > * { margin: 0 !important; }
.agenda-paso__etiqueta { display: inline-block; padding: 4px 12px; border-radius: 999px; background: var(--noche); color: var(--blanco); font-size: .8125rem; font-weight: 700; }
.agenda-paso--2 .agenda-paso__etiqueta { background: var(--cian); color: var(--noche); }
.agenda-paso__texto { margin-top: 8px !important; color: var(--texto-suave); }
.agenda-dia__cierre { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.625rem); color: var(--azul); }
/* El tablero solo se ve en la versión fija; en pantallas menores (o con movimiento reducido) quedan los tres estados apilados. */
.agenda__tablero { display: none; }
.agenda-dia.is-fija { padding-block: 0; }
.agenda-dia.is-fija .agenda-dia__grilla { grid-template-columns: 5fr 7fr; align-items: center; gap: clamp(40px, 5vw, 80px); min-height: calc(100vh - var(--alto-menu, 64px)); padding-block: 28px; box-sizing: border-box; }
.agenda-dia.is-fija .agenda-paso { opacity: .45; transition: opacity .35s, background-color .35s; }
.agenda-dia.is-fija .agenda-paso.is-on { opacity: 1; background: #E3F1FB; }
.agenda-dia.is-fija .agenda-dia__cierre { opacity: .35; transition: opacity .4s; }
.agenda-dia.is-fija .agenda-dia__cierre.is-on { opacity: 1; }
.agenda-dia.is-fija .agenda__tablero { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.agenda__col { display: flex; flex-direction: column; gap: 12px; min-height: 300px; padding: 14px; border-radius: 20px; background: var(--niebla); box-shadow: 0 0 0 1px rgba(20, 21, 60, .06) inset; }
.agenda__col--0 { background: #E3F1FB; }
.agenda__col-titulo { font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.agenda__hueco { display: block; height: 96px; border-radius: 14px; border: 2px dashed rgba(27, 95, 161, .18); }
.agenda__tarjeta { position: absolute; left: 14px; top: 48px; width: calc((100% - 28px) / 3 - 28px); min-height: 96px; box-sizing: border-box; display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-content: start; padding: 14px; border-radius: 14px; background: var(--blanco); box-shadow: 0 18px 36px -18px rgba(20, 21, 60, .45), 0 0 0 1px rgba(27, 95, 161, .14); }
.agenda__check { width: 16px; height: 16px; margin-top: 2px; border-radius: 5px; border: 2px solid var(--azul); transition: background-color .3s; }
.agenda__tarea { font-weight: 600; font-size: .9375rem; line-height: 1.3; color: var(--noche); text-decoration: line-through; text-decoration-color: transparent; text-decoration-thickness: 2px; transition: text-decoration-color .4s, color .4s; }
.agenda__cuando { grid-column: 2; font-size: .8125rem; color: var(--texto-suave); }
.agenda__estado { position: absolute; right: -10px; top: -14px; padding: 5px 11px; border-radius: 999px; background: var(--noche); color: var(--blanco); font-size: .75rem; font-weight: 700; white-space: nowrap; box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .5); }
.agenda__estado--2 { background: var(--cian); color: var(--noche); }
.agenda__tarjeta.is-hecha .agenda__check { background: var(--cian); border-color: var(--cian); }
.agenda__tarjeta.is-hecha .agenda__tarea { text-decoration-color: var(--texto-suave); color: var(--texto-suave); }

/* ===== Mail automático al cliente: bandeja de entrada sin marcas ===== */
.mail-cliente__grilla { display: grid; gap: 32px; align-items: center; }
.mail-cliente__grilla > * { margin: 0 !important; }
.mail-cliente__texto > * + * { margin-top: 18px !important; }
@media (min-width: 960px) { .mail-cliente__grilla { grid-template-columns: 5fr 6fr; gap: clamp(40px, 5vw, 80px); } }
.bandeja { border-radius: 18px; overflow: hidden; background: var(--blanco); box-shadow: 0 30px 60px -30px rgba(20, 21, 60, .45), 0 0 0 1px rgba(20, 21, 60, .08); }
.bandeja__barra { display: flex; align-items: center; gap: 6px; padding: 12px 16px; background: var(--niebla); }
.bandeja__barra i { width: 9px; height: 9px; border-radius: 50%; background: #C8CEDB; }
.bandeja__barra span { margin-left: 10px; font-size: .8125rem; font-weight: 700; color: var(--noche); }
.bandeja__lista { list-style: none; margin: 0; padding: 0; }
.bandeja__mail { position: relative; display: grid; gap: 4px; padding: 16px 20px 16px 40px; border-top: 1px solid rgba(20, 21, 60, .07); }
.bandeja__mail--nuevo { background: #E9F6FD; }
.bandeja__punto { position: absolute; left: 18px; top: 22px; width: 10px; height: 10px; border-radius: 50%; background: var(--azul); }
.bandeja__de { font-size: .8125rem; font-weight: 700; color: var(--azul); }
.bandeja__asunto { font-size: 1.0625rem; color: var(--noche); }
.bandeja__detalle { font-size: .9375rem; color: var(--texto-suave); }
.bandeja__mail--viejo i { display: block; height: 8px; width: var(--w); border-radius: 4px; background: #E2E6EE; }
.bandeja__mail--viejo i + i { background: #EEF0F5; }
.bandeja__nota { margin-top: 16px !important; font-size: .9375rem; color: var(--texto-suave); }
.sec--noche .bandeja__nota { color: var(--en-oscuro-suave); }

/* ===== Aviso de cumpleaños (Cuentas y Contactos) ===== */
.ficha__hero-media { position: relative; }
.aviso-cumple { position: absolute; z-index: 3; right: -12px; bottom: 18%; display: flex; align-items: center; gap: 12px; width: min(290px, 80%); padding: 12px 16px 12px 12px; border-radius: 16px; background: rgba(255, 255, 255, .96); color: var(--texto-suave); font-size: .8125rem; line-height: 1.35; box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .65); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.aviso-cumple__ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #FFE9EF; }
.aviso-cumple__ico svg { width: 22px; height: 22px; fill: none; stroke: #D6336C; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.aviso-cumple__txt { display: flex; flex-direction: column; }
.aviso-cumple__txt strong { color: var(--noche); font-size: .9375rem; }
@media (max-width: 767px) { .aviso-cumple { position: relative; right: auto; bottom: auto; margin: 20px auto 0; width: min(320px, 100%); } }
/* Versión fija: todo el texto entra en la pantalla junto al tablero. */
.agenda-dia.is-fija .agenda-dia__texto > * + * { margin-top: 12px !important; }
.agenda-dia.is-fija .agenda-dia__texto h2 { font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.375rem); }
.agenda-dia.is-fija .agenda-paso { padding: 12px 16px; }
.agenda-dia.is-fija .agenda-paso__texto { margin-top: 6px !important; font-size: .9375rem; line-height: 1.45; }
.agenda-dia.is-fija .agenda-dia__pasos { gap: 8px; }

/* ===== Novedades (listado y categorías) ===== */
.pagina--novedades, .pagina--entrada { padding-top: calc(var(--alto-menu, 88px) + clamp(32px, 4vw, 56px)); }
.novedades-cabeza { max-width: 760px; margin-bottom: clamp(32px, 4vw, 56px); }
.novedades-cabeza > * + * { margin-top: 16px; }
.novedades-cabeza .is-style-etiqueta { background: var(--noche); color: var(--blanco) !important; }
.novedades-cabeza__titulo { font-size: clamp(2rem, 1.5rem + 2vw, 3.25rem); line-height: 1.08; }
.novedades-cabeza__bajada { font-size: var(--wp--preset--font-size--grande); font-weight: 300; color: var(--texto-suave); }
.pagina .migas a, .pagina .migas li { color: var(--texto-suave); }
.pagina .migas li[aria-current] { color: var(--noche); }
.novedades { display: grid; gap: 32px; }
.novedades > * { margin: 0 !important; }
@media (min-width: 1024px) { .novedades { grid-template-columns: 260px 1fr; gap: clamp(32px, 4vw, 64px); align-items: start; } .novedades__lateral { position: sticky; top: calc(var(--alto-menu, 64px) + 24px); } }
.lateral__bloque + .lateral__bloque { margin-top: 32px; }
.lateral__titulo { margin: 0 0 12px; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-suave); max-width: none; }
.lateral__cats { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.lateral__cats a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 12px; color: var(--noche); text-decoration: none; font-weight: 600; transition: background-color .2s; }
.lateral__cats a span { color: var(--texto-suave); font-weight: 400; }
.lateral__cats a:hover { background: var(--niebla); }
.lateral__cats a[aria-current] { background: var(--noche); color: var(--blanco); }
.lateral__cats a[aria-current] span { color: var(--en-oscuro-suave); }
.lateral__ultimas ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.lateral__ultimas a { display: block; color: var(--noche); text-decoration: none; font-weight: 600; font-size: .9375rem; line-height: 1.35; }
.lateral__ultimas a:hover { color: var(--azul); }
.lateral__ultimas span { display: block; margin-top: 2px; font-size: .8125rem; color: var(--texto-suave); }
@media (max-width: 1023px) {
	.lateral__cats { display: flex; flex-wrap: wrap; gap: 8px; }
	.lateral__cats a { padding: 8px 14px; background: var(--niebla); border-radius: 999px; }
	.lateral__ultimas { display: none; }
}
/* Tarjetas */
.novedades-grilla, .relacionadas__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .novedades-grilla, .relacionadas__lista { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1280px) { .novedades-grilla { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .relacionadas__lista { grid-template-columns: repeat(3, 1fr); } }
.novedades-grilla > li, .tarjeta-nov { display: flex; flex-direction: column; gap: 10px; padding: 12px 12px 20px; border-radius: 22px; background: var(--niebla); transition: box-shadow .3s, background-color .3s; }
.novedades-grilla > li > *, .tarjeta-nov > * { margin: 0 !important; }
.novedades-grilla > li > :not(.tarjeta-nov__img), .tarjeta-nov > :not(.tarjeta-nov__img) { padding-inline: 8px; }
.tarjeta-nov__img { display: block; overflow: hidden; border-radius: 14px; aspect-ratio: 16 / 9; }
.tarjeta-nov__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.novedades-grilla > li:hover, .tarjeta-nov:hover { background: var(--blanco); box-shadow: 0 24px 48px -26px rgba(20, 21, 60, .45), 0 0 0 1px rgba(27, 95, 161, .14); }
.novedades-grilla > li:hover .tarjeta-nov__img img, .tarjeta-nov:hover .tarjeta-nov__img img, .novedades-lista > li:hover .novedad__img img { transform: scale(1.06); }
.tarjeta-nov__fecha { font-size: .8125rem; font-weight: 600; color: var(--azul); }
.tarjeta-nov__titulo { font-size: 1.1875rem; line-height: 1.3; max-width: none; }
.tarjeta-nov__titulo a { color: var(--noche); text-decoration: none; }
.tarjeta-nov__titulo a:hover { color: var(--azul); }
.tarjeta-nov__extracto { font-size: .9375rem; line-height: 1.5; color: var(--texto-suave); }
.tarjeta-nov__extracto p { margin: 0; }
.tarjeta-nov__mas { align-self: flex-start; margin-top: auto !important; margin-left: 8px !important; padding: 9px 18px !important; border-radius: 999px; background: var(--azul); color: var(--blanco) !important; font-weight: 600; font-size: .875rem; text-decoration: none; transition: background-color .2s; }
.tarjeta-nov__mas:hover { background: var(--noche); }
.novedad__img { margin: -6px -6px 6px !important; overflow: hidden; border-radius: 14px; aspect-ratio: 16 / 9; }
.novedad__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.paginacion { margin-top: 32px !important; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.paginacion a, .paginacion .page-numbers { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: 999px; background: var(--niebla); color: var(--noche); text-decoration: none; font-weight: 600; }
.paginacion .current { background: var(--noche); color: var(--blanco); }
@media (prefers-reduced-motion: reduce) { .tarjeta-nov__img img, .novedad__img img { transition: none; } .novedades-grilla > li:hover .tarjeta-nov__img img, .tarjeta-nov:hover .tarjeta-nov__img img { transform: none; } }

/* ===== Entrada ===== */
.entrada > * + * { margin-top: 20px; }
.entrada__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: .9375rem; color: var(--texto-suave); }
.entrada__cat { padding: 5px 14px; border-radius: 999px; background: var(--noche); color: var(--blanco); font-size: .8125rem; font-weight: 700; text-decoration: none; }
.entrada__titulo { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); line-height: 1.1; max-width: none; }
.entrada__imagen img { border-radius: 22px; width: 100%; height: 100%; object-fit: cover; }
.entrada__contenido { font-size: 1.0625rem; line-height: 1.7; }
.entrada__contenido img { max-width: 100%; height: auto; border-radius: 14px; }
.entrada .videos-sec { padding-block: 32px 0; }
.entrada__modulos { margin-top: 40px !important; padding: 24px; border-radius: 22px; background: var(--niebla); }
.entrada__modulos h2 { margin: 0 0 14px; font-size: 1.25rem; }
.entrada__modulos ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chip-mod--claro { color: var(--noche); background: var(--blanco); box-shadow: 0 0 0 1px rgba(20, 21, 60, .08) inset; }
.chip-mod--claro:hover { background: var(--blanco); box-shadow: 0 0 0 1px var(--azul) inset; }
.chip-mod--claro::before { box-shadow: 0 0 0 1px rgba(20, 21, 60, .08) inset; }
.relacionadas { margin-top: clamp(56px, 7vw, 96px); }
.relacionadas h2 { margin: 0 0 20px; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); }
.pagina--entrada .volver { margin-top: 32px; }

/* Foto completa en círculo con arco degradado y puntos cian (hero de integración). */
.foto-circulo { position: relative; width: min(100%, 420px); aspect-ratio: 1; margin-inline: auto; }
.foto-circulo__marco { position: absolute; inset: 0; overflow: hidden; border-radius: 50%; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7); }
.foto-circulo__marco img { width: 100%; height: 100%; object-fit: cover; display: block; }
.foto-circulo__arco { position: absolute; inset: -7%; width: 114%; height: 114%; overflow: visible; pointer-events: none; }
.foto-circulo__puntos { position: absolute; left: -2%; bottom: 10%; display: flex; gap: 9px; }
.foto-circulo__puntos i { width: 11px; height: 11px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 10px rgba(0, 255, 255, .6); }
.hero--integracion .hero__persona { align-self: center; }
@media (max-width: 899px) { .hero--integracion .foto-circulo { width: min(72%, 320px); } }

/* ===== Formularios (Form Maker con el estilo del sitio) ===== */
.formulario-crmgo .fm-form-container { width: 100% !important; max-width: none !important; }
.formulario-crmgo .fm-form { margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; font-family: var(--wp--preset--font-family--texto, 'Noto Sans', sans-serif) !important; }
.formulario-crmgo .wdform_section { display: grid !important; grid-template-columns: 1fr; gap: 18px; padding: 0 !important; }
.formulario-crmgo .wdform_column, .formulario-crmgo .wdform_row { width: 100% !important; padding: 0 !important; margin: 0 !important; }
.formulario-crmgo .wdform-field { padding: 0 !important; margin: 0 !important; }
.formulario-crmgo .wdform-label-section { margin: 0 0 8px !important; }
.formulario-crmgo .wdform-label { font-size: 1rem !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--noche) !important; line-height: 1.3 !important; }
.formulario-crmgo .wdform-required { color: var(--azul) !important; margin-left: 4px; }
.formulario-crmgo input[type="text"], .formulario-crmgo input[type="email"], .formulario-crmgo input[type="tel"], .formulario-crmgo textarea {
	width: 100% !important; max-width: none !important; min-height: 54px; padding: 14px 18px !important; border: 1.5px solid #CBD2E1 !important; border-radius: 14px !important;
	background: var(--blanco) !important; color: var(--noche) !important; font-size: 1.0625rem !important; font-family: inherit !important; box-shadow: none !important; transition: border-color .2s, box-shadow .2s;
}
.formulario-crmgo .wdform-element-section { max-width: none !important; }
.formulario-crmgo textarea { min-height: 130px !important; resize: vertical; }
.formulario-crmgo input:focus, .formulario-crmgo textarea:focus { outline: none !important; border-color: var(--azul) !important; box-shadow: 0 0 0 4px rgba(27, 95, 161, .15) !important; }
.formulario-crmgo .iti { width: 100%; }
.formulario-crmgo .iti input[type="text"] { padding-left: 58px !important; }
.formulario-crmgo .checkbox-div label, .formulario-crmgo .fm-type_gdpr_compliance_checkbox label { display: flex !important; align-items: flex-start !important; gap: 10px; font-size: .9375rem !important; font-weight: 400 !important; color: var(--texto-suave) !important; line-height: 1.45 !important; cursor: pointer; }
.formulario-crmgo .fm-type_gdpr_compliance_checkbox input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--azul); flex: none; }
.formulario-crmgo .fm-type_gdpr_compliance_checkbox a { color: var(--azul) !important; font-weight: 600; }
/* Errores claros junto a cada campo */
.formulario-crmgo .fm-not-filled { margin: 8px 0 0 !important; padding: 0 !important; color: #B42318 !important; font-size: .875rem !important; font-weight: 600; background: none !important; border: 0 !important; }
.formulario-crmgo .fm-not-filled::before { content: "⚠ "; }
.formulario-crmgo .wdform_row:has(.fm-not-filled) input, .formulario-crmgo .wdform_row:has(.fm-not-filled) textarea { border-color: #D92D20 !important; }
/* Botón principal azul */
.formulario-crmgo .button-submit { min-height: 56px; padding: 0 30px !important; border: 0 !important; border-radius: 999px !important; background: var(--azul) !important; color: var(--blanco) !important; font-size: 1.0625rem !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important; cursor: pointer; transition: background-color .2s, transform .2s; }
.formulario-crmgo .button-submit:hover:not([disabled]) { background: var(--noche) !important; transform: translateY(-1px); }
.formulario-crmgo .button-submit[disabled] { opacity: .55; cursor: not-allowed; }
.formulario-crmgo .button-reset { display: none !important; }
.formulario-crmgo .fm-type_submit_reset .wdform-element-section { justify-content: flex-start !important; }
.formulario-crmgo .fm-message, .formulario-crmgo .fm-notice-success { padding: 18px 20px !important; border-radius: 16px !important; background: #E3F1FB !important; color: var(--noche) !important; border: 0 !important; }
@media (min-width: 720px) {
	.formulario-crmgo--contacto .wdform_section { grid-template-columns: 1fr 1fr; gap: 20px 18px; }
	.formulario-crmgo--contacto .wdform_column:nth-child(n+5) { grid-column: 1 / -1; }
	.formulario-crmgo--taller .wdform_section, .formulario-crmgo--evento .wdform_section { grid-template-columns: 1fr 1fr; }
	.formulario-crmgo--taller .wdform_column:last-child, .formulario-crmgo--evento .wdform_column:last-child { grid-column: 1 / -1; }
}
/* Participantes 2 a 4: se suman con un botón. */
.formulario-crmgo .wdform_column.es-oculto { display: none !important; }
.sumar-participante { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 1.5px dashed var(--azul); border-radius: 999px; background: none; color: var(--azul); font: 600 .9375rem/1 var(--wp--preset--font-family--texto, inherit); cursor: pointer; }
.sumar-participante:hover { background: #E3F1FB; }
.sumar-participante[hidden] { display: none; }
.participante-titulo { grid-column: 1 / -1; margin: 6px 0 -6px !important; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-suave); }

/* ===== Páginas: contacto, gracias e inscripción ===== */
.contacto, .recibido, .registracion { padding-top: calc(var(--alto-menu, 88px) + clamp(32px, 4vw, 56px)); }
.contacto__grilla, .registracion__grilla { display: grid; gap: clamp(32px, 5vw, 72px); align-items: start; }
.contacto__grilla > *, .registracion__grilla > * { margin: 0 !important; }
@media (min-width: 1024px) { .contacto__grilla { grid-template-columns: 7fr 5fr; } .registracion__grilla { grid-template-columns: 5fr 7fr; } .contacto__lateral, .registracion__cabeza { position: sticky; top: calc(var(--alto-menu, 64px) + 24px); } }
.contacto__principal > * + *, .registracion__cabeza > * + * { margin-top: 18px !important; }
.contacto__titulo, .registracion__titulo, .recibido__titulo { font-size: clamp(2.125rem, 1.6rem + 2vw, 3.25rem); line-height: 1.08; max-width: 18ch; }
.contacto__bajada { display: inline-block; padding: 12px 18px; border-radius: 14px; background: #E3F1FB; color: var(--noche) !important; font-size: 1.125rem !important; font-weight: 600; }
.contacto .formulario-crmgo { margin-top: 32px !important; padding: clamp(22px, 3vw, 36px); border-radius: 28px; background: var(--niebla); }
.registracion__formulario { padding: clamp(22px, 3vw, 36px); border-radius: 28px; background: var(--niebla); }
.registracion__bajada { color: var(--texto-suave); font-size: 1.0625rem; }
.contacto-datos { display: grid; gap: 20px; }
.contacto-datos__persona { width: min(100%, 340px); margin-inline: auto; }
.contacto-datos__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.contacto-datos__item { display: grid; gap: 2px; padding: 14px 18px; border-radius: 16px; background: var(--niebla); font-size: 1.0625rem; color: var(--noche); }
.contacto-datos__item span { font-size: .8125rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-suave); }
.contacto-datos__item a { color: var(--noche); font-weight: 600; text-decoration: none; }
.contacto-datos__item a:hover { color: var(--azul); }
.contacto-datos__wa { margin: 0; }
.boton--wa { display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; border-radius: 999px; background: #25D366; color: #08361A; font-weight: 700; text-decoration: none; }
.boton--wa:hover { background: #1EBE5A; color: #08361A; }
.contacto-datos__mapa { overflow: hidden; border-radius: 20px; aspect-ratio: 4 / 3; background: var(--niebla); }
.contacto-datos__mapa iframe { width: 100%; height: 100%; border: 0; display: block; }
.recibido__cabeza { max-width: 820px; text-align: center; margin-inline: auto; }
.recibido__cabeza > * + * { margin-top: 18px !important; }
.recibido__titulo { margin-inline: auto; max-width: 20ch; }
.recibido__bajada { color: var(--texto-suave); font-size: 1.125rem; }
.recibido__ok { display: inline-grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--cian); box-shadow: 0 0 0 12px rgba(0, 255, 255, .15); }
.recibido__ok svg { width: 36px; height: 36px; fill: none; stroke: var(--noche); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.recibido .evento-tarjeta { text-align: left; margin-top: 28px; }
.evento-bloque__titulo { margin: 0 0 14px; font-size: 1.25rem; max-width: none; }
.recibido .evento-bloque__titulo { margin-top: 36px; }

/* Tarjeta del taller o evento */
.evento-tarjeta { display: grid; overflow: hidden; border-radius: 24px; background: var(--blanco); box-shadow: 0 24px 50px -28px rgba(20, 21, 60, .45), 0 0 0 1px rgba(27, 95, 161, .12); }
.evento-tarjeta__img { aspect-ratio: 16 / 9; overflow: hidden; }
.evento-tarjeta__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.evento-tarjeta__cuerpo { display: grid; gap: 8px; padding: 18px 20px 22px; }
.evento-tarjeta__cuerpo > * { margin: 0 !important; }
.evento-tarjeta__tipo { font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }
.evento-tarjeta__titulo { font-size: 1.25rem; line-height: 1.25; max-width: none; color: var(--noche); }
.evento-tarjeta__fecha { font-weight: 600; color: var(--noche); }
.evento-tarjeta__desc { color: var(--texto-suave); font-size: .9375rem; line-height: 1.5; }
.evento-tarjeta__accion { margin-top: 6px !important; }
.evento-tarjeta .boton { background: var(--azul); color: var(--blanco); }
.evento-tarjeta .boton:hover { background: var(--noche); }
@media (min-width: 720px) { .evento-tarjeta--compacta { grid-template-columns: minmax(220px, 2fr) 3fr; } .evento-tarjeta--compacta .evento-tarjeta__img { aspect-ratio: auto; height: 100%; } }
.evento-tarjeta--grande .evento-tarjeta__titulo { font-size: 1.5rem; }
.novedades__lateral .evento-tarjeta { margin-bottom: 28px; grid-template-columns: 1fr; }
.novedades__lateral .evento-tarjeta__img { aspect-ratio: 16 / 9; }
.novedades-home > .wrap > .evento-tarjeta, .novedades-home .evento-bloque__titulo { margin-bottom: 18px; }

/* ===== Aviso del próximo taller o evento ===== */
.aviso-evento { position: fixed; z-index: 60; right: 24px; bottom: 96px; display: grid; grid-template-columns: 96px 1fr; gap: 14px; width: min(360px, calc(100vw - 48px)); padding: 12px 40px 12px 12px; border-radius: 20px; background: var(--blanco); box-shadow: 0 24px 60px -20px rgba(20, 21, 60, .55), 0 0 0 1px rgba(27, 95, 161, .14); opacity: 0; transform: translateY(16px); transition: opacity .4s var(--ease), transform .4s var(--ease); }
.aviso-evento[hidden] { display: none; }
.aviso-evento.is-visible { opacity: 1; transform: none; }
.aviso-evento__img { border-radius: 12px; overflow: hidden; aspect-ratio: 1; }
.aviso-evento__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aviso-evento__cuerpo { display: grid; gap: 3px; align-content: center; }
.aviso-evento__tipo { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }
.aviso-evento__titulo { font-size: .9375rem; line-height: 1.25; color: var(--noche); }
.aviso-evento__fecha { font-size: .8125rem; color: var(--texto-suave); }
.aviso-evento__boton { justify-self: start; margin-top: 6px; padding: 7px 16px; border-radius: 999px; background: var(--azul); color: var(--blanco); font-size: .8125rem; font-weight: 700; text-decoration: none; }
.aviso-evento__boton:hover { background: var(--noche); color: var(--blanco); }
.aviso-evento__cerrar { position: absolute; top: 6px; right: 6px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: var(--niebla); color: var(--noche); font-size: 1.25rem; line-height: 1; cursor: pointer; }
.aviso-evento__cerrar:hover { background: #E3E7F0; }
/* Celular y tablet: franja compacta abajo; el botón de WhatsApp sube para no quedar tapado. */
@media (max-width: 1080px) {
	.aviso-evento { left: 0; right: 0; bottom: 0; width: auto; grid-template-columns: 1fr; padding: 12px 52px 14px 16px; border-radius: 18px 18px 0 0; }
	.aviso-evento__img { display: none; }
	.aviso-evento__cuerpo { grid-template-columns: 1fr auto; column-gap: 12px; align-items: center; }
	.aviso-evento__tipo, .aviso-evento__titulo, .aviso-evento__fecha { grid-column: 1; }
	.aviso-evento__boton { grid-column: 2; grid-row: 1 / span 3; margin: 0; align-self: center; }
	.aviso-evento__cerrar { top: 50%; right: 8px; translate: 0 -50%; }
	body.con-aviso-evento .wa-flotante { bottom: calc(var(--alto-aviso, 96px) + 16px) !important; transition: bottom .3s; }
}
@media (prefers-reduced-motion: reduce) { .aviso-evento { transition: none; } }
/* Novedades: todas las tarjetas arrancan a la misma altura (sin el margen que WordPress suma entre bloques) y "Conocé más" queda siempre abajo. */
.novedades-grilla > li, .relacionadas__lista > li { margin: 0 !important; }
.novedades-grilla > li > .tarjeta-nov__mas, .tarjeta-nov > .tarjeta-nov__mas { margin-top: auto !important; margin-left: 8px !important; }
.novedades-grilla > li > .tarjeta-nov__extracto { flex: 0 0 auto; }
/* Aviso en escritorio: la imagen arriba, 16:9, con el recorte elegido en el panel. */
@media (min-width: 1081px) {
	.aviso-evento { grid-template-columns: 1fr; padding: 0 0 14px; overflow: hidden; }
	.aviso-evento__img { aspect-ratio: 16 / 9; border-radius: 0; position: relative; }
	.aviso-evento__cuerpo { padding: 0 16px; }
	.aviso-evento__img--izquierda img, .aviso-evento__img--derecha img { position: absolute; top: 0; height: 100%; width: 170%; max-width: none; object-fit: cover; }
	.aviso-evento__img--izquierda img { left: 0; object-position: left top; }
	.aviso-evento__img--derecha img { right: 0; object-position: right top; }
	.aviso-evento__cerrar { background: rgba(255, 255, 255, .92); }
}
.ficha-evento .evento-tarjeta { max-width: 920px; }

/* ===== Captura con zonas por función (inc/zonas.php) ===== */
.funciones__notebook .notebook__pantalla > .zonas { position: absolute; inset: 2.2%; overflow: hidden; border-radius: 10px; background: #D3E5F8; }
.zonas__capa { position: absolute; inset: 0; display: flex; align-items: flex-start; justify-content: flex-start; overflow: hidden; container-type: size; }
/* "Cover" desde arriba a la izquierda: la captura llena la pantalla aunque se corte a la derecha o abajo. */
.zonas__capa > .zonas__lienzo { width: max(100%, var(--ancho-max, 100%)); }
.zonas__capa:not([data-capa="principal"]), .zonas__tarjeta, .zonas__nota { opacity: 0; visibility: hidden; }
.zonas__tarjeta { position: absolute; z-index: 2; overflow: hidden; border-radius: 10px; background: #fff; box-shadow: 0 0 0 2px rgba(0, 255, 255, .6), 0 24px 50px -18px rgba(10, 12, 40, .7); }
.zonas__tarjeta .zonas__lienzo { display: block; }
.zonas__nota, .zona-recorte--nota { max-width: 340px; padding: 14px 18px 16px; border-radius: 18px 18px 18px 4px; background: #fff; color: var(--azul-noche, #14153C); box-shadow: 0 0 0 2px rgba(0, 255, 255, .6), 0 18px 40px -16px rgba(10, 12, 40, .55); font-size: 15px; line-height: 1.45; }
.zonas__nota { position: absolute; z-index: 3; right: 7%; bottom: 16%; width: 44%; }
.zonas__nota p, .zona-recorte--nota p { margin: 4px 0 0; }
.zonas__nota-quien { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #1B5FA1; }
.zonas__nota-quien::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #25D366; }
.zona-recorte--nota { margin: 14px 0 0 !important; }
.zonas__lienzo { position: relative; flex: none; width: 100%; transform-origin: 0 0; will-change: transform; --s: 1; }
.zonas__img { display: block; width: 100%; height: 100%; }
.zonas__foco, .zonas__marca { position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0; pointer-events: none; border-radius: calc(6px / var(--s)); }
.zonas__foco { border: calc(2px / var(--s)) solid var(--cian); box-shadow: 0 0 0 9999px rgba(20, 21, 60, .35); }
.zonas__foco::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 calc(22px / var(--s)) calc(5px / var(--s)) rgba(0, 255, 255, .75), inset 0 0 calc(16px / var(--s)) rgba(0, 255, 255, .35); opacity: var(--brillo, 0); }
.zonas__marca { border: calc(2px / var(--s)) dashed var(--cian); background: rgba(0, 255, 255, .08); }
/* Recorte estático de cada función: pantallas menores y movimiento reducido. */
.zona-recorte { position: relative; width: 100%; overflow: hidden; margin: 14px 0 0 !important; border-radius: 12px; background: #D3E5F8; box-shadow: 0 0 0 2px rgba(0, 255, 255, .55), 0 14px 30px -18px rgba(20, 21, 60, .5); }
.zona-recorte img { position: absolute; max-width: none; height: auto; }
.funciones--zonas.is-activa .zona-recorte { display: none; }
.zona-recorte.zona-recorte--nota { overflow: visible; background: #fff; aspect-ratio: auto; }
.zonas__nota--pendiente { border-radius: 14px; background: #F3F7FC; box-shadow: 0 0 0 2px rgba(27, 95, 161, .35); }
.zonas__nota--pendiente .zonas__nota-quien::before { background: #B4B0B2; }
.zonas__nota--pendiente.zonas__nota { left: 50%; right: auto; bottom: 8%; transform: translateX(-50%); width: auto; }
.zonas__nota--cumple.zonas__nota { left: 30%; right: auto; top: 14%; bottom: auto; width: auto; }
.zonas__nota--cumple .zonas__nota-quien::before { background: var(--cian); }
.zonas__nota--enviado.zonas__nota { left: 22%; right: auto; top: 40%; bottom: auto; width: auto; }
.zonas__nota--enviado .zonas__nota-quien::before { background: var(--cian); }
.zonas__nota--agenda.zonas__nota { left: 50%; right: auto; top: 12%; bottom: auto; width: min(380px, 60%); transform: translateX(-50%); }
.zonas__nota--agenda .zonas__nota-quien::before { background: var(--cian); }
.zonas__nota--info.zonas__nota { left: auto; right: 4%; top: 8%; bottom: auto; width: min(300px, 38%); }
.zonas__nota--info .zonas__nota-quien::before { background: var(--cian); }

/* Zonas: cada paso tiene su propio tramo de scroll (35 % de la pantalla) y el texto de la función queda fijo mientras dura. */
.funcion__texto > * + * { margin-top: 8px !important; }
@media (min-width: 1200px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
	.funciones--zonas.is-activa .funcion { justify-content: flex-start; padding-block: 0; }
	.funciones--zonas.is-activa .funcion::before { display: none; }
	.funciones--zonas.is-activa .funcion__texto { position: sticky; top: 40vh; padding-block: 36px; }
	.funciones--zonas.is-activa .funcion__texto::before { content: ""; position: absolute; left: -28px; top: 50%; width: 3px; height: 64px; translate: 0 -50%; border-radius: 3px; background: var(--borde); transition: background-color .4s; }
	.funciones--zonas.is-activa .funcion.is-on .funcion__texto::before { background: var(--cian-ui); }
	.funciones--zonas.is-activa .funcion.pasos-2 { min-height: 70vh; }
	.funciones--zonas.is-activa .funcion.pasos-3 { min-height: 105vh; }
	.funciones--zonas.is-activa .funcion.pasos-4 { min-height: 140vh; }
	.funciones--zonas.is-activa .funcion.pasos-5 { min-height: 175vh; }
	.funciones--zonas.is-activa .funcion.pasos-6 { min-height: 210vh; }
	.funciones--zonas.is-activa .funcion.pasos-7 { min-height: 245vh; }
	.funciones--zonas.is-activa .funcion.pasos-8 { min-height: 280vh; }
}
.aviso-evento.is-visible.is-corrido { opacity: 0; transform: translateY(16px); pointer-events: none; }

/* ===== Botón "Agendar demo" (inc/cta-demo.php) ===== */
.cta-demo { box-sizing: border-box; --cta-alto: 64px; --cta-ancho: 300px; --cta-perilla: 84px; --cta-pad: 7px; position: relative; display: inline-flex; align-items: center; flex: none; height: var(--cta-alto); width: var(--cta-ancho); max-width: 100%; padding: var(--cta-pad); border-radius: 999px; background: var(--noche); color: #fff; text-decoration: none; cursor: pointer; box-shadow: 0 10px 30px rgba(20, 21, 60, .25), inset 0 2px 0 rgba(255, 255, 255, .12); -webkit-tap-highlight-color: transparent; font-family: var(--wp--preset--font-family--titulos, inherit); }
.cta-demo:focus { outline: none; }
.cta-demo:focus-visible { outline: 3px solid var(--cian); outline-offset: 4px; }
.cta-demo__perilla { position: absolute; left: var(--cta-pad); top: var(--cta-pad); bottom: var(--cta-pad); width: var(--cta-perilla); border-radius: 999px; background: linear-gradient(90deg, #1B5FA1, #2E8FD8 75%, #00FFFF); display: flex; align-items: center; justify-content: center; transition: width .45s cubic-bezier(.16, 1, .3, 1); }
.cta-demo__ico { position: absolute; width: 26px; height: 26px; color: #fff; transition: opacity .25s, transform .45s cubic-bezier(.16, 1, .3, 1); }
.cta-demo__flecha { animation: cta-empuje 1.6s ease-in-out infinite; }
.cta-demo__cal { opacity: 0; transform: scale(.6); }
.cta-demo__texto { margin-left: auto; margin-right: 30px; font-size: 19px; font-weight: 700; letter-spacing: .2px; color: inherit; white-space: nowrap; transition: transform .45s cubic-bezier(.16, 1, .3, 1), opacity .25s; }
.cta-demo__tip { position: absolute; left: 50%; bottom: calc(100% + 14px); transform: translate(-50%, 8px); opacity: 0; pointer-events: none; background: #E6FFFF; color: var(--noche); font-size: 14px; font-weight: 600; padding: 8px 14px; border-radius: 999px; white-space: nowrap; box-shadow: 0 6px 18px rgba(20, 21, 60, .15); transition: opacity .3s, transform .45s cubic-bezier(.16, 1, .3, 1); }
.cta-demo__tip::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); border: 7px solid transparent; border-top-color: #E6FFFF; }
@keyframes cta-empuje { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
/* Mouse encima: solo con puntero que puede posarse (en celulares, tocar = clic). */
@media (hover: hover) and (pointer: fine) {
	.cta-demo:hover .cta-demo__perilla { width: calc(var(--cta-perilla) + 16px); }
	.cta-demo:hover .cta-demo__flecha { transform: translateX(4px); }
	.cta-demo:hover .cta-demo__texto { transform: translateX(6px); }
}
/* Clic */
.cta-demo.is-ok .cta-demo__perilla { width: calc(100% - 2 * var(--cta-pad)); transition: width .5s cubic-bezier(.65, 0, .35, 1); }
.cta-demo.is-ok .cta-demo__flecha { opacity: 0; animation: none; }
.cta-demo.is-ok .cta-demo__cal { opacity: 1; transform: scale(1); transition-delay: .25s; }
.cta-demo.is-ok .cta-demo__texto { opacity: 0; }
.cta-demo.is-ok .cta-demo__tip { opacity: 1; transform: translate(-50%, 0); transition-delay: .35s; }
/* Sobre fondos oscuros */
.cta-demo--claro { background: #fff; color: var(--noche); box-shadow: 0 10px 30px rgba(0, 0, 0, .28), inset 0 -2px 0 rgba(20, 21, 60, .08); }
/* Header fijo: 44 px y sin globito */
.cta-demo--chico { --cta-alto: 44px; --cta-ancho: 214px; --cta-perilla: 56px; --cta-pad: 5px; box-shadow: 0 6px 18px rgba(20, 21, 60, .22), inset 0 1px 0 rgba(255, 255, 255, .12); }
.cta-demo--chico .cta-demo__ico { width: 20px; height: 20px; }
.cta-demo--chico .cta-demo__texto { font-size: 15px; margin-right: 20px; }
.hdr .cta-demo--chico { margin-left: 8px; }
.wp-block-buttons > .cta-demo { margin: 0; }
@media (prefers-reduced-motion: reduce) {
	.cta-demo__perilla, .cta-demo__ico, .cta-demo__texto, .cta-demo__tip { transition: none !important; }
	.cta-demo__flecha { animation: none; }
}

/* Ventana con el formulario de contacto */
.cta-modal { width: min(640px, calc(100vw - 32px)); max-height: min(860px, calc(100dvh - 32px)); height: min(860px, calc(100dvh - 32px)); padding: 0; border: 0; border-radius: 24px; background: #fff; box-shadow: 0 40px 100px -30px rgba(10, 12, 40, .6); overflow: hidden; }
.cta-modal::backdrop { background: rgba(10, 12, 40, .55); backdrop-filter: blur(3px); }
.cta-modal__cerrar { position: absolute; z-index: 2; top: 12px; right: 12px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(20, 21, 60, .06); color: var(--noche); font-size: 26px; line-height: 1; cursor: pointer; }
.cta-modal__cerrar:focus-visible { outline: 3px solid var(--cian); outline-offset: 2px; }
.cta-modal__marco { display: block; width: 100%; height: 100%; border: 0; transition: opacity .25s ease; }
.cta-modal.is-enviado .cta-modal__marco { opacity: 0; pointer-events: none; }
.cta-modal-pagina { margin: 0; background: #fff; }
.cta-modal-pagina__in { padding: 40px clamp(20px, 5vw, 44px) 32px; }
.cta-modal-pagina .contacto__titulo { margin: 6px 0 8px; font-size: clamp(1.6rem, 4vw, 2.1rem); }

/* Mensaje de éxito con la animación */
.exito { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 32px 24px; text-align: center; opacity: 0; transition: opacity .3s ease .2s; }
.cta-modal.is-enviado .exito { opacity: 1; }
.exito__anim { width: 320px; aspect-ratio: 1; max-width: 80%; background: transparent; }
.exito__anim canvas, .exito__anim svg { width: 100% !important; height: 100% !important; display: block; }
.exito__anim:empty { display: none; }
.exito__titulo { margin: 4px 0 0; font-size: clamp(1.5rem, 3.6vw, 2rem); color: var(--noche); }
.exito__titulo:focus { outline: none; }
.exito__titulo:focus-visible { outline: 3px solid var(--cian); outline-offset: 4px; border-radius: 6px; }
.exito__texto { margin: 0 0 12px; max-width: 34ch; color: var(--texto-suave); }
@media (max-width: 767px) { .exito__anim { width: 240px; } }
.cta-modal-pagina .wa-flotante, .cta-modal-pagina .aviso-evento { display: none !important; }
.cta-modal-pagina .is-style-etiqueta { margin-left: calc(-1 * clamp(20px, 5vw, 44px)) !important; padding-left: clamp(20px, 5vw, 44px) !important; }
/* Grupo de botones con el botón "Agendar demo" (HTML propio, sin las clases de layout de WordPress) */
.wp-block-buttons:has(> .cta-demo) { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; }
.wp-block-buttons:has(> .cta-demo) > .wp-block-button { margin: 0; }
.exito[hidden] { display: none; }
.exito .wp-block-button.is-style-secundario { font-family: var(--wp--preset--font-family--titulos, inherit); font-style: normal; }
.exito .wp-block-button__link { font-family: inherit; font-style: normal; font-weight: 600; }

/* Ilustración del celular de Pedidos de Servicio: la firma se dibuja sola (no simula la interfaz del sistema) */
.firma-cel { position: absolute; inset: 0; padding: 22cqw 8cqw 10cqw; display: flex; flex-direction: column; align-items: center; gap: 6cqw; background: #F4F6FB; font-family: var(--wp--preset--font-family--cuerpo, "Noto Sans", sans-serif); color: #14153C; }
.firma-cel__titulo { margin: 0 !important; align-self: flex-start; font-size: 5.2cqw; font-weight: 600; letter-spacing: .02em; }
.firma-cel__recuadro { position: relative; width: 100%; aspect-ratio: 1 / .78; margin-top: 18cqw; border: 2px dashed #B4B0B2; border-radius: 5cqw; background: #fff; display: flex; align-items: center; justify-content: center; }
.firma-cel__firma { width: 86%; height: auto; }
.firma-cel__firma path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.firma-cel__leyenda { position: absolute; left: 0; right: 0; bottom: 4cqw; text-align: center; font-size: 4cqw; color: #8A8790; border-top: 1px solid #E2E1E6; margin: 0 8cqw; padding-top: 2cqw; }
.firma-cel__ok { display: flex; align-items: center; gap: 3cqw; font-size: 5cqw; opacity: 0; transform: scale(.7); }
.firma-cel__ok strong { color: #14153C; }
.firma-cel__tilde { width: 10cqw; height: 10cqw; border-radius: 50%; background: #1B5FA1; display: flex; align-items: center; justify-content: center; }
.firma-cel__tilde svg { width: 70%; height: 70%; }
.firma-cel.is-animando .firma-cel__firma path { animation: firma-traza 1.4s cubic-bezier(.65, 0, .35, 1) forwards; }
.firma-cel.is-animando .firma-cel__ok { animation: firma-ok .3s cubic-bezier(.16, 1, .3, 1) 1.4s forwards; }
@keyframes firma-traza { to { stroke-dashoffset: 0; } }
@keyframes firma-ok { to { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
	.firma-cel .firma-cel__firma path { stroke-dashoffset: 0; animation: none !important; }
	.firma-cel .firma-cel__ok { opacity: 1; transform: none; animation: none !important; }
}

/* Informe de Acopios (tarjeta HTML dentro de la notebook y como recorte en celular) */
.zonas__nota--html.zonas__nota { inset: 0; padding: 0 12% !important; background: #F4F6FB !important; max-width: none; width: auto; padding: 0; border-radius: 0; background: none; box-shadow: none; display: flex; align-items: center; justify-content: center; }
.zona-recorte--nota.zonas__nota--html { padding: 0; background: none; box-shadow: none; max-width: 460px; }
.informe { position: relative; width: 100%; max-width: 460px; box-sizing: border-box; padding: 22px 22px 18px; border: 1px solid #E3E7F0; border-radius: 16px; background: #fff; box-shadow: 0 18px 40px -22px rgba(20, 21, 60, .45); font-family: var(--wp--preset--font-family--cuerpo, "Noto Sans", sans-serif); color: #14153C; font-size: 13px; line-height: 1.45; text-align: left; }
.informe__etiqueta { position: absolute; top: 10px; right: 14px; font-size: 12px; color: #B4B0B2; }
.informe__cabeza { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #E3E7F0; }
.informe__cabeza b { font-weight: 600; color: #55577a; }
.informe__linea { display: flex; justify-content: space-between; gap: 12px; }
.informe__cuerpo .informe__linea + .informe__linea { margin-top: 3px; }
.informe__titulo { margin-top: 8px !important; font-weight: 600; }
.informe__item span:first-child { padding-left: 12px; }
.informe__monto { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; }
.informe__saldo { margin-top: 8px !important; padding-top: 8px; border-top: 1px solid #E3E7F0; color: #1B5FA1; font-weight: 700; }

/* Notas, hero: avisos de ejemplo flotando sobre los bordes de la notebook, sin salir del contenedor */
.avisos-notas { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.aviso-nota { position: absolute; display: flex; align-items: center; gap: 9px; max-width: 46%; padding: 9px 13px; border-radius: 14px; background: rgba(255, 255, 255, .97); color: var(--noche); font-size: .8125rem; font-weight: 600; line-height: 1.3; box-shadow: 0 18px 38px -18px rgba(0, 0, 0, .6); }
.aviso-nota__punto { flex: none; width: 9px; height: 9px; border-radius: 50%; }
.aviso-nota--stock { left: 0; top: 4%; } .aviso-nota--stock .aviso-nota__punto { background: #F2A900; }
.aviso-nota--cheque { right: 0; top: 38%; } .aviso-nota--cheque .aviso-nota__punto { background: #E5484D; }
.aviso-nota--cumple { left: 4%; bottom: 14%; } .aviso-nota--cumple .aviso-nota__punto { background: #D6336C; }
@media (max-width: 899px) {
	.avisos-notas { position: relative; display: grid; gap: 10px; margin-top: 18px; }
	.aviso-nota { position: relative; inset: auto; max-width: none; }
}
/* Botón "Agendar demo" claro: el texto siempre en azul marino, aunque el contenedor pinte los links de blanco (pie, cierres). */
a.cta-demo.cta-demo--claro, a.cta-demo.cta-demo--claro:hover, a.cta-demo.cta-demo--claro:visited { color: #14153C; }
a.cta-demo:not(.cta-demo--claro), a.cta-demo:not(.cta-demo--claro):hover { color: #fff; }
.cta-demo.is-ok .cta-demo__texto { color: inherit; }

/* ===== Redes sociales ===== */
.seguinos { background: #F4F6FB; padding: clamp(40px, 6vw, 72px) 0; }
.seguinos__in { width: min(1320px, 100% - 2 * var(--margen)); margin-inline: auto; }
.seguinos__titulo { margin: 0 0 24px; color: var(--noche); }
.seguinos__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.seguinos__red { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 22px; border-radius: 18px; background: #fff; box-shadow: 0 12px 30px -22px rgba(20, 21, 60, .45); }
.seguinos__ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #F4F6FB; }
.seguinos__ico svg { width: 26px; height: 26px; }
.seguinos__nombre { color: var(--noche); font-size: 1.0625rem; }
.seguinos__texto { color: var(--texto-suave); font-size: .9375rem; line-height: 1.45; flex: 1; }
.seguinos__boton { margin-top: 6px; display: inline-flex; align-items: center; padding: .6em 1.2em; border-radius: 999px; background: var(--noche); color: #fff !important; font-weight: 600; text-decoration: none; }
.seguinos__boton:hover { background: var(--azul); }
.seguinos__boton:focus-visible, .boton--yt:focus-visible, .boton--contorno:focus-visible { outline: 3px solid var(--cian); outline-offset: 3px; }
@media (max-width: 899px) { .seguinos__lista { grid-template-columns: repeat(2, 1fr); gap: 12px; } .seguinos__red { padding: 16px; } }
.boton--yt { display: inline-flex; align-items: center; gap: .5em; padding: .7em 1.3em; border-radius: 999px; background: #CC0000; color: #fff !important; font-weight: 600; text-decoration: none; }
.boton--yt::before { content: ""; width: 0; height: 0; border-left: 9px solid #fff; border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.boton--yt:hover { background: #A30000; }
.boton--contorno { display: inline-flex; align-items: center; padding: .7em 1.3em; border-radius: 999px; box-shadow: inset 0 0 0 2px var(--azul); color: var(--azul) !important; font-weight: 600; text-decoration: none; }
.boton--contorno:hover { background: var(--azul); color: #fff !important; }
.taller-modulo__lista { display: grid; gap: 20px; margin-top: 20px; }
.taller-modulo__tarjeta { display: grid; grid-template-columns: minmax(0, 420px) 1fr; gap: 24px; align-items: center; padding: 18px; border-radius: 20px; background: #F4F6FB; }
.taller-modulo__mini { position: relative; display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 9; }
.taller-modulo__mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.taller-modulo__play { position: absolute; left: 50%; top: 50%; width: 64px; height: 44px; translate: -50% -50%; border-radius: 12px; background: #CC0000; }
.taller-modulo__play::after { content: ""; position: absolute; left: 26px; top: 13px; border-left: 16px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.taller-modulo__titulo { margin: 0 0 14px; }
.taller-modulo__botones { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 767px) { .taller-modulo__tarjeta { grid-template-columns: 1fr; } }
.exito__canal { margin: 6px 0 0; color: var(--texto-suave); font-size: .9375rem; }
.exito .exito__yt { margin-top: 4px; }
.novedades-cabeza__fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; }
.novedades-cabeza__fila .boton--yt { flex: none; }
.boton.boton--contorno { background: transparent; box-shadow: inset 0 0 0 2px var(--azul); color: var(--azul) !important; }
.boton.boton--contorno:hover { background: var(--azul); color: #fff !important; }
.boton.boton--yt { background: #CC0000; }
.boton.boton--yt:hover { background: #A30000; }
.novedades-cabeza__fila { flex-wrap: nowrap; align-items: flex-end; }
.novedades-cabeza__fila .novedades-cabeza__titulo { margin: 0; max-width: 24ch; }
@media (max-width: 767px) { .novedades-cabeza__fila { flex-wrap: wrap; align-items: flex-start; } }
.novedades-cabeza { max-width: none !important; }
.novedades-cabeza__fila { justify-content: space-between; }
.novedades-cabeza__fila .novedades-cabeza__titulo { max-width: 26ch; }
.novedades-cabeza__bajada { max-width: 60ch; }

/* ==========================================================================
   Carrusel de logos (casos de éxito y home): dos filas opuestas, una en celular, grilla con reduced-motion
   ========================================================================== */
.logos { --logo-color: #8A8FA8; --logo-hover: var(--azul); position: relative; display: grid; gap: 18px; padding-block: 8px; }
.logos--oscuro { --logo-hover: var(--blanco); margin-top: clamp(48px, 6vw, 80px); }
.logos__fila { display: flex; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.logos__pista { list-style: none; margin: 0; padding: 0; display: flex; flex: none; gap: 16px; padding-right: 16px; }
.logos__item { flex: none; display: grid; place-items: center; width: 190px; height: 40px; }
.logos__item img { max-width: 160px; height: 40px; width: auto; object-fit: contain; }
.logo-texto { display: block; max-width: 180px; font-weight: 800; font-size: .875rem; line-height: 1.15; letter-spacing: .06em; text-transform: uppercase; text-align: center; color: var(--logo-color); transition: color .3s; }
.logos__item:hover .logo-texto { color: var(--logo-hover); }
.logos__grilla, .logos__unica { display: none; }
.logos__grilla { list-style: none; margin: 0 auto; padding: 0 var(--margen); max-width: var(--ancho); flex-wrap: wrap; justify-content: center; gap: 14px 16px; }
@media (prefers-reduced-motion: no-preference) {
	.logos__pista { animation: logos-izq 90s linear infinite; }
	.logos__fila--der .logos__pista { animation-name: logos-der; }
}
@keyframes logos-izq { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@keyframes logos-der { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@media (max-width: 767px) {
	.logos__doble { display: none; }
	.logos__unica { display: flex; }
	.logos__unica .logos__pista { animation-duration: 150s; }
	.logos__item { width: 150px; }
	.logo-texto { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
	.logos__fila { display: none !important; }
	.logos__grilla { display: flex; }
}
.logos__nota { margin-top: 18px !important; text-align: center; color: var(--en-oscuro-suave); font-size: .9375rem; }
.empresas { padding-block: clamp(56px, 7vw, 96px); }
.empresas .kit__cabeza { margin-bottom: clamp(24px, 3vw, 40px); text-align: center; }
.empresas__pie { margin-top: clamp(20px, 3vw, 32px); text-align: center; }
.link-flecha { color: var(--azul); font-weight: 700; text-decoration: none; }
.link-flecha:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ==========================================================================
   Casos de éxito
   ========================================================================== */
.hero--casos { padding-bottom: clamp(48px, 6vw, 80px); }
.hero--casos .hero__texto { text-align: center; }
.casos-datos { list-style: none; margin: clamp(24px, 3vw, 36px) auto 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px clamp(16px, 3vw, 40px); color: var(--en-oscuro-suave); font-size: 1.0625rem; }
.casos-datos li { display: flex; align-items: baseline; gap: 8px; }
.casos-datos strong { color: var(--blanco); font-size: clamp(1.5rem, 1rem + 1.6vw, 2.125rem); font-weight: 800; font-variant-numeric: tabular-nums; }
.casos-datos li + li::before { content: ""; align-self: center; width: 6px; height: 6px; border-radius: 50%; background: var(--cian); margin-right: clamp(8px, 2vw, 24px); box-shadow: 0 0 10px var(--cian); }
.hero--casos .hero__botones { justify-content: center; margin-top: clamp(24px, 3vw, 36px) !important; }

.casos__in { display: grid; gap: 20px; }
.filtro { display: flex; flex-wrap: wrap; gap: 10px; }
.filtro__chip { font: inherit; font-size: .9375rem; font-weight: 600; padding: 9px 18px; border-radius: 999px; border: 1px solid var(--borde); background: var(--blanco); color: var(--noche); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.filtro__chip:hover { border-color: var(--azul); }
.filtro__chip[aria-pressed="true"] { background: var(--noche); color: var(--blanco); border-color: var(--noche); }
.casos__estado { margin: 0; min-height: 1px; font-size: .875rem; color: var(--texto-suave); }
.casos__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.caso { display: flex; flex-direction: column; gap: 14px; padding: clamp(22px, 2.6vw, 32px); border-radius: var(--radio-card); background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); }
.caso[hidden] { display: none; }
.caso.is-entrando { animation: caso-entra .45s var(--ease) both; }
@keyframes caso-entra { from { opacity: 0; transform: translateY(16px); } }
.caso__cabeza { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.caso__logo { --logo-color: var(--noche); min-height: 40px; display: flex; align-items: center; }
.caso__logo .logo-texto { text-align: left; font-size: .9375rem; max-width: none; }
.caso__logo img { height: 40px; width: auto; }
.caso__meta { margin: 0; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.caso__titulo { margin: 0; font-size: clamp(1.25rem, 1rem + .7vw, 1.5rem); line-height: 1.25; }
.caso__ayuda { padding: 16px 18px; border-radius: 14px; background: var(--niebla); }
.caso__ayuda-titulo { margin: 0 0 8px; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }
.caso__ayuda ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.caso__ayuda li { position: relative; padding-left: 26px; font-weight: 600; line-height: 1.4; }
.caso__ayuda li::before { content: ""; position: absolute; left: 0; top: .2em; width: 16px; height: 16px; border-radius: 50%; background: var(--azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.caso__texto { margin: 0; color: var(--texto-suave); line-height: 1.55; }
.caso__modulos { list-style: none; margin: auto 0 0; padding: 12px 0 0; display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px solid var(--borde); }
.caso__mod { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px 4px 5px; border-radius: 8px; background: var(--niebla); color: var(--texto-suave); font-size: .75rem; font-weight: 600; text-decoration: none; transition: background-color .2s, color .2s; }
.caso__mod::before { content: ""; width: 16px; height: 16px; background: var(--ico) center / contain no-repeat; }
.caso__mod:hover, .caso__mod:focus-visible { background: #E3ECF8; color: var(--azul); }
.caso__ver { align-self: flex-start; font: inherit; font-weight: 700; color: var(--azul); background: none; border: 0; padding: 4px 0; cursor: pointer; }
.caso__ver::after { content: " →"; }
.caso__detalle h4 { margin: 16px 0 4px; font-size: 1rem; }
.caso__detalle p { margin: 0; color: var(--texto-suave); }
.caso__frase { margin: 16px 0 0; padding-left: 16px; border-left: 3px solid var(--cian); font-style: italic; }
.caso__detalle-empresa { display: none; }
/* Panel lateral (escritorio) */
.caso-panel { position: fixed; inset: 0 0 0 auto; margin: 0; width: min(520px, 100vw); height: 100dvh; max-height: none; padding: clamp(28px, 3vw, 40px); border: 0; background: var(--blanco); color: var(--noche); box-shadow: -30px 0 80px -30px rgba(20, 21, 60, .5); overflow: auto; }
.caso-panel::backdrop { background: rgba(20, 21, 60, .45); }
.caso-panel[open] { animation: panel-entra .35s var(--ease); }
@keyframes panel-entra { from { transform: translateX(40px); opacity: 0; } }
.caso-panel .caso__detalle-empresa { display: block; margin: 0 40px 0 0; font-size: 1.375rem; font-weight: 800; }
.caso-panel__cerrar { position: absolute; top: 18px; right: 18px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--borde); background: var(--blanco); font-size: 1.25rem; cursor: pointer; }
@media (max-width: 767px) {
	.casos__grilla { grid-template-columns: 1fr; }
	.filtro { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--margen) * -1); padding: 2px var(--margen) 6px; scrollbar-width: none; }
	.filtro__chip { flex: none; }
}
@media (prefers-reduced-motion: reduce) { .caso.is-entrando, .caso-panel[open] { animation: none; } }
.empresas .kit__cabeza > *, .empresas__pie > * { margin-inline: auto !important; text-align: center; }

/* ==========================================================================
   CRM Go Web
   ========================================================================== */
.mega__web { display: flex; align-items: center; gap: 4px 14px; flex-wrap: wrap; margin: 0 0 20px; padding: 12px 16px 12px 60px; position: relative; border-radius: 16px; background: linear-gradient(120deg, rgba(27, 95, 161, .1), rgba(0, 255, 255, .12)); color: var(--noche); text-decoration: none; }
.mega__web::before { content: ""; position: absolute; left: 14px; top: 50%; translate: 0 -50%; width: 34px; height: 34px; background: var(--ico) center / contain no-repeat; }
.mega__web strong { font-size: 1rem; }
.mega__web span { font-size: .875rem; color: var(--texto-suave); }
.mega__web:hover { background: var(--noche); color: var(--blanco); }
.mega__web:hover span { color: var(--en-oscuro-suave); }
@media (max-width: 1023px) { .mega__web { margin: 4px 6px 12px; } }

.web__dispositivos { position: relative; padding-right: clamp(40px, 7vw, 110px); padding-bottom: 40px; }
.web__telefono { position: absolute !important; right: 0; bottom: 0; width: clamp(120px, 11vw, 170px); z-index: 2; }
.web__telefono .telefono__captura img { width: 100%; height: auto; display: block; }
@media (prefers-reduced-motion: no-preference) {
	.web__notebook { animation: web-entra .8s var(--ease) .15s both; }
	.web__telefono { animation: web-entra .8s var(--ease) .65s backwards; }
}
@keyframes web-entra { from { opacity: 0; transform: translateY(28px); } }
@media (max-width: 767px) {
	.web__dispositivos { padding: 0; }
	.web__telefono { position: relative !important; width: clamp(200px, 56vw, 260px); }
}
.web-sec--niebla { background: var(--niebla); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.web-tarjetas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1023px) { .web-tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .web-tarjetas { grid-template-columns: 1fr; } }
.web-tarjeta { padding: 26px; border-radius: var(--radio-card); background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); }
.web-tarjeta__ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(27, 95, 161, .08); color: var(--azul); margin-bottom: 16px; }
.web-tarjeta__ico .ico-linea { width: 28px; height: 28px; }
.web-tarjeta__titulo { margin: 0 0 6px; font-size: 1.125rem; }
.web-tarjeta p { margin: 0; color: var(--texto-suave); line-height: 1.5; }
.web-carrito { display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: clamp(24px, 4vw, 56px); padding: clamp(28px, 4vw, 56px); border-radius: var(--radio-sec); background: var(--noche); color: var(--blanco); overflow: hidden; }
.web-carrito h2 { color: var(--blanco); margin: 6px 0 12px; }
.web-carrito p { color: var(--en-oscuro-suave); }
.web-carrito .is-style-etiqueta { color: var(--cian-ui); }
.web-carrito .boton { background: var(--blanco); color: var(--noche); }
.web-carrito__img img { width: 100%; height: auto; border-radius: 14px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .8); display: block; }
@media (max-width: 899px) { .web-carrito { grid-template-columns: 1fr; } }

/* Talleres: resumen, capítulos plegados y grilla de Novedades */
.taller-modulo__cat { margin: 0 0 6px; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }
.taller-modulo__resumen { margin: -6px 0 14px; color: var(--texto-suave); line-height: 1.55; }
.taller-caps { margin: 0 0 16px; }
.taller-caps summary { cursor: pointer; font-weight: 700; color: var(--azul); list-style: none; display: inline-flex; align-items: center; gap: 6px; }
.taller-caps summary::-webkit-details-marker { display: none; }
.taller-caps summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; rotate: 45deg; translate: 0 -2px; transition: rotate .2s; }
.taller-caps[open] summary::after { rotate: 225deg; translate: 0 2px; }
.taller-caps ol { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 2px; }
.taller-caps a { display: flex; gap: 12px; padding: 6px 8px; border-radius: 8px; color: var(--noche); text-decoration: none; font-size: .9375rem; }
.taller-caps a:hover { background: var(--blanco); color: var(--azul); }
.taller-caps__min { flex: none; min-width: 3.2em; font-variant-numeric: tabular-nums; font-weight: 700; color: var(--azul); }
.talleres-grilla { margin: clamp(24px, 3vw, 40px) 0 clamp(32px, 4vw, 56px); }
.talleres-grilla__titulo { margin: 0; }
.talleres-grilla .taller-modulo__tarjeta { grid-template-columns: minmax(0, 360px) 1fr; }
@media (max-width: 767px) { .talleres-grilla .taller-modulo__tarjeta { grid-template-columns: 1fr; } }
.talleres-grilla { max-width: none !important; }
.taller-modulo__tarjeta { align-items: start; }

/* ==========================================================================
   Íconos de redes animados (pie, franja "Seguí a CRM Go", tarjetas de taller y mensaje de éxito)
   Entrada escalonada una sola vez, relleno con el color de cada red, gesto propio y latido de YouTube cada 6 s.
   ========================================================================== */
.red-anim--linkedin { --c: #0A66C2; }
.red-anim--instagram { --c: linear-gradient(45deg, #F58529, #DD2A7B 50%, #8134AF); }
.red-anim--youtube { --c: #FF0000; }
.red-anim--facebook { --c: #1877F2; }
.red-ico { position: relative; overflow: hidden; isolation: isolate; border-radius: 50%; transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s, color .25s; }
.red-ico::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--c); transform: translateY(101%); transition: transform .35s cubic-bezier(.16, 1, .3, 1); }
.red-ico svg { position: relative; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
/* Pie: círculos de 40 px */
.pie__redes .red-ico { color: #fff; }
:is(.pie__redes .red-ico, .red-card):is(:hover, :focus-visible, .is-tocado) { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0, 0, 0, .35); }
.red-ico:is(:hover, :focus-visible, .is-tocado)::before, a:is(:hover, :focus-visible, .is-tocado) > .red-ico::before, .red-card:is(:hover, :focus-within, .is-tocado) .red-ico::before { transform: none; }
.pie__redes .red-ico:is(:hover, :focus-visible, .is-tocado) { color: #fff; }
/* Gesto de cada red */
:is(.red-ico.red-anim--linkedin:hover, .red-card.red-anim--linkedin:hover .red-ico) svg { transform: rotate(-10deg) scale(1.1); }
:is(.red-ico.red-anim--instagram:hover, .red-card.red-anim--instagram:hover .red-ico) svg { transform: rotate(90deg); }
:is(.red-ico.red-anim--youtube:hover, a:hover > .red-ico.red-anim--youtube, .red-card.red-anim--youtube:hover .red-ico) svg { animation: red-play .7s ease-in-out; }
:is(.red-ico.red-anim--facebook:hover, .red-card.red-anim--facebook:hover .red-ico) svg { animation: red-sube .5s cubic-bezier(.16, 1, .3, 1); }
@keyframes red-play { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.25); } 70% { transform: scale(.95); } }
@keyframes red-sube { 0% { transform: translateY(0); } 45% { transform: translateY(-120%); } 46% { transform: translateY(120%); } 100% { transform: translateY(0); } }
/* Franja: ícono de 72 px y el color cubre toda la tarjeta */
.red-card { position: relative; overflow: hidden; isolation: isolate; transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s; }
.red-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--c); transform: translateY(101%); transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
.red-card:is(:hover, :focus-within, .is-tocado)::before { transform: none; }
.red-card :is(.seguinos__nombre, .seguinos__texto) { transition: color .25s; }
.red-card:is(:hover, :focus-within, .is-tocado) :is(.seguinos__nombre, .seguinos__texto) { color: #fff; }
.red-card:is(:hover, :focus-within, .is-tocado) .seguinos__boton { background: #fff; color: var(--noche) !important; }
.seguinos__ico.red-ico { width: 72px; height: 72px; border-radius: 50%; background: #F4F6FB; }
.seguinos__ico.red-ico svg { width: 34px; height: 34px; }
.red-card:is(:hover, :focus-within, .is-tocado) .seguinos__ico.red-ico { color: #fff !important; background: rgba(255, 255, 255, .18); }
.red-card .red-ico::before { display: none; }
/* Botones de YouTube con ícono */
.boton--yt:has(.red-ico)::before { display: none; }
.boton--yt .red-ico { display: grid; place-items: center; width: 26px; height: 26px; margin-left: -.45em; color: #fff; background: rgba(255, 255, 255, .18); --c: #fff; }
.boton--yt .red-ico svg { width: 15px; height: 15px; }
.boton--yt:is(:hover, :focus-visible) .red-ico { color: #FF0000; }
.exito__redes { margin: 10px 0 4px; }
/* Latido de YouTube cada 6 s */
@keyframes red-late { 0%, 90%, 100% { box-shadow: 0 0 0 0 rgba(255, 0, 0, 0); } 95% { box-shadow: 0 0 0 8px rgba(255, 0, 0, .25); } }
@keyframes red-entra { from { opacity: 0; transform: translateY(16px) scale(.8); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
	.redes-js .red-grupo :is(.red-ico, .red-card) { opacity: 0; }
	.redes-js .red-grupo.is-visible :is(.red-ico, .red-card) { animation: red-entra .6s cubic-bezier(.16, 1, .3, 1) calc(var(--i, 0) * .1s + .05s) forwards; }
	.redes-js .red-grupo.is-visible .red-anim--youtube:is(.red-ico, .red-card) { animation: red-entra .6s cubic-bezier(.16, 1, .3, 1) calc(var(--i, 0) * .1s + .05s) forwards, red-late 6s ease-in-out 2s infinite; }
	.redes-js .red-grupo.is-visible .red-card .red-ico, .redes-js .red-grupo.is-visible .boton--yt .red-ico { animation: none; opacity: 1; }
	.redes-js .red-grupo.is-visible .boton--yt .red-ico.red-anim--youtube { animation: red-late 6s ease-in-out 2s infinite; }
}
@media (prefers-reduced-motion: reduce) {
	.red-ico, .red-ico::before, .red-ico svg, .red-card, .red-card::before { transition: none !important; animation: none !important; }
	.red-ico:hover svg, .red-card:hover svg { transform: none !important; }
}
@media (prefers-reduced-motion: no-preference) {
	/* Terminada la entrada se libera la animación para que el gesto del mouse funcione. */
	.redes-js .red-grupo.is-visible :is(.red-ico, .red-card).red-entro { opacity: 1; animation: none; }
	.redes-js .red-grupo.is-visible .red-anim--youtube:is(.red-ico, .red-card).red-entro { animation: red-late 6s ease-in-out 1s infinite; }
}

/* ==========================================================================
   Calculadora de ventas perdidas
   ========================================================================== */
.calc { display: grid; grid-template-columns: 1.1fr .9fr; border-radius: var(--radio-sec); overflow: hidden; background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); }
.calc__entrada { padding: clamp(24px, 3.4vw, 48px); }
.calc__titulo { margin: 6px 0 8px; font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.5rem); line-height: 1.15; }
.calc__sub { margin: 0 0 28px; color: var(--texto-suave); line-height: 1.5; }
.calc__campo { margin-bottom: 22px; }
.calc__campo label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-weight: 600; margin-bottom: 8px; color: var(--noche); }
.calc__campo output { font-size: 1.125rem; font-weight: 800; color: var(--azul); white-space: nowrap; font-variant-numeric: tabular-nums; }
.calc__campo input[type=range] { width: 100%; height: 32px; accent-color: var(--azul); cursor: pointer; }
.calc__ayuda { margin: 2px 0 0; font-size: .8125rem; color: var(--texto-suave); }
.calc__salida { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: clamp(24px, 3.4vw, 48px); background: var(--noche); color: var(--blanco); }
.calc__salida::after { content: ""; position: absolute; right: -80px; top: -80px; width: 240px; height: 240px; border-radius: 50%; border: 28px solid rgba(0, 255, 255, .07); pointer-events: none; }
.calc__lbl { margin: 0; color: var(--en-oscuro-suave); }
.calc__grande { margin: 6px 0 4px; font-size: clamp(2.25rem, 1.5rem + 2.6vw, 3.25rem); font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; color: var(--blanco); }
.calc__anual { margin: 0 0 20px; color: var(--en-oscuro-suave); }
.calc__anual b { color: var(--cian-ui); }
.calc__detalle { margin: 0 0 24px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .15); color: var(--en-oscuro-suave); line-height: 1.6; font-size: .9375rem; }
.calc__detalle b { color: var(--blanco); }
.calc__nota { margin: 16px 0 0; font-size: .75rem; color: rgba(255, 255, 255, .62); line-height: 1.4; }
@media (max-width: 899px) { .calc { grid-template-columns: 1fr; } }

/* ==========================================================================
   Dos puertas (home y /contacto/)
   ========================================================================== */
.dos-puertas { background: var(--noche); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.dos-puertas__grilla { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 2.4vw, 28px); }
.puerta { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-height: 320px; padding: clamp(28px, 3.6vw, 48px); border-radius: var(--radio-card); color: var(--blanco); }
.puerta--demo { background: linear-gradient(135deg, #1B5FA1 0%, #1E7FC8 55%, #18B5D8 100%); }
.puerta--cliente { background: linear-gradient(135deg, #1C1E52 0%, #101236 100%); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset; }
.puerta__num { position: absolute; z-index: -1; right: -6px; bottom: -40px; font-size: clamp(8rem, 6rem + 8vw, 13rem); font-weight: 800; line-height: 1; color: rgba(255, 255, 255, .1); letter-spacing: -.04em; }
.puerta__ico { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: rgba(255, 255, 255, .14); color: var(--blanco); }
.puerta__ico .ico-linea { width: 30px; height: 30px; }
.puerta__titulo { margin: 8px 0 0; color: var(--blanco); font-size: clamp(1.625rem, 1.2rem + 1.2vw, 2.25rem); line-height: 1.15; }
.puerta__texto { margin: 0; max-width: 40ch; color: rgba(255, 255, 255, .86); font-size: 1.0625rem; line-height: 1.5; }
.puerta__link { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px; background: var(--blanco); color: var(--noche) !important; font-weight: 700; text-decoration: none; transition: transform .2s var(--ease), box-shadow .2s; }
.puerta__link:hover { transform: translateY(-2px); box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .6); }
.puerta__link:focus-visible { outline: 3px solid var(--cian); outline-offset: 3px; }
.puerta__extra { margin: 4px 0 0; font-size: .9375rem; color: rgba(255, 255, 255, .7); }
.puerta__extra a { display: inline-block; padding: 10px 0; color: var(--cian-ui); text-decoration: none; }
.puerta__extra a:hover { text-decoration: underline; }
@media (max-width: 767px) { .dos-puertas__grilla { grid-template-columns: 1fr; } .puerta { min-height: 0; } }
.contacto-cab { padding-bottom: 0; }
.contacto-cab .kit__cabeza { margin-bottom: clamp(20px, 3vw, 32px); }
.formulario-crmgo select { width: 100% !important; max-width: none !important; min-height: 54px; padding: 14px 44px 14px 18px !important; border: 1.5px solid #CBD2E1 !important; border-radius: 14px !important; background: var(--blanco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2314153C' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") right 18px center / 12px no-repeat !important; color: var(--noche) !important; font-size: 1.0625rem !important; font-family: inherit !important; -webkit-appearance: none; appearance: none; }
.formulario-crmgo select:focus { outline: none !important; border-color: var(--azul) !important; box-shadow: 0 0 0 4px rgba(27, 95, 161, .15) !important; }
.puerta__titulo { max-width: none !important; }

/* Páginas de rubro: captura real de cada módulo destacado */
.destacado__captura { margin: 0; aspect-ratio: 16 / 10; border-radius: var(--radio-card); overflow: hidden; background: var(--niebla); box-shadow: var(--sombra), 0 0 0 1px var(--borde); }
.destacado__captura img { width: 100%; height: 100%; object-fit: cover; object-position: left top; display: block; }

/* 404 */
.pagina-404 .hero__texto { text-align: center; }
.buscador-404 { display: flex; gap: 10px; max-width: 560px; margin: 28px auto 0; }
.buscador-404 input { flex: 1; min-height: 52px; padding: 0 18px; border-radius: 999px; border: 0; font: inherit; font-size: 1rem; }
.buscador-404 button { min-height: 52px; padding: 0 24px; border-radius: 999px; border: 2px solid var(--cian-ui); background: transparent; color: var(--blanco); font: inherit; font-weight: 700; cursor: pointer; }
.pagina-404 .hero__botones { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; margin-top: 28px; }
.boton-contorno-claro { display: inline-flex; align-items: center; min-height: 48px; padding: 0 24px; border-radius: 999px; border: 2px solid rgba(255, 255, 255, .7); color: var(--blanco); font-weight: 700; text-decoration: none; }
.boton-contorno-claro:hover { background: rgba(255, 255, 255, .1); }
.pagina-404__lista { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.pagina-404__lista .chip-mod { min-height: 52px; background: var(--niebla); color: var(--noche); }
.pagina-404__mas { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 24px; }
.pagina-404__mas a { display: inline-block; padding: 10px 0; }
@media (max-width: 767px) { .buscador-404 { flex-direction: column; } }

/* Contraste AA y tamaños de toque (auditoría UX) */
.logos--claro { --logo-color: #6B7090; }
.antes__lista li.is-tachado { color: #4A4D6E; }
@media (max-width: 1080px) {
	.seguinos__boton, .taller-caps summary, .caso__mod, .puerta__extra a, .pie__redes a, .migas a { min-height: 44px; display: inline-flex; align-items: center; }
	.pie__redes a { width: 44px; height: 44px; }
	.caso__mod { min-height: 36px; }
	.caso__modulos { gap: 8px; }
	.pie a:not(.cta-demo):not(.red-ico) { display: inline-block; padding-block: 6px; }
	.saltar, .skip-link { padding: 14px 18px !important; }
}
/* Formularios: error con borde rojo y texto, sin la franja de fondo. */
.formulario-crmgo .wdform_row.form-error, .formulario-crmgo .form-error .wdform-field, .formulario-crmgo .wdform-field.form-error, .formulario-crmgo [class*="error"] .wdform-element-section { background: transparent !important; }
.formulario-crmgo .form-error input, .formulario-crmgo .form-error textarea, .formulario-crmgo .form-error select { border-color: #C62828 !important; }
.formulario-crmgo .fm-not-filled, .formulario-crmgo .wd-error-label, .formulario-crmgo .error_label { color: #B00020 !important; background: none !important; font-size: .875rem !important; }
.formulario-crmgo .wdform_row:has(.fm-not-filled) { background: transparent !important; }
.formulario-crmgo .wdform_row:has(.fm-not-filled) :is(input:not([type=checkbox]), textarea, select) { border-color: #C62828 !important; }
/* Tablet: los recortes de las funciones no se estiran más que su tamaño legible. */
@media (min-width: 600px) and (max-width: 1199px) { .zona-recorte:not(.zona-recorte--nota) { max-width: 520px; } }
.migas--centro ol { justify-content: center; }
.hero--pagina .migas { margin-bottom: 18px; }
.conecta__links { margin-top: 18px !important; line-height: 2; }
.conecta__links a { color: var(--cian-ui); font-weight: 600; text-decoration: none; display: inline-block; padding-block: 4px; }
.conecta__links a:hover { text-decoration: underline; }
.migas--claro { margin-bottom: 14px; }
.migas--claro ol { color: var(--texto-suave); }
.migas--claro a { color: var(--azul); }
.migas--claro li + li::before { color: var(--texto-suave); }
.fm-limite { margin: 0 0 16px; padding: 12px 16px; border-radius: 12px; background: #FDECEC; color: #8A1C1C; font-weight: 600; }

/* ==========================================================================
   Consistencia de botones: animado = demo; contorno = secundario; link con flecha = terciario
   ========================================================================== */
.tarjeta-nov__mas { background: transparent !important; color: var(--azul) !important; box-shadow: inset 0 0 0 2px var(--azul); }
.tarjeta-nov__mas:hover { background: var(--azul) !important; color: var(--blanco) !important; }
.web-carrito .boton-contorno-claro { margin-top: 8px; }
.puerta__pie { margin-top: auto; padding-top: 12px; display: grid; gap: 14px; justify-items: start; }
.puerta__pie .puerta__extra { margin: 0; min-height: 44px; display: flex; flex-wrap: wrap; align-items: center; }
.puerta .puerta__link { margin-top: auto; background: transparent; color: var(--blanco) !important; }
.puerta .puerta__link:hover { background: var(--blanco); color: var(--noche) !important; transform: none; box-shadow: none; }
.boton-contorno-claro { transition: background-color .2s, color .2s; }
.boton-contorno-claro:hover { color: var(--noche) !important; background: var(--blanco); }
/* Espaciado entre secciones: el mismo en todo el sitio */
.empresas { padding-block: var(--sec-pad); }

/* ==========================================================================
   Inteligencia artificial (/crm-con-inteligencia-artificial/)
   ========================================================================== */

.mega__destacados { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 0 20px; }
.mega__destacados .mega__web { margin: 0; }
.mega__nuevo { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 99px; background: var(--noche); color: var(--cian-ui); font-style: normal; font-size: .6875rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; vertical-align: 2px; }
.mega__ia:hover .mega__nuevo { background: var(--cian-ui); color: var(--noche); }
@media (max-width: 1023px) { .mega__destacados { grid-template-columns: 1fr; gap: 0; } .mega__destacados .mega__web { margin: 4px 6px 8px; } }

/* Chat del hero: alto fijo para que la animación no mueva nada. */
.ia__media { width: 100%; }
.chat-ia { width: 100%; max-width: 520px; height: 560px; display: flex; flex-direction: column; border-radius: 22px; background: var(--blanco); color: var(--noche); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .65), 0 0 0 1px rgba(255, 255, 255, .08); overflow: hidden; text-align: left; }
.chat-ia__barra-sup { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--borde); font-size: .9375rem; }
.chat-ia__logo { width: 28px; height: 28px; border-radius: 8px; background: var(--niebla) url(../icons/ia.svg) center / 20px no-repeat; }
.chat-ia__estado { margin-left: auto; font-size: .75rem; font-weight: 700; color: var(--azul); background: rgba(27, 95, 161, .08); padding: 3px 10px; border-radius: 99px; }
.chat-ia__cuerpo { flex: 1; padding: 18px; display: flex; flex-direction: column; gap: 14px; overflow: hidden; background: linear-gradient(180deg, #FAFBFD, var(--blanco)); }
.chat-ia__pregunta { align-self: flex-end; max-width: 88%; margin: 0; padding: 10px 14px; border-radius: 16px 16px 4px 16px; background: var(--azul); color: var(--blanco); font-size: .9375rem; line-height: 1.4; }
.chat-ia__tipeo.escribiendo::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 2px; vertical-align: -2px; background: currentColor; animation: chat-ia-cursor .8s steps(1) infinite; }
@keyframes chat-ia-cursor { 50% { opacity: 0; } }
.chat-ia__respuesta { max-width: 100%; }
.chat-ia__texto { margin: 0 0 10px; font-size: .875rem; color: var(--texto-suave); }
.chat-ia__vistas { display: grid; }
.chat-ia__tabla, .chat-ia__grafico { grid-area: 1 / 1; }
.chat-ia__tabla { width: 100%; border-collapse: collapse; font-size: .8125rem; background: var(--blanco); border: 1px solid var(--borde); border-radius: 12px; overflow: hidden; }
.chat-ia__tabla th { text-align: left; padding: 8px 10px; background: var(--niebla); color: var(--texto-suave); font-weight: 700; }
.chat-ia__tabla td { padding: 7px 10px; border-top: 1px solid var(--borde); }
.chat-ia__tabla td:last-child, .chat-ia__tabla th:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.chat-ia__tabla td:first-child, .chat-ia__tabla th:first-child { width: 28px; color: var(--texto-suave); }
.chat-ia__grafico { list-style: none; margin: 0; padding: 12px; display: grid; gap: 7px; border: 1px solid var(--borde); border-radius: 12px; background: var(--blanco); font-size: .75rem; }
.chat-ia__grafico li { display: grid; grid-template-columns: 9.5em 1fr 3.2em; align-items: center; gap: 8px; }
.chat-ia__barra-nombre { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--texto-suave); }
.chat-ia__barra { height: 12px; border-radius: 6px; background: var(--niebla); overflow: hidden; }
.chat-ia__barra i { display: block; height: 100%; width: var(--v); border-radius: 6px; background: var(--degradado); transform-origin: left; }
.chat-ia__barra-valor { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
/* Estado final sin JavaScript: se ve el gráfico. Con JavaScript la animación alterna tabla → gráfico. */
.chat-ia__tabla { visibility: hidden; }
.chat-ia.js-tabla .chat-ia__tabla { visibility: visible; }
.chat-ia.js-tabla .chat-ia__grafico { visibility: hidden; }
.chat-ia__entrada { display: flex; align-items: center; justify-content: space-between; margin: 0 14px 14px; padding: 10px 10px 10px 16px; border: 1px solid var(--borde); border-radius: 14px; font-size: .875rem; color: var(--texto-suave); }
.chat-ia__entrada i { width: 30px; height: 30px; border-radius: 9px; background: var(--degradado); }
@media (max-width: 599px) {
	.chat-ia { height: 520px; }
	.chat-ia__cuerpo { padding: 14px; }
	.chat-ia__tabla td { padding: 6px 8px; }
	.chat-ia__grafico li { grid-template-columns: 7.5em 1fr 2.8em; }
}

/* La IA consulta, no modifica. */
.ia-seguro { position: relative; overflow: hidden; margin: var(--sec-pad) clamp(0px, 1vw, 12px) 0; padding: clamp(64px, 9vw, 120px) 0; border-radius: var(--radio-sec); background: var(--noche); color: var(--blanco); text-align: center; }
.ia-seguro__arcos { position: absolute; inset: 0; background: radial-gradient(60% 80% at 50% 120%, rgba(0, 255, 255, .18), transparent 70%), radial-gradient(40% 60% at 0% 0%, rgba(27, 95, 161, .45), transparent 70%); pointer-events: none; }
.ia-seguro__in { position: relative; max-width: 860px; }
.ia-seguro__ico { display: inline-grid; place-items: center; width: 64px; height: 64px; margin-bottom: 20px; border-radius: 50%; background: rgba(0, 255, 255, .12); color: var(--cian-ui); }
.ia-seguro__ico .ico-linea { width: 32px; height: 32px; }
.ia-seguro h2 { margin: 0 0 16px; color: var(--blanco); font-size: clamp(2rem, 4.6vw, 3.5rem); line-height: 1.08; }
.ia-seguro p { margin: 0 auto; max-width: 640px; font-size: clamp(1.0625rem, 1.6vw, 1.25rem); line-height: 1.55; color: var(--en-oscuro-suave); }

/* Preguntas de ejemplo. */
.ia-ejemplos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ia-ejemplo { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; padding: 12px 18px; border: 1px solid var(--borde); border-radius: 16px; background: var(--blanco); color: var(--noche); font: inherit; font-size: 1rem; text-align: left; cursor: pointer; transition: border-color .2s, box-shadow .2s, transform .2s; }
.ia-ejemplo:hover, .ia-ejemplo:focus-visible { border-color: var(--azul-claro); box-shadow: var(--sombra); transform: translateY(-2px); }
.ia-ejemplo__ico { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(27, 95, 161, .08); color: var(--azul); }
.ia-ejemplo__ico .ico-linea { width: 20px; height: 20px; }
.ia-ejemplo__texto { min-height: 1.4em; }
.ia-ejemplo__texto.escribiendo::after { content: ""; display: inline-block; width: 2px; height: 1em; margin-left: 2px; vertical-align: -2px; background: var(--azul); animation: chat-ia-cursor .8s steps(1) infinite; }
@media (max-width: 767px) { .ia-ejemplos { grid-template-columns: 1fr; } }

/* Disponibilidad. */
.ia-disponible { padding-block: 0; }
.ia-disponible__caja { display: flex; align-items: center; gap: 22px; max-width: 760px; margin-inline: auto; padding: 28px 32px; border-radius: var(--radio-card); background: linear-gradient(120deg, rgba(27, 95, 161, .08), rgba(0, 255, 255, .1)); border: 1px solid rgba(27, 95, 161, .15); }
.ia-disponible__sello { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--degradado); color: var(--noche); font-size: 1.5rem; font-weight: 800; }
.ia-disponible h2 { margin: 0 0 4px; font-size: clamp(1.5rem, 2.4vw, 2rem); }
.ia-disponible p { margin: 0; color: var(--texto-suave); font-size: 1.0625rem; }

/* La IA en otros módulos. */
.ia-modulo { display: flex; flex-direction: column; }
.ia-modulo__modulo { margin: 0 0 4px !important; font-size: .8125rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--azul) !important; }
.ia-modulo__link { margin-top: auto; padding-top: 14px; display: inline-flex; min-height: 44px; align-items: center; }
.ia-modulos { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.ia-modulos > li { grid-column: span 2; }
.ia-modulos > li:nth-child(4) { grid-column: 2 / span 2; }
@media (max-width: 1023px) { .ia-modulos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ia-modulos > li, .ia-modulos > li:nth-child(4) { grid-column: auto; } }
@media (max-width: 599px) { .ia-modulos { grid-template-columns: 1fr; } }

/* Bloque de la home. */
.ia-home { padding-top: clamp(40px, 5vw, 64px); }
.ia-home__in { display: flex; align-items: center; gap: 20px; padding: 20px 26px; border-radius: var(--radio-card); background: var(--noche); color: var(--blanco); text-decoration: none; position: relative; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s; }
.ia-home__in::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 120% at 100% 50%, rgba(0, 255, 255, .22), transparent 70%); pointer-events: none; }
.ia-home__in:hover { transform: translateY(-2px); box-shadow: 0 24px 48px -24px rgba(20, 21, 60, .7); }
.ia-home__ico { position: relative; flex: none; width: 56px; height: 56px; border-radius: 16px; background: var(--blanco) var(--ico) center / 34px no-repeat; }
.ia-home__texto { position: relative; display: flex; flex-direction: column; gap: 2px; }
.ia-home__texto strong { font-size: 1.1875rem; }
.ia-home__texto > span:last-child { color: var(--en-oscuro-suave); }
.ia-home__etiqueta { align-self: flex-start; padding: 1px 10px; border-radius: 99px; background: var(--cian-ui); color: var(--noche); font-size: .6875rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.ia-home__flecha { position: relative; margin-left: auto; white-space: nowrap; font-weight: 700; color: var(--cian-ui); }
@media (max-width: 599px) { .ia-disponible__caja { align-items: flex-start; padding: 22px; gap: 16px; } .ia-disponible__sello { width: 44px; height: 44px; font-size: 1.25rem; } }
@media (max-width: 599px) { .ia-home__in { flex-wrap: wrap; } .ia-home__flecha { margin-left: 76px; } }
.ia-taller__caps-titulo { margin: 0 0 6px; font-weight: 800; font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-suave); }
.ia-taller__caps { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 2px; }
.ia-taller__caps a { display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 6px 8px; border-radius: 8px; color: var(--noche); text-decoration: none; font-size: .9375rem; }
.ia-taller__caps a:hover, .ia-taller__caps a.activo { background: var(--blanco); color: var(--azul); }
.ia-taller .taller-modulo__media iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 14px; }

/* ==========================================================================
   Landing de anuncios (/demo/)
   ========================================================================== */

body.landing .wa-flotante, body.landing .franja-redes, body.landing .seguinos { display: none !important; }
body.landing { background: var(--blanco); }
.landing-main { margin: 0; }
.landing-main .lp-hero { margin-top: 0 !important; }
.lp-barra { position: absolute; inset: 0 0 auto; z-index: 5; padding: 18px 0; }
.lp-barra__in { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lp-barra__in img { height: 44px; width: auto; }
.lp-barra__wa { color: var(--blanco); font-weight: 700; text-decoration: none; font-size: .9375rem; padding: 10px 16px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 99px; min-height: 44px; display: inline-flex; align-items: center; }
.lp-barra__wa:hover { background: rgba(255, 255, 255, .1); }
.lp-hero { position: relative; overflow: hidden; background: var(--noche); color: var(--blanco); padding: clamp(110px, 12vw, 150px) 0 clamp(56px, 7vw, 96px); border-radius: 0 0 var(--radio-sec) var(--radio-sec); }
.lp-hero__grilla { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.lp-hero__titulo { margin: 14px 0 16px; color: var(--blanco); font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.05; }
.lp-hero__bajada { margin: 0 0 22px; font-size: clamp(1.0625rem, 1.5vw, 1.25rem); line-height: 1.55; color: var(--en-oscuro-suave); }
.lp-puntos { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 12px; }
.lp-puntos li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.45; }
.lp-puntos svg { flex: none; width: 24px; height: 24px; padding: 3px; border-radius: 50%; background: rgba(0, 255, 255, .14); fill: none; stroke: var(--cian-ui); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.lp-datos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; color: var(--en-oscuro-suave); }
.lp-datos strong { display: block; font-size: 1.75rem; color: var(--blanco); line-height: 1.1; }
.lp-form { scroll-margin-top: 16px; background: var(--blanco); color: var(--noche); border-radius: 24px; padding: clamp(22px, 3vw, 34px); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .6); }
.lp-form__titulo { margin: 0 0 4px; font-size: clamp(1.5rem, 2.4vw, 1.875rem); }
.lp-form__bajada { margin: 0 0 14px; color: var(--texto-suave); }
.lp-form__alt { margin: 14px 0 0; text-align: center; color: var(--texto-suave); }
.lp-form__alt a { color: var(--azul); font-weight: 700; }
.lp-logos { padding-block: clamp(40px, 5vw, 64px) clamp(24px, 3vw, 40px); }
.lp-logos__titulo { margin: 0; text-align: center; font-weight: 800; color: var(--texto-suave); }
.lp-beneficios__lista { display: grid; gap: clamp(48px, 6vw, 88px); }
.lp-beneficio { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(28px, 4vw, 64px); align-items: center; }
.lp-beneficio--inv .lp-beneficio__texto { order: 2; }
.lp-beneficio__num { font-weight: 800; color: var(--azul-claro); letter-spacing: .04em; }
.lp-beneficio h3 { margin: 6px 0 10px; font-size: clamp(1.5rem, 2.6vw, 2.125rem); line-height: 1.15; }
.lp-beneficio p { margin: 0; color: var(--texto-suave); font-size: 1.0625rem; line-height: 1.6; }
.lp-beneficio__img img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: var(--sombra); border: 1px solid var(--borde); }
.lp-como { background: var(--niebla); border-radius: var(--radio-sec); margin-inline: clamp(0px, 1vw, 12px); }
.lp-pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.lp-paso { background: var(--blanco); border-radius: var(--radio-card); padding: 26px; border: 1px solid var(--borde); }
.lp-paso__num { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--degradado); color: var(--noche); font-weight: 800; margin-bottom: 14px; }
.lp-paso h3 { margin: 0 0 6px; font-size: 1.1875rem; }
.lp-paso p { margin: 0; color: var(--texto-suave); line-height: 1.5; }
.lp-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 32px 0 0; }
.lp-boton { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px; border-radius: 99px; background: var(--noche); color: var(--blanco); font-weight: 800; text-decoration: none; transition: transform .2s var(--ease), box-shadow .2s; }
.lp-boton:hover { transform: translateY(-2px); box-shadow: 0 16px 32px -16px rgba(20, 21, 60, .6); }
.lp-boton--claro { background: var(--blanco); color: var(--noche); }
.lp-boton--contorno { background: transparent; color: var(--blanco); border: 1px solid rgba(255, 255, 255, .45); }
.lp-cierre { margin: var(--sec-pad) clamp(0px, 1vw, 12px) 0; padding: clamp(56px, 8vw, 104px) 0; border-radius: var(--radio-sec); background: var(--noche) radial-gradient(60% 90% at 50% 120%, rgba(0, 255, 255, .2), transparent 70%); color: var(--blanco); text-align: center; }
.lp-cierre h2 { margin: 0 0 10px; color: var(--blanco); font-size: clamp(1.875rem, 4vw, 3rem); }
.lp-cierre p { margin: 0; color: var(--en-oscuro-suave); }
.lp-cierre .lp-cta { margin-top: 28px; }
.lp-pie { padding: 28px 0 40px; text-align: center; font-size: .875rem; color: var(--texto-suave); }
.lp-pie a { color: var(--azul); }
.lp-fija { display: none; }
@media (max-width: 900px) {
	.lp-hero__grilla, .lp-beneficio { grid-template-columns: 1fr; }
	.lp-beneficio--inv .lp-beneficio__texto { order: 0; }
	.lp-pasos { grid-template-columns: 1fr; }
	.lp-barra__wa { display: none; }
	.lp-fija { display: flex; gap: 10px; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; padding: 8px; border-radius: 99px; background: rgba(20, 21, 60, .92); backdrop-filter: blur(8px); box-shadow: 0 16px 40px -12px rgba(0, 0, 0, .5); transition: transform .3s var(--ease), opacity .3s; }
	.lp-fija--oculta { transform: translateY(120%); opacity: 0; pointer-events: none; }
	.lp-fija__demo { flex: 1; display: grid; place-items: center; min-height: 48px; border-radius: 99px; background: var(--blanco); color: var(--noche); font-weight: 800; text-decoration: none; }
	.lp-fija__wa { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #25D366; color: var(--blanco); }
	.lp-fija__wa svg { width: 24px; height: 24px; }
	.lp-pie { padding-bottom: 96px; }
}
@media (prefers-reduced-motion: reduce) { .lp-fija { transition: none; } }
/* Celular: el formulario sube justo después del título; los beneficios y los datos van debajo. */
@media (max-width: 900px) {
	.lp-hero { padding-top: 96px; }
	.lp-hero__grilla { display: flex; flex-direction: column; gap: 0; }
	.lp-hero__texto { display: contents; }
	.lp-hero__texto > .hero__etiqueta { order: 1; align-self: flex-start; }
	.lp-hero__titulo { order: 2; font-size: clamp(1.875rem, 8vw, 2.4rem); margin: 10px 0 10px; }
	.lp-hero__bajada { order: 3; font-size: 1rem; margin-bottom: 18px; }
	.lp-form { order: 4; }
	.lp-puntos { order: 5; margin-top: 28px; }
	.lp-datos { order: 6; }
}
@media (max-width: 600px) { .lp-hero__bajada { display: none; } }
/* Landing: "Cinco herramientas sueltas. Un solo CRM." */
.lp-antes { padding-block: clamp(32px, 4vw, 56px) 0; }
.lp-antes__in { text-align: center; }
.lp-antes h2 { margin: 0 0 28px; font-size: clamp(1.75rem, 3.4vw, 2.75rem); }
.lp-antes h2 em { font-style: normal; background: var(--degradado); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-antes__grilla { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center; max-width: 960px; margin-inline: auto; }
.lp-antes__sueltas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.lp-antes__sueltas li { padding: 10px 16px; border-radius: 99px; background: var(--niebla); color: var(--texto-suave); text-decoration: line-through; text-decoration-color: rgba(204, 51, 85, .7); }
.lp-antes__flecha { font-size: 2rem; color: var(--azul); font-weight: 800; }
.lp-antes__crm { padding: 24px; border-radius: var(--radio-card); background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); text-align: left; }
.lp-antes__crm img { height: 40px; width: auto; display: block; margin-bottom: 10px; }
.lp-antes__crm p { margin: 0; color: var(--texto-suave); line-height: 1.5; }
@media (max-width: 760px) { .lp-antes__grilla { grid-template-columns: 1fr; } .lp-antes__flecha { rotate: 90deg; justify-self: center; } }

/* Logos de clientes (WebP en caja de 160×64): gris y suaves, en color al pasar el mouse. */
.logos__item { height: 64px; }
.logos__item img { width: 160px; height: 64px; max-width: none; object-fit: contain; }
.logos--oscuro .logos__item { width: 184px; height: 76px; border-radius: 14px; background: rgba(255, 255, 255, .94); }
.caso__logo { min-height: 64px; }
.caso__logo img { width: 160px; height: 64px; object-fit: contain; object-position: left center; }
@media (max-width: 700px) { .logos__item img { width: 130px; height: 52px; } .logos__item { height: 52px; } }

/* Calculadora de pérdida: franja en la home y ventana emergente. */
.calc-franja__in { display: flex; align-items: center; gap: clamp(16px, 3vw, 32px); padding: clamp(22px, 3vw, 34px) clamp(22px, 3.4vw, 44px); border-radius: var(--radio-sec); background: var(--niebla); border: 1px solid var(--borde); }
.calc-franja__ico { flex: none; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: var(--noche); color: var(--cian-ui); }
.calc-franja__ico svg { width: 32px; height: 32px; }
.calc-franja__etiqueta { margin: 0 0 4px; font-size: .8125rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.calc-franja__texto h2 { max-width: none; margin: 0 0 6px; font-size: clamp(1.375rem, 2.2vw, 1.875rem); line-height: 1.2; }
.calc-franja__texto p:last-child { margin: 0; color: var(--texto-suave); }
.calc-franja__boton { flex: none; margin-left: auto; min-height: 52px; padding: 0 28px; border: 0; border-radius: 99px; background: var(--noche); color: var(--blanco); font: inherit; font-weight: 800; cursor: pointer; transition: transform .2s var(--ease), box-shadow .2s; }
.calc-franja__boton:hover { transform: translateY(-2px); box-shadow: 0 16px 32px -16px rgba(20, 21, 60, .6); }
@media (max-width: 760px) { .calc-franja__in { flex-wrap: wrap; } .calc-franja__boton { width: 100%; margin-left: 0; } }
.calc-ventana { width: min(1000px, 100% - 32px); max-height: calc(100dvh - 32px); padding: 0; border: 0; border-radius: var(--radio-sec); background: transparent; overflow: auto; }
.calc-ventana::backdrop { background: rgba(20, 21, 60, .62); backdrop-filter: blur(3px); }
.calc-ventana .calc { box-shadow: none; }
.calc-ventana__cerrar { position: absolute; top: 12px; right: 12px; z-index: 2; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .14); color: var(--blanco); font-size: 1.75rem; line-height: 1; cursor: pointer; }
.calc-ventana__cerrar:hover { background: rgba(255, 255, 255, .26); }
@media (max-width: 860px) { .calc-ventana__cerrar { background: var(--niebla); color: var(--noche); } }
@media (prefers-reduced-motion: no-preference) { .calc-ventana[open] { animation: calc-entra .3s var(--ease); } }
@keyframes calc-entra { from { opacity: 0; transform: translateY(16px) scale(.98); } }

/* Home 06: logos de clientes y link a casos (sin testimonio). */
.clientes-logos .logos { margin-top: clamp(28px, 4vw, 48px); }
.clientes-logos__pie { margin-top: clamp(20px, 3vw, 32px); text-align: center; }
.clientes-logos__pie p { margin: 0; }
.clientes-logos__link { display: inline-flex; align-items: center; min-height: 44px; color: var(--en-oscuro-suave); font-weight: 700; text-decoration: none; }
.clientes-logos__link:hover { color: var(--cian-ui); text-decoration: underline; text-underline-offset: 4px; }

/* Casos de éxito: testimonio entre las tarjetas (ocupa toda la fila). */
.casos-testimonio { grid-column: 1 / -1; padding: clamp(24px, 3.4vw, 44px); border-radius: var(--radio-card); background: var(--noche); color: var(--blanco); }
body.logged-in .casos-testimonio.borrador-oculto { display: block; }
.casos-testimonio__aviso { margin: 0 0 12px; }
.casos-testimonio__fig { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 12px 28px; align-items: center; }
.casos-testimonio__logo { grid-row: span 2; padding: 14px; border-radius: 14px; background: var(--blanco); }
.casos-testimonio blockquote { margin: 0; }
.casos-testimonio blockquote p { margin: 0; font-size: clamp(1.125rem, 1.6vw, 1.375rem); line-height: 1.5; }
.casos-testimonio blockquote p::before { content: "“"; color: var(--cian-ui); font-weight: 800; margin-right: 2px; }
.casos-testimonio figcaption { color: var(--en-oscuro-suave); }
.casos-testimonio figcaption strong { color: var(--blanco); }
@media (max-width: 700px) { .casos-testimonio__fig { grid-template-columns: 1fr; } .casos-testimonio__logo { grid-row: auto; justify-self: start; } }
.clientes-logos { padding-bottom: clamp(56px, 7vw, 96px); }
@media (max-width: 700px) { .logos--oscuro .logos__item { width: 140px; height: 60px; border-radius: 12px; } .logos--oscuro .logos__item img { width: 116px; height: 46px; } }
.formulario-crmgo__privacidad { margin: 10px 0 0; font-size: .8125rem; color: var(--texto-suave); }
.formulario-crmgo__privacidad a { color: var(--azul); }

/* Celular: barra fija "Agendar demo" + WhatsApp (el flotante de WhatsApp se oculta para no superponerse). */
.barra-demo { display: none; }
@media (max-width: 767px) {
	body.con-barra-demo .wa-flotante { display: none; }
	.barra-demo { display: flex; gap: 10px; position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 55; padding: 8px; border-radius: 99px; background: rgba(20, 21, 60, .94); backdrop-filter: blur(8px); box-shadow: 0 16px 40px -12px rgba(0, 0, 0, .5); transition: transform .3s var(--ease), opacity .3s; }
	.barra-demo--oculta { transform: translateY(140%); opacity: 0; pointer-events: none; }
	.barra-demo__demo { flex: 1; position: relative; display: flex; align-items: center; min-height: 52px; padding: 5px; border-radius: 99px; background: var(--blanco); color: var(--noche) !important; font-weight: 800; font-size: 1.0625rem; text-decoration: none; box-shadow: inset 0 -2px 0 rgba(20, 21, 60, .08); }
	.barra-demo__perilla { display: grid; place-items: center; width: 64px; height: 42px; flex: none; border-radius: 99px; background: linear-gradient(90deg, #1B5FA1, #2E8FD8 75%, #00FFFF); color: #fff; transition: width .4s cubic-bezier(.16, 1, .3, 1); }
	.barra-demo__perilla svg { width: 22px; height: 22px; animation: cta-empuje 1.6s ease-in-out infinite; }
	.barra-demo__texto { flex: 1; text-align: center; padding-right: 12px; }
	.barra-demo__demo:active .barra-demo__perilla { width: 84px; }
	.barra-demo__wa { width: 52px !important; height: 52px !important; }
	.barra-demo__wa { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #25D366; color: var(--blanco); }
	.barra-demo__wa svg { width: 26px; height: 26px; }
	body.con-aviso-evento .barra-demo { bottom: calc(var(--alto-aviso, 96px) + 10px); }
	body.con-barra-demo .pie { padding-bottom: 88px; }
}
@media (prefers-reduced-motion: reduce) { .barra-demo { transition: none; } }

/* Heros: un solo botón; lo secundario como link y la promesa debajo. */
.hero__botones { align-items: center; }
.hero__link-sec { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; color: var(--blanco); font-weight: 700; text-decoration: none; opacity: .85; }
.hero__link-sec:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
.hero__promesa { margin: 14px 0 0 !important; font-size: .875rem; color: var(--en-oscuro-suave); }
.hero:not(.hero--ficha):not(.hero--ia) .hero__promesa { text-align: center; }
.hero__confianza a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
/* Home en celular: título y etiqueta cortos ("para vender, cobrar…" sigue en la bajada y en escritorio). */
@media (max-width: 767px) {
	body.home .hero .h1-b { display: none; }
	body.home .hero .hero__etiqueta-extra { display: none; }
}

.casos__mas { margin: 24px 0 0; text-align: center; }
.novedades-home__todos { display: block; width: 100%; max-width: none !important; margin: 24px 0 0 !important; text-align: center; grid-column: 1 / -1; }

/* ==========================================================================
   CRM Go Web · Picking: 4 pasos que se encienden de a uno, beneficios 2×2, taller y CTA
   ========================================================================== */
.picking__bajada { max-width: 62ch; margin: 14px 0 0; font-size: 1.125rem; line-height: 1.55; color: var(--texto-suave); }
.picking__sub { margin: 0 0 22px; font-size: .8125rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-suave); }
.picking-pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; counter-reset: none; }
.picking-paso { position: relative; padding: 24px 22px 26px; border-radius: var(--radio-card); background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); transition: opacity .5s, transform .5s var(--ease), border-color .5s, box-shadow .5s; }
.picking-paso::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, #1B5FA1, #2E8FD8 70%, #00FFFF); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease); }
.picking-paso__cabeza { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.picking-paso__num { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--niebla); color: var(--noche); font-weight: 800; font-size: 1rem; transition: background .5s, color .5s; }
.picking-paso__ico { display: block; color: var(--noche); }
.picking-paso__ico .ico-duo { width: 56px; height: 56px; }
.picking-paso__titulo { margin: 0 0 8px; font-size: 1.125rem; line-height: 1.25; }
.picking-paso p { margin: 0; color: var(--texto-suave); line-height: 1.5; font-size: .96875rem; }
.picking-paso.is-encendido::before { transform: scaleX(1); }
.picking-paso.is-encendido .picking-paso__num { background: var(--azul); color: var(--blanco); }
.picking-paso.is-encendido { border-color: rgba(27, 95, 161, .35); box-shadow: 0 18px 40px -22px rgba(27, 95, 161, .55); }
/* Apagados hasta que llegan (solo si hay JS y movimiento). */
.js-pasos .picking-paso:not(.is-encendido) { opacity: .45; transform: translateY(10px); }
.picking__beneficios { margin-top: clamp(28px, 3.5vw, 44px); }
.picking__beneficios .web-tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.picking__taller { margin-top: clamp(48px, 6vw, 80px); }
.picking__taller .taller-modulo__tarjeta { background: var(--blanco); }
.picking__cta { margin-top: clamp(40px, 5vw, 64px); display: flex; justify-content: center; }
@media (max-width: 1023px) { .picking-pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) {
	.picking-pasos { grid-template-columns: 1fr; }
	.picking__beneficios .web-tarjetas { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.picking-paso, .picking-paso::before { transition: none; }
	.js-pasos .picking-paso:not(.is-encendido) { opacity: 1; transform: none; }
}
.picking .kit__cabeza h2 { max-width: 26ch; }

/* Íconos de dos tonos (inc/iconos-duo.php): línea azul noche + celeste, sin recuadro. */
.ico-duo { display: block; color: var(--noche); }
.ico-duo .d-b { fill: #fff; }
.ico-duo .d-a { fill: #85C9DA; }
.ico-duo .d-s { fill: #EEF0F5; }
.ico-duo .d-p { fill: currentColor; }
.ico-duo .d-osc { stroke: var(--noche); }
.web-tarjeta__ico--duo { width: auto; height: auto; background: none; border-radius: 0; margin-bottom: 18px; place-items: start; color: var(--noche); }
.web-tarjeta__ico--duo .ico-duo { width: 64px; height: 64px; }
.ia-seguro__ico:has(.ico-duo) { width: 96px; height: 96px; background: rgba(255, 255, 255, .08); }
.ia-seguro__ico .ico-duo { width: 66px; height: 66px; margin-left: 6px; color: var(--noche); }
.ficha__icono--duo { display: grid; place-items: center; background: var(--blanco); }
.ficha__icono--duo .ico-duo { width: 46px; height: 46px; }

/* IA: Delfina, la asistente, asomada al costado del chat del hero. */
.ia__media { position: relative; }
.ia__delfina { position: absolute; z-index: 3; left: -132px; bottom: -78px; width: 160px; height: auto; filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .35)); pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
	.ia__delfina { animation: delfina-flota 4.5s ease-in-out infinite; }
}
@keyframes delfina-flota { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-10px) rotate(2deg); } }
@media (max-width: 1100px) { .ia__delfina { left: -40px; bottom: -70px; width: 120px; } }
@media (max-width: 767px) { .ia__delfina { left: auto; right: -6px; bottom: auto; top: -64px; width: 96px; } }
/* En la ficha del módulo (recuadro grande) va el logo original con "Live"; en listas y tarjetas chicas, el ícono. */
.ficha__icono.ico-crm-go-live { --ico: url(../icons/crm-go-live-logo.webp); background-size: 58px; }
/* Picking: capturas del taller debajo de los pasos. */
.picking__sub--capturas { margin-top: clamp(36px, 4.5vw, 56px); }
.picking-capturas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.picking-captura { margin: 0; }
.picking-captura--ancha { grid-column: 1 / -1; }
.picking-captura__marco { display: grid; place-items: center; height: 340px; padding: 18px; border-radius: var(--radio-card); background: var(--blanco); border: 1px solid var(--borde); box-shadow: var(--sombra); overflow: hidden; }
.picking-captura--ancha .picking-captura__marco { height: auto; }
.picking-captura__marco img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.picking-captura figcaption { margin-top: 10px; font-size: .9375rem; color: var(--texto-suave); }
@media (max-width: 767px) {
	.picking-capturas { grid-template-columns: 1fr; }
	.picking-captura__marco { height: 300px; padding: 12px; }
	.picking-captura--ancha .picking-captura__marco { overflow-x: auto; place-items: start; }
	.picking-captura--ancha .picking-captura__marco img { max-width: none; width: 720px; }
}
.picking-captura:not(.picking-captura--ancha) .picking-captura__marco img { max-height: 304px; }
@media (max-width: 767px) { .picking-captura:not(.picking-captura--ancha) .picking-captura__marco img { max-height: 276px; } }
.picking-capturas > .picking-captura { min-width: 0; }

/* ==========================================================================
   Íconos de dos tonos que se dibujan solos al aparecer (referencia "iconos animados")
   y se mueven un poco al pasar el mouse. Proceso de Picking con una línea que se llena.
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
	:is(.ico-duo, .ico-linea).is-dibujando :is(path, rect, circle, ellipse) { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ico-traza .9s cubic-bezier(.65, 0, .35, 1) forwards; }
	.ico-duo.is-dibujando .d-a, .ico-duo.is-dibujando .d-s { fill-opacity: 0; animation: ico-traza .9s cubic-bezier(.65, 0, .35, 1) forwards, ico-relleno .45s ease-out .75s forwards; }
	:is(.ico-duo, .ico-linea).is-esperando { visibility: hidden; }
	@media (hover: hover) and (pointer: fine) {
		.web-tarjeta .ico-duo, .picking-paso .ico-duo { transition: transform .45s cubic-bezier(.34, 1.56, .64, 1); }
		.web-tarjeta:hover .ico-duo, .picking-paso:hover .ico-duo { transform: translateY(-4px) rotate(-6deg) scale(1.06); }
	}
	/* Línea de progreso arriba de los pasos de Picking (solo escritorio, con los 4 en fila). */
	@media (min-width: 1024px) {
		.picking-pasos { position: relative; padding-top: 34px; }
		.picking-pasos::before, .picking-pasos::after { content: ""; position: absolute; top: 6px; left: 12.5%; right: 12.5%; pointer-events: none; }
		.picking-pasos::before { height: 14px; background:
			radial-gradient(circle, #C9DCEE 5px, transparent 5.5px) 0 0 / 14px 14px no-repeat,
			radial-gradient(circle, #C9DCEE 5px, transparent 5.5px) 33.333% 0 / 14px 14px no-repeat,
			radial-gradient(circle, #C9DCEE 5px, transparent 5.5px) 66.666% 0 / 14px 14px no-repeat,
			radial-gradient(circle, #C9DCEE 5px, transparent 5.5px) 100% 0 / 14px 14px no-repeat,
			linear-gradient(#DCE7F2, #DCE7F2) 0 5.5px / 100% 3px no-repeat; margin-left: -7px; margin-right: -7px; }
		.picking-pasos::after { top: 11.5px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #1B5FA1, #2E8FD8 70%, #00FFFF); transform-origin: left; transform: scaleX(calc(var(--encendidos, 0) / 3)); transition: transform .45s var(--ease); }
	}
}
@keyframes ico-traza { to { stroke-dashoffset: 0; } }
@keyframes ico-relleno { to { fill-opacity: 1; } }


/* ¿Qué es CRM Go? · datos con movimiento: la línea se dibuja, los números cuentan y "Sin límite" sale de un contador que no para. */
.dato { position: relative; }
@media (prefers-reduced-motion: no-preference) {
	.datos.js-datos .dato { border-top-color: transparent; }
	.datos.js-datos .dato::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 2px; background: linear-gradient(90deg, var(--noche), var(--azul) 70%, var(--cian)); transform: scaleX(0); transform-origin: left; transition: transform 1s cubic-bezier(.65, 0, .35, 1); }
	.datos.js-datos .dato.is-visto::before { transform: scaleX(1); }
	.datos.js-datos .dato__texto { opacity: 0; translate: 0 12px; transition: opacity .6s ease .5s, translate .6s var(--ease) .5s; }
	.datos.js-datos .dato.is-visto .dato__texto { opacity: 1; translate: 0 0; }
	.dato__numero.is-cayo { animation: dato-cae .55s cubic-bezier(.34, 1.56, .64, 1); }
	.dato:hover .dato__numero { background: linear-gradient(90deg, var(--azul), #2E8FD8, var(--cian), var(--azul)); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: dato-brillo 1.6s linear; }
}
.dato__numero { font-variant-numeric: tabular-nums; }
@keyframes dato-cae { 0% { transform: translateY(-14px) scale(1.06); } 100% { transform: none; } }
@keyframes dato-brillo { to { background-position: -300% 0; } }

/* Home: "Implementación" y "Próximo taller" van seguidas sobre fondo blanco; sin sumar los dos espacios. */
.implementacion:has(+ .novedades-home) { padding-bottom: clamp(40px, 4vw, 64px); }
.implementacion + .novedades-home { padding-top: 0; }
.evento-bloque__titulo { max-width: none !important; }

/* Kit Básico: barra de progreso del avance automático y captura que respira. */
.explorador__item .pildora { position: relative; overflow: hidden; }
.explorador__item.is-auto .pildora::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: linear-gradient(90deg, var(--azul), var(--cian)); transform-origin: left; animation: kit-progreso 5s linear forwards; }
@keyframes kit-progreso { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: no-preference) {
	.explorador__escenario .explorador__media:not([hidden]) img { animation: kit-flota 5s ease-in-out infinite alternate; }
	/* Implementación: los íconos saltan al aparecer y se mueven con el mouse. */
	.implementacion__grilla .apoyo { transition: transform .35s var(--ease), box-shadow .35s var(--ease), background .35s; }
	.implementacion__grilla .apoyo:hover { transform: translateY(-6px); background: var(--blanco); box-shadow: 0 22px 44px -26px rgba(20, 21, 60, .45); }
	.implementacion__grilla .apoyo::before { transition: transform .45s cubic-bezier(.34, 1.56, .64, 1); }
	.implementacion__grilla .apoyo:hover::before { transform: rotate(-8deg) scale(1.1); }
	.implementacion__grilla .apoyo.is-salta::before { animation: apoyo-salta .7s cubic-bezier(.34, 1.56, .64, 1); }
	/* Talleres: la miniatura se acerca y el play late con el mouse encima. */
	.talleres .video-taller img { transition: transform .6s var(--ease); }
	.talleres .video-taller:hover img { transform: scale(1.05); }
}
@keyframes kit-flota { from { transform: translateY(0) rotate(0); } to { transform: translateY(-10px) rotate(-.6deg); } }
@keyframes apoyo-salta { 0% { transform: translateY(0) scale(.6); } 55% { transform: translateY(-14px) scale(1.12) rotate(-6deg); } 100% { transform: none; } }

/* Home · franja de texto gigante que se desliza con el scroll */
.cinetica { overflow: hidden; padding-block: clamp(28px, 4vw, 56px); display: grid; gap: clamp(4px, 1vw, 12px); user-select: none; pointer-events: none; }
.cinetica__fila { white-space: nowrap; }
.cinetica__pista { display: inline-flex; align-items: center; gap: clamp(18px, 2.4vw, 40px); padding-right: clamp(18px, 2.4vw, 40px); will-change: transform; }
.cinetica__palabra { font-family: var(--wp--preset--font-family--titulos, inherit); font-weight: 800; font-size: clamp(3rem, 1.5rem + 6.5vw, 8.5rem); line-height: 1; letter-spacing: -.03em; color: var(--noche); }
.cinetica__palabra--hueca { color: transparent; -webkit-text-stroke: 2px var(--azul); }
.cinetica__fila[data-dir="1"] .cinetica__palabra:not(.cinetica__palabra--hueca) { background: linear-gradient(90deg, var(--azul), #2E8FD8 60%, #18B5D8); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cinetica__punto { font-size: clamp(1.5rem, 1rem + 2vw, 3rem); color: var(--cian-ui); }
@media (prefers-reduced-motion: reduce) { .cinetica__fila[data-dir="1"] { text-align: right; direction: rtl; } }

/* Fondo ambiental: manchas de luz que se mueven despacio detrás de las secciones oscuras (referencia "movimiento de fondo ambiental"). */
.ambiente { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; border-radius: inherit; }
.ambiente i { position: absolute; width: 34vmax; height: 34vmax; border-radius: 50%; filter: blur(40px); opacity: .9; mix-blend-mode: screen; }
.ambiente i:nth-child(1) { left: -8%; top: -25%; background: radial-gradient(circle, rgba(46, 143, 216, .85), transparent 62%); }
.ambiente i:nth-child(2) { right: -10%; top: 5%; background: radial-gradient(circle, rgba(0, 255, 255, .55), transparent 62%); }
.ambiente i:nth-child(3) { left: 30%; bottom: -40%; background: radial-gradient(circle, rgba(120, 90, 255, .55), transparent 62%); }
.con-ambiente { position: relative; isolation: isolate; }
.con-ambiente > :not(.ambiente) { position: relative; z-index: 1; }
@media (prefers-reduced-motion: no-preference) {
	.ambiente i:nth-child(1) { animation: amb-1 11s ease-in-out infinite alternate; }
	.ambiente i:nth-child(2) { animation: amb-2 13s ease-in-out infinite alternate; }
	.ambiente i:nth-child(3) { animation: amb-3 15s ease-in-out infinite alternate; }
}
@keyframes amb-1 { to { transform: translate(40vw, 20vh) scale(1.25); } }
@keyframes amb-2 { to { transform: translate(-38vw, 25vh) scale(.8); } }
@keyframes amb-3 { to { transform: translate(-25vw, -35vh) scale(1.2); } }
.cinetica + .calc-franja { padding-top: 0; }

/* Kit Básico (escritorio): lista compacta y captura con la misma altura; el texto del módulo elegido, en una banda debajo. */
@media (min-width: 901px) {
	.explorador.is-tabs .pildora { padding: 5px 16px 5px 5px; font-size: 1rem; }
	.explorador.is-tabs .pildora::before { width: 32px; height: 32px; background-size: 20px; }
	.explorador.is-tabs .explorador__item + .explorador__item { margin-top: 6px; }
	.explorador.is-tabs .is-activo .pildora { border-radius: 999px; }
	.explorador__escenario { position: relative; top: auto; }
	.explorador__textos { grid-column: 1 / -1; position: relative; z-index: 1; }
	.explorador__textos > .explorador__texto:not([hidden]) { display: grid; grid-template-columns: 1.15fr 1fr; column-gap: 32px; align-items: center; border-radius: 24px !important; padding: 24px 28px !important; }
	.explorador__textos > .explorador__texto > * { margin: 0 !important; }
	.explorador__textos .explorador__link { grid-column: 1 / -1; margin-top: 14px !important; }
}
/* Preguntas frecuentes del home: con su fondo gris, pero con menos espacio arriba y abajo. */
body.home .faq { padding-block: clamp(56px, 6vw, 88px); }
body.home .sec:has(+ .faq) { padding-bottom: clamp(56px, 6vw, 88px); }
body.home .faq + .sec { padding-top: clamp(56px, 6vw, 88px); }

/* Dos puertas: íconos de dos tonos con línea blanca. */
.puerta__ico .ico-duo { width: 44px; height: 44px; color: var(--blanco); }
.ico-duo .d-n { fill: var(--noche); }
.ico-duo .d-raya-a { stroke: #85C9DA; }
.puerta__ico .d-osc { stroke: var(--noche); }
.puerta__ico:has(.ico-duo) { width: 72px; height: 72px; border-radius: 20px; }
.puerta__ico .ico-duo { width: 50px; height: 50px; }

/* Celular: íconos del pie centrados en su círculo; links de "Ya uso CRM Go" sin punto suelto ni espacio de más. */
.pie__redes a { justify-content: center; flex: none; height: 44px !important; min-height: 0 !important; padding: 0 !important; aspect-ratio: 1; }
.pie__redes li { display: flex; align-items: center; }
@media (max-width: 767px) {
	.puerta__extra { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
	.puerta__extra > span[aria-hidden] { display: none; }
	.puerta__extra a { padding-block: 6px !important; }
}
.pie__redes a.red-ico { display: grid !important; place-items: center; }

/* IA: Delfina que baja con el scroll */
.delfina-viaja { position: fixed; z-index: 40; top: 0; right: clamp(8px, 2vw, 32px); width: clamp(84px, 8vw, 130px); height: auto; pointer-events: none; filter: drop-shadow(0 14px 20px rgba(20, 21, 60, .35)); }
@media (max-width: 767px) { .delfina-viaja { width: 70px; right: 6px; } }
/* Delfina en el margen libre de la derecha (fuera de la columna de contenido) para no tapar texto. */
.delfina-viaja { width: clamp(64px, calc((100vw - var(--ancho)) / 2 - 12px), 120px); right: 4px; }
@media (max-width: 1360px) { .delfina-viaja { width: 64px; right: 2px; opacity: .95; } }

/* Landing: formulario en dos pasos y respaldo junto al formulario */
.lp-aval { margin: 4px 0 18px; padding: 12px 14px; border-radius: 14px; background: var(--niebla); }
.lp-aval p { margin: 0 0 10px; font-size: .875rem; color: var(--texto-suave); }
.lp-aval p strong { color: var(--noche); }
.lp-aval__logos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.lp-aval__logos li { display: grid; place-items: center; height: 40px; padding: 4px 6px; border-radius: 10px; background: var(--blanco); }
.lp-aval__logos img { max-width: 100%; max-height: 30px; width: auto; height: auto; }
.formulario-crmgo--landing .wdform_section { display: grid !important; grid-template-columns: 1fr; gap: 14px; }
.formulario-crmgo--landing .wdform_column.es-oculto { display: none !important; }
.lp-progreso { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: .8125rem; color: var(--texto-suave); }
.lp-progreso span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--niebla); color: var(--texto-suave); font-weight: 800; font-size: .75rem; }
.lp-progreso span.is-on, .lp-progreso span.is-hecho { background: var(--azul); color: #fff; }
.lp-progreso i { width: 36px; height: 3px; border-radius: 3px; background: var(--niebla); }
.lp-progreso i.is-on { background: linear-gradient(90deg, var(--azul), var(--cian)); }
.lp-progreso b { margin-left: 6px; font-weight: 700; }
.lp-siguiente { width: 100%; min-height: 52px; margin-top: 6px; border: 0; border-radius: 999px; background: var(--azul); color: #fff; font: 800 1.0625rem/1 var(--wp--preset--font-family--titulos, inherit); cursor: pointer; transition: background .2s, transform .2s; }
.lp-siguiente:hover { background: #164f87; transform: translateY(-1px); }
.lp-siguiente:focus-visible { outline: 3px solid var(--cian); outline-offset: 3px; }
.lp-error { margin: 8px 0 0; min-height: 1em; font-size: .875rem; font-weight: 600; color: #B42318; }
.lp-error:empty { display: none; }
/* Capturas de los beneficios: más grandes y nítidas, con un poco de zoom al pasar el mouse. */
.lp-beneficio { grid-template-columns: 4fr 8fr; }
.lp-beneficio__img { overflow: hidden; border-radius: 16px; box-shadow: 0 30px 60px -30px rgba(20, 21, 60, .45); }
.lp-beneficio__img img { border: 0; border-radius: 0; box-shadow: none; transition: transform .6s var(--ease); image-rendering: -webkit-optimize-contrast; }
.lp-beneficio__img:hover img { transform: scale(1.06); }
@media (max-width: 900px) { .lp-beneficio { grid-template-columns: 1fr; } }
/* Celular: el respaldo y los logos se ven antes de completar. */
@media (max-width: 767px) { .lp-aval__logos li { height: 36px; } }
.formulario-crmgo--landing .button-submit { width: 100%; min-height: 52px; font-size: 1.0625rem; }

/* Gracias (/contacto-recibido/): ilustración de reunión con movimientos suaves y los pasos que siguen */
.gracias { width: min(440px, 100%); margin: 0 auto; }
.gracias .reunion { display: block; width: 100%; height: auto; overflow: visible; }
.gracias__pasos { list-style: none; margin: 26px auto 0 !important; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 760px; text-align: left; }
.gracias__pasos li { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 16px; background: var(--niebla); }
.gracias__pasos span { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--blanco); color: var(--noche); font-weight: 800; box-shadow: inset 0 0 0 2px var(--borde); }
.gracias__pasos li.is-hecho span { background: var(--cian); box-shadow: none; }
.gracias__pasos strong { display: block; font-size: .9688rem; color: var(--noche); }
.gracias__pasos small { color: var(--texto-suave); font-size: .8125rem; }
.recibido__mientras { margin-top: 34px !important; }
@media (max-width: 700px) { .gracias__pasos { grid-template-columns: 1fr; } .gracias { width: min(320px, 100%); } }
@media (prefers-reduced-motion: no-preference) {
	.reunion > * { animation: gr-sube .7s var(--ease) both; }
	.reunion__pantalla { animation-delay: .1s !important; } .reunion__mesa { animation-delay: .3s !important; } .reunion__izq { animation-delay: .4s !important; } .reunion__der { animation-delay: .5s !important; } .reunion__parado { animation-delay: .2s !important; }
	.reunion .r-barra { transform-box: fill-box; transform-origin: 50% 100%; animation: gr-crece .6s var(--ease) both; }
	.reunion .r-barra:nth-child(1) { animation-delay: .7s; } .reunion .r-barra:nth-child(2) { animation-delay: .85s; } .reunion .r-barra:nth-child(3) { animation-delay: 1s; }
	.reunion .r-linea { stroke-dasharray: 1; stroke-dashoffset: 1; animation: gr-traza-l 1s ease 1.1s forwards; }
	.reunion .r-punto { transform-box: fill-box; transform-origin: center; animation: gr-pulso 2s ease-in-out 2s infinite; }
	.reunion .r-globo { transform-box: fill-box; transform-origin: 30% 100%; animation: gr-pop .5s cubic-bezier(.34, 1.56, .64, 1) 1.4s both, gr-flota-s 3.5s ease-in-out 2s infinite; }
	.reunion .r-brazo { transform-box: fill-box; transform-origin: 0% 50%; animation: gr-senala 3s ease-in-out 1.6s infinite; }
	.reunion .r-tablet { transform-box: fill-box; transform-origin: 0 100%; animation: gr-tablet 4s ease-in-out 1s infinite; }
	.gracias__pasos li { animation: gr-sube .5s var(--ease) both; }
	.gracias__pasos li:nth-child(1) { animation-delay: .9s; } .gracias__pasos li:nth-child(2) { animation-delay: 1.1s; } .gracias__pasos li:nth-child(3) { animation-delay: 1.3s; }
	.gracias__pasos li:nth-child(2) span { animation: gr-late 1.6s ease-in-out 2s infinite; }
}
@keyframes gr-sube { from { opacity: 0; transform: translateY(14px); } }
@keyframes gr-crece { from { transform: scaleY(0); } }
@keyframes gr-traza-l { to { stroke-dashoffset: 0; } }
@keyframes gr-pulso { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.5); } }
@keyframes gr-pop { from { opacity: 0; transform: scale(.3); } }
@keyframes gr-flota-s { 0%, 100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes gr-senala { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-8deg); } }
@keyframes gr-tablet { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-4deg); } }
@keyframes gr-late { 0%, 100% { box-shadow: inset 0 0 0 2px var(--borde), 0 0 0 0 rgba(0, 255, 255, .5); } 50% { box-shadow: inset 0 0 0 2px var(--cian), 0 0 0 8px rgba(0, 255, 255, 0); } }
.recibido .recibido__titulo { padding-top: 0 !important; margin-top: 10px !important; }
.recibido .recibido__bajada { margin-inline: auto !important; max-width: 60ch; text-align: center; }
.gracias.is-lottie { width: min(360px, 100%); aspect-ratio: 1; }
.gracias__lottie, .gracias__lottie svg { width: 100% !important; height: 100% !important; display: block; }
@media (max-width: 700px) { .gracias.is-lottie { width: min(260px, 100%); } }
/* Flyer del evento: el texto está a la izquierda; si hay que recortar, se recorta la derecha. */
.evento-tarjeta__img img { object-position: left center; }
/* Gracias: el bloque de talleres grabados va pegado al del próximo taller (dos secciones blancas seguidas). */
.recibido { padding-bottom: clamp(40px, 4vw, 64px); }
.recibido + .videos-sec { padding-top: clamp(24px, 3vw, 40px); margin-top: 0 !important; }
/* Landing en celular: igual que el resto del sitio, sin panel fijo con "Agendar demo"; queda solo el WhatsApp flotante. */
@media (max-width: 767px) {
	.lp-fija { left: auto; right: 16px; bottom: 16px; padding: 0; background: none; backdrop-filter: none; box-shadow: none; }
	.lp-fija__demo { display: none !important; }
	.lp-fija__wa { box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .45); }
}

/* Módulos · problema → solución */
.soluciones { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.solucion { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 16px 64px; position: relative; border-radius: 16px; background: var(--blanco); box-shadow: 0 10px 24px -18px rgba(20, 21, 60, .35); }
.solucion::before { content: ""; position: absolute; left: 16px; top: 16px; width: 34px; height: 34px; background: var(--ico) center / contain no-repeat; }
.solucion__mod a, .solucion__mod span { font-weight: 800; color: var(--noche); text-decoration: none; }
.solucion__mod a:hover { color: var(--azul); }
.solucion p { margin: 0 !important; font-size: .9375rem; line-height: 1.45; color: var(--texto-suave); }
.soluciones__cta { margin-top: 18px !important; }
@media (max-width: 700px) { .soluciones { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: no-preference) {
	.selector__item:not([hidden]) .solucion { animation: sol-entra .45s var(--ease) both; animation-delay: calc(var(--i) * 90ms + 80ms); }
	/* Imagen: zoom lento continuo e inclinación con el mouse */
	.selector__escenario .selector__foto { transition: transform .5s var(--ease); transform: perspective(1000px) rotateY(var(--ry, 0deg)) rotateX(var(--rx, 0deg)); }
	.selector__escenario .selector__media:not([hidden]) .selector__foto img { animation: foto-zoom 12s ease-in-out infinite alternate; }
}
@keyframes sol-entra { from { opacity: 0; transform: translateY(14px); } }
@keyframes foto-zoom { from { transform: scale(1); } to { transform: scale(1.1) translate(-2%, -1%); } }

/* Confirmación de inscripción: tarjeta centrada y animada */
.con-envio-ok { display: flex; align-items: center; justify-content: center; min-height: min(520px, 70vh); }
.formulario-crmgo.is-enviado { width: 100%; }
.envio-ok { text-align: center; padding: clamp(24px, 4vw, 48px) clamp(16px, 3vw, 32px); outline: none; }
.envio-ok__tilde { display: inline-grid; width: 88px; height: 88px; margin-bottom: 18px; border-radius: 50%; background: rgba(0, 255, 255, .12); box-shadow: 0 0 0 14px rgba(0, 255, 255, .06); }
.envio-ok__tilde svg { width: 88px; height: 88px; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.envio-ok__tilde circle { stroke: var(--cian-ui, #00C2D1); stroke-width: 3; stroke-dasharray: 151; stroke-dashoffset: 0; }
.envio-ok__tilde path { stroke: var(--noche); stroke-width: 4; stroke-dasharray: 40; stroke-dashoffset: 0; }
.envio-ok__titulo { margin: 0 0 10px; font-size: clamp(1.625rem, 1.2rem + 1.4vw, 2.25rem); line-height: 1.15; color: var(--noche); }
.envio-ok__texto { margin: 0 auto 22px; max-width: 40ch; color: var(--texto-suave); font-size: 1.0625rem; line-height: 1.55; }
.envio-ok__pasos { list-style: none; margin: 0 auto 22px; padding: 0; display: grid; gap: 10px; max-width: 360px; text-align: left; }
.envio-ok__pasos li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--blanco); font-weight: 600; color: var(--noche); font-size: .9688rem; }
.envio-ok__pasos span { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--borde); font-weight: 800; font-size: .875rem; }
.envio-ok__pasos li.is-hecho span { background: var(--cian); box-shadow: none; }
.envio-ok__extra { margin: 0; }
@media (prefers-reduced-motion: no-preference) {
	.envio-ok__tilde { animation: ok-pop .5s cubic-bezier(.34, 1.56, .64, 1) both; }
	.envio-ok__tilde circle { stroke-dashoffset: 151; animation: ok-traza .6s ease .15s forwards; }
	.envio-ok__tilde path { stroke-dashoffset: 40; animation: ok-traza .4s ease .65s forwards; }
	.envio-ok__titulo, .envio-ok__texto, .envio-ok__pasos li, .envio-ok__extra { animation: ok-sube .5s var(--ease) both; }
	.envio-ok__titulo { animation-delay: .5s; } .envio-ok__texto { animation-delay: .6s; }
	.envio-ok__pasos li:nth-child(1) { animation-delay: .75s; } .envio-ok__pasos li:nth-child(2) { animation-delay: .85s; } .envio-ok__pasos li:nth-child(3) { animation-delay: .95s; }
	.envio-ok__extra { animation-delay: 1.1s; }
}
@keyframes ok-pop { from { transform: scale(.4); opacity: 0; } }
@keyframes ok-traza { to { stroke-dashoffset: 0; } }
@keyframes ok-sube { from { opacity: 0; transform: translateY(12px); } }
.envio-ok__titulo { margin-inline: auto !important; max-width: 22ch !important; }
/* Hero (escritorio): "CRM GO" gigante arriba de la notebook, para que se lea y no lo tape la pantalla. */
.is-escenario .hero__gigante { top: 2.5%; margin-top: 0; font-size: clamp(6rem, 15vw, 14rem); line-height: .82; }
/* Con "CRM GO" arriba, los íconos del arco pasan a los costados de la notebook. */
.is-escenario .tesela:nth-child(1) { left: 5%; top: 20%; } .is-escenario .tesela:nth-child(2) { left: 15%; top: 26%; } .is-escenario .tesela:nth-child(3) { left: 23%; top: 17%; }
.is-escenario .tesela:nth-child(4) { left: 77%; top: 17%; } .is-escenario .tesela:nth-child(5) { left: 85%; top: 26%; } .is-escenario .tesela:nth-child(6) { left: 95%; top: 20%; }

/* IA en los módulos: tres tarjetas en una fila */
.ia-modulos { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.ia-modulos > li, .ia-modulos > li:nth-child(4) { grid-column: auto !important; }
@media (max-width: 1023px) { .ia-modulos { grid-template-columns: 1fr !important; } }
/* Inscripción (escritorio): el recuadro del formulario arranca a la altura del título, no arriba de todo;
   la confirmación ocupa el alto del formulario y queda centrada. */
@media (min-width: 1024px) {
	.registracion__formulario { margin-top: var(--reg-offset, 150px) !important; }
	.con-envio-ok { min-height: 0; }
	.registracion__formulario.con-envio-ok .envio-ok { padding-block: 8px; }
}
/* Inscripción: menos espacio entre el menú y el contenido. */
.registracion { padding-top: calc(var(--alto-menu, 88px) + 4px) !important; }
.registracion .migas { margin: 0 0 8px !important; }
.registracion__cabeza > .migas + * { margin-top: 6px !important; }
/* Todas las páginas internas: el contenido arranca cerca del menú, sin el hueco de arriba. */
.hero--ficha, .hero--pagina, .hero--ia, .hero--web { padding-top: calc(var(--alto-menu, 88px) + clamp(16px, 2vw, 28px)) !important; }
.contacto, .recibido { padding-top: calc(var(--alto-menu, 88px) + clamp(12px, 1.5vw, 20px)) !important; }
.hero--ficha .migas, .hero--pagina .migas { margin-bottom: 12px !important; }

/* Promos del mes (home) */
.promos { padding-block: clamp(48px, 6vw, 88px); }
.promos__cabeza { text-align: center; margin-bottom: clamp(24px, 3vw, 40px); }
.promos__cabeza h2 { margin: 10px 0 6px; }
.promos__hasta { margin: 0; color: var(--texto-suave); }
.promos__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.promo { position: relative; overflow: hidden; padding: 26px 24px; border-radius: var(--radio-card); background: linear-gradient(135deg, #1B5FA1 0%, #1E7FC8 55%, #18B5D8 100%); color: #fff; box-shadow: 0 24px 50px -28px rgba(27, 95, 161, .8); }
.promo::after { content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; background: rgba(255, 255, 255, .12); }
.promo__etiqueta { display: inline-block; margin-bottom: 12px; padding: 6px 12px; border-radius: 999px; background: var(--blanco); color: var(--noche); font-weight: 800; font-size: .9375rem; }
.promo__titulo { margin: 0 0 6px; color: #fff; font-size: 1.25rem; }
.promo__detalle { margin: 0; color: rgba(255, 255, 255, .88); line-height: 1.5; }
.promos__cta { display: flex; justify-content: center; margin-top: clamp(24px, 3vw, 36px); }
@media (prefers-reduced-motion: no-preference) {
	.promo { animation: promo-entra .6s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--i) * 120ms); animation-timeline: view(); animation-range: entry 0% entry 60%; }
	.promo__etiqueta { animation: promo-late 2.4s ease-in-out infinite; }
}
@keyframes promo-entra { from { opacity: 0; transform: translateY(24px) scale(.96); } }
@keyframes promo-late { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
.promos__cabeza > * { margin-inline: auto !important; text-align: center; max-width: none !important; }
.promos + .calc-franja, .promos + * .calc-franja { padding-top: 0 !important; }

.promos__vacio { text-align: center; display: grid; justify-items: center; gap: 14px; }
.promos__vacio p { color: var(--texto-suave); max-width: 52ch; margin: 0; }

/* Promociones: más movimiento */
.promo { isolation: isolate; transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), box-shadow .45s; transform-style: preserve-3d; }
.promo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .28) 48%, transparent 66%); transform: translateX(-120%); }
.promo__etiqueta { font-size: 1.125rem; padding: 8px 16px; }
@media (prefers-reduced-motion: no-preference) {
	.promo { animation: promo-entra .7s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--i) * 160ms + 150ms); animation-timeline: auto; animation-range: normal; }
	.promo::before { animation: promo-brillo 3.8s ease-in-out infinite; animation-delay: calc(var(--i) * 1.2s + 1s); }
	.promo::after { animation: promo-burbuja 7s ease-in-out infinite alternate; }
	.promo:hover { transform: translateY(-8px) rotate(-.6deg) scale(1.02); box-shadow: 0 36px 60px -28px rgba(27, 95, 161, .9); }
	.promo:hover .promo__etiqueta { animation-duration: .8s; }
	.promos__cabeza h2 { animation: promo-titulo .8s cubic-bezier(.34, 1.56, .64, 1) both; }
	.promos__cta { animation: promo-entra .6s ease both .7s; }
}
@keyframes promo-brillo { 0%, 60% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
@keyframes promo-burbuja { from { transform: translate(0, 0) scale(1); } to { transform: translate(-30px, 24px) scale(1.35); } }
@keyframes promo-titulo { from { opacity: 0; transform: translateY(18px) scale(.96); letter-spacing: .02em; } }