feat(wise-hearted-decor): initial luxury event decor website build with 5 pillars, portfolio, and booking funnel
This commit is contained in:
@@ -0,0 +1,100 @@
|
||||
import React from 'react';
|
||||
import Image from 'next/image';
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function AboutSection() {
|
||||
return (
|
||||
<section id="about" style={{
|
||||
padding: '100px 24px',
|
||||
backgroundColor: '#080808',
|
||||
position: 'relative',
|
||||
borderBottom: '1px solid var(--border-gold)',
|
||||
}}>
|
||||
<div className="container">
|
||||
|
||||
<div style={{
|
||||
display: 'grid',
|
||||
gridTemplateColumns: 'repeat(auto-fit, minmax(320px, 1fr))',
|
||||
gap: '50px',
|
||||
alignItems: 'center',
|
||||
}}>
|
||||
|
||||
{/* Left Column: Monogram & Brand Card */}
|
||||
<div style={{ position: 'relative' }}>
|
||||
<div className="glass-panel" style={{
|
||||
padding: '40px 32px',
|
||||
borderRadius: '24px',
|
||||
textAlign: 'center',
|
||||
border: '2px solid var(--border-gold)',
|
||||
boxShadow: '0 0 40px rgba(212, 175, 55, 0.15)',
|
||||
position: 'relative',
|
||||
overflow: 'hidden',
|
||||
}}>
|
||||
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
top: '-50px',
|
||||
right: '-50px',
|
||||
width: '180px',
|
||||
height: '180px',
|
||||
background: 'radial-gradient(circle, rgba(224,0,111,0.2) 0%, transparent 70%)',
|
||||
filter: 'blur(30px)',
|
||||
}} />
|
||||
|
||||
<div style={{ position: 'relative', width: '220px', height: '220px', margin: '0 auto 24px' }}>
|
||||
<Image
|
||||
src="/images/logo_monogram.png"
|
||||
alt="Wise Hearted Monogram Logo"
|
||||
fill
|
||||
style={{ objectFit: 'contain' }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div style={{ fontFamily: 'var(--font-script)', fontSize: '2rem', color: 'var(--color-gold)', marginBottom: '8px' }}>
|
||||
Be led by God from the heart.
|
||||
</div>
|
||||
<div style={{ fontSize: '0.85rem', fontWeight: 800, color: 'var(--color-pink-light)', letterSpacing: '0.15em', textTransform: 'uppercase' }}>
|
||||
Wise Hearted Event Decor
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column: About Story & Mission */}
|
||||
<div>
|
||||
<span style={{ fontSize: '0.85rem', fontWeight: 800, color: 'var(--color-pink)', letterSpacing: '0.15em', textTransform: 'uppercase', display: 'block', marginBottom: '10px' }}>
|
||||
About the Heart Behind the Brand
|
||||
</span>
|
||||
<h2 style={{ fontSize: 'clamp(2rem, 3.8vw, 2.8rem)', fontWeight: 800, marginBottom: '20px', lineHeight: 1.25 }}>
|
||||
Called to Create. <br />
|
||||
<span className="gold-gradient-text">Enabled by God.</span>
|
||||
</h2>
|
||||
<p style={{ fontSize: '1.05rem', lineHeight: 1.8, color: '#E2E8F0', marginBottom: '20px' }}>
|
||||
At <strong>Wise Hearted Event Decor</strong>, we believe every milestone, birthday, wedding, and celebration is a sacred opportunity to gather loved ones and create memories that last a lifetime.
|
||||
</p>
|
||||
<p style={{ fontSize: '1.05rem', lineHeight: 1.8, color: '#CBD5E1', marginBottom: '24px' }}>
|
||||
Founded with a deep commitment to faith, beauty, purpose, and love, our mission is to transform ordinary rooms into breathtaking, immersive spaces. We do not just build balloon garlands—we pour intentionality, artistic prayer, and meticulous craftsmanship into every single arch, floral arrangement, and personalized detail.
|
||||
</p>
|
||||
|
||||
<div style={{
|
||||
background: 'rgba(255, 255, 255, 0.04)',
|
||||
borderLeft: '4px solid var(--color-gold)',
|
||||
padding: '16px 20px',
|
||||
borderRadius: '8px',
|
||||
marginBottom: '32px',
|
||||
}}>
|
||||
<p style={{ fontStyle: 'italic', fontSize: '0.98rem', color: 'var(--color-gold-light)', margin: 0 }}>
|
||||
“Creating beautiful spaces and memorable events through God-given creativity, with faith, beauty, purpose, and love at the heart of every design.”
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<Link href="#contact" className="btn-pink">
|
||||
<span>💕</span> Let’s Design Your Event
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user