B2G Holdings Website Redesign on Webflow

<style> /* ─── Global typography matching velocitygrowth.ae ─── */ .vg-section p { font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.7;color:#06054B;margin:0 0 16px; } .vg-section p:last-child { margin-bottom:0; } .vg-section p strong { color:#06054B; } /* Key Takeaway (white bg, same as body) */ .vg-key-takeaway-content p { font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.7;color:#06054B !important;margin:0 0 16px; } .vg-key-takeaway-content p strong { color:#06054B !important; } .vg-key-takeaway-content p:last-child { margin-bottom:0; } /* Force colors on all injected content - Webflow overrides without !important */ #vg-casestudy-content p { color:#06054B !important; } #vg-casestudy-content li { color:inherit !important; } #vg-casestudy-content .vg-challenge-card p, #vg-casestudy-content .vg-challenge-card li { color:#c8cdd3 !important; } #vg-casestudy-content .vg-challenge-card p[style*="color:#fff"] { color:#fff !important; } #vg-casestudy-content .vg-impact-narrative p { color:#c8cdd3 !important; } /* Impact narrative (navy bg, light text) */ .vg-impact-narrative p { font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.7;color:#c8cdd3;margin:0 0 16px; } .vg-impact-narrative p strong { color:#fff; } .vg-impact-narrative p:last-child { margin-bottom:0; } /* Metric card hover glow */ .vg-metric-card { transition: all 0.3s cubic-bezier(0.22,1,0.36,1) !important; } /* Challenge tiles (navy bg) - white glow on hover */ .vg-challenge-card { transition: all 0.3s cubic-bezier(0.22,1,0.36,1); cursor: default; } .vg-challenge-card:hover { transform: translateY(-4px); box-shadow: 0 0 24px rgba(148,49,255,0.35), 0 0 48px rgba(148,49,255,0.15), 0 8px 24px rgba(0,0,0,0.25); } /* Execution tiles (white bg) - purple glow on hover */ .vg-exec-card { transition: all 0.3s cubic-bezier(0.22,1,0.36,1); cursor: default; } .vg-exec-card:hover { transform: translateY(-4px); border-color: rgba(148,49,255,0.25) !important; box-shadow: 0 8px 20px rgba(0,0,0,0.06), 0 16px 48px rgba(148,49,255,0.15), 0 0 0 1px rgba(148,49,255,0.1); } @media (max-width: 768px) { .vg-takeaway-grid { grid-template-columns: 1fr !important; } .vg-form-card { position: static !important; } } .vg-metric-card:hover { transform: translateY(-4px); border-color: rgba(255,255,255,0.35) !important; box-shadow: 0 0 20px rgba(255,255,255,0.08), 0 0 40px rgba(255,255,255,0.04), 0 4px 24px rgba(0,0,0,0.2); background: rgba(255,255,255,0.1) !important; } </style> <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=Montserrat:wght@400;500;600;700;800&family=Nunito+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">    <section class="vg-section" style="background:#06054B;padding:80px 0 60px;position:relative;overflow:hidden;">  <svg style="position:absolute;top:-40px;right:-60px;width:400px;height:400px;opacity:0.06;" viewBox="0 0 400 400" fill="none" aria-hidden="true"> <circle cx="200" cy="200" r="180" stroke="#9431ff" stroke-width="2"/> <circle cx="200" cy="200" r="130" stroke="#9431ff" stroke-width="1.5"/> <circle cx="200" cy="200" r="80" stroke="#9431ff" stroke-width="1"/> </svg> <svg style="position:absolute;bottom:-20px;left:-40px;width:300px;height:300px;opacity:0.05;" viewBox="0 0 300 300" fill="none" aria-hidden="true"> <rect x="30" y="30" width="240" height="240" rx="20" stroke="#9431ff" stroke-width="2" transform="rotate(15 150 150)"/> <rect x="60" y="60" width="180" height="180" rx="15" stroke="#9431ff" stroke-width="1.5" transform="rotate(15 150 150)"/> </svg> <div style="max-width:1200px;margin:0 auto;padding:0 24px;position:relative;z-index:1;">  <nav style="margin-bottom:24px;" aria-label="Breadcrumb"> <ol style="list-style:none;padding:0;margin:0;display:flex;gap:8px;align-items:center;font-family:'Nunito Sans',sans-serif;font-size:14px;color:#94a3b8;flex-wrap:wrap;"> <li><a href="https://www.velocitygrowth.ae" style="color:#94a3b8;text-decoration:none;">Home</a></li> <li style="color:#94a3b8;">›</li> <li><a href="https://www.velocitygrowth.ae/case-studies" style="color:#94a3b8;text-decoration:none;">Our Work</a></li> <li style="color:#94a3b8;">›</li> <li style="color:#9431ff;">A B2G and B2B Holdings Group, UAE</li> </ol> </nav>  <div style="display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;"> <div style="flex:1;min-width:280px;">  <div style="display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap;"> <span style="display:inline-block;padding:6px 14px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;background:#9431ff;color:#fff;">Spotlight</span> <span style="display:inline-block;padding:6px 14px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:500;background:rgba(255,255,255,0.12);color:#c8cdd3;">UAE</span> </div>  <h1 style="font-family:'Montserrat',sans-serif;font-size:56px;font-weight:700;line-height:1.1;color:#fff;margin:0 0 16px;">A B2G and B2B Holdings Group, UAE</h1>  <p style="font-family:'Nunito Sans',sans-serif;font-size:18px;line-height:1.6;color:#c8cdd3;margin:0 0 24px;max-width:700px;">Delivered a full website redesign and revamp on Webflow at short notice, from stakeholder interviews through moodboards and wireframes to development, including an immersive homepage banner with particle animation.</p>  <div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;"> <span style="display:inline-block;padding:4px 12px;border-radius:6px;font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:600;background:rgba(148,49,255,0.15);color:#c084fc;">Growth Design</span> <span style="display:inline-block;padding:4px 12px;border-radius:6px;font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:600;background:rgba(148,49,255,0.15);color:#c084fc;">Growth Engineering</span> </div>  <div style="display:flex;gap:8px;flex-wrap:wrap;"> <span style="display:inline-block;padding:5px 14px;border-radius:6px;font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:600;background:rgba(255,255,255,0.9);color:#06054B;">Enterprise</span> <span style="display:inline-block;padding:5px 14px;border-radius:6px;font-family:'Nunito Sans',sans-serif;font-size:12px;font-weight:600;background:rgba(255,255,255,0.9);color:#06054B;">B2G / B2B Holdings</span> </div> </div>  <div style="display:flex;gap:10px;flex-shrink:0;margin-top:48px;"> <button onclick="navigator.clipboard.writeText(window.location.href).then(function(){var b=this;b.innerHTML='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> Copied!';setTimeout(function(){b.innerHTML='<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg> Copy Link'},2000)}.bind(this))" style="display:flex;align-items:center;gap:7px;padding:10px 18px;border-radius:100px;border:2px solid rgba(255,255,255,0.5);background:transparent;color:#fff;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.2s;" onmouseover="this.style.background='rgba(255,255,255,0.1)';this.style.borderColor='#fff'" onmouseout="this.style.background='transparent';this.style.borderColor='rgba(255,255,255,0.5)'"> <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg> Copy Link </button> <a href="https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.velocitygrowth.ae%2Fcase-studies%2Fwebsite-redesign-holdings-uae" target="_blank" rel="noopener noreferrer" style="display:flex;align-items:center;gap:7px;padding:10px 18px;border-radius:100px;border:none;background:#9431ff;color:#fff;font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;text-decoration:none;transition:all 0.2s;" onmouseover="this.style.background='#7a28d6'" onmouseout="this.style.background='#9431ff'"> <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg> Share on LinkedIn </a> </div> </div>  <div style="margin-top:40px;padding-top:32px;border-top:1px solid rgba(255,255,255,0.08);"> <div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap;"> <div style="font-family:'Montserrat',sans-serif;font-size:56px;font-weight:600;line-height:1;background:linear-gradient(135deg,#9431ff 0%,#c084fc 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;">1</div> <div> <div style="font-family:'Nunito Sans',sans-serif;font-size:18px;font-weight:600;color:#fff;line-height:1.3;">Full Website Redesign</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:14px;color:#94a3b8;line-height:1.3;">delivered at short notice on Webflow</div> </div> </div> </div> </div> </section>    <section class="vg-section" style="background:#fff;padding:80px 0;"> <div style="max-width:1000px;margin:0 auto;padding:0 24px;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">The Challenge</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:700;color:#06054B;margin:0 0 32px;letter-spacing:-0.48px;line-height:46px;">What We Were Solving</h2> <p style="font-family:'Nunito Sans',sans-serif;font-size:18px;line-height:1.7;color:#06054B;margin:0 0 36px;">A UAE holdings group operating across B2G and B2B needed a complete website overhaul on a tight timeline. The existing site did not reflect the company's scale or credibility.</p><div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;"><div class="vg-challenge-card" style="background:#06054B;border-radius:12px;padding:28px;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.2);display:flex;align-items:center;justify-content:center;margin-bottom:14px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#c084fc" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 21V9"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:16px;font-weight:700;color:#fff;margin:0 0 12px;">Outdated Digital Presence</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#c8cdd3;"><li>Website did not reflect company scale</li><li>Design outdated for a holdings-level brand</li><li>No immersive or interactive elements</li></ul></div><div class="vg-challenge-card" style="background:#06054B;border-radius:12px;padding:28px;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.2);display:flex;align-items:center;justify-content:center;margin-bottom:14px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#c084fc" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:16px;font-weight:700;color:#fff;margin:0 0 12px;">Tight Timeline</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#c8cdd3;"><li>Delivered at short notice under deadline pressure</li><li>Needed full process: research to development</li><li>No room for iterative delays</li></ul></div></div> </div> </section>    <section class="vg-section" style="background:#fff;padding:0 0 80px;"> <div style="max-width:1000px;margin:0 auto;padding:0 24px;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">The Approach</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:700;color:#06054B;margin:0 0 32px;letter-spacing:-0.48px;line-height:46px;">How We Thought About It</h2> <p style="font-family:'Nunito Sans',sans-serif;font-size:18px;line-height:1.7;color:#06054B;margin:0 0 36px;">Full design process compressed into a sprint: stakeholder alignment, creative direction, wireframes, high-fidelity designs, and Webflow development.</p><div style="position:relative;padding-left:48px;"><div style="position:absolute;left:19px;top:40px;bottom:40px;width:2px;background:linear-gradient(180deg,#9431ff,rgba(148,49,255,0.15));"></div><div style="position:relative;margin-bottom:36px;"><div style="position:absolute;left:-48px;top:0;width:40px;height:40px;border-radius:50%;background:#9431ff;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-size:16px;font-weight:700;color:#fff;">1</div><p style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:600;color:#06054B;margin:0 0 12px;letter-spacing:-0.4px;padding-top:8px;">Discovery and Creative Direction</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#06054B;"><li>Stakeholder interviews to understand brand positioning</li><li>Moodboards defining visual direction and tone</li><li>Creative alignment before any design work began</li></ul></div><div style="position:relative;"><div style="position:absolute;left:-48px;top:0;width:40px;height:40px;border-radius:50%;background:#9431ff;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-size:16px;font-weight:700;color:#fff;">2</div><p style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:600;color:#06054B;margin:0 0 12px;letter-spacing:-0.4px;padding-top:8px;">Design and Development</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#06054B;"><li>Low-fidelity to high-fidelity wireframes</li><li>Immersive homepage banner with particle animation</li><li>Full Webflow development and launch</li></ul></div></div> </div> </section>    <section class="vg-section" style="background:#f8f9fa;padding:80px 0;"> <div style="max-width:1000px;margin:0 auto;padding:0 24px;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">The Execution</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:700;color:#06054B;margin:0 0 32px;letter-spacing:-0.48px;line-height:46px;">What We Delivered</h2> <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;"><div class="vg-exec-card" style="background:#fff;border-radius:12px;padding:28px;border:1px solid #e2e8f0;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.08);display:flex;align-items:center;justify-content:center;margin-bottom:14px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 12px;">Design</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#06054B;"><li>Stakeholder interviews + moodboards</li><li>Low and high fidelity wireframes</li><li>Particle animation for homepage banner</li></ul></div><div class="vg-exec-card" style="background:#fff;border-radius:12px;padding:28px;border:1px solid #e2e8f0;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.08);display:flex;align-items:center;justify-content:center;margin-bottom:14px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 12px;">Development</p><ul style="margin:0;padding:0 0 0 18px;font-family:'Nunito Sans',sans-serif;font-size:16px;line-height:1.8;color:#06054B;"><li>Full Webflow build and launch</li><li>Immersive interactive elements</li><li>Delivered under tight deadline</li></ul></div></div> </div> </section>    <section class="vg-section" style="background:#06054B;padding:80px 0;position:relative;overflow:hidden;"> <svg style="position:absolute;top:-40px;right:-60px;width:400px;height:400px;opacity:0.06;" viewBox="0 0 400 400" fill="none" aria-hidden="true"> <circle cx="200" cy="200" r="180" stroke="#9431ff" stroke-width="2"/> <circle cx="200" cy="200" r="130" stroke="#9431ff" stroke-width="1.5"/> </svg> <svg style="position:absolute;bottom:-30px;left:-50px;width:300px;height:300px;opacity:0.05;" viewBox="0 0 300 300" fill="none" aria-hidden="true"> <rect x="30" y="30" width="240" height="240" rx="20" stroke="#9431ff" stroke-width="2" transform="rotate(15 150 150)"/> </svg> <div style="max-width:1000px;margin:0 auto;padding:0 24px;position:relative;z-index:1;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#c084fc;margin:0 0 8px;letter-spacing:0.04em;">The Impact</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:700;color:#fff;margin:0 0 40px;letter-spacing:-0.48px;line-height:46px;">Results That Moved the Needle</h2>  <div class="vg-grid-4" style="display:grid;grid-template-columns:repeat(1,1fr);gap:16px;margin-bottom:48px;"> <div class="vg-metric-card" style="padding:20px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:12px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:110px;cursor:default;"> <div style="font-family:'Montserrat',sans-serif;font-size:28px;font-weight:600;color:#fff;"><span class="vg-anim-num" data-value="1" data-decimals="0">0</span><span></span></div> <div style="font-family:'Nunito Sans',sans-serif;font-size:13px;color:#94a3b8;margin-top:4px;">Full Website Redesign</div> </div> </div>    <div class="vg-impact-narrative"> <div style="background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);border-radius:12px;padding:24px;margin-top:8px;"><p style="font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.6;color:#c8cdd3;margin:0;">A complete digital transformation from an outdated web presence to an immersive, modern platform that reflects the company's B2G and B2B scale. The particle animation homepage banner set a new benchmark for the brand's digital credibility. Delivered end-to-end in a compressed timeline with zero back-and-forth delays.</p></div> </div>  </div> </section>    <section class="vg-section" style="background:#f8f9fa;padding:80px 0;"> <div style="max-width:1200px;margin:0 auto;padding:0 24px;"> <div class="vg-takeaway-grid" style="display:grid;grid-template-columns:1fr 480px;gap:56px;align-items:stretch;">  <div style="display:flex;flex-direction:column;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">Key Takeaway</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:32px;font-weight:700;color:#06054B;margin:0 0 28px;letter-spacing:-0.48px;line-height:38px;">What This Means for Your Business</h2> <div class="vg-key-takeaway-content"> <div style="display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;"><div style="background:#fff;border-radius:12px;padding:20px;border:1px solid #e2e8f0;"><div style="display:flex;align-items:center;gap:10px;margin-bottom:10px;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.08);display:flex;align-items:center;justify-content:center;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:15px;font-weight:700;color:#06054B;margin:0;">Process Enables Speed</p></div><p style="font-size:14px;line-height:1.6;margin:0;">A structured process (interviews, moodboards, wireframes, build) is what makes tight timelines possible. Skipping steps creates delays, not speed.</p></div><div style="background:#fff;border-radius:12px;padding:20px;border:1px solid #e2e8f0;"><div style="display:flex;align-items:center;gap:10px;margin-bottom:10px;"><div style="width:36px;height:36px;border-radius:8px;background:rgba(148,49,255,0.08);display:flex;align-items:center;justify-content:center;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2"><path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"/></svg></div><p style="font-family:'Montserrat',sans-serif;font-size:15px;font-weight:700;color:#06054B;margin:0;">Digital Is the First Impression</p></div><p style="font-size:14px;line-height:1.6;margin:0;">For B2G and B2B companies, the website is often the first credibility check. A holdings-level brand needs a holdings-level digital presence.</p></div></div> </div>  <div style="margin-top:28px;padding:20px 24px;border-left:3px solid #9431ff;border-radius:0 8px 8px 0;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.7;color:#06054B;margin:0;">Every growth transformation starts with a conversation. Tell us about your business and we'll work with you to help unlock growth.</p> </div>  <div style="display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:24px;"> <div style="flex:1;height:1px;background:linear-gradient(90deg,transparent,#9431ff);"></div> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg> </div> </div>  <div class="vg-form-card" style="position:sticky;top:24px;">  <div style="background:#06054B;border-radius:16px 16px 0 0;padding:20px 28px;"> <div style="display:flex;gap:24px;align-items:center;justify-content:center;"> <div style="text-align:center;"> <div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#fff;">33+</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:11px;color:#94a3b8;margin-top:2px;">Brands Grown</div> </div> <div style="width:1px;height:32px;background:rgba(255,255,255,0.15);"></div> <div style="text-align:center;"> <div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#fff;">$1.4B</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:11px;color:#94a3b8;margin-top:2px;">Revenue Generated</div> </div> <div style="width:1px;height:32px;background:rgba(255,255,255,0.15);"></div> <div style="text-align:center;"> <div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#fff;">6</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:11px;color:#94a3b8;margin-top:2px;">Countries</div> </div> </div> </div>  <div style="background:#fff;border-radius:0 0 16px 16px;padding:28px 28px 32px;border:1px solid #e2e8f0;border-top:none;box-shadow:0 8px 32px rgba(6,5,75,0.08);"> <h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#06054B;margin:0 0 20px;">Get a custom growth audit</h3> <div id="vg-cta-form-container"> <form id="vg-lead-form" onsubmit="return handleFormSubmit(event)" style="display:flex;flex-direction:column;gap:14px;"> <div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;"> <div> <label style="font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;color:#06054B;display:block;margin-bottom:5px;">Name *</label> <input type="text" name="name" required onfocus="pushFormFocus('name')" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;color:#06054B;box-sizing:border-box;transition:border-color 0.2s;" onfocusin="this.style.borderColor='#9431ff'" onfocusout="this.style.borderColor='#e2e8f0'" /> </div> <div> <label style="font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;color:#06054B;display:block;margin-bottom:5px;">Work Email *</label> <input type="email" name="email" required onfocus="pushFormFocus('email')" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;color:#06054B;box-sizing:border-box;transition:border-color 0.2s;" onfocusin="this.style.borderColor='#9431ff'" onfocusout="this.style.borderColor='#e2e8f0'" /> </div> </div> <div> <label style="font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;color:#06054B;display:block;margin-bottom:5px;">Company *</label> <input type="text" name="company" required onfocus="pushFormFocus('company')" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;color:#06054B;box-sizing:border-box;transition:border-color 0.2s;" onfocusin="this.style.borderColor='#9431ff'" onfocusout="this.style.borderColor='#e2e8f0'" /> </div> <div> <label style="font-family:'Nunito Sans',sans-serif;font-size:13px;font-weight:600;color:#06054B;display:block;margin-bottom:5px;">3 core problems you'd want us to take a look at</label> <textarea name="message" rows="3" onfocus="pushFormFocus('message')" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-family:'Nunito Sans',sans-serif;font-size:14px;color:#06054B;box-sizing:border-box;resize:vertical;transition:border-color 0.2s;" onfocusin="this.style.borderColor='#9431ff'" onfocusout="this.style.borderColor='#e2e8f0'"></textarea> </div> <button type="submit" style="width:100%;padding:14px 32px;background:#9431ff;color:#fff;font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;border:none;border-radius:100px;cursor:pointer;transition:all 0.2s;margin-top:4px;box-shadow:0 4px 16px rgba(148,49,255,0.3);" onmouseover="this.style.background='#7a28d6';this.style.boxShadow='0 6px 24px rgba(148,49,255,0.4)'" onmouseout="this.style.background='#9431ff';this.style.boxShadow='0 4px 16px rgba(148,49,255,0.3)'">Book Your Free Discovery Call</button> </form> </div>  <div style="display:flex;align-items:center;justify-content:center;gap:16px;margin-top:16px;"> <div style="display:flex;align-items:center;gap:5px;"> <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#22c55e" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> <span style="font-family:'Nunito Sans',sans-serif;font-size:12px;color:#64748b;">No commitment</span> </div> <div style="display:flex;align-items:center;gap:5px;"> <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#22c55e" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> <span style="font-family:'Nunito Sans',sans-serif;font-size:12px;color:#64748b;">Response within 24hrs</span> </div> </div>  <div id="vg-thank-you" style="display:none;text-align:center;padding:24px 0;"> <svg width="40" height="40" viewBox="0 0 48 48" fill="none" style="margin-bottom:12px;"> <circle cx="24" cy="24" r="24" fill="#f0fdf4"/> <path d="M14 24l7 7 13-13" stroke="#22c55e" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/> </svg> <h3 style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 6px;">We've received your details</h3> <p style="font-family:'Nunito Sans',sans-serif;font-size:14px;color:#64748b;margin:0;">We'll reach out within 24 hours.</p> </div> </div> </div> </div> </div> </section>    <section class="vg-section" style="background:#fff;padding:80px 0;"> <div style="max-width:800px;margin:0 auto;padding:0 24px;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">FAQ</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:32px;font-weight:700;color:#06054B;margin:0 0 32px;letter-spacing:-0.48px;line-height:38px;">Common Questions</h2> <details style="border:1px solid #e2e8f0;border-radius:12px;padding:0;margin-bottom:12px;background:#fff;"> <summary style="padding:20px 24px;font-family:'Montserrat',sans-serif;font-size:16px;font-weight:600;color:#06054B;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;"> Why Webflow for a corporate website? <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0;margin-left:16px;transition:transform 0.2s;"><polyline points="6 9 12 15 18 9"/></svg> </summary> <div style="padding:0 24px 20px;font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.7;color:#06054B;">Webflow combines visual design flexibility with production-ready code output. For corporate sites that need to be maintained by non-technical teams, Webflow's CMS and visual editor eliminate the dependency on developers for content updates.</div> </details> <details style="border:1px solid #e2e8f0;border-radius:12px;padding:0;margin-bottom:12px;background:#fff;"> <summary style="padding:20px 24px;font-family:'Montserrat',sans-serif;font-size:16px;font-weight:600;color:#06054B;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;"> How do you deliver a full redesign on a tight timeline? <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0;margin-left:16px;transition:transform 0.2s;"><polyline points="6 9 12 15 18 9"/></svg> </summary> <div style="padding:0 24px 20px;font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.7;color:#06054B;">By running a structured but compressed process: stakeholder interviews to align on direction quickly, moodboards to lock creative direction before wireframing, and going directly from high-fidelity designs to Webflow development without a separate front-end coding phase.</div> </details> <details style="border:1px solid #e2e8f0;border-radius:12px;padding:0;margin-bottom:12px;background:#fff;"> <summary style="padding:20px 24px;font-family:'Montserrat',sans-serif;font-size:16px;font-weight:600;color:#06054B;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;"> What is an immersive particle animation banner? <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#9431ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0;margin-left:16px;transition:transform 0.2s;"><polyline points="6 9 12 15 18 9"/></svg> </summary> <div style="padding:0 24px 20px;font-family:'Nunito Sans',sans-serif;font-size:15px;line-height:1.7;color:#06054B;">A dynamic, interactive hero section where particles respond to cursor movement or scroll, creating a sense of depth and modernity. It signals technical sophistication and sets the brand apart from static corporate websites.</div> </details> </div> </section>    <section class="vg-section" style="background:#f8f9fa;padding:80px 0;"> <div style="max-width:1200px;margin:0 auto;padding:0 24px;"> <p style="font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;margin:0 0 8px;letter-spacing:0.04em;">More Work</p> <h2 style="font-family:'Montserrat',sans-serif;font-size:32px;font-weight:700;color:#06054B;margin:0 0 32px;letter-spacing:-0.48px;line-height:38px;">Related Case Studies</h2> <div class="vg-grid-3" style="display:grid;grid-template-columns:repeat(3,1fr);gap:24px;"> <a href="https://www.velocitygrowth.ae/case-studies/growth-engine-events-marketplace-uae" style="text-decoration:none;"> <div class="vg-card" style="background:#fff;border-radius:16px;padding:28px;border:1px solid #e5e7eb;"> <div style="display:flex;gap:8px;margin-bottom:12px;"> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:600;background:#f3e8ff;color:#7c3aed;">Transformation</span> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:500;background:#f1f5f9;color:#64748b;">UAE</span> </div> <h3 style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 8px;line-height:1.3;">A Major Events & Experiences Marketplace, UAE</h3> <div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:800;color:#9431ff;margin:12px 0 4px;">256%</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:13px;color:#64748b;">Increase in Qualified Leads</div> <p style="font-family:'Nunito Sans',sans-serif;font-size:14px;color:#64748b;margin:12px 0 0;line-height:1.5;">Full-stack growth engine across 7 workstreams.</p> </div> </a> <a href="https://www.velocitygrowth.ae/case-studies/crm-experimentation-superapp-uae" style="text-decoration:none;"> <div class="vg-card" style="background:#fff;border-radius:16px;padding:28px;border:1px solid #e5e7eb;"> <div style="display:flex;gap:8px;margin-bottom:12px;"> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:600;background:#f3e8ff;color:#7c3aed;">Deep Dive</span> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:500;background:#f1f5f9;color:#64748b;">UAE</span> </div> <h3 style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 8px;line-height:1.3;">A Leading SuperApp, UAE</h3> <div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:800;color:#9431ff;margin:12px 0 4px;">265%</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:13px;color:#64748b;">Uplift vs Control Group</div> <p style="font-family:'Nunito Sans',sans-serif;font-size:14px;color:#64748b;margin:12px 0 0;line-height:1.5;">CRM + experimentation program delivering 265% uplift.</p> </div> </a> <a href="https://www.velocitygrowth.ae/case-studies/cro-framework-ondemand-marketplace-uae" style="text-decoration:none;"> <div class="vg-card" style="background:#fff;border-radius:16px;padding:28px;border:1px solid #e5e7eb;"> <div style="display:flex;gap:8px;margin-bottom:12px;"> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:600;background:#f3e8ff;color:#7c3aed;">Spotlight</span> <span style="padding:4px 10px;border-radius:100px;font-family:'Nunito Sans',sans-serif;font-size:11px;font-weight:500;background:#f1f5f9;color:#64748b;">UAE</span> </div> <h3 style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#06054B;margin:0 0 8px;line-height:1.3;">An On-Demand Services Marketplace, UAE</h3> <div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:800;color:#9431ff;margin:12px 0 4px;">19%</div> <div style="font-family:'Nunito Sans',sans-serif;font-size:13px;color:#64748b;">Signup Rate Improvement</div> <p style="font-family:'Nunito Sans',sans-serif;font-size:14px;color:#64748b;margin:12px 0 0;line-height:1.5;">CRO framework for signup and booking flows.</p> </div> </a> </div> <div style="text-align:center;margin-top:40px;"> <a href="https://www.velocitygrowth.ae/case-studies" style="display:inline-flex;align-items:center;gap:8px;font-family:'Nunito Sans',sans-serif;font-size:16px;font-weight:600;color:#9431ff;text-decoration:none;padding:12px 28px;border:2px solid #9431ff;border-radius:100px;transition:all 0.2s;" onmouseover="this.style.background='#9431ff';this.style.color='#fff'" onmouseout="this.style.background='transparent';this.style.color='#9431ff'">View All Case Studies <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg></a> </div> </div> </section>