From babbb9907480c2edecfdd1e86cd26308b58cc58c Mon Sep 17 00:00:00 2001
From: feispro <262678496+feiscs@users.noreply.github.com>
Date: Wed, 13 May 2026 20:39:47 -0400
Subject: [PATCH 1/2] Add service pricing section for programming and design
 offering

---
 index.html | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
diff --git a/index.html b/index.html
index fb2043f..552a47b 100644
--- a/index.html
+++ b/index.html
@@ -30,6 +30,7 @@
         <a href="#productos">Productos</a>
         <a href="#coleccion">Colección</a>
         <a href="#garantias">Garantías</a>
+        <a href="#planes">Planes</a>
         <a href="#newsletter">Newsletter</a>
       </nav>
 
@@ -130,6 +131,20 @@ <h2>Diseñada para combinar sin pensar.</h2>
         </div>
       </section>
 
+
+      <section class="pricing" id="planes" aria-label="Planes de servicios digitales">
+        <div class="section-head">
+          <p class="eyebrow">Servicios FORMA</p>
+          <h2>Convierte mi conocimiento en tu crecimiento digital</h2>
+          <p>Plan de trabajo para marcas que necesitan diseño, programación e integración Shopify en un solo flujo.</p>
+        </div>
+        <div class="ops-grid">
+          <article><strong>Plan Base</strong><span>Desde $299</span><p>Landing comercial + branding visual + formulario de contacto con enfoque de conversión.</p></article>
+          <article><strong>Plan Growth</strong><span>Desde $799</span><p>Tienda Shopify personalizada con catálogo, UX premium y automatizaciones esenciales.</p></article>
+          <article><strong>Plan Integración Pro</strong><span>Desde $1,490</span><p>Implementación completa: Shopify + Supabase + asistente IA + analítica y mejoras continuas.</p></article>
+        </div>
+      </section>
+
       <section class="ops-stack" aria-label="Stack de operaciones e integraciones">
         <div>
           <p class="eyebrow">Operación conectada</p>
@@ -189,6 +204,7 @@ <h2>Lista para Shopify, Supabase, Chatbase, GitHub AI y Vercel.</h2>
       <div>
         <a class="brand" href="#inicio"><span class="brand-mark">F</span><span>FORMA</span></a>
         <p>Un e-commerce editorial construido para vender productos premium con claridad, confianza y estilo.</p>
+        <p><strong>Contacto comercial:</strong> FORMA Ventas · <a href="mailto:feispla@hotmail.com" aria-label="Enviar correo a FORMA Ventas">feispla@forma.com</a></p>
       </div>
       <form class="newsletter" data-newsletter-form>
         <label for="email-newsletter">Recibe drops y descuentos privados</label>

From 8f8b64f1ede0f730e4cd1abd20f018197f516fb9 Mon Sep 17 00:00:00 2001
From: feispro <262678496+feiscs@users.noreply.github.com>
Date: Thu, 14 May 2026 18:15:42 -0400
Subject: [PATCH 2/2] Update index.html

---
 index.html | 172 +----------------------------------------------------
 1 file changed, 1 insertion(+), 171 deletions(-)

diff --git a/index.html b/index.html
index ed69cb1..cf4f1c5 100644
--- a/index.html
+++ b/index.html
@@ -1,174 +1,5 @@
-<!doctype html>
-<html lang="es">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>FORMA — Tienda premium de esenciales modernos</title>
-    <meta
-      name="description"
-      content="FORMA es una tienda e-commerce premium con moda, accesorios y lifestyle: catálogo filtrable, quick add, wishlist, detalle de producto, carrito lateral y checkout."
-    />
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Playfair+Display:wght@700;800&display=swap"
-      rel="stylesheet"
-    />
-    <link rel="stylesheet" href="assets/store.css" />
-    <script defer src="assets/config.js"></script>
-    <script defer src="assets/integrations.js"></script>
-    <script defer src="assets/store.js"></script>
-  </head>
-  <body>
-    <header class="navbar" aria-label="Navegación principal">
-      <a class="brand" href="#inicio" aria-label="FORMA inicio">
-        <span class="brand-mark">F</span>
-        <span>FORMA</span>
-      </a>
 
-      <nav class="nav-links" aria-label="Secciones de la tienda">
-        <a href="#productos">Productos</a>
-        <a href="#coleccion">Colección</a>
-        <a href="#garantias">Garantías</a>
-        <a href="#planes">Planes</a>
-        <a href="#newsletter">Newsletter</a>
-      </nav>
-
-      <div class="nav-actions">
-        <label class="search-box" aria-label="Buscar productos">
-          <span aria-hidden="true">⌕</span>
-          <input data-search type="search" placeholder="Buscar" />
-        </label>
-        <button class="nav-icon" type="button" data-open-wishlist aria-label="Abrir favoritos">
-          ♡<strong data-wishlist-count>0</strong>
-        </button>
-        <button class="nav-icon" type="button" aria-label="Cuenta de usuario">◎</button>
-        <button class="cart-trigger" type="button" data-open-cart aria-label="Abrir carrito">
-          Bolsa <strong data-cart-count>0</strong>
-        </button>
-      </div>
-    </header>
-
-    <main>
-      <section class="hero" id="inicio">
-        <div class="hero-copy">
-          <p class="eyebrow">Nueva campaña · Primavera urbana</p>
-          <h1>Esenciales con forma, intención y carácter.</h1>
-          <p>
-            Compra una selección curada de moda, accesorios y objetos lifestyle con estética editorial, materiales premium y experiencia de compra sin fricción.
-          </p>
-          <div class="hero-actions">
-            <a class="btn btn-dark" href="#productos">Comprar ahora</a>
-            <button class="btn btn-light" type="button" data-open-featured>Ver campaña</button>
-          </div>
-          <dl class="stats" aria-label="Estadísticas de la tienda">
-            <div><dt>24h</dt><dd>despacho</dd></div>
-            <div><dt>+18k</dt><dd>clientes</dd></div>
-            <div><dt>4.9</dt><dd>rating</dd></div>
           </dl>
-        </div>
-        <div class="campaign-card" aria-label="Imagen de campaña FORMA">
-          <div class="campaign-image" role="img" aria-label="Bolso y prendas de la campaña primavera urbana"></div>
-          <div class="campaign-note">
-            <span>Drop 04</span>
-            <strong>Minimal Utility</strong>
-          </div>
-        </div>
-      </section>
-
-      <section class="feature-bar" id="garantias" aria-label="Características de compra">
-        <article><span>🚚</span><strong>Envío gratis</strong><p>En pedidos desde $100.</p></article>
-        <article><span>↩</span><strong>Devoluciones fáciles</strong><p>30 días para cambios.</p></article>
-        <article><span>✦</span><strong>Garantía premium</strong><p>Materiales verificados.</p></article>
-        <article><span>◌</span><strong>Soporte humano</strong><p>Asesoría de estilo real.</p></article>
-      </section>
-
-      <section class="catalog" id="productos">
-        <div class="section-head">
-          <p class="eyebrow">Catálogo</p>
-          <h2>Compra por categoría</h2>
-          <p>Filtros rápidos, ordenamiento inteligente, vista compacta y tarjetas listas para conversión.</p>
-        </div>
-
-        <div class="catalog-toolbar">
-          <div class="tabs" role="tablist" aria-label="Filtrar por categoría">
-            <button class="tab is-active" type="button" data-filter="all">Todo</button>
-            <button class="tab" type="button" data-filter="Prendas">Prendas</button>
-            <button class="tab" type="button" data-filter="Bolsos">Bolsos</button>
-            <button class="tab" type="button" data-filter="Accesorios">Accesorios</button>
-            <button class="tab" type="button" data-filter="Hogar">Hogar</button>
-          </div>
-          <div class="toolbar-actions">
-            <label>
-              Ordenar
-              <select data-sort>
-                <option value="newest">Novedad</option>
-                <option value="price-asc">Precio menor</option>
-                <option value="price-desc">Precio mayor</option>
-                <option value="rating">Rating</option>
-              </select>
-            </label>
-            <button class="view-toggle" type="button" data-view-toggle aria-pressed="false">Vista compacta</button>
-          </div>
-        </div>
-
-        <div class="product-grid" data-product-grid></div>
-        <p class="empty-state" data-empty-state hidden>No encontramos productos con esa búsqueda.</p>
-      </section>
-
-      <section class="editorial" id="coleccion">
-        <div>
-          <p class="eyebrow">Colección cápsula</p>
-          <h2>Diseñada para combinar sin pensar.</h2>
-          <p>
-            Piezas neutras, siluetas limpias y acentos de textura para elevar outfits diarios, viajes cortos y espacios personales.
-          </p>
-        </div>
-        <div class="editorial-grid" aria-label="Imágenes personalizadas de colección">
-          <span class="art art-one"></span>
-          <span class="art art-two"></span>
-          <span class="art art-three"></span>
-        </div>
-      </section>
-
-
-      <section class="pricing" id="planes" aria-label="Planes de servicios digitales">
-        <div class="section-head">
-          <p class="eyebrow">Servicios FORMA</p>
-          <h2>Convierte mi conocimiento en tu crecimiento digital</h2>
-          <p>Plan de trabajo para marcas que necesitan diseño, programación e integración Shopify en un solo flujo.</p>
-        </div>
-        <div class="ops-grid">
-          <article><strong>Plan Base</strong><span>Desde $299</span><p>Landing comercial + branding visual + formulario de contacto con enfoque de conversión.</p></article>
-          <article><strong>Plan Growth</strong><span>Desde $799</span><p>Tienda Shopify personalizada con catálogo, UX premium y automatizaciones esenciales.</p></article>
-          <article><strong>Plan Integración Pro</strong><span>Desde $1,490</span><p>Implementación completa: Shopify + Supabase + asistente IA + analítica y mejoras continuas.</p></article>
-        </div>
-      </section>
-
-      <section class="ops-stack" aria-label="Stack de operaciones e integraciones">
-        <div>
-          <p class="eyebrow">Operación conectada</p>
-          <h2>Lista para Shopify, Supabase, Chatbase, GitHub AI y Vercel.</h2>
-          <p>
-            La tienda queda organizada para usar Shopify como catálogo y checkout, Supabase como CRM/eventos, Chatbase como asistente, GitHub con agente IA tipo Claude para PRs y Vercel para previews y producción.
-          </p>
-        </div>
-        <div class="ops-grid">
-          <article><strong>Shopify</strong><span data-integration-status="shopify">Modo demo</span><p>Storefront API para productos y variantes.</p></article>
-          <article><strong>Supabase</strong><span data-integration-status="supabase">Modo demo</span><p>Eventos, newsletter y base operativa.</p></article>
-          <article><strong>Chatbase</strong><span data-integration-status="chatbase">Modo demo</span><p>Chatbot de soporte cargado por configuración.</p></article>
-          <article><strong>GitHub AI</strong><span>Claude-ready</span><p>Flujo de issues, ramas, PRs y revisión.</p></article>
-          <article><strong>Vercel</strong><span>Preview-ready</span><p>Deploy estático con headers y rewrites.</p></article>
-        </div>
-      </section>
-    </main>
-
-   diff --git a/index.html b/index.html
-index 5543082c9361d99e38f3bbd8ef2ac7c2c4fb4ae4..25ea7b4f7732fb6a4b03768afee1285576bd43dc 100644
---- a/index.html
-+++ b/index.html
-@@ -167,43 +167,43 @@
-           </dl>
            <a class="btn btn-dark" href="#newsletter" data-close-cart>Checkout</a>
          </footer>
        </div>
@@ -194,7 +25,7 @@ <h2>Lista para Shopify, Supabase, Chatbase, GitHub AI y Vercel.</h2>
          <a class="brand" href="#inicio"><span class="brand-mark">F</span><span>FORMA</span></a>
          <p>Un e-commerce editorial construido para vender productos premium con claridad, confianza y estilo.</p>
 -        <p><strong>Contacto comercial:</strong> FORMA Ventas · <a href="mailto:feispla@hotmail.com">feispla@hotmail.com</a></p>
-+        <p><strong>Contacto comercial:</strong> FORMA Ventas · <a href="mailto:feispla@forma.com" aria-label="Enviar correo a FORMA Ventas">feispla@forma.com</a></p>
++        <p><strong>Contacto comercial:</strong> FORMA Ventas · <a href="mailto:feispla@hotmail.com" aria-label="Enviar correo a FORMA Ventas">feispla@hotmail.com</a></p>
        </div>
        <form class="newsletter" data-newsletter-form>
          <label for="email-newsletter">Recibe drops y descuentos privados</label>
@@ -212,4 +43,3 @@ <h2>Lista para Shopify, Supabase, Chatbase, GitHub AI y Vercel.</h2>
      </footer>
    </body>
  </html>
-
