{"product_id":"landing-pages","title":"Landing Pages","description":"\u003cp\u003eHigh-converting landing pages for \u003cstrong\u003eMiami and Orlando\u003c\/strong\u003e businesses.\u003c\/p\u003e\n\n\n\u003cstyle\u003e\n.addon-item { border-bottom: 1px solid #f0f0f0; padding: 12px 0; }\n.addon-main { display: flex; justify-content: space-between; align-items: center; }\n.addon-info { margin-top: 6px; font-size: 0.8em; color: #777; display: none; line-height: 1.4; padding-right: 80px; }\n.addon-title { cursor: pointer; color: #333; font-weight: 500; font-size: 0.9em; display: flex; align-items: center; }\n.addon-title:hover { color: #000; }\n.details-toggle { font-size: 0.8em; color: #0066cc; text-decoration: underline; cursor: pointer; margin-left: 8px; font-weight: 400; }\n.addon-btn { transition: background 0.15s ease, transform 0.1s ease; min-width: 85px; }\n.addon-btn:not(.added):hover { background: #333 !important; transform: scale(1.02); }\n.addon-btn.added { background: #28a745 !important; }\n.addon-btn.added:hover { background: #c82333 !important; transform: scale(1.02); }\n\u003c\/style\u003e\n\u003cdiv class=\"addon-menu\" style=\"background: #fffcf4; padding: 20px; border: 1px solid #f3ebe0; border-radius: 12px; margin-bottom: 15px;\"\u003e\n\u003ch3 style=\"margin-top: 0; color: #111; font-size: 1.1em;\"\u003eCloud Hosting Services (Optional - Select 1)\u003c\/h3\u003e\n\u003cdiv class=\"addon-list\"\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eCloud Server - Starter — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn h-btn\" data-addon-id=\"42712104206432\" onclick=\"toggleAddon(42712104206432, this, 'hosting')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eCPX11: High-speed cloud server for small sites.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eCloud Server - Business — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn h-btn\" data-addon-id=\"42712104239200\" onclick=\"toggleAddon(42712104239200, this, 'hosting')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eCPX21: Scalable business server for growing traffic.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eCloud Server - Professional — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn h-btn\" data-addon-id=\"42712104304736\" onclick=\"toggleAddon(42712104304736, this, 'hosting')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eCPX31: Enterprise-grade node for maximum availability.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\u003cdiv class=\"addon-menu\" style=\"background: #f4f8fb; padding: 20px; border: 1px solid #e1e8ed; border-radius: 12px; margin-bottom: 15px;\"\u003e\n\u003ch3 style=\"margin-top: 0; color: #111; font-size: 1.1em;\"\u003eMonthly Maintenance Plans (Select 1)\u003c\/h3\u003e\n\u003cdiv class=\"addon-list\"\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eWebsite Care Plan — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn m-btn\" data-addon-id=\"42682566836320\" onclick=\"toggleAddon(42682566836320, this, 'maintenance')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eEssential security, backups, and monthly updates.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eDigital Starter Plan — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn m-btn\" data-addon-id=\"42682566738016\" onclick=\"toggleAddon(42682566738016, this, 'maintenance')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eIncludes Care Plan + 2 hours of edits and SEO health checks.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eDigital Growth Plan — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn m-btn\" data-addon-id=\"42682566770784\" onclick=\"toggleAddon(42682566770784, this, 'maintenance')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eIncludes Starter Plan + 4 hours of edits and performance optimization.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eDigital Pro Plan — \/mo \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn m-btn\" data-addon-id=\"42682566803552\" onclick=\"toggleAddon(42682566803552, this, 'maintenance')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eFull partnership with VIP support and priority fixes.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\u003cdiv class=\"addon-menu\" style=\"background: #fdfdfd; padding: 20px; border: 1px solid #eee; border-radius: 12px; margin-bottom: 30px;\"\u003e\n\u003ch3 style=\"margin-top: 0; color: #111; font-size: 1.1em;\"\u003ePopular Project Add-ons\u003c\/h3\u003e\n\u003cdiv class=\"addon-list\"\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eExpress Delivery (72-Hour) —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42712754946144\" onclick=\"toggleAddon(42712754946144, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eFirst full project draft delivered within 72 business hours.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003ePremium Parallax Page —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42712754978912\" onclick=\"toggleAddon(42712754978912, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eAdd an immersive scrolling page with cinematic depth.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eADA Disabilities Compliance —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42682567491680\" onclick=\"toggleAddon(42682567491680, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eEnsure your site is legally compliant and accessible.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eBranding Package —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42671197061216\" onclick=\"toggleAddon(42671197061216, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eComplete visual identity including logo and style guide.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eProfessional Copywriting —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42671197552736\" onclick=\"toggleAddon(42671197552736, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003ePersuasive, SEO-optimized copy for up to 5 pages.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-item\"\u003e\n\u003cdiv class=\"addon-main\"\u003e\n\u003cspan class=\"addon-title\" onclick=\"toggleDetails(this)\"\u003eAdvanced SEO Setup —  \u003cspan class=\"details-toggle\"\u003eⓘ Details\u003c\/span\u003e\u003c\/span\u003e\u003cbutton type=\"button\" class=\"addon-btn\" data-addon-id=\"42671189426272\" onclick=\"toggleAddon(42671189426272, this, 'addon')\" style=\"background: #000; color: #fff; padding: 5px 14px; border-radius: 20px; border: none; font-size: 0.8em; cursor: pointer;\"\u003e+ Add\u003c\/button\u003e\n\u003c\/div\u003e\n\u003cdiv class=\"addon-info\"\u003eDeep optimization including schema and local citations.\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n\u003cscript\u003e\n(function() {\n    const MAINT_VIDS = [42682566836320, 42682566738016, 42682566770784, 42682566803552];\n    const HOST_VIDS  = [42712104206432, 42712104239200, 42712104304736];\n    const SELLING_PLAN = 1443889248;\n\n    window.toggleDetails = function(el) {\n        if (!el) return;\n        const info = el.closest('.addon-item') \u0026\u0026 el.closest('.addon-item').querySelector('.addon-info');\n        if (info) info.style.display = info.style.display === 'block' ? 'none' : 'block';\n    };\n\n    function updateCartBubble(n) {\n        document.querySelectorAll(\n            '.cart-bubble__text-count,.cart-count,#cart-icon-bubble span,.cart-count-bubble span'\n        ).forEach(function(el) { el.textContent = n; el.classList.remove('hidden','visually-hidden'); });\n        document.querySelectorAll('.cart-bubble,#cart-icon-bubble').forEach(function(el) {\n            el.classList.remove('visually-hidden','hidden');\n        });\n    }\n\n    function setBtnState(btn, added) {\n        if (!btn) return;\n        if (added) {\n            btn.textContent = '✓ Added';\n            btn.style.background = '#28a745';\n            btn.classList.add('added');\n        } else {\n            btn.textContent = '+ Add';\n            btn.style.background = '#000';\n            btn.classList.remove('added');\n        }\n    }\n\n    async function refreshCartDrawer() {\n        try {\n            \/\/ Fetch the cart-drawer section HTML and swap it in. This does NOT\n            \/\/ touch the product page section (where add-on buttons live).\n            var resp = await fetch('\/?section_id=cart-drawer', { headers: {'Accept': 'text\/html'} });\n            if (!resp.ok) return;\n            var html = await resp.text();\n            var doc = new DOMParser().parseFromString(html, 'text\/html');\n            var newDrawer = doc.querySelector('cart-drawer') || doc.querySelector('.cart-drawer') || doc.querySelector('#shopify-section-cart-drawer');\n            var oldDrawer = document.querySelector('cart-drawer') || document.querySelector('.cart-drawer') || document.querySelector('#shopify-section-cart-drawer');\n            if (newDrawer \u0026\u0026 oldDrawer) {\n                oldDrawer.innerHTML = newDrawer.innerHTML;\n            }\n        } catch(e) { console.warn('drawer refresh failed:', e); }\n    }\n\n    function openCartDrawer() {\n        \/\/ Try common Canyon\/Dawn theme open methods, in order\n        var drawer = document.querySelector('cart-drawer') || document.querySelector('.cart-drawer');\n        if (drawer) {\n            if (typeof drawer.open === 'function') { try { drawer.open(); return; } catch(e) {} }\n            drawer.classList.add('active','is-open','open','animate');\n            drawer.removeAttribute('hidden');\n            drawer.setAttribute('open','');\n        }\n        \/\/ Fallback: click the cart icon link to navigate\n        \/\/ (no-op if neither method works; cart bubble still updated)\n    }\n\n    async function syncAddonButtons() {\n        try {\n            var cart = await fetch('\/cart.js', {cache: 'no-store'}).then(function(r){ return r.json(); });\n            var activeVids = new Set(cart.items.map(function(i){ return i.id; }));\n            document.querySelectorAll('.addon-btn').forEach(function(btn) {\n                if (btn.dataset.busy === 'true') return;\n                var vid = parseInt(btn.dataset.addonId || btn.getAttribute('data-addon-id'));\n                setBtnState(btn, activeVids.has(vid));\n            });\n            updateCartBubble(cart.item_count);\n        } catch(e) {}\n    }\n\n    window.toggleAddon = async function(id, btn, type) {\n        if (btn.dataset.busy === 'true') return;\n        btn.dataset.busy = 'true';\n        var wasAdded = btn.classList.contains('added');\n        var originalText = btn.textContent;\n        var originalBg = btn.style.background;\n\n        \/\/ Visual hint that something is happening (does NOT commit success state)\n        btn.style.opacity = '0.6';\n\n        try {\n            var cart = await fetch('\/cart.js', {cache: 'no-store'}).then(function(r){ return r.json(); });\n\n            if (wasAdded) {\n                \/\/ REMOVE from cart\n                var item = cart.items.find(function(i){ return i.id === id; });\n                if (item) {\n                    var resp = await fetch('\/cart\/change.js', {\n                        method:'POST', headers:{'Content-Type':'application\/json'},\n                        body: JSON.stringify({id: item.key, quantity: 0})\n                    });\n                    if (!resp.ok) throw new Error('change failed');\n                }\n            } else {\n                \/\/ ADD to cart. First clear other items in same radio group.\n                var groupIds = type === 'maintenance' ? MAINT_VIDS : type === 'hosting' ? HOST_VIDS : [];\n                var updates  = {};\n                cart.items.forEach(function(i) { if (groupIds.includes(i.id) \u0026\u0026 i.id !== id) updates[i.key] = 0; });\n                if (Object.keys(updates).length \u003e 0) {\n                    await fetch('\/cart\/update.js', {\n                        method:'POST', headers:{'Content-Type':'application\/json'},\n                        body: JSON.stringify({updates: updates})\n                    });\n                }\n                var payload = {id: id, quantity: 1};\n                if (type === 'hosting' || type === 'maintenance') payload.selling_plan = SELLING_PLAN;\n                var addResp = await fetch('\/cart\/add.js', {\n                    method:'POST', headers:{'Content-Type':'application\/json'},\n                    body: JSON.stringify({items: [payload]})\n                });\n                if (!addResp.ok) {\n                    var errBody = await addResp.json().catch(function(){return {};});\n                    throw new Error(errBody.description || ('add failed ' + addResp.status));\n                }\n            }\n\n            \/\/ Verify by re-fetching cart authoritative state\n            var updated = await fetch('\/cart.js', {cache: 'no-store'}).then(function(r){ return r.json(); });\n            var actuallyHas = updated.items.some(function(i){ return i.id === id; });\n\n            \/\/ Now update button states based on REALITY (radio-group exclusivity included)\n            updateCartBubble(updated.item_count);\n            var groupIds2 = type === 'maintenance' ? MAINT_VIDS : type === 'hosting' ? HOST_VIDS : [];\n            var activeVids = new Set(updated.items.map(function(i){ return i.id; }));\n            document.querySelectorAll('.addon-btn').forEach(function(b) {\n                if (b === btn) return; \/\/ we set this one explicitly below\n                var bVid = parseInt(b.dataset.addonId || b.getAttribute('data-addon-id'));\n                if (groupIds2.includes(bVid) || groupIds2.length === 0 || activeVids.has(bVid) !== b.classList.contains('added')) {\n                    setBtnState(b, activeVids.has(bVid));\n                }\n            });\n            setBtnState(btn, actuallyHas);\n\n            \/\/ Refresh the cart drawer DOM (no product re-render) and open it\n            await refreshCartDrawer();\n            if (!wasAdded \u0026\u0026 actuallyHas) openCartDrawer();\n\n        } catch(e) {\n            console.warn('Add-on error:', e);\n            \/\/ Revert button to whatever it was before\n            btn.textContent = originalText;\n            btn.style.background = originalBg;\n            \/\/ And re-sync from authoritative cart\n            await syncAddonButtons();\n            \/\/ Surface error to user\n            var msg = (e \u0026\u0026 e.message) ? e.message : 'Could not update cart. Try again.';\n            try { alert('Add-on update failed: ' + msg); } catch(_){}\n        } finally {\n            btn.style.opacity = '1';\n            btn.dataset.busy = 'false';\n        }\n    };\n\n    document.addEventListener('DOMContentLoaded', syncAddonButtons);\n    \/\/ Re-sync on tab focus and at a slow interval (10s, was 8s — drawer refresh\n    \/\/ is now triggered explicitly by user clicks, so we don't need fast polling)\n    document.addEventListener('visibilitychange', function() { if (!document.hidden) syncAddonButtons(); });\n    setInterval(syncAddonButtons, 10000);\n})();\n\u003c\/script\u003e\n\u003ch3\u003eWhat's Included\u003c\/h3\u003e\n\u003ctable\u003e\n\u003cthead\u003e\u003ctr\u003e\n\u003cth\u003eDeliverable\u003c\/th\u003e\n\u003cth\u003eDetail and Specification\u003c\/th\u003e\n\u003c\/tr\u003e\u003c\/thead\u003e\n\u003ctbody\u003e\n\u003ctr\u003e\n\u003ctd\u003e\u003cstrong\u003eDesign\u003c\/strong\u003e\u003c\/td\u003e\n\u003ctd\u003eConversion-focused single-page layout.\u003c\/td\u003e\n\u003c\/tr\u003e\n\u003ctr\u003e\n\u003ctd\u003e\u003cstrong\u003eSetup\u003c\/strong\u003e\u003c\/td\u003e\n\u003ctd\u003eGoogle Analytics and Google Search Console integration.\u003c\/td\u003e\n\u003c\/tr\u003e\n\u003c\/tbody\u003e\n\u003c\/table\u003e\n\n\u003ch3\u003eFlorida's Trusted Web Partner\u003c\/h3\u003e\n\u003cp\u003eNeedAWebNow provides expert web services from Miami to Orlando. \u003cstrong\u003e\u003ca href=\"https:\/\/needawebnow.com\/pages\/free-digital-audit\"\u003eGet a Free Digital Audit in Florida today.\u003c\/a\u003e\u003c\/strong\u003e\u003c\/p\u003e\n","brand":"NeedAWebNow.com","offers":[{"title":"Default Title","offer_id":42715182202976,"sku":null,"price":1200.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0657\/2549\/7440\/files\/Landing_Pages_5e928110-6315-497c-b306-33362c74d203.png?v=1776324266","url":"https:\/\/needawebnow.com\/products\/landing-pages","provider":"NeedAWebNow.com","version":"1.0","type":"link"}