ADD LANDING PAGE

2026-05-05 18:35:16 +07:00
commit d70ec03c94
27 changed files with 4394 additions and 0 deletions
@@ -0,0 +1,76 @@
+import React from 'react'
+import Nova40Icon from './Nova40Icon'
+import useReveal from '../hooks/useReveal'
+
+export default function Download() {
+  const ref = useReveal()
+
+  return (
+    <section id="download" className="py-20 sm:py-28 relative" ref={ref}>
+      <div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="reveal relative glass-card p-10 sm:p-16 text-center overflow-hidden">
+          {/* Background effects */}
+          <div className="absolute top-0 left-1/2 -translate-x-1/2 w-[500px] h-[500px] bg-nova-primary/10 rounded-full blur-[150px]" />
+          <div className="absolute bottom-0 right-0 w-[300px] h-[300px] bg-nova-accent/5 rounded-full blur-[100px]" />
+
+          {/* Decorative orbit */}
+          <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[400px] h-[400px] border border-nova-primary/10 rounded-full animate-orbit" />
+
+          <div className="relative">
+            <div className="flex justify-center mb-6">
+              <div className="relative">
+                <Nova40Icon size={96} rounded />
+                <div className="absolute -inset-4 bg-nova-primary/15 rounded-2xl blur-xl -z-10 animate-pulse-slow" />
+              </div>
+            </div>
+
+            <h2 className="text-3xl sm:text-5xl font-bold mb-4">
+              Ready to become{' '}
+              <br className="hidden sm:block" />
+              <span className="text-shimmer">someone new?</span>
+            </h2>
+            <p className="text-nova-textSecondary text-lg max-w-lg mx-auto mb-10">
+              Download Nova40 for free and start your 40-day identity transformation journey today.
+            </p>
+
+            <div className="flex flex-col sm:flex-row gap-4 justify-center items-center">
+              {/* App Store */}
+              <a
+                href="https://apps.apple.com/app/nova40/id0000000000"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="w-full sm:w-auto inline-flex items-center justify-center gap-3 px-8 py-4 bg-white/5 hover:bg-white/10 border border-nova-border hover:border-nova-primary/50 rounded-2xl transition-all group hover:scale-105 hover:shadow-lg hover:shadow-nova-primary/10"
+              >
+                <svg className="w-9 h-9 text-white" viewBox="0 0 24 24" fill="currentColor">
+                  <path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z"/>
+                </svg>
+                <div className="text-left">
+                  <p className="text-[10px] text-nova-textSecondary leading-tight">Download on the</p>
+                  <p className="text-white font-bold text-lg leading-tight">App Store</p>
+                </div>
+              </a>
+
+              {/* Google Play */}
+              <a
+                href="https://play.google.com/store/apps/details?id=com.nova40.app"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="w-full sm:w-auto inline-flex items-center justify-center gap-3 px-8 py-4 bg-white/5 hover:bg-white/10 border border-nova-border hover:border-nova-accent/50 rounded-2xl transition-all group hover:scale-105 hover:shadow-lg hover:shadow-nova-accent/10"
+              >
+                <svg className="w-9 h-9 text-white" viewBox="0 0 24 24" fill="currentColor">
+                  <path d="M3.609 1.814L13.792 12 3.61 22.186a.996.996 0 01-.61-.92V2.734a1 1 0 01.609-.92zm10.89 10.893l2.302 2.302-10.937 6.333 8.635-8.635zm3.199-3.198l2.807 1.626a1 1 0 010 1.73l-2.808 1.626L15.206 12l2.492-2.491zM5.864 2.658L16.8 8.99l-2.3 2.3-8.636-8.632z"/>
+                </svg>
+                <div className="text-left">
+                  <p className="text-[10px] text-nova-textSecondary leading-tight">Get it on</p>
+                  <p className="text-white font-bold text-lg leading-tight">Google Play</p>
+                </div>
+              </a>
+            </div>
+
+            <p className="text-nova-textMuted text-xs mt-6">Free download. No credit card required.</p>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}