dios.one
77 lines
4.4 KiB
React
77 lines
4.4 KiB
React
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>
|
|
)
|
|
}
|