Commit aadf53d6 by PLN (Algolia)

feat(parvagues): apply hero variant C - logo-first centered layout

Wave logo takes center stage with neon glow, title below in
spaced uppercase, radial gradient backdrop.
parent ab600f5d
......@@ -3,61 +3,32 @@ import Image from 'next/image';
export default function Hero() {
return (
<section className="relative h-screen flex items-center justify-center overflow-hidden">
{/* Background */}
<div className="absolute inset-0">
<Image
src="/images/parvagues/lives/2024/ccc_release_party/poster.png"
alt=""
fill
className="object-cover"
style={{ opacity: 0.15 }}
priority
/>
{/* Heavy overlay to kill poster text bleed */}
<div
className="absolute inset-0"
style={{
background: 'linear-gradient(to bottom, var(--surface) 0%, rgba(10,10,10,0.85) 40%, rgba(10,10,10,0.85) 60%, var(--surface) 100%)',
}}
/>
</div>
<div className="absolute inset-0" style={{ background: 'radial-gradient(circle at 50% 40%, rgba(217,0,255,0.06) 0%, transparent 60%)' }} />
{/* Content */}
<div className="relative z-10 text-center px-6 w-full">
<div className="relative z-10 text-center px-6 w-full flex flex-col items-center">
<div className="relative w-48 h-48 md:w-72 md:h-72 mb-8">
<Image
src="/images/parvagues/logo_transparent.png"
alt="ParVagues"
fill
className="object-contain"
style={{ filter: 'drop-shadow(0 0 40px rgba(217,0,255,0.25))' }}
priority
/>
</div>
<h1
className="font-display font-extrabold leading-none tracking-tight"
style={{
fontSize: 'clamp(2.5rem, 11vw, 9rem)',
textShadow: '0 0 80px rgba(217,0,255,0.2), 0 0 160px rgba(217,0,255,0.08)',
}}
className="font-display font-extrabold leading-none tracking-[0.15em] uppercase"
style={{ fontSize: 'clamp(1.5rem, 5vw, 3.5rem)', textShadow: '0 0 60px rgba(217,0,255,0.15)' }}
>
ParVagues
</h1>
<div
className="mx-auto mt-8 mb-8"
style={{ width: '6rem', height: '1px', background: 'linear-gradient(to right, transparent, rgba(217,0,255,0.4), transparent)' }}
/>
<div className="mx-auto mt-6 mb-6" style={{ width: '6rem', height: '1px', background: 'linear-gradient(to right, transparent, rgba(217,0,255,0.4), transparent)' }} />
<p className="text-base md:text-lg italic leading-relaxed max-w-xl mx-auto" style={{ color: 'var(--text-muted)' }}>
ParVagues, c&apos;est des ondes qui naissent dans un océan binaire
pour parfois s&apos;échouer sur vos plages sonores.
Des ondes qui naissent dans un oc&eacute;an binaire pour parfois s&apos;&eacute;chouer sur vos plages sonores.
</p>
<div className="mt-14 flex flex-col sm:flex-row gap-4 justify-center items-center">
<a
href="#tour"
className="inline-block px-8 py-3.5 bg-white font-display font-bold text-sm tracking-widest uppercase rounded-full transition-all duration-300 hover:shadow-lg"
style={{ color: 'var(--surface)' }}
>
On Tour
</a>
<a
href="#music"
className="inline-block px-8 py-3.5 border border-white/25 text-white font-display font-bold text-sm tracking-widest uppercase rounded-full hover:bg-white/10 hover:border-white/50 transition-all duration-300"
>
Écouter
</a>
<a href="#tour" className="inline-block px-8 py-3.5 bg-white font-display font-bold text-sm tracking-widest uppercase rounded-full transition-all duration-300 hover:shadow-lg" style={{ color: 'var(--surface)' }}>On Tour</a>
<a href="#music" className="inline-block px-8 py-3.5 border border-white/25 text-white font-display font-bold text-sm tracking-widest uppercase rounded-full hover:bg-white/10 hover:border-white/50 transition-all duration-300">&Eacute;couter</a>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment