// Section components for landing page function Reveal({ children, delay = 0, className = '' }) { const ref = React.useRef(null); const [seen, setSeen] = React.useState(false); React.useEffect(() => { const el = ref.current;if (!el) return; const io = new IntersectionObserver((es) => es.forEach((e) => {if (e.isIntersecting) {setSeen(true);io.disconnect();}}), { threshold: 0.15 }); io.observe(el);return () => io.disconnect(); }, []); return

{children}

; } function StoreIcon({ kind }) { if (kind === 'apple') return ; return ; } function Nav({ lang, setLang, t }) { const [scrolled, setScrolled] = React.useState(false); React.useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 30); window.addEventListener('scroll', onScroll, { passive: true }); return () => window.removeEventListener('scroll', onScroll); }, []); return ( ); } function GiftDeco({ className, size = 80, color = '#F2A076', ribbon = '#2C5650' }) { return ( ); } function Hero({ t, screenIndex, setScreenIndex }) { const screens = [, , , ]; return (

Seçtim Ben

{t.heroBrandTag}

{t.heroBrandSub}

{t.heroH1a}
{t.heroH1b} {t.heroH1c}

{t.heroLede}

{t.downloadOn}App Store

{t.getItOn}Google Play

12K+

{t.statUsers}

450+

{t.statStores}

4.9

App Store

{screens.map((sc, i) =>

{sc}

)}

SEÇTİM BEN {t.floatLabel1}

🎁 {t.floatVal1}

✓

{t.floatLabel2}

{t.floatVal2}

); } function Features({ t }) { const items = [ { num: '01', title: t.feat1Title, body: t.feat1Body, illu:

{[ { l: t.feat1Item1, p: '₺790', t: t.bought, c: '#2C5650', img: PRODUCT.perfume }, { l: t.feat1Item2, p: '₺450', t: t.reserve, c: '#F2A076', img: PRODUCT.vase }, { l: t.feat1Item3, p: '₺1.250', t: t.available, c: '#8A8F8C', img: PRODUCT.sunglasses }]. map((it, i) =>

{it.l}

{it.p}

{it.t}

)}

}, { num: '02', title: t.feat2Title, body: t.feat2Body, illu:

{[AVATAR.melis, AVATAR.selin, AVATAR.zeynep, AVATAR.arda].map((src, i) =>

)}

{t.friendInvite}

{t.moreFriends}

}, { num: '03', title: t.feat3Title, body: t.feat3Body, illu:

{['trendyol', 'ZARA', 'MANGO', 'Karaca', 'SEPHORA', 'PANDORA'].map((s, i) =>

{s}

)}

}]; return (

— {t.feat_eyebrow}

{t.feat_titleA} {t.feat_titleB}

{t.feat_sub}

{items.map((it, i) =>

{it.num}

{it.title}

{it.body}

{it.illu}

)}

); } function PhonePlaceholder() { return (

Görsel yakında

); } function Preview({ t }) { const [activeStep, setActiveStep] = React.useState(0); const stepRefs = React.useRef([]); React.useEffect(() => { const io = new IntersectionObserver((entries) => { entries.forEach((e) => { if (e.isIntersecting) { const idx = stepRefs.current.indexOf(e.target); if (idx !== -1) setActiveStep(idx); } }); }, { threshold: 0.5, rootMargin: '-20% 0px -30% 0px' }); stepRefs.current.forEach((r) => r && io.observe(r)); return () => io.disconnect(); }, []); const steps = [ { num: '01', title: t.step1Title, body: t.step1Body, tip: t.step1Tip, screen: , mobileMockup: }, { num: '02', title: t.step2Title, body: t.step2Body, tip: t.step2Tip, screen: }, { num: '03', title: t.step3Title, body: t.step3Body, tip: t.step3Tip, screen: }, { num: '04', title: t.step4Title, body: t.step4Body, tip: t.step4Tip, screen: }]; return (

— {t.prev_eyebrow}

{t.prev_titleA} {t.prev_titleB}

{t.prev_sub}

{steps.map((s, i) =>

{s.screen}

)}

{steps.map((s, i) =>

stepRefs.current[i] = el} className="preview-step" style={{ opacity: activeStep === i ? 1 : 0.35, transition: 'opacity 0.4s' }}> {s.mobileMockup && (

{s.mobileMockup}

)} {s.num}

{s.title}

{s.body}

{s.tip &&

💡{s.tip}

}

)}

); } function Stores({ t }) { const stores = ['Trendyol', 'Zara', 'Nike', 'Mango', 'Karaca', 'Sephora', 'Beymen', 'Pandora', 'H&M', 'LCW', 'Adidas', 'Boyner', 'Sephora', 'Penti', 'Yargıcı', 'Vakko']; return (

— {t.stores_eyebrow}

{t.stores_titleA} {t.stores_titleB}

{t.stores_sub}

{[...stores, ...stores].map((s, i) => {s})}

{[...stores.slice().reverse(), ...stores.slice().reverse()].map((s, i) => {s})}

); } function Testimonials({ t }) { const items = [ { q: t.testi1, n: 'Defne K.', h: '@defnek', src: AVATAR.defne }, { q: t.testi2, n: 'Cem A.', h: '@cematk', src: AVATAR.cem }, { q: t.testi3, n: 'Ayşe N.', h: '@aysenur', src: AVATAR.ayse }]; return (

— {t.testi_eyebrow}

{t.testi_titleA} {t.testi_titleB}

{items.map((it, i) =>

{it.q}

{it.n}

{it.h}

)}

); } function CTA({ t }) { return (

— {t.cta_eyebrow}

{t.cta_titleA}
{t.cta_titleB}

{t.cta_sub}