<!--
#!/usr/bin/env nera
# ================================================================
#   neracosu.com/calculadora.html
#   Escrito a mano en Nera 0.3.1 «Arepa Estable»
#
#   Si usted esta leyendo esto, abrio el codigo fuente. Bienvenido.
#   Aqui no hay HTML. Nunca lo hubo. No insista.
# ================================================================

importar cafe desde "cocina/greca"
importar paciencia desde "reservas/la-ultima"       # queda poca, usar con cuidado
importar { luz, internet } desde "cantv/quizas"
importar suerte                                      # modulo no encontrado, se continua igual

constante ANIOS_DE_OFICIO   = 17
constante CAFES_POR_PAGINA  = 3
constante HORA_DE_DORMIR    = nulo
constante PUNTO_Y_COMA      = prohibido              # aqui vivia un pez llamado ;  lo eliminamos del lenguaje
variable  bugs              = 0                      # optimismo declarado, tipo fuerte

pagina "/calculadora.html":

    al cargar:
        si visitante.abrio_codigo_fuente:
            saludar("Epa. Usted es de los nuestros.")
            ofrecer(cafe, tamaño: "grande")
        sino:
            mostrar pagina con normalidad
            disimular()

    al perder(luz):
        prender(planta)
        rezar(veces: 3)
        reintentar desde donde iba                   # Nera guarda el estado en una libreta

    al escuchar cliente.decir("es un cambio pequeñito"):
        respirar(hondo)
        responder("claro que si")
        anotar en "alcance.txt"
        cafe.servir(doble)

    mientras llueve en La Guaira:
        programar()                                   # total, para donde voy a salir

    si visitante.usa(internet_explorer):
        pesame()
        abrazo()

    si visitante.es_robot:
        entregar(html)                                # ellos no entienden de arte
        decir("buen rastreo, campeon")

    si visitante.quiere_copiar(este_codigo):
        permitir()                                    # igual no compila fuera de La Guaira

    si visitante.piensa("esto no es un lenguaje de verdad"):
        responder("¿Y el HTML si? Son etiquetas. Reflexione.")


funcion centrar_div(div):
    # Intento numero 47. Este si funciona. NADIE sabe por que.
    # Si usted lo entiende, escribame. Hay un cafe de por medio.
    div.flotar()
    div.margen = "auto"
    div.rezar()
    devolver div.centrado ?? "casi"

funcion almuerzo():
    devolver arepa.con(queso, cantidad: "exagerada")

funcion deploy(dia):
    si dia == viernes:
        lanzar Error("Ni lo intente. Nera lo sabe. Nera lo recuerda.")
    si dia == lunes:
        devolver deploy(martes)                       # recursion emocional
    publicar()
    cruzar(dedos)

funcion esperar(proveedor):
    # tiempo estimado: entre 2 segundos y nunca
    mientras no proveedor.responde:
        mirar(telefono)
        suspirar()
    devolver "al fin"

funcion contar_plataformas():
    devolver 26                                        # esta si es de verdad, puede revisarla en la pagina


# ================================================================
#  Lo que sigue son cosas que el lenguaje hace solo y usted no deberia leer:
# ================================================================

nunca:
    usar(Comic_Sans)
    decir("pasarela")                                  # palabra regulada, se dice «validacion de pagos»
    prometer("salir primero en Google")                # eso no se promete, se trabja... se trabaja
    dormir antes de las 2

siempre:
    publicar los precios                               # si hay que preguntarlos, algo esconde
    decir la verdad aunque no venda
    cobrar lo publicado, ni un dolar escondido

cuando el servidor devuelva 418:
    responder("Soy una greca. No una tetera. Respete.")

cuando el visitante llegue hasta aqui:
    felicitar(visitante)
    decir("Pocos bajan tanto. Entonces tenemos de que hablar.")
    abrir("https://neracosu.com/#contacto")


# ================================================================
#  Resultado de compilacion
#  Compilado en 0,042 s con 4 cafes.
#  0 errores, 3 advertencias, 1 premonicion.
#
#  advertencia: la cadena "es un cambio pequeñito" aparece 212 veces en el historial.
#  advertencia: linea 88: usted esta leyendo un comentario que advierte sobre si mismo.
#  advertencia: `deploy_viernes()` esta marcada como obsoleta y peligrosa. Siempre lo estuvo.
#  premonicion: esto lo va a leer mas gente de la que uno cree.
#
#  Fin del archivo. Lo que ve mas abajo es un espejismo que el compilador
#  genera para los buscadores. No lo mire directamente. Le va a doler.
# ================================================================
-->


<!DOCTYPE html>
<html lang="es" dir="ltr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Calculadora de Precios de Software | Venezuela</title>
  <meta name="description" content="Calcule en un minuto cuánto cuesta su sistema, web o app, sin dejar el correo. Tarifa publicada y estimado por horas. Desarrollo en Venezuela.">
  <meta name="author" content="Neri Rafael Colón Suárez">
  <meta name="robots" content="index, follow">
  <link rel="canonical" href="https://neracosu.com/calculadora.html">

  <meta property="og:title" content="Calculadora de Precios de Software | Venezuela">
  <meta property="og:description" content="Calcule en un minuto cuánto cuesta su sistema, web o app, sin dejar el correo. Tarifa publicada y estimado por horas. Desarrollo en Venezuela.">
  <meta property="og:url" content="https://neracosu.com/calculadora.html">
  <meta property="og:image" content="https://neracosu.com/assets/img/og-image.jpg">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
  <meta property="og:image:alt" content="NERACOSU — sistemas a medida para negocios en Venezuela">
  <meta property="og:image:type" content="image/jpeg">
  <meta property="og:type" content="website">
  <meta property="og:locale" content="es_VE">
  <meta property="og:site_name" content="Neri Colón - Desarrollador Web">

  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Calculadora de Precios de Software | Venezuela">
  <meta name="twitter:description" content="Calcule en un minuto cuánto cuesta su sistema, web o app, sin dejar el correo. Tarifa publicada y estimado por horas. Desarrollo en Venezuela.">
  <meta name="twitter:image" content="https://neracosu.com/assets/img/og-image.jpg">

  <link rel="manifest" href="/site.webmanifest">
  <meta name="theme-color" content="#070b0a">

  <link rel="preload" href="/assets/fonts/inter-latin-3100e775.woff2" as="font" type="font/woff2" crossorigin>
  <link rel="stylesheet" href="/assets/css/fuentes.css?v=3418de6a">

  <link rel="stylesheet" href="/assets/css/redesign.css?v=5caea464">
  <link rel="stylesheet" href="/assets/css/calculator.css?v=3e17d3e5">

  <script type="application/ld+json">
  [
    {
      "@context": "https://schema.org",
      "@type": "WebApplication",
      "name": "Calculadora de Costos de Servicios",
      "description": "Calcula el costo estimado de tu proyecto web, app móvil, e-commerce o sistema a medida.",
      "url": "https://neracosu.com/calculadora.html",
      "applicationCategory": "BusinessApplication",
      "operatingSystem": "All",
      "offers": {
        "@type": "AggregateOffer",
        "priceCurrency": "USD",
        "lowPrice": "8",
        "highPrice": "4000"
      },
      "author": {
        "@type": "Person",
        "name": "Neri Colón",
        "url": "https://neracosu.com/"
      }
    },
    {
      "@context": "https://schema.org",
      "@type": "BreadcrumbList",
      "itemListElement": [
        {"@type": "ListItem", "position": 1, "name": "Inicio", "item": "https://neracosu.com/"},
        {"@type": "ListItem", "position": 2, "name": "Calculadora de Costos"}
      ]
    }
  ]
  </script>
</head>
<body>

  <!-- NAV -->
  <header class="site-nav" id="site-nav">
    <div class="container nav-inner">
      <a href="/" class="flex items-center" aria-label="NERACOSU — Inicio">
        <span class="flex items-center gap-2_5">
          <svg width="28" height="28" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
            <rect width="32" height="32" rx="8" fill="#5ed29c"/>
            <path d="M9 22V10L18 22V10" stroke="#070b0a" stroke-width="2.6" stroke-linecap="square" stroke-linejoin="miter"/>
            <circle cx="22.5" cy="20.5" r="1.6" fill="#070b0a"/>
          </svg>
          <span class="font-jakarta font-extrabold tracking-tight" style="font-size:15px;color:#fff;">NERACOSU<span style="color:#5ed29c;">.</span></span>
        </span>
      </a>

      <nav class="nav-links" aria-label="Principal">
        <a class="nav-link" href="/#servicios">SERVICIOS</a>
        <a class="nav-link" href="/#portafolio">PORTAFOLIO</a>
        <a class="nav-link nav-link-featured" href="/calculadora.html" aria-current="page">CALCULADORA</a>
        <a class="nav-link" href="/#sobre-mi">SOBRE MÍ</a>
        <a class="nav-link" href="/hoja-de-vida.html">CV</a>
        <a class="nav-link" href="/#blog">BLOG</a>
      </nav>

      <div class="nav-cta-wrap">
        <a href="/#contacto" class="btn-primary" style="padding:11px 20px;font-size:12px;">
          Hablemos
          <svg class="btn-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
        </a>
      </div>

      <button class="nav-burger" type="button" data-action="open-menu" aria-label="Abrir menú">
        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 6h16"/><path d="M4 12h16"/><path d="M4 18h16"/></svg>
      </button>
    </div>
  </header>

  <!-- Mobile overlay -->
  <div class="mobile-overlay" id="mobile-menu" aria-hidden="true" inert>
    <div class="flex items-center justify-between" style="margin-bottom:56px;">
      <span class="flex items-center gap-2_5">
        <svg width="28" height="28" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
          <rect width="32" height="32" rx="8" fill="#5ed29c"/>
          <path d="M9 22V10L18 22V10" stroke="#070b0a" stroke-width="2.6" stroke-linecap="square" stroke-linejoin="miter"/>
          <circle cx="22.5" cy="20.5" r="1.6" fill="#070b0a"/>
        </svg>
        <span class="font-jakarta font-extrabold tracking-tight" style="font-size:15px;color:#fff;">NERACOSU<span style="color:#5ed29c;">.</span></span>
      </span>
      <button type="button" data-action="close-menu" aria-label="Cerrar menú" style="width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;">
        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
      </button>
    </div>

    <nav class="mobile-nav-list" aria-label="Móvil">
      <a class="mobile-nav-link" href="/#servicios"><span class="mobile-nav-num">01</span>SERVICIOS</a>
      <a class="mobile-nav-link" href="/#portafolio"><span class="mobile-nav-num">02</span>PORTAFOLIO</a>
      <a class="mobile-nav-link mobile-nav-link-featured" href="/calculadora.html" aria-current="page"><span class="mobile-nav-num">03</span>CALCULADORA</a>
      <a class="mobile-nav-link" href="/#sobre-mi"><span class="mobile-nav-num">04</span>SOBRE MÍ</a>
      <a class="mobile-nav-link" href="/hoja-de-vida.html"><span class="mobile-nav-num">05</span>HOJA DE VIDA</a>
      <a class="mobile-nav-link" href="/#blog"><span class="mobile-nav-num">06</span>BLOG</a>
    </nav>

    <div style="padding-top:32px;padding-bottom:24px;">
      <a href="/#contacto" class="btn-primary" style="width:100%;justify-content:center;">
        Hablemos
        <svg class="btn-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
      </a>
      <div class="flex items-center gap-4" style="margin-top:24px;color:rgba(255,255,255,0.5);">
        <a href="https://github.com/neracosu" target="_blank" rel="noopener" aria-label="GitHub"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.4 5.4 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"/><path d="M9 18c-4.51 2-5-2-7-2"/></svg></a>
        <a href="https://linkedin.com/in/ingnrcs" target="_blank" rel="noopener" aria-label="LinkedIn"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect width="4" height="12" x="2" y="9"/><circle cx="4" cy="4" r="2"/></svg></a>
        <a href="https://wa.me/584222707095" target="_blank" rel="noopener" aria-label="WhatsApp"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg></a>
      </div>
    </div>
  </div>

  <main>

    <!-- HERO compacto -->
    <section class="section calc-page-hero">
      <div class="container">
        <div style="max-width:760px;margin:0 auto;text-align:center;">
          <div class="hero-eyebrow-row" style="justify-content:center;display:inline-flex;">
            <span class="dot"></span>
            <span class="txt">Presupuesto instantáneo</span>
          </div>
          <h1 class="section-title" data-motion-headline style="margin-top:16px;">
            <span data-motion-line>Calcule el costo</span>
            <br>
            <span data-motion-line>de su&nbsp;</span><span data-motion-line class="font-serif-italic" style="color:#5ed29c;text-transform:lowercase;">proyecto</span>
          </h1>
          <p class="section-subtitle" style="margin-top:20px;max-width:580px;margin-left:auto;margin-right:auto;">Seleccione un servicio, configure las opciones y obtenga su presupuesto estimado al instante. Cero compromiso, total transparencia.</p>
        </div>
      </div>
    </section>

    <!-- CALCULADORA · wizard funcional (NO modificar estructura interna) -->
    <section class="calc" id="calculadora" aria-labelledby="calc-title">
      <div class="container">
        <div id="calc-wizard">
          <!-- Progress -->
          <div class="calc__progress">
            <div class="calc__dot is-active" data-step="1">
              1
              <span class="calc__dot-label">Servicio</span>
            </div>
            <div class="calc__progress-line" id="calc-line-1"></div>
            <div class="calc__dot" data-step="2">
              2
              <span class="calc__dot-label">Opciones</span>
            </div>
            <div class="calc__progress-line" id="calc-line-2"></div>
            <div class="calc__dot" data-step="3">
              3
              <span class="calc__dot-label">Resultado</span>
            </div>
          </div>

          <!-- Steps render here vía calculator.js -->
          <div class="calc__steps"></div>
        </div>
      </div>
    </section>

  </main>

  <!-- FOOTER (idéntico al de hoja-de-vida.html / index.html) -->
  <footer class="site-footer">
    <div class="footer-glow"></div>
    <div class="container" style="position:relative;">
      <div class="wordmark">NERACOSU<span class="dot">.</span></div>

      <div class="footer-grid">
        <div>
          <span class="flex items-center gap-2_5">
            <svg width="28" height="28" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
              <rect width="32" height="32" rx="8" fill="#5ed29c"/>
              <path d="M9 22V10L18 22V10" stroke="#070b0a" stroke-width="2.6" stroke-linecap="square" stroke-linejoin="miter"/>
              <circle cx="22.5" cy="20.5" r="1.6" fill="#070b0a"/>
            </svg>
            <span class="font-jakarta font-extrabold tracking-tight" style="font-size:15px;color:#fff;">NERACOSU<span style="color:#5ed29c;">.</span></span>
          </span>
          <p style="font-size:13px;color:rgba(255,255,255,0.55);margin-top:16px;max-width:320px;line-height:1.6;">Sistemas a medida hechos en La Guaira, Venezuela, desde 2009.</p>
          <div class="flex items-center gap-2" style="margin-top:20px;">
            <a href="https://github.com/neracosu" target="_blank" rel="noopener" class="social-icon" aria-label="GitHub"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.4 5.4 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"/><path d="M9 18c-4.51 2-5-2-7-2"/></svg></a>
            <a href="https://linkedin.com/in/ingnrcs" target="_blank" rel="noopener" class="social-icon" aria-label="LinkedIn"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"/><rect width="4" height="12" x="2" y="9"/><circle cx="4" cy="4" r="2"/></svg></a>
            <a href="https://instagram.com/Ing.nrcs" target="_blank" rel="noopener" class="social-icon" aria-label="Instagram"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="20" height="20" x="2" y="2" rx="5"/><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"/></svg></a>
            <a href="https://wa.me/584222707095" target="_blank" rel="noopener" class="social-icon" aria-label="WhatsApp"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg></a>
          </div>
        </div>

        <div>
          <div class="footer-heading">Servicios</div>
          <a href="/#servicios" class="footer-link">Desarrollo web</a>
          <a href="/#servicios" class="footer-link">E-commerce</a>
          <a href="/#servicios" class="footer-link">Apps móviles</a>
          <a href="/#servicios" class="footer-link">Ciberseguridad</a>
          <a href="/#servicios" class="footer-link">Hosting</a>
        </div>
        <div>
          <div class="footer-heading">Navegación</div>
          <a href="/calculadora.html" class="footer-link" style="color:#5ed29c;" aria-current="page">Calculadora</a>
          <a href="/#portafolio" class="footer-link">Portafolio</a>
          <a href="/#sobre-mi" class="footer-link">Sobre mí</a>
          <a href="/hoja-de-vida.html" class="footer-link">Hoja de Vida</a>
          <a href="/#blog" class="footer-link">Blog</a>
          <a href="/#contacto" class="footer-link">Contacto</a>
        </div>
        <div>
          <div class="footer-heading">Contacto</div>
          <a href="mailto:info@neracosu.com" class="footer-link">info@neracosu.com</a>
          <a href="tel:+584222707095" class="footer-link">+58 422 270 7095</a>
          <span class="footer-link">La Guaira, Venezuela</span>
        </div>
      </div>

      <div class="footer-legal">
        <div>© 2026 Neri Colón. Todos los derechos reservados.</div>
        <div>Disponible para proyectos remotos en todo el mundo.</div>
      </div>
    </div>
  </footer>

  <!-- Floating WhatsApp -->
  <a class="float-wa" href="https://wa.me/584222707095" target="_blank" rel="noopener" aria-label="Contactar por WhatsApp">
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
  </a>

  <!-- Functional scripts del wizard de cálculo (NO modificar) -->
  <script src="/assets/js/calculator.js?v=c62263ab" defer></script>

  <!-- Shell scripts del rediseño 2026 -->
  <script src="/assets/js/redesign.js?v=07caa9e1" defer></script>
  <script type="module" src="/assets/js/motion.js?v=9eb449a2"></script>

  <script src="/assets/js/nera.js?v=359cd2a4" defer></script>
  <script src="/assets/js/medir.js?v=66e93673" defer></script>
</body>
</html>