patx/afterdarklabs
update section ordering
Commit 93d4c7a · patx · 2026-07-07T00:23:36-04:00
Comments
No comments yet.
Diff
diff --git a/docs/index.html b/docs/index.html
index b006938..f198d1e 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -180,9 +180,9 @@
</a>
<div class="flex items-center gap-6">
<div class="flex items-center gap-7 text-sm font-medium">
- <a href="#process" class="transition-colors hover:text-[#ccff00]" data-nav-link>Process</a>
- <a href="#services" class="transition-colors hover:text-[#ccff00]" data-nav-link>Services</a>
<a href="#work" class="transition-colors hover:text-[#ccff00]" data-nav-link>Our Work</a>
+ <a href="#services" class="transition-colors hover:text-[#ccff00]" data-nav-link>Services</a>
+ <a href="#process" class="transition-colors hover:text-[#ccff00]" data-nav-link>Process</a>
<a href="#questionnaire" class="transition-colors hover:text-[#ccff00]" data-nav-link>Contact</a>
</div>
<a href="#questionnaire" class="rounded-2xl bg-[#ccff00] px-6 py-3 font-semibold text-black transition-colors hover:bg-white">Get Free Demo</a>
@@ -192,9 +192,9 @@
<div id="mobile-nav-menu" class="hidden lg:hidden">
<div class="mt-4 grid gap-2 border-t border-white/10 pt-4 text-sm font-semibold">
<a href="#hero" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Home</a>
- <a href="#process" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Process</a>
- <a href="#services" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Services</a>
<a href="#work" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Our Work</a>
+ <a href="#services" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Services</a>
+ <a href="#process" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Process</a>
<a href="#questionnaire" class="rounded-2xl px-4 py-3 text-gray-200 transition-colors hover:bg-white/10 hover:text-[#ccff00]" data-nav-link>Contact</a>
</div>
</div>
@@ -222,62 +222,6 @@
</div>
</section>
- <section id="process" class="scroll-mt-24 border-t border-white/10 bg-black">
- <div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
- <div class="mb-12 max-w-3xl">
- <p class="mb-5 text-sm font-bold uppercase tracking-[0.28em] text-[#ccff00]">No upfront cost, no pressure. We prove our work before you pay a dime.</p>
- <h2 class="heading text-4xl font-semibold leading-none tracking-tighter md:text-6xl">Our process</h2>
- </div>
- <ol class="space-y-7">
- <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
- <p class="heading text-2xl font-bold text-[#ccff00]">01</p>
- <p class="text-lg leading-8 text-gray-300">Answer our simple questionnaire <a href="#questionnaire" class="font-semibold text-[#ccff00] underline decoration-[#ccff00]/60 underline-offset-4 transition-colors hover:text-white hover:decoration-white">here</a>. It's super quick, there is only 4 questions!</p>
- </li>
- <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
- <p class="heading text-2xl font-bold text-[#ccff00]">02</p>
- <p class="text-lg leading-8 text-gray-300">Within 24 hours, we'll reach out and send you a free live demo built from your answers.</p>
- </li>
- <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
- <p class="heading text-2xl font-bold text-[#ccff00]">03</p>
- <p class="text-lg leading-8 text-gray-300">If you like the demo, we set up a call to discuss pricing and scope.</p>
- </li>
- <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
- <p class="heading text-2xl font-bold text-[#ccff00]">04</p>
- <p class="text-lg leading-8 text-gray-300">We build your full website, mobile app, or Shopify store. This can take less than a week.</p>
- </li>
- <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
- <p class="heading text-2xl font-bold text-[#ccff00]">05</p>
- <p class="text-lg leading-8 text-gray-300">We launch your website for you. You watch your business boom. Ongoing support is available separately after launch if you need it. You own everything we build, no monthly fees or lock-ins.</p>
- </li>
- </ol>
- </div>
- </section>
-
- <section id="services" class="scroll-mt-24 border-t border-white/10 bg-zinc-950">
- <div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
- <p class="mb-5 text-sm font-bold uppercase tracking-[0.28em] text-[#ccff00]">What we do</p>
- <h2 class="heading text-4xl font-semibold leading-none tracking-tighter md:text-6xl">Built different, by design</h2>
- <div class="mt-8 max-w-3xl space-y-6 text-lg leading-8 text-gray-300">
- <p>After Dark Labs designs and builds custom websites, applications, AI-powered tools, and online storefronts for businesses across the globe. Simple business sites usually start around $500–$1,500. Larger websites, Shopify stores, apps, or custom tools are quoted based on scope.</p>
- <p>Instead of Wordpress, Wix, or Squarespace templates, broken plugins, and cookie-cutter AI site builders that end up costing you tons of money and time, we build real software from the ground up, designed around how your business actually works. This means you get a website, app, or storefront that loads fast, ranks in search/AI results and converts clicks to sales.</p>
- <div class="flex flex-wrap gap-3">
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Business & personal websites</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Shopify, e-commerce & online payments</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Mobile apps for iOS & Android</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Customer portals & admin dashboards</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Booking, membership & subscription systems</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Internal tools, SaaS MVPs & custom web apps</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Backend APIs, databases & 3rd-party integrations</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">SEO, GEO, blogs & local search setup</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Hosting, domains & business email addresses</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Logo design, lead capture & email/SMS notifications</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">AI-powered features & automation</span>
- <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Google, Yelp, social media & influencer marketing setup</span>
- </div>
- </div>
- </div>
- </section>
-
<section id="work" class="scroll-mt-24 border-t border-white/10 bg-black">
<div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
<div class="mb-10">
@@ -325,6 +269,62 @@
</div>
</section>
+ <section id="services" class="scroll-mt-24 border-t border-white/10 bg-zinc-950">
+ <div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
+ <p class="mb-5 text-sm font-bold uppercase tracking-[0.28em] text-[#ccff00]">What we do</p>
+ <h2 class="heading text-4xl font-semibold leading-none tracking-tighter md:text-6xl">Built different, by design</h2>
+ <div class="mt-8 max-w-3xl space-y-6 text-lg leading-8 text-gray-300">
+ <p>After Dark Labs designs and builds custom websites, applications, AI-powered tools, and online storefronts for businesses across the globe. Simple business sites usually start around $500–$1,500. Larger websites, Shopify stores, apps, or custom tools are quoted based on scope.</p>
+ <p>Instead of Wordpress, Wix, or Squarespace templates, broken plugins, and cookie-cutter AI site builders that end up costing you tons of money and time, we build real software from the ground up, designed around how your business actually works. This means you get a website, app, or storefront that loads fast, ranks in search/AI results and converts clicks to sales.</p>
+ <div class="flex flex-wrap gap-3">
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Business & personal websites</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Shopify, e-commerce & online payments</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Mobile apps for iOS & Android</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Customer portals & admin dashboards</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Booking, membership & subscription systems</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Internal tools, SaaS MVPs & custom web apps</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Backend APIs, databases & 3rd-party integrations</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">SEO, GEO, blogs & local search setup</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Hosting, domains & business email addresses</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Logo design, lead capture & email/SMS notifications</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">AI-powered features & automation</span>
+ <span class="rounded-full border border-[#ccff00]/30 bg-[#ccff00]/10 px-4 py-2 text-sm font-semibold text-white shadow-[0_0_24px_rgba(204,255,0,0.08)]">Google, Yelp, social media & influencer marketing setup</span>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section id="process" class="scroll-mt-24 border-t border-white/10 bg-black">
+ <div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
+ <div class="mb-12 max-w-3xl">
+ <p class="mb-5 text-sm font-bold uppercase tracking-[0.28em] text-[#ccff00]">No upfront cost, no pressure. We prove our work before you pay a dime.</p>
+ <h2 class="heading text-4xl font-semibold leading-none tracking-tighter md:text-6xl">Our process</h2>
+ </div>
+ <ol class="space-y-7">
+ <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
+ <p class="heading text-2xl font-bold text-[#ccff00]">01</p>
+ <p class="text-lg leading-8 text-gray-300">Answer our simple questionnaire <a href="#questionnaire" class="font-semibold text-[#ccff00] underline decoration-[#ccff00]/60 underline-offset-4 transition-colors hover:text-white hover:decoration-white">here</a>. It's super quick, there is only 4 questions!</p>
+ </li>
+ <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
+ <p class="heading text-2xl font-bold text-[#ccff00]">02</p>
+ <p class="text-lg leading-8 text-gray-300">Within 24 hours, we'll reach out and send you a free live demo built from your answers.</p>
+ </li>
+ <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
+ <p class="heading text-2xl font-bold text-[#ccff00]">03</p>
+ <p class="text-lg leading-8 text-gray-300">If you like the demo, we set up a call to discuss pricing and scope.</p>
+ </li>
+ <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
+ <p class="heading text-2xl font-bold text-[#ccff00]">04</p>
+ <p class="text-lg leading-8 text-gray-300">We build your full website, mobile app, or Shopify store. This can take less than a week.</p>
+ </li>
+ <li class="grid gap-4 py-6 md:grid-cols-[4rem_1fr]">
+ <p class="heading text-2xl font-bold text-[#ccff00]">05</p>
+ <p class="text-lg leading-8 text-gray-300">We launch your website for you. You watch your business boom. Ongoing support is available separately after launch if you need it. You own everything we build, no monthly fees or lock-ins.</p>
+ </li>
+ </ol>
+ </div>
+ </section>
+
<section id="questionnaire" class="scroll-mt-24 border-t border-white/10 bg-zinc-950">
<div class="mx-auto max-w-5xl px-6 py-20 md:py-24">
<div class="mb-10 max-w-3xl">
@@ -354,13 +354,12 @@
<fieldset data-question-step="1" class="hidden">
<legend class="mb-4 text-sm font-semibold uppercase tracking-[0.18em] text-gray-300">Services Needed (select all that apply)<span class="text-[#ccff00]" aria-hidden="true">*</span><span class="sr-only"> required</span></legend>
<div class="grid gap-3 sm:grid-cols-2 xl:grid-cols-3">
- <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Website" class="sr-only">Custom website</label>
- <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Online store" class="sr-only">Shopify / Online storefront</label>
- <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Bookings/Subscriptions" class="sr-only">Bookings or subscriptions</label>
+ <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Website" class="sr-only">Custom website / Redesign</label>
<label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Internal tool" class="sr-only">Internal tool or API</label>
<label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Mobile app" class="sr-only">iOS or Android app</label>
- <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Redesign" class="sr-only">Website redesign</label>
+ <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Online store" class="sr-only">Subscriptions / Online stores</label>
<label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="AI Work" class="sr-only">AI automation or voice agents</label>
+ <label class="service-chip cursor-pointer rounded-2xl border border-white/10 bg-black px-4 py-4 text-sm font-semibold text-gray-300 transition-colors"><input type="checkbox" name="services_needed" value="Other" class="sr-only">Other</label>
</div>
<p id="services-error" class="mt-3 hidden text-sm font-medium text-red-300">Select at least one service.</p>
</fieldset>