<?php
// ===========================================================================
// SmartPend — landing V3.
// Todo el texto sale de la landing publicada, del catálogo de planes y del
// sitio corporativo. Nada inventado: ni cifras, ni clientes, ni promesas.
// ===========================================================================
require_once __DIR__ . '/_planes.php';

$AHORRO  = a_ahorro_anual();
$URL_APP = a_url_panel();
$PROD    = 'smartpend';
?>
<!doctype html>
<html lang="es" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>SmartPend | Nada se pierde entre correos y juntas</title>

<meta name="description" content="Sistema de gestión de pendientes y proyectos: quién lo pidió, quién responde, en qué va y qué se hizo. Con historial completo e IA que acelera el registro.">
<meta name="author" content="SmartPend, un producto de Alkes — software y soluciones TI">
<meta name="theme-color" content="#061c6b">
<meta name="format-detection" content="telephone=no">

<meta property="og:type" content="website">
<meta property="og:site_name" content="SmartPend">
<meta property="og:title" content="SmartPend | Nada se pierde entre correos y juntas">
<meta property="og:description" content="Centraliza los pendientes de tu organización con folio, responsable, historial completo e inteligencia artificial en el registro.">
<meta property="og:image" content="https://smartpend.alkes.mx/assets/img/og-image.png">
<meta property="og:locale" content="es_MX">

<link rel="icon" href="assets/img/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="assets/img/apple-touch-icon.png">

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend:wght@500;600;700&family=Source+Sans+3:wght@400;600&family=IBM+Plex+Mono:wght@400;500&display=swap">
<link rel="stylesheet" href="assets/css/alkes.css">
<style>
/* Bloques propios de esta página, no compartidos con las otras landings. */
.disc__group { font-family: var(--font-mono); font-weight: 600; font-size: var(--t-mono); letter-spacing: 0.09em; color: var(--fg-subtle); text-transform: uppercase; margin-top: var(--sp-5); }
.disc__group:first-child { margin-top: 0; }
.roadmap__item .mono { display: block; margin-top: var(--sp-3); color: var(--fg-subtle); }
.feat__media > * + * { margin-top: var(--sp-4); }
.feat__media .disc + .disc { margin-top: var(--sp-3); }
</style>

<script>
(function () {
    var r = document.documentElement;
    r.className = r.className.replace('no-js', 'js');
    try {
        var t = localStorage.getItem('tema');
        if (t === 'dark' || t === 'light') { r.setAttribute('data-theme', t); }
    } catch (e) {}
})();
</script>
</head>
<body>

<a class="skip-link" href="#main">Saltar al contenido</a>


<header class="nav" id="nav">
    <div class="container nav__in">
        <a class="nav__logo" href="#inicio">
            <img src="assets/img/logo-blanco.png" alt="" width="34" height="34">
            <span>SmartPend</span>
        </a>
        <a class="nav__by" href="https://alkes.mx">por <strong>ALKES</strong></a>
        <nav class="nav__links" aria-label="Secciones">
            <a class="nav__link" href="#producto">Producto</a>
            <a class="nav__link" href="#capacidades">Capacidades</a>
            <a class="nav__link" href="#precios">Precios</a>
            <a class="nav__link" href="#novedades">Novedades</a>
            <a class="nav__link" href="#confianza">Confianza</a>
            <a class="nav__link" href="#contacto">Contacto</a>
        </nav>
        <div class="nav__actions">
            <?= a_tema() ?>
            <a class="btn btn--ghost btn--sm" href="<?= a_e($URL_APP) ?>">Iniciar sesión</a>
            <a class="btn btn--primary btn--sm" href="#precios">Ver planes</a>
        </div>
        <button class="nav__burger" type="button" id="navToggle" aria-expanded="false" aria-controls="navPanel" aria-label="Abrir menú">
            <?= a_icon('menu', 'i-menu') ?><?= a_icon('close', 'i-close') ?>
        </button>
    </div>
    <div class="nav__panel container" id="navPanel">
        <a class="nav__link" href="#producto">Producto</a>
        <a class="nav__link" href="#capacidades">Capacidades</a>
        <a class="nav__link" href="#precios">Precios</a>
        <a class="nav__link" href="#novedades">Novedades</a>
        <a class="nav__link" href="#confianza">Confianza</a>
        <a class="nav__link" href="#contacto">Contacto</a>
        <a class="nav__link" href="#ecosistema">Ecosistema Alkes</a>
        <div class="nav__panel-actions">
            <?= a_tema() ?>
            <a class="btn btn--outline" href="<?= a_e($URL_APP) ?>">Iniciar sesión</a>
            <a class="btn btn--primary" href="#precios">Ver planes y precios</a>
        </div>
    </div>
</header>

<main id="main">

<!-- 01 · Hero ------------------------------------------------------------- -->
<section class="hero" id="inicio">
    <div class="container">
        <div class="hero__grid">
            <div class="hero__body">
                <p class="eyebrow" data-reveal>Gestión de pendientes y proyectos</p>
                <h1 data-reveal style="--reveal-delay:60ms">Nada se pierde entre <em>correos</em> y juntas</h1>
                <p class="lede" data-reveal style="--reveal-delay:120ms">
                    SmartPend concentra los pendientes de tu organización en un solo lugar:
                    quién lo pidió, quién responde, en qué va y qué se hizo. Con historial
                    completo de cada movimiento e inteligencia artificial que acelera el
                    registro y la clasificación.
                </p>
                <div class="btn-row" data-reveal style="--reveal-delay:180ms">
                    <a class="btn btn--primary btn--lg" href="#precios">Ver planes y precios<?= a_icon('arrow') ?></a>
                    <a class="btn btn--outline btn--lg" href="<?= a_e($URL_APP) ?>" data-open-demo><?= a_icon('play') ?>Probar el demo</a>
                </div>
                <ul class="hero__facts" data-reveal style="--reveal-delay:240ms">
                    <li><?= a_icon('check') ?>Sin instalar nada</li>
                    <li><?= a_icon('check') ?>Actualizaciones incluidas</li>
                    <li><?= a_icon('check') ?>Soporte de quien lo desarrolla</li>
                </ul>
            </div>
            <div class="hero__aside" data-reveal style="--reveal-delay:300ms">
                <div class="ticks">
                    <div class="panel">
                        <div class="panel__bar">
                            <span class="panel__dots" aria-hidden="true"><i></i><i></i><i></i></span>
                            <span class="panel__url">app.smartpend.alkes.mx</span>
                        </div>
                        <div class="panel__body">
                            <div class="panel__title">
                                <p class="panel__h">Pendientes abiertos</p>
                                <span class="chip chip--accent"><?= a_icon('history') ?>Historial</span>
                            </div>
                            <ul class="rows">
                                <li class="row">
                                    <span class="dot dot--busy" aria-hidden="true"></span>
                                    <span class="row__name">Alta de usuario en el ERP<small>SP-1042 · Operaciones</small></span>
                                    <span class="row__state">En proceso</span>
                                </li>
                                <li class="row">
                                    <span class="dot dot--on" aria-hidden="true"></span>
                                    <span class="row__name">Respaldo del servidor de archivos<small>SP-1039 · Sistemas</small></span>
                                    <span class="row__state row__state--on">Resuelto</span>
                                </li>
                                <li class="row">
                                    <span class="dot" aria-hidden="true"></span>
                                    <span class="row__name">Cotización de licencias<small>SP-1044 · Compras</small></span>
                                    <span class="row__state">Pendiente</span>
                                </li>
                            </ul>
                            <div class="kpis" style="margin-top:1rem">
                                <div class="kpi"><b>18</b><span>Abiertos</span></div>
                                <div class="kpi"><b>7</b><span>En proceso</span></div>
                                <div class="kpi"><b>51</b><span>Resueltos</span></div>
                            </div>
                        </div>
                    </div>
                </div>
                <p class="hero__note">
                    <?= a_icon('shield') ?>
                    <span><strong>Trazabilidad completa</strong>
                    <span>Cada cambio queda registrado con su autor y su fecha.</span></span>
                </p>
            </div>
        </div>
    </div>
</section>

<!-- 02 · Qué es ----------------------------------------------------------- -->
<section class="section section--tight" id="producto">
    <div class="container">
        <h2 class="sr-only">Qué es SmartPend, para quién es y qué resuelve</h2>
        <div class="pillars" data-reveal>
            <div class="pillar">
                <span class="pillar__k idx">01 · Qué es</span>
                <h3>Un sistema de pendientes, no otro chat</h3>
                <p>Registras un pendiente, lo asocias a una empresa y un servicio, defines
                   responsable y fecha, y el sistema conserva todo el rastro hasta cerrarlo.</p>
            </div>
            <div class="pillar">
                <span class="pillar__k idx">02 · Para quién</span>
                <h3>Equipos que responden a terceros</h3>
                <p>Áreas de soporte, TI, operaciones y servicio que atienden solicitudes de
                   varios clientes o departamentos y necesitan saber en qué va cada una.</p>
            </div>
            <div class="pillar">
                <span class="pillar__k idx">03 · Qué resuelve</span>
                <h3>El seguimiento que hoy vive disperso</h3>
                <p>Elimina el rastreo por correo, los mensajes sueltos y las hojas de cálculo,
                   y quita las llamadas de «¿cómo va lo mío?» con consulta directa por folio.</p>
            </div>
        </div>
    </div>
</section>

<!-- 03 · Capacidades ------------------------------------------------------ -->
<section class="section section--rule" id="capacidades">
    <div class="container">
        <?= a_head('01', 'Capacidades', 'Del pendiente suelto al proceso ordenado',
            'Del registro a la resolución, con formularios para tus clientes, reportes para quien decide y avisos para quien sigue de cerca.') ?>

        <article class="feat" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Operación diaria</p>
                <h3>Todo el contexto de un pendiente en una sola pantalla</h3>
                <p class="muted">Quien atiende no tiene que reconstruir la historia: ve la solicitud,
                   los archivos, las notas previas y cada cambio de estado con su responsable.</p>
                <ul class="feat__list">
                    <li><?= a_icon('user-check') ?><div><strong>Asignación con responsable y estado</strong><p>Cambios de estado controlados y visibles para todo el equipo.</p></div></li>
                    <li><?= a_icon('paperclip') ?><div><strong>Archivos y notas por pendiente</strong><p>Adjunta documentos o pega imágenes directo desde el portapapeles.</p></div></li>
                    <li><?= a_icon('history') ?><div><strong>Historial de cada movimiento</strong><p>Quién hizo qué y cuándo, sin depender de la memoria de nadie.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/dashboard.png', 'Panel principal de SmartPend con indicadores y gráficas de pendientes', 1600, 900, 'Panel principal con el estado de la operación', 'Fig. 01') ?>
            </div>
        </article>

        <article class="feat feat--flip" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Inteligencia artificial</p>
                <h3>Registrar deja de ser el cuello de botella</h3>
                <p class="muted">La IA está integrada donde realmente ahorra tiempo: al capturar,
                al clasificar y al planear un proyecto. No es un chat aparte, es parte del flujo.</p>
                <ul class="feat__list">
                    <li><?= a_icon('mic') ?><div><strong>Dictado por voz</strong><p>Cuéntale a la IA que solicita el cliente/usuario y el problema que presenta, y la IA reformateará el mensaje para registrar el pendiente de forma clara para el técnico.</p></div></li>
                    <li><?= a_icon('search') ?><div><strong>Búsqueda inteligente de servicio</strong><p>La IA lee la descripción y sugiere el servicio que mejor aplica antes de guardar.</p></div></li>
                    <li><?= a_icon('sparkle') ?><div><strong>Pendientes de un proyecto con IA</strong><p>Describe el proyecto y recibe la lista de pendientes propuesta, revisable y editable antes de crearla.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/dictado.png', 'Dictado por voz de SmartPend transcribiendo un pendiente', 1600, 900, 'Dictado por voz durante el registro', 'Fig. 02') ?>
            </div>
        </article>

        <article class="feat" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Organización</p>
                <h3>Calendario, recurrencias y proyectos</h3>
                <p class="muted">Más allá del listado, SmartPend ubica cada pendiente en el tiempo:
                   cuándo vence, si se repite y a qué proyecto pertenece.</p>
                <ul class="feat__list">
                    <li><?= a_icon('calendar') ?><div><strong>Calendario por color de estado</strong><p>Vista de mes, semana, día o lista con cada pendiente coloreado según su estado.</p></div></li>
                    <li><?= a_icon('repeat') ?><div><strong>Pendientes programados</strong><p>Define una recurrencia en días, semanas, meses o años y el sistema genera el pendiente solo.</p></div></li>
                    <li><?= a_icon('layers') ?><div><strong>Expediente del proyecto</strong><p>Notas, archivos, historial e involucrados del proyecto, con progreso calculado según los pendientes resueltos.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/calendario.png', 'Calendario de SmartPend con pendientes coloreados por estado', 1600, 900, 'Calendario con el estado de cada pendiente', 'Fig. 03') ?>
            </div>
        </article>

        <article class="feat feat--flip" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Seguimiento</p>
                <h3>Etiquetas, seguidores y avisos dentro de la app</h3>
                <p class="muted">Clasifica lo que importa y entérate cuando se mueve, sin depender de
                   que alguien te copie en un correo.</p>
                <ul class="feat__list">
                    <li><?= a_icon('tag') ?><div><strong>Etiquetas de color propias</strong><p>Clasifica pendientes, proyectos y tareas programadas con etiquetas de color propias de tu organización.</p></div></li>
                    <li><?= a_icon('bell') ?><div><strong>Seguidores por pendiente o proyecto</strong><p>Suma personas a un registro y les llega el aviso dentro de la app cuando algo cambia.</p></div></li>
                    <li><?= a_icon('sparkle') ?><div><strong>Etiquetado automático por IA</strong><p>La IA lee la descripción y propone las etiquetas que aplican, también en el dictado por voz.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/etiquetas.png', 'Pendiente de SmartPend con etiquetas de color y seguidores asignados', 1600, 900, 'Etiquetas y seguidores en el detalle de un pendiente', 'Fig. 04') ?>
            </div>
        </article>

        <article class="feat" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Tus clientes</p>
                <h3>Que reporten y consulten sin llamarte</h3>
                <p class="muted">Publica un formulario en tu propio sitio para que quien reporta lo
                   haga sin tener cuenta, reciba un folio y siga el avance por su cuenta.</p>
                <ul class="feat__list">
                    <li><?= a_icon('form') ?><div><strong>Formularios públicos embebibles</strong><p>Se embebe con un iframe o se comparte como enlace, y lo configuras por completo: qué campos ve el visitante, a quién se le asigna, colores, PIN de acceso opcional y límites contra abuso.</p></div></li>
                    <li><?= a_icon('search') ?><div><strong>Consulta por folio</strong><p>Quien reporta recibe un folio y ve su estado —recibido, en proceso, resuelto— sin acceder a tu operación.</p></div></li>
                    <li><?= a_icon('sparkle') ?><div><strong>Clasificación automática por IA</strong><p>Si lo activas, lo que llega desde tu sitio se etiqueta solo, sin que nadie tenga que revisarlo primero.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/formulario.png', 'Formulario público de SmartPend embebido en un sitio web', 900, 1320, 'Formulario público embebido en tu sitio', 'Fig. 05') ?>
            </div>
        </article>

        <article class="feat feat--flip" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Reportes</p>
                <h3>Diez reportes, con periodo comparado</h3>
                <p class="muted">Cada reporte se compara automáticamente contra el periodo anterior
                   equivalente, y se exporta cuando lo necesitas para juntas o auditorías.</p>
                <ul class="feat__list">
                    <li><?= a_icon('chart') ?><div><strong>Diez reportes por familia</strong><p>Resumen, cumplimiento de SLA, vencidos y en riesgo, antigüedad, desempeño por usuario, actividad por cliente, demanda por servicio, avance de proyectos, salud de programados y bitácora de auditoría.</p></div></li>
                    <li><?= a_icon('history') ?><div><strong>Comparación contra el periodo anterior</strong><p>Cada cifra se lee junto a su equivalente del periodo previo, no aislada.</p></div></li>
                    <li><?= a_icon('report') ?><div><strong>Exportación a Excel, CSV o PDF</strong><p>El mismo reporte, en el formato que tu equipo o tu cliente necesite.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <?= a_shot('assets/img/reportes.png', 'Reporte de desempeño por usuario de SmartPend con exportación a Excel, CSV y PDF', 1600, 900, 'Reportes con comparación de periodo y exportación', 'Fig. 06') ?>
            </div>
        </article>

        <article class="feat" data-reveal>
        <div class="feat__body">
        <p class="eyebrow eyebrow--brand">Tu día</p>
        <h3>Tablero, búsqueda y avisos a tu medida</h3>
        <p class="muted">Ve tus pendientes como columnas de trabajo, encuentra cualquier
        folio desde cualquier pantalla y elige de qué quieres enterarte.</p>
        <ul class="feat__list">
        <li><?= a_icon('layers') ?><div><strong>Tablero de pendientes</strong><p>Una columna por estado; arrastra una tarjeta para iniciarlo, resolverlo o cancelarlo, con las mismas reglas del formulario.</p></div></li>
        <li><?= a_icon('search') ?><div><strong>Búsqueda en todo el sistema</strong><p>Folios, clientes, proyectos y usuarios desde la barra de arriba, solo con lo que tú puedes abrir.</p></div></li>
        <li><?= a_icon('bell') ?><div><strong>Tú eliges qué avisos recibir</strong><p>Un interruptor por tipo de aviso: estados, asignaciones, notas, archivos, etiquetas, cambios de datos y lo que haces tú mismo.</p></div></li>
        </ul>
        </div>
        <div class="feat__media">
        <?= a_shot('assets/img/tablero.png', 'Tablero de pendientes de SmartPend con una columna por estado', 1600, 900, 'Tablero: una columna por estado', 'Fig. 07') ?>
        </div>
        </article>

        <div class="mt-block">
            <?= a_head('02', '', 'Y todo lo que sostiene la operación', '', 'head--sub') ?>
            <div class="matrix matrix--3" data-reveal>
                <div class="matrix__item"><h3><?= a_icon('lock') ?>Permisos por grupos</h3><p>Organiza usuarios en grupos y define qué áreas ven y gestionan información de otras.</p></div>
                <div class="matrix__item"><h3><?= a_icon('history') ?>Historial de cada pendiente</h3><p>Quién hizo qué y cuándo, registrado automáticamente en cada movimiento.</p></div>
                <div class="matrix__item"><h3><?= a_icon('filter') ?>Filtros rápidos</h3><p>Alterna estados con pestañas de un clic y filtra cada columna: contiene, empieza con, vacío y más.</p></div>
                <div class="matrix__item"><h3><?= a_icon('building') ?>Clientes y servicios</h3><p>Asocia cada pendiente a su cliente y al servicio correspondiente.</p></div>
                <div class="matrix__item"><h3><?= a_icon('route') ?>Accesos cruzados</h3><p>Salta entre proyectos, pendientes relacionados y usuarios desde cualquier registro.</p></div>
                <div class="matrix__item"><h3><?= a_icon('paperclip') ?>Archivos y notas</h3><p>Adjunta documentos o pega imágenes directo desde el portapapeles, en pendientes y proyectos.</p></div>
            </div>
        </div>

        <div class="mt-block">
            <?= a_head('03', '', 'Capacidades avanzadas', '', 'head--sub') ?>
            <div class="matrix matrix--3" data-reveal>
                <div class="matrix__item"><h3><?= a_icon('layers') ?>Gestión de proyectos</h3><p>Organiza tareas por proyectos con seguimiento de progreso.</p></div>
                <div class="matrix__item"><h3><?= a_icon('users') ?>Multiusuario</h3><p>Todo el equipo sobre la misma información; la campana se actualiza sola.</p></div>
                <div class="matrix__item"><h3><?= a_icon('lock') ?>Seguridad Argon2id</h3><p>Encriptación de última generación.</p></div>
                <div class="matrix__item"><h3><?= a_icon('building') ?>Gestión integral</h3><p>Empresas, servicios, proyectos y usuarios.</p></div>
                <div class="matrix__item"><h3><?= a_icon('clock') ?>Disponibilidad 24/7</h3><p>Sistema optimizado continuo.</p></div>
                <div class="matrix__item"><h3><?= a_icon('mic') ?>Dictado inteligente por voz</h3><p>Registra tareas con voz y deja que la IA las organice.</p></div>
                <div class="matrix__item"><h3><?= a_icon('shield') ?>Roles y permisos a tu medida</h3><p>Define por rol qué se puede ver, crear, editar y dar de baja en cada módulo, con ajustes para una persona concreta.</p></div>
                <div class="matrix__item"><h3><?= a_icon('route') ?>Visibilidad entre áreas</h3><p>Reglas por grupo para colaboración controlada entre departamentos.</p></div>
                <div class="matrix__item"><h3><?= a_icon('book') ?>Manual dentro del sistema</h3><p>La ayuda se abre en la pantalla donde estás, con buscador.</p></div>
                <div class="matrix__item"><h3><?= a_icon('report') ?>Imprime como documento</h3><p>Un pendiente o un proyecto sale en papel con el logo de tu organización y sin los botones de la pantalla.</p></div>
                <div class="matrix__item"><h3><?= a_icon('box') ?>Duplicar como plantilla</h3><p>Abre un alta nueva con los datos, etiquetas y seguidores de otro registro ya cargados.</p></div>
                <div class="matrix__item"><h3><?= a_icon('zap') ?>Alta rápida de catálogos</h3><p>Crea el cliente, servicio, categoría o etiqueta que falte sin salir del formulario que estás llenando.</p></div>
            </div>
        </div>
    </div>
</section>

<!-- 04 · Resultados ------------------------------------------------------- -->
<section class="section band on-dark" id="resultados">
    <div class="container">
        <?= a_head('04', 'Por qué SmartPend', '¿Por qué SmartPend es la elección ideal?',
            'Descubre cómo nuestro sistema transforma la gestión de tareas en tu organización.') ?>

        <div class="feat" data-reveal>
            <div class="feat__body">
                <p class="eyebrow eyebrow--brand">Maximiza la eficiencia de tu equipo</p>
                <h3>SmartPend elimina las barreras de comunicación</h3>
                <p class="muted">SmartPend está diseñado para eliminar las barreras de comunicación y optimizar los flujos de trabajo, permitiendo que tu equipo se concentre en lo que realmente importa: resolver los pendientes.</p>
                <ul class="feat__list">
                    <li><?= a_icon('zap') ?><div><strong>Ahorra tiempo</strong><p>Reduce hasta un 40% el tiempo en gestión de tareas.</p></div></li>
                    <li><?= a_icon('users') ?><div><strong>Mejora la colaboración</strong><p>Facilita el trabajo en equipo entre departamentos.</p></div></li>
                    <li><?= a_icon('chart') ?><div><strong>Incrementa productividad</strong><p>Optimiza recursos y elimina cuellos de botella.</p></div></li>
                    <li><?= a_icon('history') ?><div><strong>Garantiza trazabilidad</strong><p>Registro completo de cada acción y responsable.</p></div></li>
                    <li><?= a_icon('filter') ?><div><strong>Prioriza lo urgente</strong><p>Ordenado por estado y fecha estimada: lo que vence antes aparece primero.</p></div></li>
                    <li><?= a_icon('gear') ?><div><strong>Mejor decisión operativa</strong><p>Dashboard con métricas claras: sin asignar, totales reales y carga por empresa.</p></div></li>
                </ul>
            </div>
            <div class="feat__media">
                <p class="eyebrow eyebrow--brand">Integración perfecta con tus procesos</p>
                <p class="muted">A diferencia de otras soluciones genéricas, SmartPend se adapta a tu forma de trabajar, no al revés. Nuestro sistema está diseñado para integrarse sin problemas en tus flujos de trabajo existentes.</p>
                <details class="disc" open>
                    <summary class="disc__sum"><span class="disc__t">Personalización a medida</span><?= a_icon('chevron', 'disc__chev') ?></summary>
                    <div class="disc__body"><p>Adaptamos el sistema a tus necesidades específicas, desde campos personalizados hasta flujos de trabajo particulares de tu industria.</p></div>
                </details>
                <details class="disc">
                    <summary class="disc__sum"><span class="disc__t">La misma información para todos</span><?= a_icon('chevron', 'disc__chev') ?></summary>
                    <div class="disc__body"><p>Todo el equipo trabaja sobre la misma información desde cualquier equipo, y la campana avisa de los cambios sin recargar la página.</p></div>
                </details>
                <details class="disc">
                    <summary class="disc__sum"><span class="disc__t">Asistencia inteligente</span><?= a_icon('chevron', 'disc__chev') ?></summary>
                    <div class="disc__body"><p>La IA trabaja donde ahorra tiempo: redacta el pendiente a partir de tu voz, sugiere el servicio y las etiquetas, y propone los pendientes de un proyecto.</p></div>
                </details>
                <details class="disc">
                    <summary class="disc__sum"><span class="disc__t">Gobernanza por grupos y reglas</span><?= a_icon('chevron', 'disc__chev') ?></summary>
                    <div class="disc__body"><p>Configura permisos de visibilidad entre departamentos una sola vez y aplícalos en pendientes, proyectos, búsquedas y accesos directos de forma automática.</p></div>
                </details>
            </div>
        </div>

        <div class="mt-block">
            <p class="eyebrow" style="text-align:center">La diferencia SmartPend</p>
            <p class="lede" style="text-align:center;max-width:60ch;margin-inline:auto">No ofrecemos solo un software, ofrecemos una solución completa a tus necesidades de gestión. Con soporte directo del desarrollador y actualizaciones constantes, tu inversión evoluciona contigo.</p>
            <div class="metrics metrics--4">
                <div class="metric" data-reveal><span class="metric__n">&gt;99<span>%</span></span><span class="metric__k">Del tiempo online</span></div>
                <div class="metric" data-reveal style="--reveal-delay:60ms"><span class="metric__n">24/7</span><span class="metric__k">Disponibilidad del sistema</span></div>
                <div class="metric" data-reveal style="--reveal-delay:120ms"><span class="metric__n">&lt;2s</span><span class="metric__k">Tiempo de respuesta</span></div>
                <div class="metric" data-reveal style="--reveal-delay:180ms"><span class="metric__n">∞</span><span class="metric__k">Posibilidades de crecimiento</span></div>
            </div>
        </div>
    </div>
</section>

<!-- 05 · Precios ---------------------------------------------------------- -->
<section class="section" id="precios">
    <div class="container">
        <?= a_head('05', 'Planes', 'Precios claros, sin sorpresas',
            'Todos los planes incluyen soporte, mantenimiento y las actualizaciones que se publiquen durante tu periodo contratado.') ?>
        <div class="center" data-reveal>
            <div class="period" role="tablist" aria-label="Periodo de facturación">
                <button type="button" role="tab" id="tab-mensual" aria-selected="true" aria-controls="panel-mensual">Mensual</button>
                <button type="button" role="tab" id="tab-anual" aria-selected="false" tabindex="-1" aria-controls="panel-anual">Anual<?php if ($AHORRO): ?><span class="save">−<?= (int) $AHORRO ?> %</span><?php endif; ?></button>
            </div>
        </div>
        <div id="panel-mensual" role="tabpanel" aria-labelledby="tab-mensual" data-reveal><?= a_grid_planes('mensual') ?></div>
        <div id="panel-anual" role="tabpanel" aria-labelledby="tab-anual" hidden><?= a_grid_planes('anual') ?></div>
        <ul class="plan-foot" data-reveal>
            <li><?= a_icon('check') ?>Soporte y mantenimiento incluidos</li>
            <li><?= a_icon('check') ?>Actualizaciones sin costo adicional</li>
            <li><?= a_icon('check') ?>Sin instalaciones ni servidores propios</li>
            <li><?= a_icon('check') ?>Precios en pesos mexicanos</li>
        </ul>
    </div>
</section>

<!-- 06 · Tecnología --------------------------------------------------------- -->
<section class="section section--sunken section--rule" id="tecnologia">
    <div class="container">
        <?= a_head('06', 'Tecnología', 'Construido con tecnología de punta',
            'Utilizamos un stack tecnológico moderno y robusto para garantizar el rendimiento, la seguridad y la escalabilidad.') ?>
        <div class="trust trust--4" data-reveal>
            <div class="trust__item"><?= a_icon('server') ?><h3>Backend</h3><p>PHP con Medoo ORM y Jaxon para un backend rápido y eficiente.</p></div>
            <div class="trust__item"><?= a_icon('database') ?><h3>Base de Datos</h3><p>MariaDB, garantizando integridad y velocidad en el manejo de datos.</p></div>
            <div class="trust__item"><?= a_icon('image') ?><h3>Frontend</h3><p>Bootstrap, DataTables, FullCalendar y SweetAlert2 para una interfaz moderna y responsiva.</p></div>
            <div class="trust__item"><?= a_icon('ethernet') ?><h3>Servidor</h3><p>Nginx con un potente motor de seguridad anti DDoS.</p></div>
        </div>
    </div>
</section>

<!-- 07 · Novedades -------------------------------------------------------- -->
<section class="section section--sunken section--rule" id="novedades">
    <div class="container container--narrow">
        <?= a_head('07', 'Novedades', 'El producto se mueve, y queda por escrito',
            'Historial público de versiones: lo que se entregó, cuándo y qué cambia para quien lo usa.') ?>
        <div data-reveal>
            <details class="disc disc--latest" open>
            <summary class="disc__sum">
            <span class="disc__v">v6.0.1</span>
            <span class="disc__t">Dashboard mejor espaciado</span>
            <span class="disc__d">6 oct 2026</span>
            <?= a_icon('chevron', 'disc__chev') ?>
            </summary>
            <div class="disc__body"><ul>
            <li><div><strong>Indicadores con aire</strong><p>Las tarjetas de color y las barras de avance del dashboard ya no se ven pegadas.</p></div></li>
            </ul></div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v6.0.0</span>
                    <span class="disc__t">Interfaz renovada, tablero de pendientes y búsqueda en todo el sistema</span>
                    <span class="disc__d">4 oct 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Resumen de la versión</h4>
                    <ul>
                    <li><div><strong>Interfaz renovada de punta a punta</strong><p>SmartPend estrena diseño completo. El encabezado, el menú y el pie se quedan fijos mientras trabajas, y tablas, calendario, gráficas y avisos pasan a sus versiones actuales. Se trabaja igual de cómodo en el celular, la tablet o la computadora.</p></div></li>
                    <li><div><strong>Tablero de pendientes</strong><p>Además de la lista, los pendientes se ven en un tablero con una columna por estado. Arrastra una tarjeta para iniciarlo, resolverlo o cancelarlo: se abre la misma confirmación del formulario, con las mismas reglas. Los vencidos se marcan en rojo, y un interruptor deja solo los asignados a ti.</p></div></li>
                    <li><div><strong>Búsqueda en todo el sistema</strong><p>Escribe un folio, un cliente o un proyecto en la barra de arriba, desde cualquier pantalla. Los resultados llegan agrupados en pendientes, proyectos, clientes y usuarios, con lo buscado resaltado. Solo aparece lo que tú puedes abrir.</p></div></li>
                    <li><div><strong>Mi perfil y ajustes, sin salir de lo que haces</strong><p>Desde tu nombre, arriba a la derecha, se abre una ventana con tus datos y tus cifras del mes, el cambio de contraseña, la opción de cerrar sesión en los demás equipos, la apariencia y tu actividad reciente.</p></div></li>
                    <li><div><strong>Tú eliges qué avisos recibir</strong><p>Un interruptor por tipo de aviso: cambios de estado, asignaciones, notas, archivos, etiquetas y seguidores, cambios de datos y lo que haces tú mismo. La campana distingue de un vistazo lo nuevo de lo leído.</p></div></li>
                    <li><div><strong>Tema automático, 20 colores y modo compacto</strong><p>Además de claro y oscuro, el tema automático sigue al de tu equipo. El color de énfasis suma 14 tonos nuevos, y el modo compacto deja más filas a la vista en pantallas bajas.</p></div></li>
                    <li><div><strong>Un dashboard que dice cómo va el trabajo</strong><p>Cada indicador lleva directo al listado de ese estado. Tres barras miden qué tanto está al día: abiertos dentro de su fecha, abiertos con alguien asignado y resueltos a tiempo en el mes. Los proyectos en curso muestran su avance y su equipo, con los atrasados primero, y la actividad reciente se lee como una línea de tiempo.</p></div></li>
                    <li><div><strong>Historial, notas y adjuntos más fáciles de seguir</strong><p>El historial es una línea de tiempo agrupada por día. Las notas se leen como una conversación, y una nota rápida se envía con Enter. Los adjuntos se arrastran con barra de progreso, se ven en cuadrícula con miniaturas y las fotos se recorren en galería.</p></div></li>
                    <li><div><strong>El pendiente avisa cuando se le acaba el tiempo</strong><p>Al abrir un pendiente vencido, un aviso dice desde cuándo; si vence en las próximas 24 horas, también lo advierte. Una cinta en la esquina marca si está vencido, resuelto o cancelado.</p></div></li>
                    <li><div><strong>Listados que caben en la pantalla</strong><p>El texto largo se acomoda en varias líneas para que las columnas quepan, y si aun así hay que desplazarse, la columna de acciones se queda a la vista. Cada columna tiene su propio filtro (contiene, empieza con, vacío y más) y cualquier listado se exporta a PDF.</p></div></li>
                    <li><div><strong>Imprime un pendiente o un proyecto</strong><p>Sale como documento, con el logo de tu organización, todas sus secciones una tras otra y la fecha de impresión, sin los botones de la pantalla.</p></div></li>
                    <li><div><strong>Menú con buscador y con tu logo</strong><p>Escribe el nombre de un módulo y ábrelo con Enter; las teclas <kbd>/</kbd> o <kbd>Ctrl</kbd>+<kbd>K</kbd> llevan al buscador desde cualquier pantalla. El menú muestra el logo de tu organización y cuántos pendientes tienes abiertos, y se puede reducir a una fila de íconos.</p></div></li>
                    <li><div><strong>Manual de usuario dentro del sistema</strong><p>Un botón al pie del menú abre la ayuda justo en la sección de la pantalla donde estás: 44 preguntas con buscador.</p></div></li>
                    <li><div><strong>Errores claros en los formularios</strong><p>Si un dato falta o no es válido, el campo se marca en rojo con el mensaje debajo, usando el nombre que ves en pantalla. En las ventanas largas, el título y los botones se quedan fijos y solo se desplaza el contenido.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Impacto en tu día a día</h4>
                    <ul>
                    <li><div><strong>Los mismos flujos, con otra cara</strong><p>Lo que ya sabías hacer se hace igual. Cerrar sesión cambia de lugar: ahora está en el menú de tu nombre, arriba a la derecha.</p></div></li>
                    <li><div><strong>Para ordenar, el botón junto al título</strong><p>En los listados, el clic sobre el título de una columna ya no la ordena; se ordena con su botón. El filtro de cada columna sube del pie de la tabla al encabezado.</p></div></li>
                    <li><div><strong>Tu nombre y tu correo los cambia un administrador</strong><p>Desde Usuarios, como siempre. En tu perfil se ven, pero no se editan.</p></div></li>
                    <li><div><strong>Amarillo y Claro dejan de ser colores de énfasis</strong><p>Con texto blanco no se leían. Quien los tenía pasa a Gris y puede elegir otro desde Mi perfil y ajustes.</p></div></li>
                    <li><div><strong>Sale el estado «En revisión»</strong><p>Ningún paso del sistema llevaba a él. Los pendientes abiertos son los que están en Pendiente o En proceso.</p></div></li>
                    <li><div><strong>En proyectos, los seguidores ya no borran archivos</strong><p>Un seguidor consulta el proyecto y sube archivos, pero borrarlos queda para quien puede operarlo, igual que en los pendientes.</p></div></li>
                    <li><div><strong>Una recarga la primera vez</strong><p>Si tenías SmartPend abierto durante la actualización, recarga la página antes de seguir.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>El botón Duplicar se multiplicaba</strong><p>En Proyectos y Pendientes programados aparecía un botón Duplicar más cada vez que se cambiaba un campo. Ahora siempre hay uno.</p></div></li>
                    <li><div><strong>La ✕ que escondía secciones</strong><p>Las tarjetas de los formularios tenían un botón que ocultaba la sección entera, sin forma de recuperarla salvo recargando la página. Se quitó.</p></div></li>
                    <li><div><strong>El buscador de una columna reordenaba la tabla</strong><p>En las tablas dentro de los formularios, hacer clic en el buscador de una columna cambiaba el orden de las filas.</p></div></li>
                    <li><div><strong>Modo oscuro incompleto</strong><p>La fila de los días del calendario salía en blanco y las gráficas no cambiaban de color con el tema.</p></div></li>
                    <li><div><strong>«Sin asignar» contaba de más</strong><p>El indicador del dashboard sumaba pendientes resueltos y cancelados sin persona asignada. Ahora cuenta solo los abiertos.</p></div></li>
                    <li><div><strong>Movimientos de «Desconocido»</strong><p>Lo que registran el formulario público y los pendientes programados aparecía en el historial a nombre de «Desconocido». Ahora dice «Sistema».</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
            <summary class="disc__sum">
            <span class="disc__v">v5.2.2</span>
            <span class="disc__t">Íconos a color y contratación sin tropiezos</span>
            <span class="disc__d">3 oct 2026</span>
            <?= a_icon('chevron', 'disc__chev') ?>
            </summary>
            <div class="disc__body"><ul>
            <li><div><strong>Íconos que se reconocen</strong><p>El ícono de la pestaña se lee igual en fondo claro y oscuro, y el de la pantalla de inicio del celular conserva los colores del logo.</p></div></li>
            <li><div><strong>Contratar sin errores</strong><p>Se corrigió una validación de seguridad que podía interrumpir el pago al contratar un plan.</p></div></li>
            </ul></div>
            </details>
            <details class="disc">
            <summary class="disc__sum">
            <span class="disc__v">v5.2.1</span>
            <span class="disc__t">Lo asignado a ti siempre se ve</span>
            <span class="disc__d">3 oct 2026</span>
            <?= a_icon('chevron', 'disc__chev') ?>
            </summary>
            <div class="disc__body"><ul>
            <li><div><strong>Lo tuyo, aunque no estés en un grupo</strong><p>Los pendientes asignados a ti, los proyectos a tu cargo y las tareas programadas que te tocan se ven y se operan siempre, estés o no en un grupo.</p></div></li>
            <li><div><strong>Adjuntos que se abren a quien debe</strong><p>Un adjunto de un pendiente que cambió de organización ya no le aparece bloqueado a quien sí tiene acceso.</p></div></li>
            <li><div><strong>Pagar después de un cobro fallido</strong><p>Al ponerte al corriente, tu cuenta sale del periodo de gracia en ese momento.</p></div></li>
            <li><div><strong>Íconos nuevos en el navegador</strong><p>Favicon e ícono de inicio renovados.</p></div></li>
            </ul></div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v5.2.0</span>
                    <span class="disc__t">Revisión de seguridad de todo el sistema</span>
                    <span class="disc__d">14 sep 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Resumen de la versión</h4>
                    <ul>
                    <li><div><strong>Auditoría completa y endurecimiento</strong><p>Se revisó el sistema de punta a punta —sesiones, formularios, permisos entre organizaciones, entrega de archivos y registro de actividad— y se aplicaron las correcciones que salieron de esa revisión. No cambia cómo se trabaja: es trabajo de cimientos.</p></div></li>
                    <li><div><strong>Los archivos adjuntos exigen sesión y permisos</strong><p>Antes, quien tuviera la dirección exacta de un adjunto podía abrirlo sin entrar al sistema. Ahora toda descarga comprueba quién eres y si ese registro es tuyo o de tu grupo. <strong>Si guardaste el enlace directo de algún archivo, deja de funcionar</strong>: los adjuntos se abren desde el pendiente o el proyecto, como siempre.</p></div></li>
                    <li><div><strong>Cada organización, más aislada de las demás</strong><p>Se reforzaron las comprobaciones de pertenencia en la administración de usuarios y grupos, para que ninguna acción pueda alcanzar registros de otra organización.</p></div></li>
                    <li><div><strong>Las contraseñas ya no llegan a la bitácora</strong><p>El registro de actividad oculta contraseñas, códigos y claves antes de escribir nada en disco.</p></div></li>
                    <li><div><strong>Los fallos ya no muestran detalles internos</strong><p>Si algo se rompe, el sistema lo anota en su bitácora en vez de enseñar rutas y detalles técnicos en pantalla.</p></div></li>
                    <li><div><strong>Folios sin choques</strong><p>Dos altas al mismo tiempo ya no pueden llevarse el mismo número de folio.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Impacto en tu día a día</h4>
                    <ul>
                    <li><div><strong>Nada que aprender de nuevo</strong><p>Las pantallas y los flujos son los mismos. Lo único que se nota es el punto de los adjuntos.</p></div></li>
                    <li><div><strong>Una recarga la primera vez</strong><p>Si tenías SmartPend abierto durante la actualización, la primera acción en esa pestaña te pedirá recargar la página. Después, normal.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>«Acceso denegado» al consultar un pendiente</strong><p>Al abrir un pendiente que sí se podía consultar, saltaba un aviso de «No tienes permisos sobre este registro» aunque el pendiente se viera bien detrás. Pasaba cuando la persona asignada no pertenecía a ningún grupo. Ya no aparece: el registro se consulta con normalidad y solo se ocultan los botones de lo que esa persona no puede hacer.</p></div></li>
                    <li><div><strong>El bloque de seguidores se quedaba vacío</strong><p>En esos mismos casos, la lista de seguidores no se pintaba y no decía por qué. Ahora se ve siempre que puedas consultar el registro.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v5.1.1</span>
                    <span class="disc__t">Correcciones sobre la 5.1.0</span>
                    <span class="disc__d">9 sep 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>Servicios y Categorías no se dejaban editar</strong><p>Al guardar un cambio en un servicio o en una categoría, el sistema respondía «permiso denegado» incluso a quien tenía todos los permisos concedidos. Ya se editan con normalidad, y darlos de baja exige el permiso de eliminar, como en el resto del sistema.</p></div></li>
                    <li><div><strong>Detalle de escritura en dos avisos</strong><p>Los mensajes de alta de cliente y de pendiente mostraban los signos de exclamación al revés.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v5.1.0</span>
                    <span class="disc__t">Roles y permisos a tu medida, IA que planifica proyectos y menos fricción al capturar</span>
                    <span class="disc__d">9 sep 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Resumen de la versión</h4>
                    <ul>
                    <li><div><strong>Roles y permisos a la medida de tu organización</strong><p>Se acabó el "administrador o nada". Ahora defines roles con permisos por módulo —ver, crear, editar, dar de baja, operar y un permiso avanzado para actuar sobre el trabajo de otros— y puedes concederle o quitarle un permiso suelto a una persona concreta sin inventar un rol nuevo. Ningún módulo queda cerrado por sistema: quien tú decidas puede entrar a Usuarios, Servicios o Reportes.</p></div></li>
                    <li><div><strong>Genera los pendientes de un proyecto con IA</strong><p>Describe el proyecto y pide la lista de pendientes. Puedes dar instrucciones concretas —"uno por cada sucursal: Norte, Centro y Sur"— y la propuesta llega con su descripción, fecha, servicio y etiquetas. Se revisa y se edita antes de crear nada: hasta que no pulsas Crear, no existe ningún pendiente.</p></div></li>
                    <li><div><strong>Duplicar como plantilla</strong><p>Un pendiente, proyecto o tarea programada se abre como punto de partida de uno nuevo, con sus datos, etiquetas y seguidores ya cargados. No se copia nada: se llena el alta y tú decides qué cambiar antes de guardar. En las tareas programadas ahorra volver a elegir toda la recurrencia.</p></div></li>
                    <li><div><strong>Alta rápida de catálogos sin salir del formulario</strong><p>Si al registrar algo falta el cliente, el servicio, la categoría o la etiqueta, se crean ahí mismo con un botón junto al desplegable y quedan seleccionados al instante, respetando lo que cada quien tiene permitido crear.</p></div></li>
                    <li><div><strong>Seguir un registro deja de ser automático</strong><p>Ser responsable ya no obliga a seguir el registro: los seguidores se ponen y se quitan a voluntad. Y un seguidor puede ver el registro aunque no comparta grupo, para casos como el administrativo que prepara una cotización y suma al vendedor.</p></div></li>
                    <li><div><strong>Los listados se desplazan de lado</strong><p>En pantallas estrechas las columnas ya no se esconden detrás de un botón: el listado conserva todas sus columnas y se desliza horizontalmente, que es como se lee una tabla.</p></div></li>
                    <li><div><strong>Confirmación al guardar, en todo el sistema</strong><p>Los formularios guardan solo, campo a campo, pero antes no decían nada. Ahora cada cambio confirma en pantalla que quedó registrado.</p></div></li>
                    <li><div><strong>Menos fricción para empezar</strong><p>Al abrir un alta, el sistema avisa de qué catálogos faltan por crear antes y te lleva a crearlos. Las descripciones de los catálogos y la categoría de un servicio dejan de ser obligatorias, y las fechas de registro se llenan solas.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Impacto en tu día a día</h4>
                    <ul>
                    <li><div><strong>Cada quien hace exactamente lo suyo</strong><p>Dejas de repartir permisos de administrador solo para que alguien pueda dar de alta un cliente, y dejas de bloquear a quien únicamente necesitaba una parte del sistema.</p></div></li>
                    <li><div><strong>Un proyecto se planifica en minutos</strong><p>De un título y una descripción a una lista de pendientes revisada, con responsable y fecha, sin capturarlos uno por uno.</p></div></li>
                    <li><div><strong>Arrancar el sistema cuesta menos</strong><p>Una organización nueva puede empezar a capturar desde el primer día: lo que falte se crea sobre la marcha, sin ir y venir entre catálogos.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>Notificaciones al momento</strong><p>Los avisos aparecen en cuanto ocurre el movimiento, ya no con hasta un minuto de retraso.</p></div></li>
                    <li><div><strong>Movimientos que no avisaban</strong><p>Iniciar, resolver o cancelar un pendiente, agregar una nota y cualquier cambio en una tarea programada ahora sí notifican a quien sigue el registro. Y quien realiza la acción también recibe su aviso si sigue el registro.</p></div></li>
                    <li><div><strong>Avisos que mentían</strong><p>Quitar una etiqueta o un seguidor que ya no estaban confirmaba el cambio y escribía historial aunque no hubiera pasado nada.</p></div></li>
                    <li><div><strong>Borrar un adjunto deja rastro</strong><p>Eliminar un archivo de un pendiente no quedaba registrado en su historial.</p></div></li>
                    <li><div><strong>Altas en blanco que no se podían guardar</strong><p>Las fechas obligatorias del alta de cliente y de usuario nacían vacías, así que un formulario recién abierto daba error al guardar.</p></div></li>
                    <li><div><strong>El modal de pendientes de un proyecto</strong><p>Ya cierra al guardar; antes se quedaba abierto si se había usado el selector de etiquetas o seguidores.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v5.0.0</span>
                    <span class="disc__t">Formularios para tu web, reportes, etiquetas y seguidores</span>
                    <span class="disc__d">29 ago 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Resumen de la versión</h4>
                    <ul>
                    <li><div><strong>Formularios públicos para tu sitio web</strong><p>Publica un formulario en tu página para que tus clientes reporten sin tener cuenta. Se embebe con un iframe o se comparte como enlace, y lo configuras por completo: qué campos ve el visitante, a quién se le asigna, colores, PIN de acceso opcional y límites contra abuso.</p></div></li>
                    <li><div><strong>Consulta de folio para quien reporta</strong><p>Quien envía un reporte recibe un folio y puede seguir su avance desde el mismo formulario, sin llamar ni escribir. Solo ve el estado y las fechas.</p></div></li>
                    <li><div><strong>Módulo de Reportes</strong><p>Diez reportes agrupados por familias, con periodo, comparación contra el periodo anterior equivalente y exportación a Excel, CSV o PDF. El Dashboard se reenfoca como pantalla operativa del día a día.</p></div></li>
                    <li><div><strong>Etiquetas, con sugerencia por IA</strong><p>Clasifica pendientes, proyectos y tareas programadas con etiquetas de color propias de tu organización. La IA lee la descripción y propone las que aplican, también en el dictado por voz.</p></div></li>
                    <li><div><strong>Seguidores y notificaciones en la app</strong><p>Suma personas a un pendiente, proyecto o tarea programada y se enteran dentro de la plataforma cada vez que algo se mueve, con una campana de avisos siempre a la mano.</p></div></li>
                    <li><div><strong>Expediente completo del proyecto</strong><p>Notas, archivos e historial también a nivel de proyecto, más una pestaña de involucrados con el avance de cada persona del equipo.</p></div></li>
                    <li><div><strong>Más autonomía para el equipo</strong><p>Un miembro del equipo puede tomar un pendiente libre o ponerse como responsable de un proyecto sin esperar a un administrador. Las tareas programadas dejan de ser exclusivas de administradores y ahora llevan su propio historial de cambios.</p></div></li>
                    <li><div><strong>Protección reforzada</strong><p>Los formularios públicos validan los archivos por su contenido real, limitan los envíos por día y controlan desde qué sitios se pueden incrustar. Se endureció además la protección de toda la plataforma frente a incrustaciones no autorizadas.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Impacto en tu día a día</h4>
                    <ul>
                    <li><div><strong>Tus clientes entran solos</strong><p>Los reportes llegan desde tu propia web ya clasificados y con responsable, sin capturarlos a mano ni perder correos.</p></div></li>
                    <li><div><strong>Menos llamadas de seguimiento</strong><p>Quien reporta consulta el avance de su folio por su cuenta, cuando quiera.</p></div></li>
                    <li><div><strong>Decisiones con datos, no con intuición</strong><p>Compara el periodo actual contra el anterior y exporta lo que necesites presentar.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>Aislamiento entre organizaciones</strong><p>El Dashboard ya no podía mostrar información de otra organización bajo ningún escenario.</p></div></li>
                    <li><div><strong>Folios sin duplicados</strong><p>La generación de folios pasó a ser atómica: dos altas simultáneas ya no pueden generar el mismo número.</p></div></li>
                    <li><div><strong>Filtros de listados persistentes</strong><p>Los filtros, el orden y la paginación de un listado ya no se pierden al entrar a un registro y volver.</p></div></li>
                    <li><div><strong>Notas e historial más confiables</strong><p>Se corrigieron fechas y datos que en algunos casos no se guardaban correctamente en el historial y las notas.</p></div></li>
                    <li><div><strong>Historial del proyecto más completo</strong><p>Ahora refleja también la actividad de sus pendientes: asignaciones, avances y cancelaciones.</p></div></li>
                    <li><div><strong>Dictado por voz más estable</strong><p>Cambiar de cliente durante el dictado ya no borra el servicio que ya se había elegido.</p></div></li>
                    <li><div><strong>Campana de notificaciones</strong><p>Se corrigió su alineación y su comportamiento en pantallas de celular.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v4.0.0</span>
                    <span class="disc__t">Permisos por grupos, filtros rápidos y mejoras operativas</span>
                    <span class="disc__d">23 feb 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Resumen de la versión</h4>
                    <ul>
                    <li><div><strong>Permisos por grupos y visibilidad</strong><p>Controla qué equipos ven y gestionan información de otros, con acceso total para administradores.</p></div></li>
                    <li><div><strong>Orden inteligente de pendientes</strong><p>Ahora se prioriza: En proceso, Pendiente y después fecha más reciente.</p></div></li>
                    <li><div><strong>Dashboard: usuarios con más pendientes corregido</strong><p>Se separan correctamente las columnas Pendientes, Total y % resueltos a tiempo.</p></div></li>
                    <li><div><strong>Dashboard: card de pendientes sin asignar</strong><p>Se reemplazó la métrica anterior por una vista directa de pendientes huérfanos.</p></div></li>
                    <li><div><strong>Tablas sin selección de filas</strong><p>Se eliminó el conteo de filas seleccionadas para una interfaz más limpia en listados resumen.</p></div></li>
                    <li><div><strong>Filtros rápidos en listados</strong><p>Pestañas por estado en Pendientes y Proyectos para cambiar de vista con un clic.</p></div></li>
                    <li><div><strong>Hipervínculos a registros relacionados</strong><p>Botones dinámicos para abrir Proyecto y Pendiente anterior en nueva pestaña desde formularios.</p></div></li>
                    <li><div><strong>Nuevas columnas de relación en pendientes</strong><p>Se añadieron Anterior y Proyecto con acceso directo al registro relacionado.</p></div></li>
                    <li><div><strong>Dashboard: gráfica por empresa</strong><p>Se reemplazó la gráfica por servicio para mostrar carga operativa por empresa activa.</p></div></li>
                    <li><div><strong>Fecha de solución protegida</strong><p>Solo se habilita al marcar el pendiente como resuelto y se bloquean cambios inválidos.</p></div></li>
                    <li><div><strong>Solicitante por defecto en proyectos</strong><p>Los pendientes creados desde proyectos se precargan y guardan como "Interno (Proyecto)".</p></div></li>
                    <li><div><strong>Restricción de módulos críticos</strong><p>Usuarios no admin no ven ni pueden acceder a Usuarios, Grupos, Servicios y Categorías.</p></div></li>
                    <li><div><strong>Pegar archivos desde portapapeles</strong><p>En "Subir archivos" ahora puedes arrastrar, seleccionar o pegar.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v3.0.0</span>
                    <span class="disc__t">Calendario, pendientes programados e IA en todo el sistema</span>
                    <span class="disc__d">01 ene 2026</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Mejoras del sistema</h4>
                    <ul>
                    <li><div><strong>Columna "Pendiente" resumida en listados</strong><p>Todas las tablas que muestran pendientes ahora incluyen una columna "Pendiente" que muestra solo los primeros 50 caracteres de la descripción, permitiendo listados más limpios y fáciles de leer.</p></div></li>
                    <li><div><strong>Historial de notas por pendiente</strong><p>Las notas ya no están limitadas a una sola. Cada pendiente cuenta ahora con un historial de notas, incluyendo las notas previas que se migraron como notas de tipo "Solución" dentro del historial.</p></div></li>
                    <li><div><strong>Fecha tentativa de resolución</strong><p>Cada pendiente puede registrar una fecha tentativa de resolución, lo que facilita la planificación y priorización del trabajo.</p></div></li>
                    <li><div><strong>Nuevo módulo de calendario</strong><p>Se agregó un calendario que se basa en la fecha tentativa de resolución y respeta el código de colores de los estados de los pendientes, ofreciendo una vista visual y clara de la carga de trabajo.</p></div></li>
                    <li><div><strong>Mayor flexibilidad en servicios por empresa</strong><p>Se eliminó la obligación de ligar previamente servicios a una empresa. Ahora puedes registrar pendientes aunque la empresa no tenga asignado el servicio en su catálogo, agilizando el alta de casos.</p></div></li>
                    <li><div><strong>Filtros avanzados en módulos clave</strong><p>Se incorporaron filtros avanzados en las tablas principales de los módulos de pendientes, empresas, proyectos y usuarios, reduciendo el tiempo necesario para encontrar información específica.</p></div></li>
                    <li><div><strong>IA integrada en gran parte del sistema</strong><p>El motor de IA ahora participa en más procesos, como en las modales de alta de pendientes sugiriendo automáticamente el servicio más adecuado y apoyando a los módulos que lo permiten.</p></div></li>
                    <li><div><strong>Accesos rápidos desde empresas, proyectos y usuarios</strong><p>En las tablas de empresas, proyectos y usuarios se añadieron botones en la columna de acciones para ir directamente al módulo de pendientes con el registro seleccionado.</p></div></li>
                    <li><div><strong>Previsualización de pendientes</strong><p>Ahora es posible abrir una ventana emergente para ver una previsualización del pendiente desde varias tablas. Desde esta ventana también se puede ir directamente al módulo de pendientes con el registro seleccionado.</p></div></li>
                    <li><div><strong>Asignación de pendientes desde más módulos</strong><p>Ahora puedes asignar pendientes a usuarios y proyectos directamente desde los módulos que permiten alta de pendientes: empresas, usuarios, proyectos y dictado de pendientes.</p></div></li>
                    <li><div><strong>Programador de pendientes recurrentes</strong><p>Se añadió un programador avanzado que permite crear pendientes repetitivos con periodicidad diaria, semanal, mensual, anual o personalizada, definiendo fechas de inicio y fin para controlar el periodo activo.</p></div></li>
                    <li><div><strong>Nuevo motor de dictado por voz mejorado</strong><p>Cuéntale a la IA que solicita el cliente/usuario y el problema que presenta, y la IA reformateará el mensaje para registrar el pendiente de forma clara para el técnico.</p></div></li>
                    <li><div><strong>Listados ordenados por relevancia</strong><p>Se ajustó el comportamiento de los listados iniciales que antes se mostraban de forma uniforme. Ahora se prioriza la información más relevante, dando mayor visibilidad a los pendientes con mayor prioridad y antigüedad, para que la atención del equipo se enfoque primero en lo más crítico.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Corrección de errores (bugs)</h4>
                    <ul>
                    <li><div><strong>Validaciones en altas desde modales</strong><p>Se corrigió un problema que permitía agregar pendientes desde algunas ventanas modales sin datos obligatorios, como la empresa solicitante.</p></div></li>
                    <li><div><strong>Fecha de finalización de proyectos</strong><p>Ahora, cuando se termina el último pendiente de un proyecto, se asigna correctamente la fecha de finalización del mismo.</p></div></li>
                    <li><div><strong>Confirmación al registrar pendientes</strong><p>Se solucionó un bug que impedía mostrar la confirmación de registro de pendientes en los módulos de empresas y usuarios.</p></div></li>
                    <li><div><strong>Botón "Limpiar filtros" en tablas iniciales</strong><p>Se corrigió el botón de limpieza de filtros en las tablas principales de cada módulo, que anteriormente no eliminaba los filtros aplicados.</p></div></li>
                    <li><div><strong>Guardado de proyecto asociado a nuevos pendientes</strong><p>Se corrigió un problema que impedía guardar el proyecto seleccionado al registrar un nuevo pendiente asociado a un proyecto.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Nuevos módulos</h4>
                    <ul>
                    <li><div><strong>Módulo de calendario</strong><p>Nueva vista de calendario para consultar pendientes por fecha de forma visual y ordenada.</p></div></li>
                    <li><div><strong>Módulo de pendientes programados</strong><p>Gestor especializado para administrar pendientes recurrentes y su programación de forma centralizada.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v2.0.0</span>
                    <span class="disc__t">Gestión de Proyectos y Asignación Rápida de Servicios</span>
                    <span class="disc__d">10 nov 2025</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Nuevas funcionalidades para mejorar tu productividad</h4>
                    <ul>
                    <li><div><strong>Organización por proyectos</strong><p>Agrupa tus tareas por proyectos para una mejor organización y seguimiento.</p></div></li>
                    <li><div><strong>Asignación masiva de servicios</strong><p>Asigna todos los servicios a una empresa con un solo clic.</p></div></li>
                    <li><div><strong>Vinculación de tareas con proyectos</strong><p>Relaciona cada pendiente con un proyecto específico para mayor control.</p></div></li>
                    <li><div><strong>Visualización del progreso</strong><p>Barra de progreso animada que muestra el avance de cada proyecto en tiempo real.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Mejoras en la experiencia de usuario</h4>
                    <ul>
                    <li><div><strong>Ventanas mejoradas</strong><p>Corrección en la visualización de tablas en ventanas emergentes.</p></div></li>
                    <li><div><strong>Menú reorganizado</strong><p>Nueva estructura más intuitiva con acceso directo a proyectos.</p></div></li>
                    <li><div><strong>Interfaz mejorada</strong><p>Títulos actualizados en formularios de usuarios y servicios.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Beneficios para tu equipo</h4>
                    <ul>
                    <li><div><strong>Mayor eficiencia</strong><p>Reduce el tiempo en tareas administrativas con la asignación masiva.</p></div></li>
                    <li><div><strong>Mejor visibilidad</strong><p>Control visual del progreso de cada proyecto en tiempo real.</p></div></li>
                    <li><div><strong>Colaboración mejorada</strong><p>Asignación de tareas a proyectos específicos para equipos más enfocados.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v1.0.1</span>
                    <span class="disc__t">Mejoras en la Experiencia de Usuario</span>
                    <span class="disc__d">06 nov 2025</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Correcciones para una experiencia más fluida</h4>
                    <ul>
                    <li><div><strong>Eliminación de procesos duplicados</strong><p>Corregido un problema que causaba inicialización redundante en el formulario de pendientes.</p></div></li>
                    <li><div><strong>Mejora en las notificaciones</strong><p>Las alertas ya no interrumpen tu trabajo mientras escribes.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Impacto en tu día a día</h4>
                    <ul>
                    <li><div><strong>Flujo de trabajo ininterrumpido</strong><p>Mantén el foco en tus tareas sin distracciones innecesarias.</p></div></li>
                    <li><div><strong>Rendimiento optimizado</strong><p>Eliminación de procesos redundantes que afectaban el rendimiento.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Mejoras generales</h4>
                    <ul>
                    <li><div><strong>Actualización del sistema</strong><p>Versión actualizada con las últimas mejoras de estabilidad.</p></div></li>
                    </ul>
                </div>
            </details>
            <details class="disc">
                <summary class="disc__sum">
                    <span class="disc__v">v1.0.0</span>
                    <span class="disc__t">Lanzamiento Oficial de SmartPend</span>
                    <span class="disc__d">oct 2025</span>
                    <?= a_icon('chevron', 'disc__chev') ?>
                </summary>
                <div class="disc__body">
                    <h4 class="disc__group">Presentamos SmartPend: la solución definitiva para gestión de tareas</h4>
                    <ul>
                    <li><div><strong>Control completo de pendientes</strong><p>Registra, asigna y da seguimiento a todas tus tareas con estados personalizables.</p></div></li>
                    <li><div><strong>Gestión de clientes</strong><p>Organiza toda la información de tus empresas y clientes.</p></div></li>
                    <li><div><strong>Catálogo de servicios</strong><p>Clasifica y asigna servicios a cada empresa.</p></div></li>
                    <li><div><strong>Administración de usuarios</strong><p>Sistema de autenticación y perfiles de usuario.</p></div></li>
                    <li><div><strong>Dictado inteligente</strong><p>Crea tareas usando tu voz con nuestra tecnología de IA.</p></div></li>
                    <li><div><strong>Gestión de documentos</strong><p>Adjunta y organiza archivos relacionados con cada tarea.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Características destacadas</h4>
                    <ul>
                    <li><div><strong>Rendimiento excepcional</strong><p>Tiempo de respuesta inferior a 2 segundos para todas las operaciones.</p></div></li>
                    <li><div><strong>Diseño responsivo</strong><p>Accede desde cualquier dispositivo con una experiencia optimizada.</p></div></li>
                    </ul>
                    <h4 class="disc__group">Seguridad y confiabilidad</h4>
                    <ul>
                    <li><div><strong>Protección avanzada</strong><p>Tus datos están seguros con encriptación de última generación.</p></div></li>
                    <li><div><strong>Disponibilidad garantizada</strong><p>Acceso a tu sistema 24/7 con más del 98% de tiempo de actividad.</p></div></li>
                    </ul>
                </div>
            </details>
        </div>

        <div class="mt-block">
            <?= a_head('08', 'En camino', 'Lo que sigue', '', 'head--sub') ?>
            <div class="roadmap" data-reveal>
                <div class="roadmap__item"><h3>Asignación por grupo</h3><p>Envía un pendiente a un equipo completo, no solo a una persona.</p><span class="mono">Previsto para Q2 2026</span></div>
                <div class="roadmap__item"><h3>Flujo de aprobación</h3><p>Pasos de validación antes de dar por cerrado un pendiente.</p><span class="mono">Previsto para Q3 2026</span></div>
                <div class="roadmap__item"><h3>Sugerencia de asignado por IA</h3><p>El sistema propone quién debería atenderlo según el historial.</p><span class="mono">Previsto para Q4 2026</span></div>
                <div class="roadmap__item"><h3>Sugerencia por departamento (IA)</h3><p>Identifica automáticamente el departamento o rol más adecuado para resolver cada pendiente, reduciendo tiempos de derivación.</p><span class="mono">Previsto para Q4 2026</span></div>
                <div class="roadmap__item"><h3>Resúmenes automáticos (IA)</h3><p>Botón "Resumir" que genera un resumen breve del caso a partir de notas e historial, junto con próximos pasos sugeridos para supervisores.</p><span class="mono">Previsto para Q1 2027</span></div>
                <div class="roadmap__item"><h3>Mensajes al cliente/usuario por IA</h3><p>Generación automática del cuerpo del correo o mensaje al cliente/usuario al resolver un pendiente, usando el contexto del caso. Siempre editable antes de enviar.</p><span class="mono">Previsto para Q1 2027</span></div>
                <div class="roadmap__item"><h3>Bot de Telegram</h3><p>Crea y consulta pendientes desde la mensajería que ya usas.</p><span class="mono">Previsto para Q2 2027</span></div>
            </div>
            <div class="notice" data-reveal style="margin-top:var(--sp-5)">
                <?= a_icon('alert') ?>
                <div><p>Las fechas, el orden y la disponibilidad de esta funcionalidad están sujetos a cambios sin previo aviso.</p></div>
            </div>
        </div>
    </div>
</section>

<!-- 08 · Confianza -------------------------------------------------------- -->
<section class="section band on-dark" id="confianza">
    <div class="container">
        <?= a_head('09', 'Confianza', 'Software con responsable, no un servicio anónimo',
            'SmartPend es un producto de Alkes. Detrás hay un equipo con nombre, correo y teléfono, que desarrolla, opera y da soporte al mismo sistema.') ?>
        <div class="trust trust--4" data-reveal>
            <div class="trust__item"><?= a_icon('cloud') ?><h3>Plataforma en la nube</h3><p>Sin instalaciones ni servidores propios. Entras por el navegador y empiezas a trabajar.</p></div>
            <div class="trust__item"><?= a_icon('shield') ?><h3>Infraestructura protegida</h3><p>Servidor con motor de seguridad anti-DDoS y acceso cifrado en todo el sistema.</p></div>
            <div class="trust__item"><?= a_icon('refresh') ?><h3>Actualizaciones incluidas</h3><p>Las nuevas funciones y correcciones llegan sin costo adicional durante tu periodo.</p></div>
            <div class="trust__item"><?= a_icon('lock') ?><h3>Tus datos, separados</h3><p>Permisos por grupos y visibilidad controlada entre áreas, empresas y servicios.</p></div>
        </div>
        <div class="mt-block">
            <?= a_autor('Desarrollo y opero SmartPend de principio a fin. Si necesitas soporte, una demostración guiada o integrar un módulo a la medida de tu operación, hablas directamente con quien construye el sistema.') ?>
            <div class="author__links" style="margin-top:var(--sp-4)">
                <a href="https://github.com/GustavoQuinteroC" target="_blank" rel="noopener"><?= a_icon('external') ?>GitHub</a>
                <a href="https://www.linkedin.com/in/gustavo-quintero-81aa18169/" target="_blank" rel="noopener"><?= a_icon('external') ?>LinkedIn</a>
            </div>
        </div>
    </div>
</section>

<!-- 09 · Cierre ----------------------------------------------------------- -->
<section class="section section--tight">
    <div class="container">
        <div class="cta" data-reveal>
            <div>
                <p class="eyebrow">Empieza hoy</p>
                <h2>Que tu equipo deje de perseguir pendientes</h2>
                <p class="lede">Entra al demo con las credenciales de prueba, o contrata el plan que
                   necesites y empieza a operar el mismo día.</p>
            </div>
            <div class="btn-row">
                <a class="btn btn--primary btn--lg" href="#precios">Ver planes y precios<?= a_icon('arrow') ?></a>
                <a class="btn btn--outline btn--lg" href="<?= a_e($URL_APP) ?>" data-open-demo><?= a_icon('play') ?>Probar el demo</a>
            </div>
        </div>
    </div>
</section>

<!-- 10 · Contacto --------------------------------------------------------- -->
<section class="section section--sunken section--rule" id="contacto">
    <div class="container">
        <?= a_head('10', 'Contacto', 'Hablemos',
            'Soporte técnico, dudas comerciales o módulos a la medida. Tu mensaje llega a una bandeja real.') ?>
        <div class="contact contact--3" data-reveal>
            <a class="contact__item" href="mailto:<?= ALKES_MAIL ?>">
                <?= a_icon('mail') ?><span class="contact__k">Correo</span>
                <span class="contact__v"><?= ALKES_MAIL ?></span>
                <span class="contact__d">Respuesta en horario hábil.</span>
            </a>
            <a class="contact__item" href="tel:<?= ALKES_TEL ?>">
                <?= a_icon('phone') ?><span class="contact__k">Teléfono</span>
                <span class="contact__v"><?= ALKES_TEL_TXT ?></span>
                <span class="contact__d">Para demostraciones guiadas.</span>
            </a>
            <a class="contact__item" href="<?= a_e($URL_APP) ?>">
                <?= a_icon('login') ?><span class="contact__k">Acceso</span>
                <span class="contact__v">app.smartpend.alkes.mx</span>
                <span class="contact__d">Entra a tu cuenta de SmartPend.</span>
            </a>
        </div>
    </div>
</section>

<!-- 11 · Ecosistema ------------------------------------------------------- -->
<section class="section section--tight" id="ecosistema">
    <div class="container">
        <?= a_head('11', 'Ecosistema Alkes', 'SmartPend no está solo',
            'Cinco productos desarrollados, alojados y operados por Alkes. Mismo soporte, misma casa.') ?>
        <?= a_ecosistema_grid($PROD) ?>
    </div>
</section>

</main>

<footer class="footer">
    <div class="container footer__top">
        <div class="footer__brand">
            <span class="nav__logo"><img src="assets/img/logo-blanco.png" alt="" width="34" height="34"><span>SmartPend</span></span>
            <p>Sistema de gestión de pendientes y proyectos. Centraliza la operación, ordena
               las prioridades y conserva la trazabilidad de cada solicitud.</p>
        </div>
        <div class="footer__cols">
            <div class="footer__col">
                <h2 class="footer__h">Producto</h2>
                <ul>
                    <li><a href="#producto">Qué es</a></li>
                    <li><a href="#capacidades">Capacidades</a></li>
                    <li><a href="#precios">Planes y precios</a></li>
                    <li><a href="#novedades">Novedades</a></li>
                </ul>
            </div>
            <div class="footer__col">
                <h2 class="footer__h">Accesos</h2>
                <ul>
                    <li><a href="<?= a_e($URL_APP) ?>">Iniciar sesión</a></li>
                    <li><a href="<?= a_e($URL_APP) ?>" data-open-demo>Probar el demo</a></li>
                    <li><a href="<?= ALKES_CENTRAL ?>">Contratar</a></li>
                    <li><a href="<?= ALKES_SITIO ?>">Alkes</a></li>
                </ul>
            </div>
            <div class="footer__col">
                <h2 class="footer__h">Legal</h2>
                <ul>
                    <li><a href="assets/docs/terminos-y-condiciones.html">Términos y condiciones</a></li>
                    <li><a href="assets/docs/politica-de-privacidad.html">Privacidad</a></li>
                    <li><a href="assets/docs/aviso-de-cookies.html">Cookies</a></li>
                    <li><a href="assets/docs/aviso-legal-limitaciones.html">Aviso legal</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="footer__bot">
            <p>© <?= date('Y') ?> SmartPend. Todos los derechos reservados.</p>
            <a class="footer__sig" href="<?= ALKES_SITIO ?>">Un producto de <strong>ALKES</strong></a>
        </div>
    </div>
</footer>

<?= a_dialogo_demo($URL_APP) ?>

<script src="assets/js/alkes.js" defer></script>
</body>
</html>
