+
+ {/* Custom Global Styles for fonts & animations */}
+
+
+ {/* Decorative Ambient Background */}
+
+
+
+
+ {/* ── HEADER / NAVBAR ── */}
+
+
+ {/* ── HERO & CONVERSATIONAL SANDBOX GRID ── */}
+
+
+
+ {/* Left: Text Elements */}
+
+
+
+
+
+ {t.heroTitle1}
+
+ {t.heroTitle2}
+
+
+
+
+ {t.heroDesc}
+
+
+
+
setShowModal(true)}
+ className="w-full sm:w-auto bg-gradient-to-r from-violet-600 to-indigo-600 hover:from-violet-500 hover:to-indigo-500 text-white font-extrabold text-[12px] tracking-wider uppercase px-8 py-4.5 rounded-2xl transition-all cursor-pointer active:scale-98 shadow-lg shadow-violet-600/15"
+ >
+ {t.startBtn}
+
+
+ {t.exploreBtn}
+
+
+
+ {/* Quick Stats Grid */}
+
+ {data.istatistikler.map((stat, i) => (
+
+ {stat.deger}
+ {stat.etiket.substring(0, 15)}...
+
+ ))}
+
+
+
+ {/* Right: Conversational UI Preview Sandbox */}
+
+
+
+ {/* Chat Header */}
+
+
+
+ 🧬
+
+
+ {t.sandboxTitle}
+
+
+
+
+
+
+
+
+ {/* Chat Messages Log */}
+
+ {chatMessages.map((msg, i) => (
+
+ ))}
+
+ {/* Bot Typing Indicator */}
+ {isBotTyping && (
+
+ )}
+
+
+
+
+ {/* Suggested Questions Chips */}
+
+ handleSuggestionClick("suggest1", t.suggest1)}
+ disabled={isBotTyping}
+ className="text-[10px] font-bold text-zinc-400 bg-zinc-900 border border-zinc-800 hover:border-violet-500/40 hover:text-white px-3 py-1.5 rounded-full transition-all cursor-pointer shrink-0 disabled:opacity-50"
+ >
+ {t.suggest1}
+
+ handleSuggestionClick("suggest2", t.suggest2)}
+ disabled={isBotTyping}
+ className="text-[10px] font-bold text-zinc-400 bg-zinc-900 border border-zinc-800 hover:border-violet-500/40 hover:text-white px-3 py-1.5 rounded-full transition-all cursor-pointer shrink-0 disabled:opacity-50"
+ >
+ {t.suggest2}
+
+ handleSuggestionClick("suggest3", t.suggest3)}
+ disabled={isBotTyping}
+ className="text-[10px] font-bold text-zinc-400 bg-zinc-900 border border-zinc-800 hover:border-violet-500/40 hover:text-white px-3 py-1.5 rounded-full transition-all cursor-pointer shrink-0 disabled:opacity-50"
+ >
+ {t.suggest3}
+
+
+
+ {/* Chat Input Area */}
+
+
+
+
+
+ {/* ── STREAMING TEXT / INDEXING TERMINAL WIDGET ── */}
+
+
+
+
+
+ 💻
+
+
+ {t.terminalTitle}
+
+
+ {lang === "tr"
+ ? "Zenith AI, arka planda web sitelerinizi semantik kütüphanelere ayrıştırırken eşzamanlı bir tarama yürütür. Kod bloklarını simüle edin ve veri indekslemeyi canlı izleyin."
+ : "Zenith AI runs synchronous crawlers that dissect pages into semantic vector models. Simulate knowledge indexing in real-time below."}
+
+
+ {isTerminalIndexing && (
+
+
+ )}
+ {t.terminalRunBtn}
+
+
+
+ {/* Terminal Console Card */}
+
+ {/* Header controls */}
+
+
+
+
sh - zenith_indexer.sh
+
+
+ {/* Scrollable logs */}
+
+ {terminalLogs.length === 0 ? (
+
{lang === "tr" ? "İndeksleme simülatörünü başlatmak için sol taraftaki butona basın." : "Click the button to simulate the semantic vector indexer."}
+ ) : (
+ terminalLogs.map((log, i) => (
+
+ {log}
+
+ ))
+ )}
+
+
+
+
+
+
+ {/* ── BENTO FEATURE CARDS Grid ── */}
+
+
+
+ {t.featuresHeader}
+
+
+ {t.featuresSub}
+
+
+
+ {/* Card 1: 8cols top */}
+
+ {/* Ambient hover glow */}
+
+
+
+
+
{data.hizmetler[0].baslik}
+
{data.hizmetler[0].aciklama}
+
+
+ {/* Card 2: 4cols top */}
+
+
+
+
+
+
{data.hizmetler[1].baslik}
+
{data.hizmetler[1].aciklama}
+
+
+ {/* Card 3: 4cols bottom */}
+
+
+
+
+
+
{data.hizmetler[2].baslik}
+
{data.hizmetler[2].aciklama}
+
+
+ {/* Card 4: 8cols bottom */}
+
+
+
+
+
+
{data.hizmetler[3].baslik}
+
{data.hizmetler[3].aciklama}
+
+
+
+
+ {/* ── INTEGRATIONS SCROLLING LOGO MARQUEE ── */}
+
+
+
+
{t.integrationsHeader}
+
{t.integrationsSub}
+
+
+
+ {[1, 2].map((loop) => (
+
+
+ {/* Integration Logo: Slack */}
+
+
+ {/* Integration Logo: WhatsApp */}
+
+
+ {/* Integration Logo: Notion */}
+
+ N
+ NOTION
+
+
+ {/* Integration Logo: Discord */}
+
+
+ {/* Integration Logo: Zendesk */}
+
+ Z
+ ZENDESK
+
+
+
+ ))}
+
+
+
+ {/* ── PRICING TIER SECTION ── */}
+
+
+
{t.pricingHeader}
+
{t.pricingSub}
+
+
+ {/* Plan 1: Free */}
+
+
+
Tier 01
+
Sandbox
+
+ {lang === "tr" ? "Yapay zekayı kendi web sitenizde test edin." : "Test conversational intelligence live on your host."}
+
+
+
+ $0
+ / {lang === "tr" ? "Sonsuza Dek" : "Forever"}
+
+
+
+
+ ✓ 1 Website Connection
+
+
+ ✓ 5 Semantic Chunk Indexing
+
+
+ ✓ JS Embed Widget
+
+
+
+
+
setShowModal(true)}
+ className="w-full bg-zinc-900 hover:bg-zinc-800 text-zinc-300 font-extrabold text-[10px] tracking-wider uppercase py-4 rounded-xl transition-all cursor-pointer mt-8"
+ >
+ {t.startBtn}
+
+
+
+ {/* Plan 2: Pro (Active Glow) */}
+
+
+ POPULAR
+
+
+
+
Tier 02
+
Growth
+
+ {lang === "tr" ? "Küçük ekipler ve büyüyen SaaS markaları için." : "Ideal support scale for early corporate integrations."}
+
+
+
+ $49
+ / {lang === "tr" ? "Aylık" : "Month"}
+
+
+
+
+ ✓ 3 Website Connections
+
+
+ ✓ 200+ Pages Semantic Indexing
+
+
+ ✓ Slack & WhatsApp channels
+
+
+ ✓ Custom Brand colors & logo
+
+
+
+
+
setShowModal(true)}
+ className="w-full bg-gradient-to-r from-violet-600 to-indigo-600 hover:from-violet-500 hover:to-indigo-500 text-white font-extrabold text-[10px] tracking-wider uppercase py-4 rounded-xl transition-all cursor-pointer mt-8"
+ >
+ {lang === "tr" ? "Hemen Başlat" : "Launch Now"}
+
+
+
+ {/* Plan 3: Enterprise */}
+
+
+
Tier 03
+
Corporate
+
+ {lang === "tr" ? "Sınırsız sunucu kapasitesi ve KVKK entegrasyonu." : "Full GDPR validation and cluster node orchestration."}
+
+
+
+ Custom
+
+
+
+
+ ✓ Unlimited data sync loops
+
+
+ ✓ Dedicated Cluster Node
+
+
+ ✓ Personal Support Sommelier
+
+
+ ✓ Custom Model fine-tuning
+
+
+
+
+
setShowModal(true)}
+ className="w-full bg-zinc-900 hover:bg-zinc-800 text-zinc-300 font-extrabold text-[10px] tracking-wider uppercase py-4 rounded-xl transition-all cursor-pointer mt-8"
+ >
+ {lang === "tr" ? "İletişime Geç" : "Talk to Sales"}
+
+
+
+
+
+ {/* ── CLIENT TESTIMONIALS ── */}
+
+
+
{t.reviewsHeader}
+
{t.reviewsSub}
+
+ {data.yorumlar.map((review, i) => (
+
+
+
+ {review.emoji}
+
+
+ {review.yazar}
+ {review.tarih}
+
+
+
+ "{review.yorum}"
+
+
+ ))}
+
+
+ {/* ── BOTTOM CALL TO ACTION BANNER ── */}
+
+
+ {/* Purple decorative spotlight */}
+
+
+
+ {lang === "tr" ? "Müşteri Destek Dönüşümünü Katlayın" : "Double your customer conversion loop"}
+
+
+ {lang === "tr"
+ ? "Semantik taranan indeksler sayesinde Zenith AI sıfır halüsinasyon riski taşır. Saniyeler içinde kurun ve ekibinizi otomatik yapay zekâ ile özgürleştirin."
+ : "Thanks to parsed semantic indexing, Zenith AI delivers responses with zero hallucination. Install in under 60 seconds and automate support loops."}
+
+
+
setShowModal(true)}
+ className="bg-zinc-100 hover:bg-white text-zinc-950 font-black text-[12px] tracking-wider uppercase px-8 py-4.5 rounded-2xl transition-all cursor-pointer shadow-lg active:scale-98"
+ >
+ {lang === "tr" ? "Destek Sistemini Güçlendir" : "Supercharge Support Now"}
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+ Z
+ {data.firma.adi}
+
+
+ {t.footerText}
+
+
+
+ {/* ── INTERACTIVE SCRIPTS MODAL (SANDBOX INTEGRATOR) ── */}
+
+ {showModal && (
+
+
+ {/* Close Button */}
+ {
+ setShowModal(false);
+ setGeneratedScript("");
+ setUserUrl("");
+ setUserEmail("");
+ }}
+ className="absolute top-6 right-6 w-8 h-8 rounded-full bg-zinc-950 border border-zinc-800/80 flex items-center justify-center text-zinc-500 hover:text-white transition-all cursor-pointer font-bold text-xs"
+ >
+ ✕
+
+
+ {/* Title & Badge */}
+
+ 🧬
+
+
+
+ {t.tryModalTitle}
+
+
+ {t.tryModalDesc}
+
+
+ {/* Generative Embed Code Form */}
+ {generatedScript === "" ? (
+
+ ) : (
+ // Display Embed Script
+
+
+
+
+ {t.tokenDesc}
+
+
+
+ {generatedScript}
+
+
+
+
+ {isCopied ? "✓" : "📋"} {isCopied ? t.copied : t.copyBtn}
+
+ {
+ setShowModal(false);
+ setGeneratedScript("");
+ setUserUrl("");
+ setUserEmail("");
+ }}
+ className="border border-zinc-800 bg-zinc-950/40 hover:bg-zinc-900 text-zinc-300 font-extrabold text-[10px] tracking-wider uppercase py-4 px-6 rounded-xl transition-all cursor-pointer"
+ >
+ {t.closeBtn}
+
+
+
+
+ )}
+
+
+
+
+ {/* Floating cross graphics (+) from reference design */}
+
+
+ {/* ── FLOATING CONCEPT BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+ {/* ── PREMIUM HEADER ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navMembership, href: "#uyelik" },
+ { label: t.navServices, href: "#hizmetler" },
+ { label: t.navWorks, href: "#works" },
+ { label: t.navReviews, href: "#yorumlar" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Action Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-elegant px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-[#1E2E38]/60 hover:text-[#1E2E38]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-elegant px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-[#1E2E38]/60 hover:text-[#1E2E38]"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[10px] font-black tracking-[2.5px] uppercase text-[#FAF7F2] bg-[#1E2E38] hover:bg-[#121C22] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(30,46,56,0.15)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookNow}
+
+
+
+
+ {/* ── HERO SECTION ── */}
+
+
+
+
+ {/* Left Col - Text Content */}
+
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+
+ setShowBookingModal(true)}
+ className="inline-flex items-center gap-3 px-8 py-4.5 rounded-xl bg-[#1E2E38] hover:bg-[#121C22] text-[#FAF7F2] font-black text-[10px] tracking-[2px] uppercase transition-all shadow-[0_5px_15px_rgba(30,46,56,0.1)] cursor-pointer"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookNow} →
+
+
+
+
+ {/* Right Col - Cropped Smiling Portrait Overlay */}
+
+
+ {/* Background soft lighting */}
+
+
+ {/* Main Generated High-Fidelity Smiling Image */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+ {/* ── SECTION 001: AFFORDABLE CARE & BENTO CARDS ── */}
+
+
+
+
+
+ {/* Left Content */}
+
+
+ 001 - Join Membership
+
+
+ {t.membershipHeader}
+
+
+ {t.membershipDesc}
+
+
+ {/* Patient Pile from Reference Design */}
+
+
+ {["👨⚕️", "👩⚕️", "🧑⚕️", "✨"].map((emoji, i) => (
+
+ {emoji}
+
+ ))}
+
+ +
+
+
+ {t.joinedText}
+
+
+
+ setShowBookingModal(true)}
+ className="px-8 py-4 rounded-xl bg-[#1E2E38] hover:bg-[#121C22] text-[#FAF7F2] font-black text-[10px] tracking-[2.5px] uppercase transition-colors"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.joinBtn} →
+
+
+
+ {/* Right Bento Cards */}
+
+
+ {/* Card 1: 80% Savings */}
+
+
+
+ {istatistikler[0]?.deger || "80%"}
+
+ +
+
+
+
{t.statTitle1}
+
+ {t.statDesc1}
+
+
+
+ {/* Card 2: 40% Benefits */}
+
+
+
+ {istatistikler[1]?.deger || "40%"}
+
+ +
+
+
+
{t.statTitle2}
+
+ {t.statDesc2}
+
+
+
+
+
+
+
+
+
+ {/* ── CORE SERVICES CARD ROW ── */}
+
+
+
+
+ {t.navServices}
+
+ {t.servicesHeader}
+
+
+
+
+ {hizmetler.map((h, i) => {
+ const item = getLocalizedServiceText(h.baslik);
+ return (
+
+
+
+ {getServiceIconSvg(h.ikon)}
+
+
+ {item.title}
+
+
+ {item.desc}
+
+
setShowBookingModal(true)}
+ className="text-[#1E2E38] font-black text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-opacity-80 transition-colors pt-4 border-t border-gray-100"
+ >
+ {lang === "tr" ? "DAHA FAZLA BİLGİ →" : "LEARN MORE →"}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── SECTION 002: OUR WORKS / PORTFOLIO ── */}
+
+
+
+ {/* Header */}
+
+
+
+ 002 - Our Works
+
+
+ {t.worksHeader}
+
+
+
+ {/* Spinning Circle badge and text details */}
+
+ {/* Spinning Badge */}
+
+
+
+
+ {t.viewAllWorks}
+
+
+
+
↗
+
+ {t.worksDesc}
+
+
+
+
+ {/* 3 Column Image Cards Grid */}
+
+ {projeler.map((p, i) => (
+
+
+ {/* Photo container */}
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+ {/* Text details */}
+
{p.baslik}
+
{lang === "tr" ? "Estetik ve Dayanıklı Sonuçlar" : "Impressive, high-durability smile aesthetics"}
+
setShowBookingModal(true)}
+ className="text-[#1E2E38] font-black text-[9px] tracking-[2px] uppercase flex items-center gap-1 cursor-pointer hover:text-opacity-80 transition-colors pt-4 shrink-0"
+ >
+ {lang === "tr" ? "VAKAYI İNCELE →" : "VIEW CASE →"}
+
+
+ ))}
+
+
+
+
+ {/* ── YORUMLAR (TESTIMONIALS) ── */}
+
+
+
+
+ 003 - Patient Stories
+
+
+ {t.reviewsHeader}
+
+
+
+
+
+
+
+ {[...Array(yorumlar[activeYorum]?.puan || 5)].map((_, i) => (
+
+
+ ))}
+
+ “{yorumlar[activeYorum]?.yorum}”
+
+
+
+ {yorumlar[activeYorum]?.yazar.charAt(0)}
+
+
+
{yorumlar[activeYorum]?.yazar}
+
{yorumlar[activeYorum]?.tarih}
+
+
+
+
+
+ {yorumlar.map((_, i) => (
+ setActiveYorum(i)}
+ className="w-2.5 h-2.5 rounded-full transition-all cursor-pointer"
+ style={{ background: i === activeYorum ? "#1E2E38" : "rgba(30,46,56,0.15)",
+ transform: i === activeYorum ? "scale(1.3)" : "scale(1)" }} />
+ ))}
+
+
+
+
+ {/* ── RANDEVU AL (APPOINTMENT SECTION) ── */}
+
+
+
+
+
+ 004 - Online Appointment
+
+
+ {t.bookingHeader}
+
+
+ {t.bookingDesc}
+
+
+
+
+ {[
+ { label: t.fieldsName, placeholder: lang === "tr" ? "Adınız Soyadınız" : "Your Full Name", type: "text", full: false },
+ { label: t.fieldsPhone, placeholder: "05xx xxx xx xx", type: "tel", full: false },
+ { label: t.fieldsEmail, placeholder: "ornek@mail.com", type: "email", full: false },
+ { label: t.fieldsService, placeholder: "", type: "select", full: false },
+ { label: t.fieldsDate, placeholder: "", type: "date", full: false },
+ { label: t.fieldsNotes, placeholder: t.fieldsNotesPlaceholder, type: "text", full: true },
+ ].map((field, i) => (
+
+ {field.label}
+ {field.type === "select" ? (
+
+ {lang === "tr" ? "Diş Çürüklerini Önleme" : "Prevent Cavities & Disease"}
+ {lang === "tr" ? "Işıldayan Temizlik" : "Teeth Sparkling Cleaning"}
+ {lang === "tr" ? "Diş Düzeltme" : "Teeth Straightening"}
+ {lang === "tr" ? "Diş İmplantı" : "Dental Implant"}
+
+ ) : (
+
+ ))}
+
+
setShowBookingModal(true)}
+ className="mt-8 w-full py-4.5 rounded-xl text-[#FAF7F2] font-black text-xs bg-[#1E2E38] hover:bg-[#121C22] uppercase tracking-widest cursor-pointer shadow-[0_5px_15px_rgba(30,46,56,0.15)]"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ 📅 {t.dispatchForm}
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+
{t.footerDesc}
+
+
📍 {firma.adres}
+
📞 {firma.telefon}
+
+
+
+
{t.navServices}
+ {hizmetler.map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
{s.title}
+ );
+ })}
+
+
+
Odentries
+ {[t.navMembership, t.navServices, t.navWorks, t.navReviews].map((item) => (
+
{item}
+ ))}
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+ {/* ── BOOKING MODAL ── */}
+
+ {showBookingModal && (
+
+
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+ {t.contactTitle}
+ {t.contactDesc}
+
+
+
+ {t.fieldsName}
+
+
+ {t.fieldsPhone}
+
+
setShowBookingModal(false)}
+ >
+ {t.submit}
+
+
+
+ )}
+
+
+
+ {/* Floating Ambient Orbs */}
+
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+ {/* ── PREMIUM FLOATING NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navBook, href: "#booking-widget" },
+ { label: t.navSuites, href: "#suites-showcase" },
+ { label: t.navExp, href: "#experiences" },
+ { label: t.navRev, href: "#testimonials" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Booking Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ EN
+
+
+
+
setShowModal(true)}
+ className="text-[10px] font-black tracking-[2.5px] uppercase text-white bg-[#14B8A6] hover:bg-[#0D9488] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(20,184,166,0.15)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.reserveNow}
+
+
+
+
+ {/* ── HERO & SUITE QUICK LOOK ── */}
+
+
+
+
+ {/* Left Column: Typography Details */}
+
+
+
+
+
+ {firma.slogan}
+ {t.heroTail}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Statistics Grid */}
+
+ {istatistikler.map((stat, idx) => (
+
+
+ {stat.deger}
+
+
+ {getLocalizedStat(stat.etiket)}
+
+
+
+ {/* CTA buttons */}
+
+
+ {t.planEscape}
+
+
+ {t.resortServices}
+
+
+
+
+ {/* Right Column: Layered Boutique Showcase */}
+
+
+ {/* Outer delicate lines */}
+
+
+ {/* Main Mediterranean Dining / Pool Setup */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+ {/* Miniature citrus close-up */}
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+ {t.welcomeTitle}
+
{t.welcomeDesc}
+
+
+
+
+
+
+
+ {/* ── INTERACTIVE BOOKING ENGINE ── */}
+
+
+ {/* ── SUITES GALLERY ── */}
+
+
+
+
+
+ {t.suitesTitle}
+
+ {t.suitesHeader}
+
+
+
+ {t.suitesDesc}
+
+
+
+ {/* Gallery Columns */}
+
+ {[
+ { title: t.suite1Title, img: "/sicilia_hero_table.png", desc: t.suite1Desc },
+ { title: t.suite2Title, img: "/sicilia_lemon_heritage.png", desc: t.suite2Desc },
+ { title: t.suite3Title, img: "/sicilia_hero_table.png", desc: t.suite3Desc },
+ ].map((suite, idx) => (
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+ {suite.title}
+
+
+ {suite.desc}
+
+
+ setShowModal(true)}
+ className="text-[#14B8A6] font-black text-[10px] tracking-[2px] uppercase flex items-center gap-1.5 cursor-pointer hover:text-[#0D9488] transition-colors"
+ >
+ {t.secureRes}
+
+
+
+ ))}
+
+
+
+
+ {/* ── RESORT EXPERIENCES ── */}
+
+
+
+ {hizmetler.map((hizmet, idx) => {
+ const locServ = getLocalizedService(hizmet.baslik, hizmet.aciklama);
+ return (
+
+
+
+
+ {locServ.title}
+
+
+ {locServ.desc}
+
+
+
+
setShowModal(true)}
+ className="text-[#14B8A6] font-black text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-[#0D9488] transition-colors"
+ >
+ {lang === "tr" ? "DAHA FAZLA KEŞFET →" : "DISCOVER MORE →"}
+
+
+ );
+ })}
+
+
+
+ {/* ── TESTIMONIALS ── */}
+
+
+
+
+
{t.diaries}
+
+ {t.lovedGuests}
+
+
+ {t.lovedDesc}
+
+
+
+ {/* Testimonials 2-Column Grid */}
+
+ {yorumlar.map((y, yIdx) => (
+
+ {/* Rating Stars SVG */}
+
+ {[...Array(5)].map((_, starIdx) => (
+
+
+ ))}
+
+
+
+ “{y.yorum}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+
+ ))}
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+ {/* About Column */}
+
+
+ CalVestam
+
+
+ {firma.slogan} — Exclusive boutique resort nestled inside Ölüdeniz heights. Handcrafted sea suites, infinity pools, and organic salt therapy.
+
+
+
+
+
+ {firma.adres}
+
+
+
+
+ {firma.email}
+
+
+
+
+ {/* Coordinates Column */}
+
+
+ {t.vipCoords}
+
+
+
{t.conciergeActive} 24 Hours Active
+
Check-In/Out {t.checkInOutDetails}
+
+
+
+ {/* Leisure Services Column */}
+
+
+ {t.boutiqueLeisures}
+
+
+ {hizmetler.map((h, hIdx) => {
+ const locS = getLocalizedService(h.baslik, h.aciklama);
+ return (
+
+ {locS.title}
+
+ );
+ })}
+
+
+
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+
+ {/* ── CONFIRM SUCCESS MODAL ── */}
+
+ {showModal && (
+
+
+ {/* Close Button */}
+ setShowModal(false)}
+ >
+ ✕
+
+
+ {/* Success check indicator */}
+
+
+
+ {t.enquiryActive}
+
+
+ {t.ambassadorActive}
+
+
+
+ {t.enquirySuccess}
+
+
+ setShowModal(false)}
+ >
+ {t.dismiss}
+
+
+
+ )}
+
+
+
("direct");
+ const [lang, setLang] = useState<"tr" | "en">("tr");
+ const [preloader, setPreloader] = useState(true);
+
+ const t = translations[lang];
+
+ // 1. Lenis Smooth Scroll Integration
+ useEffect(() => {
+ let lenis: any;
+ import("@studio-freight/lenis").then(({ default: Lenis }) => {
+ lenis = new Lenis({ duration: 1.2, easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+ function raf(time: number) { lenis.raf(time); requestAnimationFrame(raf); }
+ requestAnimationFrame(raf);
+ });
+ return () => lenis?.destroy();
+ }, []);
+
+ // 2. Preloader Curtain Timer
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setPreloader(false);
+ }, 1500);
+ return () => clearTimeout(timer);
+ }, []);
+
+ // Localized services
+ const getLocalizedService = (baslik: string, aciklama: string) => {
+ if (baslik.includes("HOSTS")) {
+ return {
+ title: lang === "tr" ? "EV SAHİBİ REHBERLİĞİ" : "MEET YOUR HOSTS",
+ desc: lang === "tr" ? "Yerel dağ rehberlerimiz; alabalık avı yolları, yaban çiçeği rotaları ve gizli nehir haritaları koordinasyonunu üstlenir." : aciklama
+ };
+ }
+ if (baslik.includes("POLICIES")) {
+ return {
+ title: lang === "tr" ? "KULÜBE KURALLARI" : "CABIN POLICIES",
+ desc: lang === "tr" ? "Evcil hayvan dostu konaklama koşulları. Döküm demir tava ve her zaman dolu odunluk güvenceleri." : aciklama
+ };
+ }
+ return {
+ title: lang === "tr" ? "DOĞRUDAN REZERVE" : "DIRECT RESERVATION",
+ desc: lang === "tr" ? "Airbnb veya VRBO ile anlık takvim senkronizasyonu; dilerseniz komisyonsuz doğrudan rezervasyon avantajı." : aciklama
+ };
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;500;600;700;800;900&display=swap');
+
+ :root {
+ --color-bunkhouse-gold: #854D0E;
+ --color-bunkhouse-sand: #F5F2EB;
+ --color-bunkhouse-stone: #1C1917;
+ --color-bunkhouse-card: #FAF8F5;
+ }
+
+ .font-serif-bunkhouse {
+ font-family: 'Playfair Display', Georgia, serif;
+ }
+
+ .font-industrial-bunkhouse {
+ font-family: 'Inter', sans-serif;
+ font-weight: 800;
+ }
+
+ .font-sans-bunkhouse {
+ font-family: 'Inter', sans-serif;
+ }
+
+ .bg-rustic-mesh {
+ background-image:
+ radial-gradient(circle at 10% 10%, rgba(133, 77, 14, 0.02) 0%, transparent 40%),
+ radial-gradient(circle at 90% 90%, rgba(28, 25, 23, 0.02) 0%, transparent 50%),
+ linear-gradient(rgba(28, 25, 23, 0.005) 1px, transparent 1px),
+ linear-gradient(90deg, rgba(28, 25, 23, 0.005) 1px, transparent 1px);
+ background-size: 100% 100%, 100% 100%, 30px 30px, 30px 30px;
+ }
+
+ .border-bunkhouse {
+ border-color: rgba(28, 25, 23, 0.15);
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(34px, 5vw, 85px);
+ letter-spacing: -0.02em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: CURTAIN REVEAL PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ BITTERROOT BUNKHOUSE
+
+
+
+
+ wilderness sanctuary
+
+
+ )}
+
+
+ {/* COZY RUSTIC WILDERNESS LODGE THEME */}
+
+
+ {/* Floating Woody Ambience Orbs */}
+
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+
+
+ {/* ── COZY HEADER ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navCabin, href: "#about-cabin" },
+ { label: t.navHosts, href: "#host-details" },
+ { label: t.navChannels, href: "#booking-channels" },
+ { label: t.navReviews, href: "#testimonials" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Booking Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-[#1C1917] text-white shadow-sm" : "text-[#1C1917]/60 hover:text-[#1C1917]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-[#1C1917] text-white shadow-sm" : "text-[#1C1917]/60 hover:text-[#1C1917]"
+ }`}
+ >
+ EN
+
+
+
+
setShowModal(true)}
+ className="text-[9px] font-bold tracking-[2.5px] uppercase text-white bg-[#1C1917] hover:bg-[#854D0E] px-6 py-3.5 rounded-lg transition-all cursor-pointer shadow-md hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookWilderness}
+
+
+
+
+ {/* ── COZY HERO BANNER (DARK CONTRAST) ── */}
+
+
+ {/* Ambient fire glow background */}
+
+
+ {/* Banner top */}
+
+
+ BITTERROOT VALLEY · MONTANA
+
+
+ {t.est}
+
+
+
+ {/* Banner headings */}
+
+
+ {firma.slogan}
+
+
+ {t.heroDesc}
+
+
+
+
+ {t.cabinUnits}
+ {t.cabinWood}
+
+
+ {t.fireplaceUnit}
+ {t.fireplaceType}
+
+
+
setShowModal(true)}
+ className="px-8 py-4 bg-[#854D0E] hover:bg-white hover:text-[#1C1917] text-white font-bold text-[9px] tracking-[2.5px] uppercase rounded-xl transition-all cursor-pointer shadow-lg"
+ whileHover={{ scale: 1.02 }}
+ >
+ {t.secureCabin}
+
+
+
+
+ {/* ── ABOUT THE CABIN WITH LAYERED GRAPHICS ── */}
+
+
+
+
+
{t.aboutTitle}
+
+ {t.aboutHeader}
+
+
+
+
+ {/* Layered images grid */}
+
+
+ {/* Left Column: 3 detailed pictures layered */}
+
+ {/* 1st image: Sourdough fresh bakery */}
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+ {/* 2nd image: Cozy fireside cooking */}
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+ {/* Right Column: Cabin text details */}
+
+
EXCLUSIVELY HAND-CRAFTED
+
+ {t.aboutSub}
+
+
+ {t.aboutDesc}
+
+
+ {/* Details list */}
+
+ {[
+ { title: t.feat1Title, text: t.feat1Desc },
+ { title: t.feat2Title, text: t.feat2Desc },
+ ].map((feat, idx) => (
+
+
+
+
{feat.title}
+
{feat.text}
+
+
+ ))}
+
+
+
+
+
+
+
+ {/* ── CHANNELS & HOST GUIDES ── */}
+
+
+
+
+ {hizmetler.map((hizmet, idx) => {
+ const locServ = getLocalizedService(hizmet.baslik, hizmet.aciklama);
+ return (
+
+
+
+
+ {locServ.title}
+
+
+ {locServ.desc}
+
+
+
+
setShowModal(true)}
+ className="text-[#854D0E] font-bold text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-[#5F3507]"
+ >
+ {lang === "tr" ? "DAHA FAZLA KEŞFET →" : "DISCOVER MORE →"}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── CHANNEL BOOKING INTEGRATION ── */}
+
+
+
+
+
+
+
+
{t.channelsTitle}
+
+ {t.channelsHeader}
+
+
+ {t.channelsDesc}
+
+
+
+ {/* Toggle channels buttons */}
+
+ {[
+ { id: "airbnb", label: t.chAirbnb },
+ { id: "vrbo", label: t.chVrbo },
+ { id: "direct", label: t.chDirect },
+ ].map(item => (
+ setChannel(item.id)}
+ className={`px-4 py-3.5 rounded-xl border text-[9px] font-bold uppercase tracking-widest transition-all cursor-pointer text-center ${
+ channel === item.id
+ ? "bg-[#854D0E] border-[#854D0E] text-white shadow-md"
+ : "bg-white/[0.02] border-white/5 text-white/50 hover:text-white hover:border-white/10"
+ }`}
+ >
+ {item.label}
+
+ ))}
+
+
+ {/* Active channel info */}
+
+
+ {channel === "airbnb" ? t.airbnbTitle : channel === "vrbo" ? t.vrboTitle : t.directTitle}
+
+
+ {channel === "airbnb"
+ ? t.airbnbDesc
+ : channel === "vrbo"
+ ? t.vrboDesc
+ : t.directDesc}
+
+
setShowModal(true)}
+ className="w-full py-4.5 rounded-xl bg-[#854D0E] hover:bg-white hover:text-[#1C1917] text-white font-bold text-[9px] tracking-[2px] uppercase cursor-pointer transition-colors shadow-md"
+ whileHover={{ scale: 1.01 }}
+ >
+ {t.launchPortal}
+
+
+
+
+
+
+
+ {/* ── TESTIMONIALS ── */}
+
+
+
+
+ {t.diaries}
+
+ {t.lovedGuests}
+
+
+
+ {/* Grid */}
+
+ {yorumlar.map((y, yIdx) => (
+
+
+ {[...Array(5)].map((_, starIdx) => (
+
+
+ ))}
+
+
+
+ “{y.yorum}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+
+ ))}
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+ {/* About Column */}
+
+
+ BitterrootBunkhouse
+
+
+ {firma.slogan} — Cozy hand-built rustic cedar cabins deep inside Darby forest valley. High-end off-grid luxury.
+
+
+
+
+
+ {firma.adres}
+
+
+
+
+ {firma.email}
+
+
+
+
+ {/* Coordinates Column */}
+
+
+ {lang === "tr" ? "KULÜBE KOORDİNATLARI" : "CABIN COORDINATES"}
+
+
+
{t.mountainHelp} {t.mountainActive}
+
Check-In/Out {lang === "tr" ? "Giriş: 16:00 · Çıkış: 10:00" : "Check In: 4:00 PM · Check Out: 10:00 AM"}
+
+
+
+ {/* Services Column */}
+
+
+ {t.vipServices}
+
+
+ {hizmetler.map((h, hIdx) => {
+ const locS = getLocalizedService(h.baslik, h.aciklama);
+ return (
+
+ {locS.title}
+
+ );
+ })}
+
+
+
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+
+ {/* ── BOOKING MODAL ── */}
+
+ {showModal && (
+
+
+ {/* Close Button */}
+ setShowModal(false)}
+ >
+ ✕
+
+
+ {/* Success check indicator */}
+
+
+
+ {t.enquiryActive}
+
+
+ {t.ambassadorActive}
+
+
+
+ {t.enquirySuccess}
+
+
+ setShowModal(false)}
+ >
+ {t.dismiss}
+
+
+
+ )}
+
+
+
+ {preloader && (
+
+
+
+ APEX ARC MONOLITHIC
+
+
+
+
+ brutalist villa estate
+
+
+ )}
+
+
+ {/* SLEEK BRUTALIST ARCHITECTURAL ESTATE THEME */}
+
+
+ {/* Floating Ambient Emerald Orbs */}
+
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+
+
+ {/* ── HIGH CONTRAST SLATE NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navIdeology, href: "#ideology" },
+ { label: t.navServices, href: "#services" },
+ { label: t.navPortfolio, href: "#portfolio" },
+ { label: t.navEnquire, href: "#booking-flow" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Booking Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ EN
+
+
+
+
setShowModal(true)}
+ className="text-[10px] font-black tracking-[2.5px] uppercase text-white bg-[#059669] hover:bg-white hover:text-black px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_5px_15px_rgba(5,150,105,0.2)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.scheduleAccess}
+
+
+
+
+ {/* ── ARCHITECTURAL HERO BANNER ── */}
+
+
+
+
+ {/* Left Column: Heading and Brutalist descriptions */}
+
+
+
+
+
+ {firma.slogan}
+ {t.sloganTail}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Quick actions */}
+
+ setShowModal(true)}
+ className="px-8 py-4 rounded-xl bg-[#059669] hover:bg-white hover:text-[#09090C] text-white font-black text-[10px] tracking-[2px] uppercase transition-all shadow-[0_5px_15px_rgba(5,150,105,0.25)] cursor-pointer"
+ whileHover={{ scale: 1.02 }}
+ >
+ {t.scheduleVisit}
+
+
+ {t.estatePortfolio}
+
+
+
+
+ {/* Right Column: High-fidelity image (brutalist fireplace oven) */}
+
+
+ {/* Raw concrete fireplace oven representing structural concrete warmth */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+
+ {/* ── IDEOLOGY STATISTICS BLOCK ── */}
+
+
+
+ {istatistikler.map((stat, idx) => {
+ const locStat = getLocalizedStat(stat.deger, stat.etiket);
+ return (
+
+
{idx === 0 ? t.statTitle1 : idx === 1 ? t.statTitle2 : t.statTitle3}
+
+ {locStat.deger}
+
+
+ {locStat.etiket}
+
+
+ );
+ })}
+
+
+
+ {/* ── BESPOKE SERVICES ── */}
+
+
+
+
+ {t.privateAmenities}
+
+ {t.bespokeServices}
+
+
+
+ {/* Bento services grid */}
+
+ {hizmetler.map((hizmet, idx) => {
+ const locServ = getLocalizedService(hizmet.baslik, hizmet.aciklama);
+ return (
+
+ {/* Cover image using dark upscale culinary smoke or organic lemon */}
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+ {locServ.title}
+
+
+ {locServ.desc}
+
+
+ setShowModal(true)}
+ className="text-[#059669] group-hover:text-white transition-colors text-[10px] font-black tracking-[2px] uppercase flex items-center gap-1.5 cursor-pointer"
+ >
+ {t.secureRes}
+
+
+
+ );
+ })}
+
+
+
+
+ {/* ── RESERVATION FLOW ── */}
+
+
+
+
+
+
+
+
{t.privilegedRequest}
+
+ {t.enquirePrivate}
+
+
+ {t.formDesc}
+
+
+
+
+ {[
+ { label: t.fieldsName, placeholder: lang === "tr" ? "Adınız Soyadınız" : "Your Name", type: "text", full: false },
+ { label: t.fieldsEmail, placeholder: "you@company.com", type: "email", full: false },
+ { label: t.fieldsPhone, placeholder: lang === "tr" ? "İrtibat Numarası" : "Contact Number", type: "tel", full: false },
+ { label: t.fieldsProperty, placeholder: lang === "tr" ? "Yalıkavak Beton Villa" : "Yalıkavak Concrete Villa", type: "text", full: false },
+ { label: t.fieldsNotes, placeholder: t.fieldsNotesPlaceholder, type: "text", full: true },
+ ].map((field, idx) => (
+
+ {field.label}
+
+ ))}
+
+
+
setShowModal(true)}
+ className="mt-8 w-full py-4 rounded-xl bg-[#059669] hover:bg-white hover:text-[#09090C] text-white font-bold text-[10px] tracking-[2.5px] uppercase transition-colors cursor-pointer"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.dispatchForm}
+
+
+
+
+
+ {/* ── TESTIMONIALS ── */}
+
+
+
+
+ {t.diaries}
+
+ {t.trustedOwners}
+
+
+
+ {/* Testimonials */}
+
+ {yorumlar.map((y, yIdx) => (
+
+
+ {[...Array(5)].map((_, starIdx) => (
+
+
+ ))}
+
+ “{y.yorum}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+ ))}
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+ {/* About Column */}
+
+
+ ApexArc
+
+
+ {firma.slogan} — Monolithic concrete-Teak luxury estates looking over Muğla coastlines. High-end voice smart interfaces.
+
+
+
+
+
+ {firma.adres}
+
+
+
+
+ {firma.email}
+
+
+
+
+ {/* Coordinates Column */}
+
+
+ {t.vipCoords}
+
+
+
{t.securityHours} {t.securityActive}
+
{t.heliport} {t.heliportActive}
+
+
+
+ {/* Services Column */}
+
+
+ {t.estateServices}
+
+
+ {hizmetler.map((h, hIdx) => {
+ const locS = getLocalizedService(h.baslik, h.aciklama);
+ return (
+
+ {locS.title}
+
+ );
+ })}
+
+
+
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+
+ {/* ── ENQUIRY MODAL ── */}
+
+ {showModal && (
+
+
+ {/* Close Button */}
+ setShowModal(false)}
+ >
+ ✕
+
+
+ {/* Success check indicator */}
+
+
+
+ {t.enquiryActive}
+
+
+ {t.ambassadorActive}
+
+
+
+ {t.enquirySuccess}
+
+
+ setShowModal(false)}
+ >
+ {t.dismiss}
+
+
+
+ )}
+
+
+
+
+ );
+ }
+ if (baslik.includes("Kardiyoloji")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("Diş")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("Göz")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("Laboratuvar")) {
+ return (
+
+
+ );
+ }
+ return (
+
+
+ );
+ };
+
+ const getLocalizedDoctor = (ad: string) => {
+ if (ad.includes("Ahmet")) {
+ return {
+ name: lang === "tr" ? "Dr. Ahmet Yılmaz" : "Dr. Ahmet Yilmaz",
+ title: lang === "tr" ? "Dahiliye Uzmanı" : "Internal Medicine Specialist",
+ };
+ }
+ if (ad.includes("Ayşe")) {
+ return {
+ name: lang === "tr" ? "Dr. Ayşe Kaya" : "Dr. Ayse Kaya",
+ title: lang === "tr" ? "Kardiyolog" : "Cardiologist",
+ };
+ }
+ if (ad.includes("Mehmet")) {
+ return {
+ name: lang === "tr" ? "Dr. Mehmet Demir" : "Dr. Mehmet Demir",
+ title: lang === "tr" ? "Göz Sağlığı Uzmanı" : "Ophthalmology Specialist",
+ };
+ }
+ return {
+ name: lang === "tr" ? "Dr. Zeynep Arslan" : "Dr. Zeynep Arslan",
+ title: lang === "tr" ? "Estetik Diş Hekimi" : "Aesthetic Dentist",
+ };
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700;800;900&family=Sora:wght@300;400;500;600;700;800&display=swap');
+
+ :root {
+ --color-klinik-sky: #0ea5e9;
+ --color-klinik-sky-dark: #0284c7;
+ --color-klinik-sky-light: #e0f2fe;
+ --color-klinik-charcoal: #0F172A;
+ --color-klinik-sand: #FAF8F5;
+ }
+
+ .font-sora-editorial {
+ font-family: 'Sora', sans-serif;
+ }
+
+ .font-sans-clean {
+ font-family: 'DM Sans', sans-serif;
+ }
+
+ .shadow-premium {
+ box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.05);
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(38px, 6vw, 85px);
+ letter-spacing: -0.02em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: CURTAIN REVEAL PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ DOĞAN TIP MERKEZİ
+
+
+
+
+ interactive prototype
+
+
+ )}
+
+
+
+
+ {/* Floating Ambient Orbs */}
+
+
+
+ {/* ── FLOATING CONCEPT BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+ {/* ── PREMIUM NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navServices, href: "#hizmetler" },
+ { label: t.navDoctors, href: "#doktorlar" },
+ { label: t.navReviews, href: "#testimonials" },
+ { label: t.navContact, href: "#randevu" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Booking Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-sora-editorial px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-sora-editorial px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[10px] font-black tracking-[2.5px] uppercase text-white bg-[#0ea5e9] hover:bg-[#0284c7] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(14,165,233,0.15)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.navBooking}
+
+
+
+
+ {/* ── HERO & INTERACTIVE APPOINTMENT TRACKER ── */}
+
+
+
+
+ {/* Left Column: Heading and clinic stats */}
+
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Statistics Grid */}
+
+ {istatistikler.map((stat, idx) => (
+
+
+ {stat.deger === "4200" || stat.deger === "620" ? `${stat.deger}+` : stat.deger}
+
+
+ {getLocalizedStatLabel(stat.deger)}
+
+
+
+ {/* CTA buttons */}
+
+
+ 📅 {t.navBooking}
+
+
+ {t.navServices}
+
+
+
+
+ {/* Right Column: Layered Live Tracker Mockup */}
+
+
+
+
+
{t.appointmentsToday}
+ {t.saturday}
+
+
+
+ {t.appointmentList.map((r, i) => (
+
+
+
+
+
{r.saat}
+ {r.tip}
+
+
+
+ {r.dolu ? t.statusDolu : t.statusMusait}
+
+
+ ))}
+
+ ⭐
+
+
{t.ratingText.split("•")[0]}
+ {t.ratingText.split("•")[1]}
+
+
+
+ {/* SMS Reminder Overlay */}
+
+ 🔔
+
+
{t.smsReminder}
+ {t.smsDesc}
+
+
+
+
+
+
+
+
+ {/* ── HİZMETLER ── */}
+
+
+
+
+ {t.servicesTitle}
+
+
+ {t.servicesHeader}
+
+
+
+
+ {hizmetler.map((h, i) => {
+ const item = getLocalizedServiceText(h.baslik);
+ return (
+
+
+
+ {getServiceIconSvg(h.baslik)}
+
+
{item.title}
+
{item.desc}
+
setShowBookingModal(true)}
+ className="text-[#0ea5e9] font-black text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-opacity-80 transition-colors pt-4 border-t border-gray-100 shrink-0"
+ >
+ {t.learnMore}
+
+
+ );
+ })}
+
+
+
+ {/* ── DOKTORLAR ── */}
+
+
+
+
+ {t.doctorsTitle}
+
+
+ {t.doctorsHeader}
+
+
+
+
+ {doktorlar.map((d, i) => {
+ const doc = getLocalizedDoctor(d.ad);
+ return (
+
+
+
+ {d.emoji}
+
+
+
+
{doc.name}
+
{doc.title}
+
+ ⭐ {d.puan}
+ 🏥 {d.yil} {lang === "tr" ? "YIL" : "YRS"}
+ 👥 {d.hasta}+ {lang === "tr" ? "HASTA" : "PATS"}
+
+
+ );
+ })}
+
+
+
+ {/* ── ONLINE APPOINTMENT FORM ── */}
+
+
+ {/* Subtle cosmic grid layout */}
+
+
+
+
+
+ {/* Left Column: Contact details */}
+
+
+ {t.bookingTitle}
+
+
+ {t.bookingHeader}
+
+
+ {t.bookingDesc}
+
+
+
+ {[
+ { ikon: "📞", baslik: t.callCenter, aciklama: firma.telefon },
+ { ikon: "📍", baslik: t.addressLabel, aciklama: firma.adres },
+ { ikon: "✉️", baslik: t.emailLabel, aciklama: firma.email },
+ ].map((item) => (
+
+
{item.ikon}
+
+
{item.baslik}
+
{item.aciklama}
+
+
+
+
+ {/* Right Column: Appointment Form */}
+
+ {t.bookingTitle}
+
+ {[
+ { label: t.fieldsName, placeholder: lang === "tr" ? "Adınız Soyadınız" : "Your Full Name", type: "text", full: false },
+ { label: t.fieldsPhone, placeholder: "05xx xxx xx xx", type: "tel", full: false },
+ { label: t.fieldsEmail, placeholder: "ornek@mail.com", type: "email", full: false },
+ { label: t.fieldsDepartment, placeholder: "", type: "select", full: false },
+ { label: t.fieldsDate, placeholder: "", type: "date", full: false },
+ { label: t.fieldsNotes, placeholder: t.fieldsNotesPlaceholder, type: "text", full: true },
+ ].map((field, i) => (
+
+ {field.label}
+ {field.type === "select" ? (
+
+ {t.serviceDahiliye}
+ {t.serviceKardiyoloji}
+ {t.serviceDis}
+ {t.serviceGoz}
+ {t.serviceLab}
+
+ ) : (
+
+ ))}
+
setShowBookingModal(true)}
+ className="mt-6 w-full py-4.5 rounded-xl text-white font-black text-xs uppercase tracking-widest cursor-pointer shadow-[0_5px_15px_rgba(14,165,233,0.2)]"
+ style={{ background: `linear-gradient(135deg, ${firma.renkAna}, ${firma.renkKoyu})` }}
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ 📅 {t.dispatchForm}
+
+
+
+
+
+ {/* ── TESTIMONIALS ── */}
+
+
+
+
+ {t.navReviews}
+
+
+ {t.bookingTitle}
+
+
+
+
+
+
+
+ {[...Array(yorumlar[activeYorum]?.puan || 5)].map((_, i) => (
+
+
+ ))}
+
+ “{yorumlar[activeYorum]?.yorum}”
+
+
+
+ {yorumlar[activeYorum]?.yazar.charAt(0)}
+
+
+
{yorumlar[activeYorum]?.yazar}
+
{yorumlar[activeYorum]?.tarih}
+
+
+
+
+
+ {yorumlar.map((_, i) => (
+ setActiveYorum(i)}
+ className="w-2.5 h-2.5 rounded-full transition-all cursor-pointer"
+ style={{ background: i === activeYorum ? "#0ea5e9" : "rgba(255,255,255,0.15)",
+ transform: i === activeYorum ? "scale(1.3)" : "scale(1)" }} />
+ ))}
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+
{t.footerDesc}
+
+
📍 {firma.adres}
+
📞 {firma.telefon}
+
+
+
+
{t.navServices}
+ {hizmetler.slice(0, 4).map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
{s.title}
+ );
+ })}
+
+
+
Klinik
+ {[t.navServices, t.navDoctors, t.navReviews, t.navContact].map((item) => (
+
{item}
+ ))}
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+ {/* ── BOOKING MODAL ── */}
+
+ {showBookingModal && (
+
+
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+ {t.contactTitle}
+ {t.contactDesc}
+
+
+
+ {t.fieldsName}
+
+
+ {t.fieldsPhone}
+
+
setShowBookingModal(false)}
+ >
+ {t.submit}
+
+
+
+ )}
+
+
+
+ );
+ }
+ if (baslik.includes("Depolama")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("E-ticaret")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("Uluslararası")) {
+ return (
+
+
+ );
+ }
+ if (baslik.includes("Soğuk")) {
+ return (
+
+
+ );
+ }
+ return (
+
+
+ );
+ };
+
+ const getLocalizedTeam = (ad: string) => {
+ if (ad.includes("Murat")) return { name: "Murat Yıldız", role: lang === "tr" ? "Genel Müdür" : "Managing Director" };
+ if (ad.includes("Hande")) return { name: "Hande Çelik", role: lang === "tr" ? "Operasyon Direktörü" : "Operations Director" };
+ if (ad.includes("Serkan")) return { name: "Serkan Aydın", role: lang === "tr" ? "Teknoloji Müdürü" : "Technology Director" };
+ return { name: "Neslihan Kara", role: lang === "tr" ? "Müşteri Deneyimi Yöneticisi" : "Customer Success Lead" };
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
+
+ :root {
+ --color-kurumsal-indigo: #6366f1;
+ --color-kurumsal-indigo-dark: #4f46e5;
+ --color-kurumsal-indigo-light: #eef2ff;
+ --color-kurumsal-charcoal: #0F172A;
+ --color-kurumsal-sand: #FAF8F5;
+ }
+
+ .font-heavy-sans {
+ font-family: 'Inter', sans-serif;
+ font-weight: 900;
+ }
+
+ .font-sans-clean {
+ font-family: 'Inter', sans-serif;
+ }
+
+ .shadow-premium {
+ box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.05);
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(38px, 6vw, 90px);
+ letter-spacing: -0.03em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: CURTAIN REVEAL PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ ATLAS LOGISTICS
+
+
+
+
+ interactive prototype
+
+
+ )}
+
+
+
+
+ {/* Floating Ambient Orbs */}
+
+
+
+ {/* ── FLOATING CONCEPT BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+ {/* ── PREMIUM HEADER ── */}
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navServices, href: "#hizmetler" },
+ { label: t.navProjects, href: "#projeler" },
+ { label: t.navTeam, href: "#ekip" },
+ { label: t.navReviews, href: "#testimonials" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Quote Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-sans-clean font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-sans-clean font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-[#0F172A]/60 hover:text-[#0F172A]"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[10px] font-black tracking-[2.5px] uppercase text-white bg-[#6366f1] hover:bg-[#4f46e5] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(99,102,241,0.15)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.navBooking}
+
+
+
+
+ {/* ── HERO & BENTO HIGHLIGHTS ── */}
+
+
+
+
+ {/* Left Column: Heavy typography and stats */}
+
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Statistics Grid */}
+
+ {istatistikler.map((stat, idx) => (
+
+
+ {stat.deger}
+
+
+ {getLocalizedStatLabel(stat.etiket)}
+
+
+
+ {/* CTA buttons */}
+
+ setShowBookingModal(true)}
+ className="inline-flex items-center gap-3 px-8 py-4.5 rounded-xl bg-[#6366f1] hover:bg-[#4f46e5] text-white font-black text-[10px] tracking-[2px] uppercase transition-all shadow-[0_5px_15px_rgba(99,102,241,0.2)] cursor-pointer"
+ whileHover={{ scale: 1.02 }}
+ >
+ 📅 {t.getQuote}
+
+
+ {t.learnMore}
+
+
+
+
+ {/* Right Column: Bento style highlights preview */}
+
+ {hizmetler.slice(0, 4).map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
+
+ {getServiceIconSvg(h.baslik)}
+
+
+
+ );
+ })}
+
+
+
+
+
+ {/* ── HİZMETLER FULL BENTO GRID ── */}
+
+
+
+
+
+ {t.navServices}
+
+
+ {lang === "tr" ? "Kapsamlı Lojistik Çözüm Paketi" : "Comprehensive Logistics Solutions"}
+
+
+
+
+ {hizmetler.map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
+
+
+ {getServiceIconSvg(h.baslik)}
+
+
{s.title}
+
{s.desc}
+
setShowBookingModal(true)}
+ className="text-[#6366f1] font-black text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-opacity-80 transition-colors pt-4 border-t border-gray-100 shrink-0"
+ >
+ {lang === "tr" ? "DETAYLI BİLGİ →" : "MORE DETAILS →"}
+
+
+ );
+ })}
+
+
+
+ {/* ── REFERANSLAR (PROJELER) ── */}
+
+
+
+
+
+ {t.projectsTitle}
+
+
+ {t.projectsHeader}
+
+
+
+
+ {projeler.map((p, i) => {
+ const proj = getLocalizedProjectText(p.baslik);
+ return (
+
+
+
+ {p.ikon}
+
+
+
+
{proj.title}
+
+ {proj.sector}
+
+
+
{proj.desc}
+
+
setShowBookingModal(true)}
+ className="text-white/80 font-black text-[9px] tracking-[2.5px] uppercase flex items-center gap-1 cursor-pointer hover:text-white transition-colors pt-4 border-t border-white/5 shrink-0"
+ >
+ {lang === "tr" ? "VAKAYI İNCELE →" : "VIEW CASE STUDY →"}
+
+
+ );
+ })}
+
+
+
+ {/* ── EKİP (TEAM) ── */}
+ {ekip.length > 0 && (
+
+
+
+
+
+ {t.teamTitle}
+
+
+ {t.teamHeader}
+
+
+
+
+ {ekip.map((k, i) => {
+ const member = getLocalizedTeam(k.ad);
+ return (
+
+
+
+ {k.emoji}
+
+
+
+
{member.name}
+
{member.role}
+
+ );
+ })}
+
+
+ )}
+
+ {/* ── YORUMLAR (TESTIMONIALS) ── */}
+
+
+
+
+
+ {t.reviewsTitle}
+
+
+ {t.reviewsHeader}
+
+
+
+
+ {yorumlar.map((y, i) => (
+
+
+
+ {[...Array(y.puan || 5)].map((_, j) => (
+
+
+ ))}
+
+
“{y.yorum}”
+
+
+ {y.emoji}
+
+
+
{y.yazar.split("—")[0]}
+
{y.yazar.split("—")[1] || t.reviewsTitle}
+
+
+ ))}
+
+
+
+ {/* ── İLETİŞİM / TEKLİF AL ── */}
+
+
+ {/* Subtle cosmic grid layout */}
+
+
+
+
+
+ {/* Left Column: contact information */}
+
+
+ {t.bookingTitle}
+
+
+ {t.bookingHeader}
+
+
+ {t.bookingDesc}
+
+
+
+ {[
+ { ikon: "📞", baslik: t.callCenter, aciklama: firma.telefon },
+ { ikon: "📍", baslik: t.addressLabel, aciklama: firma.adres },
+ { ikon: "✉️", baslik: t.emailLabel, aciklama: firma.email },
+ ].map((item) => (
+
+
{item.ikon}
+
+
{item.baslik}
+
{item.aciklama}
+
+
+
+
+ {/* Right Column: Quote Form */}
+
+ {t.bookingTitle}
+
+ {[
+ { label: t.fieldsName, placeholder: lang === "tr" ? "Adınız Soyadınız" : "Your Full Name", type: "text", full: false },
+ { label: t.fieldsPhone, placeholder: "05xx xxx xx xx", type: "tel", full: false },
+ { label: t.fieldsEmail, placeholder: "ornek@mail.com", type: "email", full: false },
+ { label: t.fieldsCategory, placeholder: "", type: "select", full: false },
+ { label: t.fieldsDate, placeholder: "", type: "date", full: false },
+ { label: t.fieldsNotes, placeholder: t.fieldsNotesPlaceholder, type: "text", full: true },
+ ].map((field, i) => (
+
+ {field.label}
+ {field.type === "select" ? (
+
+ {t.serviceKarayolu}
+ {t.serviceDepolama}
+ {t.serviceEticaret}
+ {t.serviceUlusal}
+ {t.serviceSoguk}
+
+ ) : (
+
+ ))}
+
setShowBookingModal(true)}
+ className="mt-6 w-full py-4.5 rounded-xl text-white font-black text-xs uppercase tracking-widest cursor-pointer shadow-[0_5px_15px_rgba(99,102,241,0.2)]"
+ style={{ background: `linear-gradient(135deg, ${firma.renkAna}, ${firma.renkKoyu})` }}
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ 📅 {t.dispatchForm}
+
+
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+
{firma.slogan} — {t.footerDesc}
+
+
📍 {firma.adres}
+
📞 {firma.telefon}
+
+
+
+
{t.navServices}
+ {hizmetler.slice(0, 4).map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
{s.title}
+ );
+ })}
+
+
+
Company
+ {[t.navServices, t.navProjects, t.navTeam, t.navReviews].map((item) => (
+
{item}
+ ))}
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+ {/* ── CONSULTATION SUCCESS MODAL ── */}
+
+ {showBookingModal && (
+
+
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+ {t.contactTitle}
+ {t.contactDesc}
+
+
+
+ {t.fieldsName}
+
+
+ {t.fieldsPhone}
+
+
setShowBookingModal(false)}
+ >
+ {t.submit}
+
+
+
+ )}
+
+
+
+ );
+ case "special":
+ return (
+
+
+ );
+ case "catering":
+ return (
+
+
+ );
+ default:
+ return (
+
+
+ );
+ }
+ };
+
+ // Localized menu items
+ const getLocalizedMenuItemText = (ad: string) => {
+ if (ad.includes("Hummus")) return { title: t.menuHummus, desc: t.menuHummusDesc };
+ if (ad.includes("Bruschetta")) return { title: t.menuBruschetta, desc: t.menuBruschettaDesc };
+ if (ad.includes("Burrata")) return { title: t.menuBurrata, desc: t.menuBurrataDesc };
+ if (ad.includes("Wagyu")) return { title: t.menuWagyu, desc: t.menuWagyuDesc };
+ if (ad.includes("Levrek")) return { title: t.menuLevrek, desc: t.menuLevrekDesc };
+ if (ad.includes("Risotto")) return { title: t.menuRisotto, desc: t.menuRisottoDesc };
+ if (ad.includes("Brûlée")) return { title: t.menuBrule, desc: t.menuBruleDesc };
+ if (ad.includes("Fondant")) return { title: t.menuFondant, desc: t.menuFondantDesc };
+ return { title: t.menuKunefe, desc: t.menuKunefeDesc };
+ };
+
+ const getLocalizedCategoryTitle = (kategori: string) => {
+ if (kategori.includes("Başlangıç")) return t.categoryTitle1;
+ if (kategori.includes("Ana")) return t.categoryTitle2;
+ return t.categoryTitle3;
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;500;600;700;800&display=swap');
+
+ :root {
+ --color-restaurant-gold: #C5A880;
+ --color-restaurant-charcoal: #090A0C;
+ --color-restaurant-slate: #13151A;
+ }
+
+ .font-serif-editorial {
+ font-family: 'Playfair Display', Georgia, serif;
+ }
+
+ .font-sans-clean {
+ font-family: 'Inter', sans-serif;
+ }
+
+ .shadow-premium {
+ box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.4);
+ }
+
+ .grain-overlay {
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.025'/%3E%3C/svg%3E");
+ }
+
+ .marquee-text-flow {
+ white-space: nowrap;
+ animation: marquee 25s linear infinite;
+ }
+
+ @keyframes marquee {
+ 0% { transform: translateX(0%); }
+ 100% { transform: translateX(-50%); }
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(38px, 6vw, 90px);
+ letter-spacing: -0.01em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: CURTAIN REVEAL PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ LEZZET MUTFAĞI
+
+
+
+
+ interactive prototype
+
+
+ )}
+
+
+
+
+ {/* Grain texture */}
+
+
+ {/* Ambient glow blobs */}
+
+
+
+ {/* ── FLOATING CONCEPT BANNER ── */}
+
+
+
+ {lang === "tr" ? "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır." : "This website is a premium concept prototype designed by Ayris Tech."}
+
+
+
+ {/* ── FLOATING NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+ {firma.adi}
+
+
+
+ {/* Links */}
+
+ {[
+ { label: t.navHeritage, href: "#heritage" },
+ { label: t.navSpecial, href: "#special" },
+ { label: t.navBakery, href: "#bakery" },
+ { label: t.navServices, href: "#services" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Language Selector + Reserve Button */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-sans-clean font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "tr" ? "bg-white text-slate-900 shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-sans-clean font-black px-2 py-1.5 rounded-lg transition-all cursor-pointer ${
+ lang === "en" ? "bg-white text-slate-900 shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[10px] font-sans-clean font-black tracking-[2.5px] uppercase text-black bg-[#C5A880] hover:bg-[#d5b990] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(197,168,128,0.15)] hidden sm:block"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.reserveTable}
+
+
+
+
+ {/* ── HERO SECTION WITH EDITORIAL BACKGROUND zoom ── */}
+
+
+
+
+
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+
+ setShowBookingModal(true)}
+ className="px-8 py-4.5 rounded-xl bg-[#C5A880] hover:bg-[#d5b990] text-[#090A0C] font-black text-[10px] tracking-[2px] uppercase transition-all shadow-[0_5px_15px_rgba(197,168,128,0.2)] cursor-pointer"
+ >
+ {t.reserveTable}
+
+
+ {t.learnMore}
+
+
+
+
+
+ {/* ── IMZA AN: INFINITE MARQUEE BAND ── */}
+
+
+ {lang === "tr" ? "Lezzet Mutfağı Karaköy" : "Karaköy Culinary Heritage"} ·
+ {lang === "tr" ? "İmza Steakhouse ve Gastronomi" : "Signature Wagyu Steak cuts"} ·
+ {lang === "tr" ? "Geleneksel Pişirme Teknikleri" : "Wood-Fired Fermented Sourdough"} ·
+ {lang === "tr" ? "Palermo Zanaat Kültürü" : "Palermo Baking Roots"} ·
+
+ {lang === "tr" ? "Lezzet Mutfağı Karaköy" : "Karaköy Culinary Heritage"} ·
+ {lang === "tr" ? "İmza Steakhouse ve Gastronomi" : "Signature Wagyu Steak cuts"} ·
+ {lang === "tr" ? "Geleneksel Pişirme Teknikleri" : "Wood-Fired Fermented Sourdough"} ·
+ {lang === "tr" ? "Palermo Zanaat Kültürü" : "Palermo Baking Roots"} ·
+
+
+
+ {/* ── SECTION 2: HERITAGE / ABOUT US (3 COLUMN SPLIT) ── */}
+
+
+
+
+
+ {/* Left text column */}
+
+
+ {t.heritageTitle}
+
+
+ {t.heritageHeader}
+
+
+ {t.heritageDesc}
+
+
+ {/* Stat pile inside heritage */}
+
+ {istatistikler.map((stat, sIdx) => (
+
+
{stat.deger}
+
{getLocalizedStatLabel(stat.etiket)}
+
+
+
+ {/* Right layered imagery column */}
+
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+
+ {/* ── SECTION 3: ŞEFİN SEÇİMİ (DOTTED MENU GRID) ── */}
+
+
+
+
+
+ {/* Left Col: Gourmet active sauté shot */}
+
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
Flaming sauté
+
Live from karaköy kitchen
+
+
🔥
+
+
+
+ {/* Right Col: The Dotted Menu List */}
+
+
+ {t.specialTitle}
+
+
+ {t.specialHeader}
+
+
+ {t.specialDesc}
+
+
+ {/* Dotted lines menu item lists */}
+
+ {menu[aktifKategori]?.urunler.map((item) => {
+ const text = getLocalizedMenuItemText(item.ad);
+ return (
+
+
+
+ {text.title}
+
+
+
+ {item.fiyat}
+
+
+ {text.desc}
+
+
+ );
+ })}
+
+ {menu.map((kat, idx) => (
+ setAktifKategori(idx)}
+ className="text-[9px] font-sans-clean font-black tracking-[2px] uppercase px-5 py-3 rounded-lg border transition-all cursor-pointer"
+ style={aktifKategori === idx
+ ? { backgroundColor: "#C5A880", color: "#090A0C", borderColor: "#C5A880" }
+ : { backgroundColor: "transparent", color: "rgba(255,255,255,0.4)", borderColor: "rgba(255,255,255,0.1)" }
+ }
+ >
+ {getLocalizedCategoryTitle(kat.kategori)}
+
+ ))}
+
+
+
+
+
+
+
+ {/* ── SECTION 4: CHALKBOARD BAKERY ── */}
+
+
+
+
+
+ {/* Left Side: Sourdough Details */}
+
+
+ {t.bakeryTitle}
+
+
+ {t.bakeryHeader}
+
+
+ {t.bakeryDesc}
+
+
+ {/* Sourdough Boule metrics */}
+
+ {[
+ { title: lang === "tr" ? "Geleneksel İtalyan Ciabatta" : "Traditional Italian Ciabatta", desc: "1250g | 45 min | 230°C", body: lang === "tr" ? "Altın çıtır kabuklu, bol gözenekli Palermo klasiği." : "Gold crispy crust, high hydration classic boules." },
+ { title: lang === "tr" ? "Çavdar Sourdough Boule" : "Rye Sourdough Boule", desc: "750g | 38 min | 240°C", body: lang === "tr" ? "Aktif karbon, çavdar ve özel ekşi maya ile pişirilmiş tahıllı ekmek." : "Baked with active charcoal, organic rye, and local sourdough." }
+ ].map((bread, bIdx) => (
+
+
+
{bread.title}
+ {bread.desc}
+
+ {bread.body}
+
+ ))}
+
+
+ {/* Right Side: Flatlay image */}
+
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+
+ {/* ── SECTION 5: SERVICES (SVG ICONS - NO EMOJIS) ── */}
+
+
+
+
+ {t.servicesTitle}
+
+ {t.servicesHeader}
+
+
+
+
+ {hizmetler.map((h, i) => {
+ const s = getLocalizedServiceText(h.baslik);
+ return (
+
+
+ {getServiceIconSvg(h.ikon)}
+
+
+ {s.title}
+
+
+ {s.desc}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── SECTION 6: TESTIMONIALS (YORUMLAR) ── */}
+
+
+
+
+ {t.reviewsTitle}
+
+ {t.reviewsHeader}
+
+
+
+
+ {yorumlar.map((y, i) => (
+
+
+ {[...Array(y.puan || 5)].map((_, j) => (
+
+
+ ))}
+
+ “{y.yorum}”
+
+
+
+
+ {y.emoji}
+
+
+
+ {y.yazar.split("—")[0]}
+
+
+ {y.tarih}
+
+
+
+ ))}
+
+
+
+
+ {/* ── SECTION 7: RANDEVU AL / RESERVATION ── */}
+
+
+
+
+
+
{t.bookingTitle}
+
+ {t.bookingHeader}
+
+
+ {t.bookingDesc}
+
+
+
+
+ {[
+ { label: t.fieldsName, placeholder: lang === "tr" ? "Adınız Soyadınız" : "Your Full Name", type: "text", full: false },
+ { label: t.fieldsPhone, placeholder: "05xx xxx xx xx", type: "tel", full: false },
+ { label: t.fieldsDate, placeholder: "", type: "date", full: false },
+ { label: t.fieldsTime, placeholder: "", type: "time", full: false },
+ { label: t.fieldsGuests, placeholder: "2", type: "number", full: false },
+ { label: t.fieldsNotes, placeholder: t.fieldsNotesPlaceholder, type: "text", full: true },
+ ].map((field, i) => (
+
+ {field.label}
+
+ ))}
+
+
+
+
+ {t.guarantee}
+
+
setShowBookingModal(true)}
+ className="w-full md:w-auto px-10 py-4.5 rounded-xl text-[#090A0C] font-sans-clean font-black tracking-[2px] uppercase bg-[#C5A880] hover:bg-[#d5b990] transition-colors cursor-pointer text-xs shrink-0 shadow-[0_5px_15px_rgba(197,168,128,0.15)]"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.dispatchForm}
+
+
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+
+ {firma.adi}
+
+
+ {firma.slogan} — {t.footerDesc}
+
+
+
📍 {firma.adres}
+
📞 {firma.telefon}
+
+
+
+
+
+
+
+ {lang === "tr" ? "Karaköy Restoran" : "Karakoy Steakhouse"}
+
+ {[t.navHeritage, t.navSpecial, t.navBakery, t.navServices].map(item => (
+
+ {item}
+
+ ))}
+
+
+
+
+
© 2026 {firma.adi}. All rights reserved.
+
+
+
+
+
+ {/* ── FAST BOOKING OVERLAY MODAL ── */}
+
+ {showBookingModal && (
+
+
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+
+ {t.contactTitle}
+
+
+ {lang === "tr" ? "Karaköy Rezervasyon Hattı" : "Karakoy Booking Desk"}
+
+
+
+
+ {t.fieldsName}
+
+
+ {t.fieldsPhone}
+
+
setShowBookingModal(false)}
+ >
+ {t.submit}
+
+
+
+ )}
+
+
(null);
+
+ const { scrollYProgress } = useScroll({ target: heroRef, offset: ["start start", "end start"] });
+ const heroY = useTransform(scrollYProgress, [0, 1], ["0%", "20%"]);
+
+ const [aktifKategori, setAktifKategori] = useState(0);
+ const [showBookingModal, setShowBookingModal] = useState(false);
+ const [lang, setLang] = useState<"tr" | "en">("tr");
+ const [preloader, setPreloader] = useState(true);
+
+ const t = translations[lang];
+
+ // 1. Lenis Smooth Scroll Setup
+ useEffect(() => {
+ let lenis: any;
+ import("@studio-freight/lenis").then(({ default: Lenis }) => {
+ lenis = new Lenis({ duration: 1.2, easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+ function raf(time: number) { lenis.raf(time); requestAnimationFrame(raf); }
+ requestAnimationFrame(raf);
+ });
+ return () => lenis?.destroy();
+ }, []);
+
+ // 2. Preloader curtain timer
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setPreloader(false);
+ }, 1500);
+ return () => clearTimeout(timer);
+ }, []);
+
+ // Dynamic localization handlers
+ const getLocalizedStat = (etiket: string) => {
+ if (etiket.toLowerCase().includes("baking")) return lang === "tr" ? "Sicilya Fırıncılık Kökleri" : "Sicilian Baking Roots";
+ if (etiket.toLowerCase().includes("pressed")) return lang === "tr" ? "Organik Soğuk Sıkım Yağ" : "Organic Cold Pressed Oil";
+ if (etiket.toLowerCase().includes("gastronomy")) return lang === "tr" ? "Ortalama Gastronomi Puanı" : "Average Gastronomy Rating";
+ return lang === "tr" ? "Yıllık Mutlu Misafir" : "Happy Diners Annually";
+ };
+
+ const getLocalizedService = (baslik: string, aciklama: string) => {
+ if (baslik.toLowerCase().includes("carte")) {
+ return {
+ title: lang === "tr" ? "À la Carte Gastronomi" : "À la Carte Gastronomy",
+ desc: lang === "tr" ? "Odun ateşinde pişen taze makarnalar, taze deniz mahsulleri ve Sicilya klasikleri." : "Wood-fired fresh pasta, coastal seafood selections, and authentic Sicilian classics."
+ };
+ }
+ if (baslik.toLowerCase().includes("trattoria") || baslik.toLowerCase().includes("geceleri")) {
+ return {
+ title: lang === "tr" ? "Trattoria Geceleri" : "Trattoria Evenings",
+ desc: lang === "tr" ? "Özel canlı akordeon dinletileri ve şefin tadım menüleri eşliğinde Sicilya akşamları." : "Accordion acoustic performances coupled with custom tasting menus for starry Sicilian nights."
+ };
+ }
+ if (baslik.toLowerCase().includes("zeytinyağı") || baslik.toLowerCase().includes("oil")) {
+ return {
+ title: lang === "tr" ? "Zeytinyağı Tadımı" : "Olive Oil Tastings",
+ desc: lang === "tr" ? "Kendi bahçelerimizden gelen %100 soğuk sıkım sızma zeytinyağlarımızı keşfedin." : "Discover 100% biological cold-pressed extra virgin olive oils directly from our Siracusa orchards."
+ };
+ }
+ return {
+ title: lang === "tr" ? "Tavola Evinizde" : "Tavola at Home",
+ desc: lang === "tr" ? "Özel korumalı kuryelerimizle en taze gurme lezzetleri kapınıza getiriyoruz." : "Gourmet biological flavors safely packaged and dispatched directly to your doorstep."
+ };
+ };
+
+ const getLocalizedMenuCategory = (kategori: string) => {
+ if (kategori.toLowerCase().includes("primi")) return lang === "tr" ? "Primi Piatti (Başlangıç)" : "Primi Piatti";
+ if (kategori.toLowerCase().includes("secondi")) return lang === "tr" ? "Secondi (Ana Yemek)" : "Secondi";
+ return lang === "tr" ? "Dolci (Tatlı)" : "Dolci";
+ };
+
+ const getLocalizedMenuItem = (ad: string, aciklama: string) => {
+ if (ad.toLowerCase().includes("caprese")) {
+ return {
+ ad: "Caprese di Burrata",
+ desc: lang === "tr" ? "Manda burrata, pembe domates dilimleri, taze fesleğen ve sızma zeytinyağı" : "Buffalo burrata, heirloom tomato fillets, aromatic fresh basil, and cold-pressed olive oil"
+ };
+ }
+ if (ad.toLowerCase().includes("carpaccio")) {
+ return {
+ ad: "Carpaccio di Polpo",
+ desc: lang === "tr" ? "İnce dilimlenmiş marine ahtapot, kapari, bebek roka ve limon emülsiyonu" : "Wafer-thin octopus slices, wild capers, organic baby arugula, and lemon emulsion"
+ };
+ }
+ if (ad.toLowerCase().includes("focaccia")) {
+ return {
+ ad: "Focaccia al Rosmarino",
+ desc: lang === "tr" ? "Taş fırından yeni çıkmış deniz tuzu, taze biberiye ve sızma zeytinyağlı" : "Stone-oven fresh rosemary focaccia topped with coarse sea salt crystals and olive oil mist"
+ };
+ }
+ if (ad.toLowerCase().includes("tagliatelle")) {
+ return {
+ ad: "Tagliatelle al Ragu di Polpo",
+ desc: lang === "tr" ? "Ağır ateşte pişmiş ahtapot ragu, taze el yapımı tagliatelle" : "Slow-braised octopus ragout layered over fresh hand-rolled organic egg tagliatelle"
+ };
+ }
+ if (ad.toLowerCase().includes("margherita")) {
+ return {
+ ad: "Pizza Margherita DOP",
+ desc: lang === "tr" ? "Odun ateşinde taş fırın pizza, San Marzano domates, taze mozzarella di bufala" : "Authentic San Marzano tomato pulp, creamy mozzarella di bufala, and stone-oven charred crust"
+ };
+ }
+ if (ad.toLowerCase().includes("polpo alla griglia")) {
+ return {
+ ad: "Polpo alla Griglia",
+ desc: lang === "tr" ? "Izgara ahtapot kolları, kapari, cherry domates ve ezilmiş sarımsaklı bebek patates" : "Tender charred octopus arms paired with capers, blistered cherry tomatoes, and garlic fingerlings"
+ };
+ }
+ if (ad.toLowerCase().includes("cannoli")) {
+ return {
+ ad: "Cannoli Siciliani",
+ desc: lang === "tr" ? "Çıtır hamur tüpleri içinde tatlı ricotta kreması, çikolata parçacıkları ve Antep fıstığı" : "Crispy pastry tubes stuffed with sweet sheep's milk ricotta, dark chocolate curls, and Bronte pistachio"
+ };
+ }
+ if (ad.toLowerCase().includes("tiramisu")) {
+ return {
+ ad: "Tiramisu al Limone",
+ desc: lang === "tr" ? "Limon likörlü hafif mascarpone kreması, taze limon kabuğu rendesi ile" : "Light lemon-liqueur soaked ladyfingers covered in delicate lemon-mascarpone whipped cream"
+ };
+ }
+ return {
+ ad: "Gelato di Pistacchio",
+ desc: lang === "tr" ? "Kendi imalatımız gerçek Bronte Antep fıstıklı İtalyan dondurması" : "House-churned organic Sicilian pistachio gelato made with 100% biological Bronte pistachios"
+ };
+ };
+
+ const getLocalizedTestimonial = (yazar: string, yorum: string) => {
+ if (yazar.toLowerCase().includes("ender")) {
+ return lang === "tr" ? "Limon kokuları ve çalan müzikler eşliğinde kendimizi Sicilya'da hissettik. Ahtapot makarna tek kelimeyle kusursuzdu." : "We felt completely transported to Siracusa with the lemon breeze and acoustic accordion. The octopus pasta was sheer culinary perfection.";
+ }
+ return lang === "tr" ? "Focaccia ekmeği ve sızma zeytinyağının kalitesi buranın zanaatkarlığını kanıtlıyor. Mutlaka rezervasyon yaptırın." : "The sheer crumb of the rosemary focaccia paired with biological extra virgin olive oil speaks volumes. A must-visit Karaköy gem.";
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;500;600;700;800;900&display=swap');
+
+ :root {
+ --color-cobalt: #0038A8;
+ --color-cobalt-muted: rgba(0, 56, 168, 0.15);
+ --color-linen: #FDFBF7;
+ --color-linen-dark: #F5F2EB;
+ --color-text-dark: #121C22;
+ --color-leaf: #3C5A48;
+ }
+
+ .font-serif-sicilia {
+ font-family: 'Playfair Display', Georgia, serif;
+ }
+
+ .font-sans-clean {
+ font-family: 'Inter', sans-serif;
+ }
+
+ .spinning-lemon {
+ animation: spin 20s linear infinite;
+ }
+
+ @keyframes spin {
+ from { transform: rotate(0deg); }
+ to { transform: rotate(360deg); }
+ }
+
+ .dappled-sunlight {
+ background-image: radial-gradient(circle at 80% 20%, rgba(253, 251, 247, 0.1) 0%, transparent 60%);
+ opacity: 0.85;
+ mix-blend-mode: multiply;
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(38px, 6.2vw, 92px);
+ letter-spacing: -0.02em;
+ line-height: 0.95;
+ }
+ `;
+
+ const getIconSvg = (name: string) => {
+ switch (name) {
+ case "alacarte":
+ return (
+
+
+ );
+ case "special":
+ return (
+
+
+ );
+ case "catering":
+ return (
+
+
+ );
+ case "delivery":
+ return (
+
+
+ );
+ default:
+ return (
+
+
+ );
+ }
+ };
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: CURTAIN REVEAL PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ {firma.adi.toUpperCase()}
+
+
+
+
+ interactive prototype
+
+
+ )}
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {t.conceptBanner}
+
+
+ {/* Top-Left Olive Branch SVG Overlay */}
+
+ {/* Mid-Right Olive Branch */}
+
+
+
+ {/* Logo */}
+
+
+
+
+ {firma.adi}
+
+
+
+ {/* Navigation Links */}
+
+ {[
+ { label: t.navStory, href: "#story" },
+ { label: t.navMenu, href: "#pasta-pizza" },
+ { label: t.navOrchard, href: "#lemon" },
+ { label: t.navServices, href: "#services" },
+ { label: t.navBook, href: "#randevu" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Action button & Lang selector */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-clean ${
+ lang === "tr" ? "bg-[#0038A8] text-white shadow-sm" : "text-[#0038A8]/60 hover:text-[#0038A8]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-clean ${
+ lang === "en" ? "bg-[#0038A8] text-white shadow-sm" : "text-[#0038A8]/60 hover:text-[#0038A8]"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[11px] font-sans-clean font-black tracking-[2px] uppercase text-white bg-[#0038A8] hover:bg-[#002266] px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-md shadow-[#0038A8]/20 hidden sm:block"
+ whileHover={{ scale: 1.03 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookTable}
+
+
+
+
+ {/* ── HERO SECTION ── */}
+
+
+ {/* Parallax sun-drenched backdrop container */}
+
+
+
+
+
+ {/* Left Content */}
+
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+
+
+ {t.discoverMenu} →
+
+
+
+
+ {/* Right Content: Hand-crafted Sun-Drenched Image in offset frame */}
+
+
+ {/* Main Generated High-Fidelity Table Image */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+ {/* ── SECTION 2: OUR STORY / WOOD OVEN (DOUBLE SPLIT) ── */}
+
+
+
+
+
+ {/* Left Col: Stone Oven Photo */}
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+ {/* Right Col: Story detail and chalkboard metrics */}
+
+
+ {t.storySubtitle}
+
+
+ {t.storyTitle}
+
+
+
+ {t.storyDesc}
+
+
+ {/* Grid Metrics - Chalkboard Styled */}
+
+ {istatistikler.slice(0, 2).map((s, i) => (
+
+
+ {s.deger}
+
+
+ {getLocalizedStat(s.etiket)}
+
+
+
+
+
+
+
+
+ {/* ── SECTION 3: PASTA & PIZZA MENU (EDITORIAL BLUE DOTTED connectors) ── */}
+
+
+
+
+
+ {/* Left Col: Dotted Menu List */}
+
+
+ {t.menuSubtitle}
+
+
+ {t.menuTitle}
+
+
+
+ {menu[aktifKategori]?.urunler.map((item) => {
+ const locItem = getLocalizedMenuItem(item.ad, item.aciklama);
+ return (
+
+
+
+ {locItem.ad}
+
+ {/* Dotted lines connector */}
+
+
+ {item.fiyat}
+
+
+ {locItem.desc}
+
+
+ );
+ })}
+
+ {menu.map((kat, idx) => (
+ setAktifKategori(idx)}
+ className="text-[10px] font-sans-clean font-bold tracking-[1.5px] uppercase px-5 py-3 rounded-lg border transition-all cursor-pointer"
+ style={aktifKategori === idx
+ ? { backgroundColor: "#0038A8", color: "white", borderColor: "#0038A8" }
+ : { backgroundColor: "transparent", color: "rgba(0, 56, 168, 0.6)", borderColor: "rgba(0, 56, 168, 0.2)" }
+ }
+ >
+ {getLocalizedMenuCategory(kat.kategori)}
+
+ ))}
+
+
+
+ {/* Right Col: Active Roasted Octopus Blue Plate image */}
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+
+ {/* ── SECTION 4: LEMON ORCHARD STORY CARD (SICILIA LEMON & LINEN OVERLAYS) ── */}
+
+
+
+
+
+ {/* Left Col: Lemon Flatlay Image */}
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+ {/* Right Col: Spinning lemon text badge and heritage content */}
+
+
+ {t.lemonSubtitle}
+
+
+
+ {t.lemonTitle}
+
+
+
+ {t.lemonDesc}
+
+
+ {/* Spinning Seal badge */}
+
+
+
+
+
+ {t.lemonBadgeText}
+
+
+
+
🍋
+
+ {t.lemonBottomText}
+
+
+
+
+
+
+
+
+ {/* ── SECTION 5: SERVICES (PURE SVGS - NO EMOJIS) ── */}
+
+
+
+
+ {t.servicesSubtitle}
+
+ {t.servicesTitle}
+
+
+
+
+ {hizmetler.map((h, i) => {
+ const locServ = getLocalizedService(h.baslik, h.aciklama);
+ return (
+
+
+ {getIconSvg(h.ikon)}
+
+
+ {locServ.title}
+
+
+ {locServ.desc}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── SECTION 6: TESTIMONIALS (YORUMLAR) ── */}
+
+
+
+
+ {t.testimonialsSubtitle}
+
+ {t.testimonialsTitle}
+
+
+
+
+ {yorumlar.map((y, i) => {
+ const locComment = getLocalizedTestimonial(y.yazar, y.yorum);
+ return (
+
+ {/* SVG Golden Stars */}
+
+ {[...Array(y.puan)].map((_, j) => (
+
+
+ ))}
+
+ “{locComment}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+ );
+ })}
+
+
+
+
+ {/* ── SECTION 7: RANDEVU AL / RESERVATION ── */}
+
+
+
+
+
+
{t.bookingSubtitle}
+
+ {t.bookingTitle}
+
+
+ {t.bookingDesc}
+
+
+
+
+ {[
+ { label: t.formName, placeholder: t.formNamePlaceholder, type: "text", full: false },
+ { label: t.formPhone, placeholder: t.formPhonePlaceholder, type: "tel", full: false },
+ { label: t.formDate, placeholder: "", type: "date", full: false },
+ { label: t.formTime, placeholder: "", type: "time", full: false },
+ { label: t.formGuests, placeholder: "2", type: "number", full: false },
+ { label: t.formNotes, placeholder: t.formNotesPlaceholder, type: "text", full: true },
+ ].map((field, i) => (
+
+ {field.label}
+
+ ))}
+
+
+
+ {t.formSubmit}
+
+
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+
+ {firma.adi}
+
+
+ {firma.slogan} — {t.footerDesc}
+
+
📍 {firma.adres}
+
📞 {firma.telefon}
+
+
+
+
+
+
+ Sicilia
+
+ {["Our Story", "Pizza & Pasta", "Lemon Orchard", "Reservation"].map(item => (
+
+ {item}
+
+ ))}
+
+
+
+
+
© 2026 {firma.adi}. {t.footerRights}
+
{t.footerPrivacy}
+
+
+
+
+ {/* ── FAST BOOKING OVERLAY MODAL ── */}
+
+ {showBookingModal && (
+
+
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+
+ {t.quickBookTitle}
+
+
+ {t.quickBookDesc}
+
+
+
+
+ {t.formName}
+
+
+ {t.formPhone}
+
+
setShowBookingModal(false)}
+ >
+ {t.quickBookSubmit}
+
+
+
+ )}
+
+
+ );
+}
diff --git a/components/templates/TaxiTemplate/index.tsx b/components/templates/TaxiTemplate/index.tsx
new file mode 100644
index 0000000..79dd9ec
--- /dev/null
+++ b/components/templates/TaxiTemplate/index.tsx
@@ -0,0 +1,1166 @@
+"use client";
+
+import { motion, AnimatePresence } from "framer-motion";
+import { useRef, useState, useEffect } from "react";
+import type { DemoData } from "@/data/demos";
+
+const fadeUp = {
+ hidden: { opacity: 0, y: 35 },
+ show: { opacity: 1, y: 0, transition: { duration: 0.75, ease: [0.25, 0.46, 0.45, 0.94] as [number, number, number, number] } },
+};
+
+const stagger = {
+ hidden: {},
+ show: { transition: { staggerChildren: 0.1 } },
+};
+
+const translations = {
+ tr: {
+ navBook: "Rezervasyon",
+ navTariffs: "Tarifeler",
+ navBenefits: "Ayrıcalıklar",
+ navApp: "Mobil Uygulama",
+ navReviews: "Misafir Yorumları",
+ callCenter: "Çağrı Merkezi",
+ bookNow: "Rezervasyon Yap",
+ badge: "NYC GÜVENİLİR PRİVATE CAB AĞI",
+ heroTitlePart1: "NYC'DE LÜKS",
+ heroTitlePart2: "BİR SEYAHAT?",
+ heroTitlePart3: "ÖZEL ŞOFÖRLÜ HAVAALANI TRANSFER SERVİSİ",
+ heroDesc: "New York genelinde 7/24 güvenli, yüksek konforlu özel araç hizmetleri. Havalimanı lounge transferlerinizi anında hesaplayın ve stressiz planlayın.",
+ instantBooking: "Hızlı Telefon Hattı",
+ getQuote: "Seyahat Hesapla",
+ viewTariffs: "Tarifeleri İncele",
+ fastFormSubtitle: "Hızlı Seyahat Formu",
+ fastFormTitle: "MİL HESAPLA & AYIRT",
+ fastFormDesc: "Konum parametrelerinizi girerek seyahat tutarınızı anında hesaplayın ve rezervasyon oluşturun.",
+ formName: "Ad Soyad",
+ formNamePlaceholder: "Adınız Soyadınız",
+ formPhone: "Telefon Numarası",
+ formPhonePlaceholder: "İletişim Numaranız",
+ formDate: "Tarih",
+ formTime: "Saat",
+ formPickup: "Alış Noktası",
+ formDropoff: "Varış Noktası",
+ chooseVehicle: "Araç Sınıfı Seçimi",
+ submitBooking: "REZERVASYONU BAŞLAT",
+ dispatchWarning: "Bu formu gönderdiğinizde, sürücümüz sizinle 3 dakika içinde iletişime geçecektir.",
+ tariffsSubtitle: "Esnek Fiyatlar",
+ tariffsTitle: "TARİFELERİMİZ",
+ tariffsDesc: "Seyahatlerinize en uygun lüks araç segmentini ve ücretlendirmelerini keşfedin.",
+ popular: "EN ÇOK TERCİH EDİLEN",
+ perMile: "/ MİL",
+ bookTariff: "BU TARİFEYİ SEÇ",
+ benefitsSubtitle: "Özel Ayrıcalıklar",
+ benefitsTitle: "HİZMET KALİTEMİZ",
+ benefitsDesc: "New York'taki iş dünyasının ve seçkin yolcuların bizi tercih etmesinin nedenleri.",
+ appSubtitle: "Uygulamayı İndirin",
+ appTitle: "MOBİL CAB UYGULAMASI",
+ appDesc: "CabHub mobil uygulamasını telefonunuza indirin. 7/24 GPS takibi yapın, uçuş rötar senkronizasyonu ile en özel fiyatlardan faydalanın.",
+ getItOn: "HEMEN İNDİRİN",
+ googlePlay: "Google Play Store",
+ appStore: "App Store",
+ reviewsSubtitle: "Müşteri Deneyimleri",
+ reviewsTitle: "MUTLU YOLCULARIMIZ",
+ reviewsDesc: "Sık seyahat eden iş insanlarımızın CabHub özel şoför hizmeti hakkındaki yorumları.",
+ callStripText: "7 GÜN 24 SAAT ÇAĞRILARINIZI CEVAPLAMAYA HAZIRIZ!",
+ footerRights: "Tüm hakları saklıdır.",
+ footerPrivacy: "Gizlilik Politikası",
+ footerTerms: "Kullanım Şartları",
+ bookingRequested: "REZERVASYON ALINDI",
+ nycDispatchActive: "NYC Sürücü Atama Hattı Aktif",
+ successDesc: "Seyahat parametrelerinizi kaydettik. En yakın CabHub lüks aracı ve sürücüsü 3 dakika içinde sizinle iletişime geçecektir. Keyifli yolculuklar dileriz!",
+ dismiss: "KAPAT",
+ conceptBanner: "Bu web sitesi Ayris Tech tarafından hazırlanmış bir konsept çalışmasıdır.",
+ calcEstimated: "Tahmini Tutar:",
+ calcLoading: "Hesaplanıyor...",
+ min: "dk",
+ calculatingText: "Mesafe bazlı anlık ücretlendirme"
+ },
+ en: {
+ navBook: "Book Cab",
+ navTariffs: "Tariffs",
+ navBenefits: "Why Us",
+ navApp: "Mobile App",
+ navReviews: "Reviews",
+ callCenter: "Call Center",
+ bookNow: "Book Now",
+ badge: "NYC TRUSTED PRIVATE CAB NETWORK",
+ heroTitlePart1: "NEED A",
+ heroTitlePart2: "PREMIUM RIDE?",
+ heroTitlePart3: "NYC'S PREMIER PRIVATE TRANSFERS",
+ heroDesc: "Safe, high-fidelity premium luxury rides available 24/7 across New York City. Book instantly from our modern standard line or download our custom voucher app for secure rides.",
+ instantBooking: "Instant Booking Line",
+ getQuote: "Calculate Fare",
+ viewTariffs: "View Tariffs",
+ fastFormSubtitle: "Fast Ride Form",
+ fastFormTitle: "BOOK A CAB",
+ fastFormDesc: "Fill in your destination parameters below to calculate estimated fares and allocate a nearby premium cab.",
+ formName: "Name",
+ formNamePlaceholder: "Your full name",
+ formPhone: "Phone",
+ formPhonePlaceholder: "Contact Number",
+ formDate: "Date",
+ formTime: "Time",
+ formPickup: "Start Location",
+ formDropoff: "End Destination",
+ chooseVehicle: "Choose Vehicle",
+ submitBooking: "SUBMIT BOOKING",
+ dispatchWarning: "By submitting this form, you trigger immediate dispatch. A professional verified driver will contact you in under 3 minutes.",
+ tariffsSubtitle: "Flexible Rates",
+ tariffsTitle: "OUR TARIFFS",
+ tariffsDesc: "Choose the perfect ride category structured to fit your travel coordinates.",
+ popular: "POPULAR CHOICE",
+ perMile: "/ MILE",
+ bookTariff: "BOOK TARIFF",
+ benefitsSubtitle: "Premium Values",
+ benefitsTitle: "SOME BENEFITS",
+ benefitsDesc: "Why thousands of New Yorkers and high-profile businesses trust our private network.",
+ appSubtitle: "Download App",
+ appTitle: "BEST CAB SERVICES",
+ appDesc: "Download the CabHub voucher application on your phone. Book local transfers, coordinate with drivers using real-time GPS search, and access exclusive 40% member benefits dynamically.",
+ getItOn: "GET IT ON",
+ googlePlay: "Google Play",
+ appStore: "App Store",
+ reviewsSubtitle: "Testimonials",
+ reviewsTitle: "HAPPY CLIENTS",
+ reviewsDesc: "Hear what frequent business travelers say about the CabHub ride coordination.",
+ callStripText: "WE ARE READY TO TAKE YOUR CALL 24 HOURS, 7 DAYS!",
+ footerRights: "All rights reserved.",
+ footerPrivacy: "Privacy Policy",
+ footerTerms: "Terms of Service",
+ bookingRequested: "BOOKING REQUESTED",
+ nycDispatchActive: "NYC Dispatch Line Active",
+ successDesc: "We have registered your travel parameters. A professional verified CabHub chauffeur will reach out on your contact number in under 3 minutes. Thank you!",
+ dismiss: "DISMISS",
+ conceptBanner: "This website is a premium concept prototype designed by Ayris Tech.",
+ calcEstimated: "Estimated Fare:",
+ calcLoading: "Calculating...",
+ min: "min",
+ calculatingText: "Real-time coordinate-based pricing"
+ }
+};
+
+const locationsList = [
+ "Manhattan Midtown",
+ "Brooklyn Heights",
+ "Queens Astoria",
+ "JFK Airport",
+ "LaGuardia Airport"
+];
+
+export default function TaxiTemplate({ data }: { data: DemoData }) {
+ const { firma, istatistikler = [], hizmetler = [], yorumlar = [] } = data;
+ const [showBookingModal, setShowBookingModal] = useState(false);
+ const [activePlan, setActivePlan] = useState(1); // Standard Class active by default
+ const [lang, setLang] = useState<"tr" | "en">("tr");
+ const [preloader, setPreloader] = useState(true);
+
+ // Fare Calculator states
+ const [pickupLoc, setPickupLoc] = useState("Manhattan Midtown");
+ const [dropoffLoc, setDropoffLoc] = useState("Brooklyn Heights");
+
+ const t = translations[lang];
+
+ const getIconSvg = (type: string) => {
+ switch (type) {
+ case "pickup":
+ return (
+
+
+ );
+ case "booking":
+ return (
+
+
+ );
+ case "bonus":
+ return (
+
+
+ );
+ case "gps":
+ return (
+
+
+ );
+ default:
+ return (
+
+
+ );
+ }
+ };
+
+ // 1. Lenis Smooth Scroll Setup
+ useEffect(() => {
+ let lenis: any;
+ import("@studio-freight/lenis").then(({ default: Lenis }) => {
+ lenis = new Lenis({ duration: 1.2, easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+ function raf(time: number) { lenis.raf(time); requestAnimationFrame(raf); }
+ requestAnimationFrame(raf);
+ });
+ return () => lenis?.destroy();
+ }, []);
+
+ // 2. Preloader timer
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setPreloader(false);
+ }, 1500);
+ return () => clearTimeout(timer);
+ }, []);
+
+ // Price estimate logic
+ const calculatePrice = () => {
+ if (pickupLoc === dropoffLoc) return "$5.00";
+
+ // JFK flat rates
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Manhattan Midtown")) {
+ return activePlan === 0 ? "$55.00" : activePlan === 1 ? "$75.00" : "$110.00";
+ }
+ // LaGuardia flat rates
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Manhattan Midtown")) {
+ return activePlan === 0 ? "$35.00" : activePlan === 1 ? "$48.00" : "$75.00";
+ }
+
+ // Mileage estimations based on distance
+ let miles = 8;
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "Brooklyn Heights") ||
+ (pickupLoc === "Brooklyn Heights" && dropoffLoc === "Manhattan Midtown")) miles = 6;
+ else if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "Queens Astoria") ||
+ (pickupLoc === "Queens Astoria" && dropoffLoc === "Manhattan Midtown")) miles = 7;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "Queens Astoria") ||
+ (pickupLoc === "Queens Astoria" && dropoffLoc === "Brooklyn Heights")) miles = 10;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Brooklyn Heights")) miles = 16;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Brooklyn Heights")) miles = 14;
+ else if ((pickupLoc === "Queens Astoria" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Queens Astoria")) miles = 12;
+ else if ((pickupLoc === "Queens Astoria" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Queens Astoria")) miles = 6;
+ else if ((pickupLoc === "JFK Airport" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "JFK Airport")) miles = 12;
+
+ const basePrice = miles * 1.6 + 5.0;
+ const multiplier = activePlan === 0 ? 1.0 : activePlan === 1 ? 1.5 : 2.2;
+ return `$${(basePrice * multiplier).toFixed(2)}`;
+ };
+
+ // Dynamic Localization handlers
+ const getLocalizedStat = (deger: string) => {
+ if (deger.toLowerCase().includes("economy")) {
+ return {
+ title: lang === "tr" ? "Ekonomi Sınıfı" : "Economy Class",
+ desc: lang === "tr" ? "Şehir içi seyahatleriniz için ideal, konforlu ve ekonomik ulaşım. Mil başı $1.50." : "Optimal zero-emission trips to any destination within boroughs. $1.5/MI"
+ };
+ }
+ if (deger.toLowerCase().includes("standard")) {
+ return {
+ title: lang === "tr" ? "Standart Sınıf" : "Standard Class",
+ desc: lang === "tr" ? "Havaalanı ve eyaletler arası transferler için premium sedanlar. Mil başı $2.25." : "Premium transfers. Verified luxury sedans covering tri-state airport hubs. $2.25/MI"
+ };
+ }
+ return {
+ title: lang === "tr" ? "Business Sınıfı" : "Business Class",
+ desc: lang === "tr" ? "Lüks araç filomuz ve öncelikli sürücü atama ayrıcalığı. Mil başı $3.50." : "First class executive. Top-tier luxury vehicles with priority lane dispatch. $3.50/MI"
+ };
+ };
+
+ const getLocalizedService = (baslik: string, aciklama: string) => {
+ if (baslik.toLowerCase().includes("pickup") || baslik.toLowerCase().includes("home")) {
+ return {
+ title: lang === "tr" ? "ADRESTEN ALIM" : "HOME PICKUP",
+ desc: lang === "tr" ? "Kapınızdan veya otel lobinizden bagaj desteği ve koordinatlı karşılama ile lüks seyahat başlangıcı." : "We run services to serve you more better and to your convenience."
+ };
+ }
+ if (baslik.toLowerCase().includes("booking") || baslik.toLowerCase().includes("fast")) {
+ return {
+ title: lang === "tr" ? "KOLAY REZERVASYON" : "FAST BOOKING",
+ desc: lang === "tr" ? "Sadece birkaç tıkla seyahat parametrelerinizi belirleyin, stressiz rezervasyon yapın." : "Our book method is very fast and easy. It won't stress you."
+ };
+ }
+ if (baslik.toLowerCase().includes("bonus") || baslik.toLowerCase().includes("member")) {
+ return {
+ title: lang === "tr" ? "MİL & ÜYELİK AVANTAJLARI" : "BONUSES FOR RIDE",
+ desc: lang === "tr" ? "Bizimle yaptığınız her yolculukta mil puanları toplayın, sonraki rezervasyonlarda %40'a varan indirim kazanın." : "When you run services frequently we give you different bonuses that can put a smile on your face."
+ };
+ }
+ return {
+ title: lang === "tr" ? "7/24 AKTİF GPS TAKİBİ" : "GPS SEARCHING",
+ desc: lang === "tr" ? "Uçuş rötar senkronizasyonu ve 7/24 anlık uydu üzerinden konum takibi ile mutlak güvendesiniz." : "We run services incase you aren't sure of your destination. So you don't have to worry."
+ };
+ };
+
+ const getLocalizedTestimonial = (yazar: string) => {
+ if (yazar.toLowerCase().includes("john")) {
+ return lang === "tr"
+ ? "CabHub NYC iş seyahatlerimde en güvendiğim ulaşım ortağım oldu. Standart sınıf araçları pırıl pırıldı ve sürücü tüm kestirmeleri biliyordu."
+ : "CabHub NYC provided the most reliable ride during my business trip. The standard class vehicle was pristine and the driver knew all the shortcuts.";
+ }
+ return lang === "tr"
+ ? "Hızlı rezervasyon sistemi tek kelimeyle kusursuz çalışıyor. Adresten alım tam dakikasında gerçekleşti ve GPS takibi kendimi inanılmaz güvende hissettirdi."
+ : "The fast booking system works like a charm. Home pickup was exactly on time and the GPS tracking made me feel incredibly secure.";
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;700;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Syne:wght@700;800&display=swap');
+
+ :root {
+ --color-taxi-yellow: #F5C518;
+ --color-taxi-yellow-rgb: 245, 197, 24;
+ --color-coal-dark: #07080A;
+ --color-coal-card: #121418;
+ --color-coal-card-hover: #181C22;
+ --color-text-white: #FFFFFF;
+ --color-text-gray: rgba(255, 255, 255, 0.6);
+ }
+
+ .font-industrial {
+ font-family: 'Syne', 'Oswald', sans-serif;
+ }
+
+ .font-sans-premium {
+ font-family: 'Plus Jakarta Sans', sans-serif;
+ }
+
+ .spinning-badge {
+ animation: spin 25s linear infinite;
+ }
+
+ @keyframes spin {
+ from { transform: rotate(0deg); }
+ to { transform: rotate(360deg); }
+ }
+
+ .bg-mesh-grid {
+ background-image:
+ linear-gradient(rgba(245, 197, 24, 0.03) 1px, transparent 1px),
+ linear-gradient(90deg, rgba(245, 197, 24, 0.03) 1px, transparent 1px);
+ background-size: 40px 40px;
+ }
+
+ .glowing-bar {
+ box-shadow: 0 0 15px rgba(245, 197, 24, 0.4);
+ }
+
+ .pulse-glow {
+ animation: pulse 2s infinite;
+ }
+
+ @keyframes pulse {
+ 0% { box-shadow: 0 0 0 0 rgba(245, 197, 24, 0.5); }
+ 70% { box-shadow: 0 0 0 15px rgba(245, 197, 24, 0); }
+ 100% { box-shadow: 0 0 0 0 rgba(245, 197, 24, 0); }
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(34px, 5.8vw, 84px);
+ letter-spacing: -0.01em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: HIGH-TECH PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ CABHUB DISPATCH SYSTEM
+
+
+
+
+ connecting...
+
+
+ )}
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {t.conceptBanner}
+
+
+
+ {/* Decorative Mesh Background */}
+
+
+ {/* Floating Ambient Yellow Glow Orbs */}
+
+
+
+ {/* ── FLOATING NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+
+ CABHUB
+
+
+
+ {/* Navigation Links */}
+
+ {[
+ { label: t.navBook, href: "#booking-flow" },
+ { label: t.navTariffs, href: "#tariffs" },
+ { label: t.navBenefits, href: "#benefits" },
+ { label: t.navApp, href: "#app-showcase" },
+ { label: t.navReviews, href: "#testimonials" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Quick Contact & Action */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-premium ${
+ lang === "tr" ? "bg-[#F5C518] text-black shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-premium ${
+ lang === "en" ? "bg-[#F5C518] text-black shadow-sm" : "text-white/60 hover:text-white"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[11px] font-black tracking-[2px] uppercase text-black bg-[#F5C518] hover:bg-white px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_5px_15px_rgba(245,197,24,0.2)] hidden sm:block"
+ whileHover={{ scale: 1.03 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookNow}
+
+
+
+
+ {/* ── HERO & BOOKING SECTION ── */}
+
+
+
+
+ {/* Left Column: Heading and Badge */}
+
+ {/* Yellow Accent Badge */}
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Call Booking Center */}
+
+
+
+
+
+ {/* CTA Buttons */}
+
+
+ {t.getQuote}
+
+
+ {t.viewTariffs}
+
+
+
+
+ {/* Right Column: Hero Car & Parallax Plate */}
+
+
+ {/* Outer circle overlay */}
+
+
+ {/* High fidelity Yellow cab image */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+ BOOK A RIDE • PREMIUM CAR SERVICE • 24/7 •
+
+
+
+
+
+
+
+
+
+
+ {/* ── INTERACTIVE TARIFF CALCULATOR WIDGET ── */}
+
+
+
+
+ {/* Glow border header indicator */}
+
+
+
+
{t.fastFormSubtitle}
+
+ {t.fastFormTitle}
+
+
+ {t.fastFormDesc}
+
+
+
+ {/* Form Grid */}
+
+ {[
+ { label: t.formName, placeholder: t.formNamePlaceholder, type: "text" },
+ { label: t.formPhone, placeholder: t.formPhonePlaceholder, type: "tel" },
+ { label: t.formDate, placeholder: "", type: "date" },
+ { label: t.formTime, placeholder: "", type: "time" },
+ ].map((field, idx) => (
+
+ {field.label}
+
+ ))}
+
+ {/* Interactive Pickup Location */}
+
+ {t.formPickup}
+ setPickupLoc(e.target.value)}
+ className="px-4 py-3.5 rounded-xl border border-white/5 bg-[#0B0C0E] text-sm text-white focus:outline-none focus:border-[#F5C518] transition-all font-sans-clean font-medium cursor-pointer"
+ >
+ {locationsList.map(loc => {loc} )}
+
+
+
+ {/* Interactive Dropoff Location */}
+
+ {t.formDropoff}
+ setDropoffLoc(e.target.value)}
+ className="px-4 py-3.5 rounded-xl border border-white/5 bg-[#0B0C0E] text-sm text-white focus:outline-none focus:border-[#F5C518] transition-all font-sans-clean font-medium cursor-pointer"
+ >
+ {locationsList.map(loc => {loc} )}
+
+
+
+ {/* Choose Vehicle */}
+
+
{t.chooseVehicle}
+
+ {["Economy", "Standard", "Business"].map((option, oIdx) => (
+ setActivePlan(oIdx)}
+ className={`py-3.5 px-3 rounded-xl border text-xs font-bold transition-all cursor-pointer flex items-center justify-center gap-1.5 ${
+ activePlan === oIdx
+ ? "bg-[#F5C518] text-black border-[#F5C518]"
+ : "bg-[#0B0C0E] text-white/60 border-white/5 hover:border-white/20"
+ }`}
+ >
+
+ ))}
+
+
+
+
+ {/* ESTIMATED FARE BANNER */}
+
+
+
+ $
+
+
+ {t.calculatingText}
+ {t.calcEstimated} {calculatePrice()}
+
+
+
+ Flat-rate airport vouchers apply dynamically between JFK / LaGuardia and Manhattan.
+
+
+
+ {/* Submit Action */}
+
+
+ {t.dispatchWarning}
+
+
setShowBookingModal(true)}
+ className="w-full md:w-auto px-10 py-4.5 rounded-xl bg-[#F5C518] hover:bg-white text-black font-black text-xs uppercase tracking-widest transition-all cursor-pointer shadow-[0_5px_15px_rgba(245,197,24,0.3)] shrink-0"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.submitBooking}
+
+
+
+
+
+
+
+ {/* ── OUR TARIFFS (Subscription Cards) ── */}
+
+
+
+
+
{t.tariffsSubtitle}
+
+ {t.tariffsTitle}
+
+
+ {t.tariffsDesc}
+
+
+
+ {/* Three Tariff Cards Grid */}
+
+ {istatistikler.map((stat, sIdx) => {
+ const locStat = getLocalizedStat(stat.deger);
+ const isPopular = stat.deger === "Standard Class";
+ return (
+
+ {isPopular && (
+
+ {t.popular}
+
+ )}
+
+
+ {/* Car vector silhouette placeholder */}
+
+
+
+ {locStat.title}
+
+
+ {locStat.desc}
+
+
+ {/* Price Display */}
+
+
+ {sIdx === 0 ? "$1.50" : sIdx === 1 ? "$2.20" : "$3.50"}
+
+ {t.perMile}
+
+
+
{
+ setActivePlan(sIdx);
+ const el = document.getElementById("booking-flow");
+ el?.scrollIntoView({ behavior: "smooth" });
+ }}
+ className={`w-full py-4.5 rounded-xl font-black text-xs uppercase tracking-widest transition-all cursor-pointer ${
+ isPopular
+ ? "bg-[#F5C518] hover:bg-white text-black shadow-lg"
+ : "bg-[#0B0C0E] hover:bg-white/5 text-white/70 border border-white/5 hover:border-white/10"
+ }`}
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookTariff}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── OUR BENEFITS ── */}
+
+
+
+
+
{t.benefitsSubtitle}
+
+ {t.benefitsTitle}
+
+
+ {t.benefitsDesc}
+
+
+
+ {/* Grid display of benefits */}
+
+ {hizmetler.map((benefit, bIdx) => {
+ const locBenefit = getLocalizedService(benefit.baslik, benefit.aciklama);
+ return (
+
+
+ {getIconSvg(benefit.ikon)}
+
+
+
+ {locBenefit.title}
+
+
+ {locBenefit.desc}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── APP DOWNLOAD SHOWCASE ── */}
+
+
+
+
+ {/* Left Column: Heading and action badges */}
+
+
+ {t.appSubtitle}
+
+
+ {t.appTitle}
+
+
+ {t.appDesc}
+
+
+ {/* Badges buttons */}
+
+ {/* Google Play */}
+
+
+
+
+
{t.getItOn}
+
{t.googlePlay}
+
+
+ {/* App Store */}
+
+
+
+
+
{t.getItOn}
+
{t.appStore}
+
+
+
+
+ {/* Right Column: Hand holding smartphone flatlay mockup */}
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+ {/* ── TESTIMONIAL GRID ── */}
+
+
+
+
+
{t.reviewsSubtitle}
+
+ {t.reviewsTitle}
+
+
+ {t.reviewsDesc}
+
+
+
+ {/* Testimonials 2-Column Layout */}
+
+ {yorumlar.map((y, yIdx) => {
+ const locTestimonial = getLocalizedTestimonial(y.yazar);
+ return (
+
+ {/* Rating Stars SVG */}
+
+ {[...Array(5)].map((_, starIdx) => (
+
+
+ ))}
+
+ “{locTestimonial}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+ );
+ })}
+
+
+
+
+ {/* ── BOTTOM CALL RESERVATION DIRECT STRIP ── */}
+
+
+ {/* subtle moving abstract banner lines */}
+
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+ {/* About Column */}
+
+
+ CABHUB
+
+
+ {firma.slogan} — Safe, verified, high-fidelity premium luxury sedan cab rides across New York City and global destinations.
+
+
+
📍 {firma.adres}
+
📧 {firma.email}
+
+
+
+ {/* Download links */}
+
+
+ {/* Navigation links */}
+
+
+ USEFUL LINKS
+
+
+ {["Book a Cab", "Economy & Business Tariffs", "Our Core Benefits", "Happy Reviews", "Terms & Regulations"].map(item => (
+
+ {item}
+
+ ))}
+
+
+
+
+
+
+
© 2026 {firma.adi}. {t.footerRights}
+
+
+
+
+
+ {/* ── FAST BOOKING SUCCESS MODAL ── */}
+
+ {showBookingModal && (
+
+
+ {/* Close Button */}
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+ {/* Visual success indicator */}
+
+
+
+ {t.bookingRequested}
+
+
+ {t.nycDispatchActive}
+
+
+
+ {t.successDesc}
+
+
+ setShowBookingModal(false)}
+ >
+ {t.dismiss}
+
+
+
+ )}
+
+
+
(1); // Standard active by default
+ const [lang, setLang] = useState<"tr" | "en">("tr");
+ const [preloader, setPreloader] = useState(true);
+
+ // Calculator states
+ const [pickupLoc, setPickupLoc] = useState("Manhattan Midtown");
+ const [dropoffLoc, setDropoffLoc] = useState("JFK Airport");
+
+ const t = translations[lang];
+
+ const getIconSvg = (type: string) => {
+ switch (type) {
+ case "pickup":
+ return (
+
+
+ );
+ case "booking":
+ return (
+
+
+ );
+ case "bonus":
+ return (
+
+
+ );
+ case "gps":
+ return (
+
+
+ );
+ default:
+ return (
+
+
+ );
+ }
+ };
+
+ // 1. Lenis Smooth Scroll Integration
+ useEffect(() => {
+ let lenis: any;
+ import("@studio-freight/lenis").then(({ default: Lenis }) => {
+ lenis = new Lenis({ duration: 1.2, easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+ function raf(time: number) { lenis.raf(time); requestAnimationFrame(raf); }
+ requestAnimationFrame(raf);
+ });
+ return () => lenis?.destroy();
+ }, []);
+
+ // 2. Preloader timer
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setPreloader(false);
+ }, 1500);
+ return () => clearTimeout(timer);
+ }, []);
+
+ // Fare estimation logic
+ const calculatePrice = () => {
+ if (pickupLoc === dropoffLoc) return "$5.00";
+
+ // JFK flat rates
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Manhattan Midtown")) {
+ return activePlan === 0 ? "$55.00" : activePlan === 1 ? "$75.00" : "$110.00";
+ }
+ // LaGuardia flat rates
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Manhattan Midtown")) {
+ return activePlan === 0 ? "$35.00" : activePlan === 1 ? "$48.00" : "$75.00";
+ }
+
+ // Mileage estimations based on distance
+ let miles = 8;
+ if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "Brooklyn Heights") ||
+ (pickupLoc === "Brooklyn Heights" && dropoffLoc === "Manhattan Midtown")) miles = 6;
+ else if ((pickupLoc === "Manhattan Midtown" && dropoffLoc === "Queens Astoria") ||
+ (pickupLoc === "Queens Astoria" && dropoffLoc === "Manhattan Midtown")) miles = 7;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "Queens Astoria") ||
+ (pickupLoc === "Queens Astoria" && dropoffLoc === "Brooklyn Heights")) miles = 10;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Brooklyn Heights")) miles = 16;
+ else if ((pickupLoc === "Brooklyn Heights" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Brooklyn Heights")) miles = 14;
+ else if ((pickupLoc === "Queens Astoria" && dropoffLoc === "JFK Airport") ||
+ (pickupLoc === "JFK Airport" && dropoffLoc === "Queens Astoria")) miles = 12;
+ else if ((pickupLoc === "Queens Astoria" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "Queens Astoria")) miles = 6;
+ else if ((pickupLoc === "JFK Airport" && dropoffLoc === "LaGuardia Airport") ||
+ (pickupLoc === "LaGuardia Airport" && dropoffLoc === "JFK Airport")) miles = 12;
+
+ const basePrice = miles * 1.6 + 5.0;
+ const multiplier = activePlan === 0 ? 1.0 : activePlan === 1 ? 1.5 : 2.2;
+ return `$${(basePrice * multiplier).toFixed(2)}`;
+ };
+
+ // Dynamic Localization handlers
+ const getLocalizedStat = (deger: string) => {
+ if (deger.toLowerCase().includes("economy")) {
+ return {
+ title: lang === "tr" ? "Chic Şehir İçi" : "Economy Class",
+ desc: lang === "tr" ? "Şehir içi ulaşımlarda konforlu ve sıfır emisyonlu elektrikli araç deneyimi. Mil başı $1.50." : "Comfortable zero-emission trips to any destination within boroughs. $1.5/MI"
+ };
+ }
+ if (deger.toLowerCase().includes("standard")) {
+ return {
+ title: lang === "tr" ? "Premium Şehirler Arası" : "Standard Class",
+ desc: lang === "tr" ? "Eyalet genelinde ve 3 ana havalimanına premium lüks seyahatler. Mil başı $2.20." : "Premium transfers. Verified luxury sedans covering tri-state airport hubs. $2.20/MI"
+ };
+ }
+ return {
+ title: lang === "tr" ? "First Class Yönetici" : "Business Class",
+ desc: lang === "tr" ? "Öncelikli geçiş şeridi ve en üst segment lüks şoför hizmeti. Mil başı $3.50." : "First class executive. Top-tier luxury vehicles with priority lane dispatch. $3.50/MI"
+ };
+ };
+
+ const getLocalizedService = (baslik: string, aciklama: string) => {
+ if (baslik.toLowerCase().includes("pickup") || baslik.toLowerCase().includes("lounge")) {
+ return {
+ title: lang === "tr" ? "LOUNGE'DAN ALIM" : "LOUNGE PICKUP",
+ desc: lang === "tr" ? "Doğrudan havalimanı lounge kapısından veya otel girişinden bagaj asistanlığıyla karşılama." : "Direct lounge or doorstep coordination for all airport coordinates."
+ };
+ }
+ if (baslik.toLowerCase().includes("booking") || baslik.toLowerCase().includes("reservation")) {
+ return {
+ title: lang === "tr" ? "PRATİK REZERVASYON" : "TAP RESERVATION",
+ desc: lang === "tr" ? "Akıllı telefon entegrasyonu ile seyahatlerinizi 60 saniyenin altında rezerve edin." : "Ultra-fast smartphone booking client. Secure scheduling under 60 seconds."
+ };
+ }
+ if (baslik.toLowerCase().includes("bonus") || baslik.toLowerCase().includes("member")) {
+ return {
+ title: lang === "tr" ? "ÜYELİK AVANTAJLARI" : "MEMBER BENEFITS",
+ desc: lang === "tr" ? "Mil toplayın ve bir sonraki premium seyahatinizde %40 indirim kazanın." : "Collect mileage dynamically. Redeem up to 40% savings on specialty trips."
+ };
+ }
+ return {
+ title: lang === "tr" ? "HASSAS GPS TAKİBİ" : "TRACKING GPS",
+ desc: lang === "tr" ? "Gerçek zamanlı uydu üzerinden sürüş takibi ve uçuş saati rötar senkronizasyonu." : "Real-time satellite path tracking and automated flight delay syncing."
+ };
+ };
+
+ const getLocalizedTestimonial = (yazar: string) => {
+ if (yazar.toLowerCase().includes("alexander")) {
+ return lang === "tr"
+ ? "JFK'den transferim tamamen kusursuzdu. Sürücü beni lounge kapısında karşıladı ve elektrikli araç tertemiz durumdaydı."
+ : "The airport transfer from JFK was absolutely seamless. The driver met me at the lounge gate and the electric vehicle was in pristine condition.";
+ }
+ return lang === "tr"
+ ? "Kurumsal seyahatlerimde kesinlikle ilk tercihim CabHub Premium. Açık renkli sade uygulamasından rezervasyon çok basit ve rötar takibi mükemmel."
+ : "CabHub Premium is my absolute go-to for corporate travel. The light theme app booking is simple and the delay syncing works perfectly.";
+ };
+
+ const css = `
+ @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;700;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Syne:wght@700;800&display=swap');
+
+ :root {
+ --color-premium-gold: #E5A900;
+ --color-nordic-white: #FFFFFF;
+ --color-nordic-ivory: #FCFAF7;
+ --color-nordic-ivory-dark: #F5F2EC;
+ --color-coal-text: #111317;
+ --color-coal-muted: rgba(17, 19, 23, 0.6);
+ }
+
+ .font-industrial {
+ font-family: 'Syne', 'Oswald', sans-serif;
+ }
+
+ .font-sans-premium {
+ font-family: 'Plus Jakarta Sans', sans-serif;
+ }
+
+ .spinning-badge {
+ animation: spin 25s linear infinite;
+ }
+
+ @keyframes spin {
+ from { transform: rotate(0deg); }
+ to { transform: rotate(360deg); }
+ }
+
+ .bg-mesh-grid-light {
+ background-image:
+ linear-gradient(rgba(229, 169, 0, 0.02) 1px, transparent 1px),
+ linear-gradient(90deg, rgba(229, 169, 0, 0.02) 1px, transparent 1px);
+ background-size: 45px 45px;
+ }
+
+ .gold-bar-glow {
+ box-shadow: 0 0 12px rgba(229, 169, 0, 0.25);
+ }
+
+ .pulse-glow-dark {
+ animation: pulseDark 2s infinite;
+ }
+
+ @keyframes pulseDark {
+ 0% { box-shadow: 0 0 0 0 rgba(17, 19, 23, 0.2); }
+ 70% { box-shadow: 0 0 0 15px rgba(17, 19, 23, 0); }
+ 100% { box-shadow: 0 0 0 0 rgba(17, 19, 23, 0); }
+ }
+
+ .hero-title-clamp {
+ font-size: clamp(34px, 5.8vw, 84px);
+ letter-spacing: -0.01em;
+ line-height: 0.95;
+ }
+ `;
+
+ return (
+ <>
+
+
+ {/* ── IMZA AN: LIGHT TARIFF PRELOADER ── */}
+
+ {preloader && (
+
+
+
+ CABHUB PREMIUM SERVICE
+
+
+
+
+ allocating...
+
+
+ )}
+
+
+ {/* ── MANDATORY FLOATING DEMO BANNER ── */}
+
+
+
+ {t.conceptBanner}
+
+
+
+ {/* Soft Grid Overlay */}
+
+
+ {/* Floating Ambient Warm Gold Orbs */}
+
+
+
+ {/* ── PREMIUM LIGHT NAVBAR ── */}
+
+
+ {/* Logo */}
+
+
+
+ CABHUB
+
+
+
+ {/* Navigation Links */}
+
+ {[
+ { label: t.navBook, href: "#booking-flow" },
+ { label: t.navTariffs, href: "#tariffs" },
+ { label: t.navBenefits, href: "#benefits" },
+ { label: t.navApp, href: "#app-showcase" },
+ { label: t.navReviews, href: "#testimonials" }
+ ].map(item => (
+
+ {item.label}
+
+ ))}
+
+
+ {/* Direct Dial booking & Lang Selector */}
+
+ {/* Language Switcher */}
+
+ setLang("tr")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-premium ${
+ lang === "tr" ? "bg-[#E5A900] text-white shadow-sm" : "text-[#111317]/60 hover:text-[#111317]"
+ }`}
+ >
+ TR
+
+ setLang("en")}
+ className={`text-[9px] font-black px-2.5 py-1.5 rounded-lg transition-all cursor-pointer font-sans-premium ${
+ lang === "en" ? "bg-[#E5A900] text-white shadow-sm" : "text-[#111317]/60 hover:text-[#111317]"
+ }`}
+ >
+ EN
+
+
+
+
setShowBookingModal(true)}
+ className="text-[11px] font-black tracking-[2px] uppercase text-white bg-[#E5A900] hover:bg-black px-6 py-3.5 rounded-xl transition-all cursor-pointer shadow-[0_4px_12px_rgba(229,169,0,0.2)] hidden sm:block"
+ whileHover={{ scale: 1.03 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookNow}
+
+
+
+
+ {/* ── HERO SECTION ── */}
+
+
+
+
+ {/* Left Column: Heading, Slogans, Direct Reservation */}
+
+ {/* Minimalist Accent Badge */}
+
+
+
+
+ {t.heroTitlePart1}
+ {t.heroTitlePart2}
+
+
+
+ {t.heroDesc}
+
+
+ {/* Direct Dial block */}
+
+
+
+
+
+ {/* Action Buttons */}
+
+
+ {t.getQuote}
+
+
+ {t.viewTariffs}
+
+
+
+
+ {/* Right Column: Premium White e-tron Car & Rotating circular stamp */}
+
+
+ {/* Outer circle overlay */}
+
+
+ {/* High fidelity White luxury cab */}
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+ LOUNGE TRANSFER • AIRPORT EXPRESS • 24/7 •
+
+
+
+
+
+
+
+
+
+
+ {/* ── BOOKING FLOW & CALCULATOR ── */}
+
+
+
+
+ {/* Gold line border indicator */}
+
+
+
+
{t.fastFormSubtitle}
+
+ {t.fastFormTitle}
+
+
+ {t.fastFormDesc}
+
+
+
+ {/* Form Input fields */}
+
+ {[
+ { label: t.formName, placeholder: t.formNamePlaceholder, type: "text" },
+ { label: t.formPhone, placeholder: t.formPhonePlaceholder, type: "tel" },
+ { label: t.formDate, placeholder: "", type: "date" },
+ { label: t.formTime, placeholder: "", type: "time" },
+ ].map((field, idx) => (
+
+ {field.label}
+
+ ))}
+
+ {/* Pickup Location select */}
+
+ {t.formPickup}
+ setPickupLoc(e.target.value)}
+ className="px-4 py-3.5 rounded-xl border border-black/5 bg-[#FCFAF7] text-sm text-black focus:outline-none focus:border-[#E5A900] transition-all font-sans-clean font-medium cursor-pointer"
+ >
+ {locationsList.map(loc => {loc} )}
+
+
+
+ {/* Dropoff Location select */}
+
+ {t.formDropoff}
+ setDropoffLoc(e.target.value)}
+ className="px-4 py-3.5 rounded-xl border border-black/5 bg-[#FCFAF7] text-sm text-black focus:outline-none focus:border-[#E5A900] transition-all font-sans-clean font-medium cursor-pointer"
+ >
+ {locationsList.map(loc => {loc} )}
+
+
+
+ {/* Choose Vehicle */}
+
+
{t.chooseVehicle}
+
+ {["Economy", "Standard", "Business"].map((option, oIdx) => (
+ setActivePlan(oIdx)}
+ className={`py-3.5 px-3 rounded-xl border text-xs font-bold transition-all cursor-pointer flex items-center justify-center gap-1.5 ${
+ activePlan === oIdx
+ ? "bg-[#E5A900] text-white border-[#E5A900]"
+ : "bg-[#FCFAF7] text-black/60 border-black/5 hover:border-black/15"
+ }`}
+ >
+
+ ))}
+
+
+
+
+ {/* ESTIMATED FARE BANNER */}
+
+
+
+ $
+
+
+ {t.calculatingText}
+ {t.calcEstimated} {calculatePrice()}
+
+
+
+ Flat-rate airport vouchers apply dynamically between JFK / LaGuardia and Manhattan.
+
+
+
+ {/* Submit panel */}
+
+
+ {t.dispatchWarning}
+
+
setShowBookingModal(true)}
+ className="w-full md:w-auto px-10 py-4.5 rounded-xl bg-[#E5A900] hover:bg-black text-white font-black text-xs uppercase tracking-widest transition-all cursor-pointer shadow-[0_4px_12px_rgba(229,169,0,0.25)] shrink-0"
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.submitBooking}
+
+
+
+
+
+
+
+ {/* ── OUR TARIFFS (Bento style Light Plans) ── */}
+
+
+
+
+
{t.tariffsSubtitle}
+
+ {t.tariffsTitle}
+
+
+ {t.tariffsDesc}
+
+
+
+ {/* Three Cards Grid */}
+
+ {istatistikler.map((stat, sIdx) => {
+ const locStat = getLocalizedStat(stat.deger);
+ const isPopular = stat.deger === "Standard Class";
+ return (
+
+ {isPopular && (
+
+ {t.popular}
+
+ )}
+
+
+ {/* Car vector silhouette placeholder */}
+
+
+
+ {locStat.title}
+
+
+ {locStat.desc}
+
+
+ {/* Price display */}
+
+
+ {sIdx === 0 ? "$1.50" : sIdx === 1 ? "$2.20" : "$3.50"}
+
+ {t.perMile}
+
+
+
{
+ setActivePlan(sIdx);
+ const el = document.getElementById("booking-flow");
+ el?.scrollIntoView({ behavior: "smooth" });
+ }}
+ className={`w-full py-4.5 rounded-xl font-black text-xs uppercase tracking-widest transition-all cursor-pointer ${
+ isPopular
+ ? "bg-[#E5A900] hover:bg-black text-white shadow-md shadow-[#E5A900]/10"
+ : "bg-[#FCFAF7] hover:bg-black hover:text-white text-black/70 border border-black/5 hover:border-black/10"
+ }`}
+ whileHover={{ scale: 1.02 }}
+ whileTap={{ scale: 0.98 }}
+ >
+ {t.bookTariff}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── CORE BENEFITS ── */}
+
+
+
+
+
{t.benefitsSubtitle}
+
+ {t.benefitsTitle}
+
+
+ {t.benefitsDesc}
+
+
+
+ {/* Grid */}
+
+ {hizmetler.map((benefit, bIdx) => {
+ const locBenefit = getLocalizedService(benefit.baslik, benefit.aciklama);
+ return (
+
+
+ {getIconSvg(benefit.ikon)}
+
+
+
+ {locBenefit.title}
+
+
+ {locBenefit.desc}
+
+
+ );
+ })}
+
+
+
+
+ {/* ── APP SHOWCASE ── */}
+
+
+
+
+ {/* Left Column: text details and store buttons */}
+
+
+ {t.appSubtitle}
+
+
+ {t.appTitle}
+
+
+ {t.appDesc}
+
+
+ {/* Badges buttons */}
+
+ {/* Google Play */}
+
+
+
+
+
{t.getItOn}
+
{t.googlePlay}
+
+
+ {/* App Store */}
+
+
+
+
+
{t.getItOn}
+
{t.appStore}
+
+
+
+
+ {/* Right Column: Light theme smartphone mockup */}
+
+
+ {/* eslint-disable-next-line @next/next/no-img-element */}
+
+
+
+
+
+
+ {/* ── TESTIMONIALS ── */}
+
+
+
+
+
{t.reviewsSubtitle}
+
+ {t.reviewsTitle}
+
+
+ {t.reviewsDesc}
+
+
+
+ {/* Testimonials 2-Column Grid */}
+
+ {yorumlar.map((y, yIdx) => {
+ const locTestimonial = getLocalizedTestimonial(y.yazar);
+ return (
+
+ {/* Rating Stars SVG */}
+
+ {[...Array(5)].map((_, starIdx) => (
+
+
+ ))}
+
+ “{locTestimonial}”
+
+
+
+
+ {y.yazar.charAt(0)}
+
+
+
+ {y.yazar}
+
+
+ {y.tarih}
+
+
+
+ );
+ })}
+
+
+
+
+ {/* ── BOTTOM CALL RESERVATION DIRECT STRIP ── */}
+
+
+ {/* ── FOOTER ── */}
+
+
+
+
+
+ {/* About Column */}
+
+
+ CABHUB
+
+
+ {firma.slogan} — Exclusive, verified zero-emission lounge drop-offs and corporate city transfers in New York City.
+
+
+
📍 {firma.adres}
+
📧 {firma.email}
+
+
+
+ {/* Download links */}
+
+
+ {/* Navigation links */}
+
+
+ USEFUL LINKS
+
+
+ {["Book a Cab", "Economy & Business Tariffs", "Our Core Benefits", "Happy Reviews", "Terms & Regulations"].map(item => (
+
+ {item}
+
+ ))}
+
+
+
+
+
+
+
© 2026 {firma.adi}. {t.footerRights}
+
+
+
+
+
+ {/* ── FAST BOOKING SUCCESS MODAL ── */}
+
+ {showBookingModal && (
+
+
+ {/* Close Button */}
+ setShowBookingModal(false)}
+ >
+ ✕
+
+
+ {/* Success check indicator */}
+
+
+
+ {t.bookingRequested}
+
+
+ {t.nycDispatchActive}
+
+
+
+ {t.successDesc}
+
+
+ setShowBookingModal(false)}
+ >
+ {t.dismiss}
+
+
+
+ )}
+
+
+
+ {count.toLocaleString("tr-TR")}
+ {suffix}
+
+ );
+}
diff --git a/data/demos.ts b/data/demos.ts
new file mode 100644
index 0000000..7a94207
--- /dev/null
+++ b/data/demos.ts
@@ -0,0 +1,610 @@
+export interface DemoData {
+ slug: string;
+ template: "klinik" | "restoran" | "kurumsal" | "dental" | "restoran2" | "taxi" | "taxi2" | "chatbot" | "bar" | "bar2" | "hotel1" | "hotel2" | "hotel3" | "bodrumcerrahi" | "chatbot2";
+ firma: {
+ adi: string;
+ slogan: string;
+ sehir: string;
+ adres: string;
+ telefon: string;
+ email: string;
+ logoEmoji: string;
+ renkAna: string;
+ renkKoyu: string;
+ renkAcik: string;
+ };
+ // Flexible stats — her şablon kendi anahtarlarını kullanır
+ istatistikler: { deger: string; etiket: string }[];
+ hizmetler: { ikon: string; baslik: string; aciklama: string }[];
+ yorumlar: { yazar: string; yorum: string; puan: number; tarih: string; emoji: string }[];
+
+ // Klinik
+ doktorlar?: { ad: string; uzmanlik: string; puan: string; yil: string; hasta: string; emoji: string }[];
+
+ // Restoran
+ menu?: { kategori: string; ikon: string; urunler: { ad: string; aciklama: string; fiyat: string }[] }[];
+
+ // Kurumsal
+ projeler?: { baslik: string; sektor: string; aciklama: string; ikon: string; renk: string; resim?: string }[];
+ ekip?: { ad: string; rol: string; emoji: string }[];
+}
+
+export const demos: Record = {
+ "dogan-tip-merkezi": {
+ slug: "dogan-tip-merkezi",
+ template: "klinik",
+ firma: {
+ adi: "Doğan Tıp Merkezi",
+ slogan: "Sağlığınız, En Değerli Varlığınız",
+ sehir: "İstanbul",
+ adres: "Bağcılar Mah. Sağlık Cad. No:12, Bağcılar / İstanbul",
+ telefon: "0212 555 44 33",
+ email: "info@dogantip.com",
+ logoEmoji: "🏥",
+ renkAna: "#0ea5e9",
+ renkKoyu: "#0284c7",
+ renkAcik: "#e0f2fe",
+ },
+ istatistikler: [
+ { deger: "4200", etiket: "Mutlu Hasta" },
+ { deger: "14", etiket: "Uzman Doktor" },
+ { deger: "12", etiket: "Yıl Deneyim" },
+ { deger: "620", etiket: "Yorum" },
+ ],
+ hizmetler: [
+ { ikon: "🩺", baslik: "Dahiliye", aciklama: "Erişkin hastalıklarında kapsamlı tanı ve tedavi hizmetleri." },
+ { ikon: "❤️", baslik: "Kardiyoloji", aciklama: "Kalp ve damar sağlığı için ileri tanı ve tedavi." },
+ { ikon: "🦷", baslik: "Diş Hekimliği", aciklama: "İmplant, ortodonti ve estetik diş uygulamaları." },
+ { ikon: "👁️", baslik: "Göz Sağlığı", aciklama: "Lazer tedavileri ve göz cerrahisi." },
+ { ikon: "🧪", baslik: "Laboratuvar", aciklama: "Hızlı ve güvenilir tahlil sonuçları." },
+ { ikon: "📷", baslik: "Radyoloji", aciklama: "MR, tomografi ve ultrason görüntüleme." },
+ ],
+ doktorlar: [
+ { ad: "Dr. Ahmet Yılmaz", uzmanlik: "Dahiliye Uzmanı", puan: "4.9", yil: "15", hasta: "2400", emoji: "👨⚕️" },
+ { ad: "Dr. Ayşe Kaya", uzmanlik: "Kardiyoloji", puan: "4.8", yil: "12", hasta: "1800", emoji: "👩⚕️" },
+ { ad: "Dr. Mehmet Demir", uzmanlik: "Göz Hastalıkları", puan: "5.0", yil: "10", hasta: "1200", emoji: "👨⚕️" },
+ { ad: "Dr. Zeynep Arslan", uzmanlik: "Diş Hekimi", puan: "4.9", yil: "8", hasta: "900", emoji: "👩⚕️" },
+ ],
+ yorumlar: [
+ { yazar: "Fatma K.", yorum: "Çok iyi hizmet aldım. Doktorlar son derece ilgili ve profesyonel. Randevu sistemi de çok pratik.", puan: 5, tarih: "2 hafta önce", emoji: "😊" },
+ { yazar: "Mustafa A.", yorum: "Temiz, modern ortam. Muayenemi çok hızlı yaptılar ve sonuçları aynı gün aldım.", puan: 5, tarih: "1 ay önce", emoji: "🙂" },
+ { yazar: "Elif T.", yorum: "Online randevu sistemi harikaydı. Güvenilir ve kaliteli bir klinik. Tüm ailemle tercih ediyoruz.", puan: 5, tarih: "3 hafta önce", emoji: "😄" },
+ ],
+ },
+
+ // ── RESTORAN ──────────────────────────────────────────────────────────────
+ "lezzet-mutfagi": {
+ slug: "lezzet-mutfagi",
+ template: "restoran",
+ firma: {
+ adi: "Lezzet Mutfağı",
+ slogan: "Taste The Difference",
+ sehir: "İstanbul",
+ adres: "Karaköy Mah. Liman Cad. No:7, Beyoğlu / İstanbul",
+ telefon: "0212 444 55 66",
+ email: "rezervasyon@lezzetmutfagi.com",
+ logoEmoji: "🍽️",
+ renkAna: "#C5A880",
+ renkKoyu: "#0A0B0D",
+ renkAcik: "#14161B",
+ },
+ istatistikler: [
+ { deger: "12", etiket: "Years of Heritage" },
+ { deger: "48+", etiket: "Signature Dishes" },
+ { deger: "4.9", etiket: "Average Guest Rating" },
+ { deger: "18k+", etiket: "Monthly Diners" },
+ ],
+ hizmetler: [
+ { ikon: "alacarte", baslik: "À la Carte", aciklama: "Seçkin malzemelerle hazırlanan imza yemeklerimizi keşfedin." },
+ { ikon: "special", baslik: "Özel Günler", aciklama: "Doğum günü, evlilik yıldönümü ve kutlamalar için özel menüler." },
+ { ikon: "catering", baslik: "Kurumsal Etkinlik", aciklama: "İş yemekleri ve kurumsal organizasyonlar için catering hizmeti." },
+ { ikon: "delivery", baslik: "Paket Servis", aciklama: "Şehrin her köşesine hızlı ve sıcak teslimat." },
+ ],
+ menu: [
+ {
+ kategori: "Başlangıçlar", ikon: "salad",
+ urunler: [
+ { ad: "Ev Yapımı Hummus", aciklama: "Fırından taze lavaş ve trüf yağı ile", fiyat: "₺180" },
+ { ad: "Karidesli Bruschetta", aciklama: "Taze domates, fesleğen, marine sarımsak", fiyat: "₺220" },
+ { ad: "Burrata Salatası", aciklama: "Cherry domates, pesto, taze roka yaprakları", fiyat: "₺240" },
+ ],
+ },
+ {
+ kategori: "Ana Yemekler", ikon: "steak",
+ urunler: [
+ { ad: "Wagyu Bonfile", aciklama: "Fırınlanmış kuşkonmaz, trüf mantarlı patates püresi", fiyat: "₺680" },
+ { ad: "Levrek Fileto", aciklama: "Limonlu tereyağı sosu, kapari ve taze otlar", fiyat: "₺420" },
+ { ad: "Mantar Risotto", aciklama: "Yabani orman mantarları ve Parmigiano Reggiano", fiyat: "₺360" },
+ ],
+ },
+ {
+ kategori: "Tatlılar", ikon: "dessert",
+ urunler: [
+ { ad: "Crème Brûlée", aciklama: "Gerçek Madagaskar vanilyası, karamelize şeker kıtırı", fiyat: "₺160" },
+ { ad: "Çikolatalı Fondant", aciklama: "Belçika çikolatası dolgulu sıcak kek, vanilyalı dondurma", fiyat: "₺180" },
+ { ad: "Künefe", aciklama: "Halis tereyağlı çıtır tel kadayıf, manda kaymağı", fiyat: "₺200" },
+ ],
+ },
+ ],
+ yorumlar: [
+ { yazar: "Selin A.", yorum: "Hayatımda yediğim en iyi bonfile. Servis mükemmeldi, ortam son derece loş ve şık. Kesinlikle tekrar geleceğiz.", puan: 5, tarih: "1 hafta önce", emoji: "🍷" },
+ { yazar: "Burak T.", yorum: "Yıldönümümüzü burada kutladık. Detaylara gösterilen özen, menü kalitesi ve ambiyans harikaydı.", puan: 5, tarih: "2 hafta önce", emoji: "🥂" },
+ { yazar: "Canan M.", yorum: "Karaköy'ün en iyi restoranı. Risotto ve tatlılar inanılmazdı. Şefin ellerine sağlık.", puan: 5, tarih: "1 ay önce", emoji: "✨" },
+ ],
+ },
+
+ // ── KURUMSAL ──────────────────────────────────────────────────────────────
+ "atlas-lojistik": {
+ slug: "atlas-lojistik",
+ template: "kurumsal",
+ firma: {
+ adi: "Atlas Lojistik",
+ slogan: "Güvenli Taşımacılık, Zamanında Teslimat",
+ sehir: "İstanbul",
+ adres: "Esenyurt Lojistik Merkezi, Esenyurt / İstanbul",
+ telefon: "0212 333 22 11",
+ email: "info@atlaslojistik.com",
+ logoEmoji: "🚛",
+ renkAna: "#6366f1",
+ renkKoyu: "#4f46e5",
+ renkAcik: "#eef2ff",
+ },
+ istatistikler: [
+ { deger: "15", etiket: "Yıl Deneyim" },
+ { deger: "850+", etiket: "Aktif Müşteri" },
+ { deger: "12", etiket: "Şehir" },
+ { deger: "%99.2", etiket: "Zamanında Teslimat" },
+ ],
+ hizmetler: [
+ { ikon: "🚛", baslik: "Karayolu Taşımacılığı", aciklama: "Yurtiçi ve uluslararası karayolu ile güvenli ve hızlı taşımacılık." },
+ { ikon: "🏭", baslik: "Depolama & Lojistik", aciklama: "Modern depolarımızda güvenli stok yönetimi ve dağıtım hizmetleri." },
+ { ikon: "📦", baslik: "E-ticaret Lojistiği", aciklama: "Son mile teslimat, iade yönetimi ve fulfillment çözümleri." },
+ { ikon: "🌍", baslik: "Uluslararası Nakliye", aciklama: "Gümrük işlemleri dahil kapıdan kapıya uluslararası taşımacılık." },
+ { ikon: "❄️", baslik: "Soğuk Zincir", aciklama: "Gıda ve ilaç sektörü için kontrollü sıcaklıkta taşıma." },
+ { ikon: "📱", baslik: "Anlık Takip", aciklama: "Yükünüzü 7/24 gerçek zamanlı olarak takip edin." },
+ ],
+ projeler: [
+ { baslik: "Migros Dağıtım Ağı", sektor: "Perakende", aciklama: "12 şehirde günlük 400+ noktaya soğuk zincir dağıtım yönetimi.", ikon: "🛒", renk: "#10b981" },
+ { baslik: "Trendyol Fulfillment", sektor: "E-ticaret", aciklama: "Günlük 8.000+ sipariş işleme ve son mile teslimat operasyonu.", ikon: "📦", renk: "#f97316" },
+ { baslik: "Ford Otosan Tedarik", sektor: "Otomotiv", aciklama: "JIT modeli ile fabrikaya zamanında parça tedarik lojistiği.", ikon: "🚗", renk: "#6366f1" },
+ { baslik: "Pfizer İlaç Lojistiği", sektor: "İlaç", aciklama: "GDP sertifikalı soğuk zincir ile ilaç dağıtım ağı yönetimi.", ikon: "💊", renk: "#0ea5e9" },
+ ],
+ ekip: [
+ { ad: "Murat Yıldız", rol: "Genel Müdür", emoji: "👨💼" },
+ { ad: "Hande Çelik", rol: "Operasyon Direktörü", emoji: "👩💼" },
+ { ad: "Serkan Aydın", rol: "Teknoloji Müdürü", emoji: "👨💻" },
+ { ad: "Neslihan Kara", rol: "Müşteri Deneyimi", emoji: "👩💼" },
+ ],
+ yorumlar: [
+ { yazar: "Kemal B. — Tedarik Zinciri Müdürü", yorum: "3 yıldır çalışıyoruz, tek bir gecikmemiz olmadı. Gerçek anlamda güvenilir bir iş ortağı.", puan: 5, tarih: "1 ay önce", emoji: "👍" },
+ { yazar: "Derya S. — E-ticaret Direktörü", yorum: "E-ticaret operasyonumuzu tamamen Atlas'a devrettik. Müşteri memnuniyetimiz %94'e çıktı.", puan: 5, tarih: "2 ay önce", emoji: "🙌" },
+ { yazar: "Tahir A. — Satın Alma Müdürü", yorum: "Anlık takip sistemi ve proaktif iletişim anlayışı sektörde fark yaratıyor.", puan: 5, tarih: "3 hafta önce", emoji: "⭐" },
+ ],
+ },
+
+ "odentries": {
+ slug: "odentries",
+ template: "dental",
+ firma: {
+ adi: "Odentries",
+ slogan: "Seamless Dental Care",
+ sehir: "İstanbul",
+ adres: "Nişantaşı Mah. Valikonağı Cad. No:45, Şişli / İstanbul",
+ telefon: "0212 999 88 77",
+ email: "hello@odentries.com",
+ logoEmoji: "🦷",
+ renkAna: "#1E2E38",
+ renkKoyu: "#121C22",
+ renkAcik: "#EBF5F0",
+ },
+ istatistikler: [
+ { deger: "80%", etiket: "Exclusive Member Savings: Save 60% - 80% on Dental Procedures, including Oral Exams, Cleanings, and X-Rays." },
+ { deger: "40%", etiket: "Enhanced Member Benefits: Save 40% on All Other Dental Services, including Cosmetic, Restorative, and Specialty Dental Procedures." },
+ ],
+ hizmetler: [
+ { ikon: "🦷", baslik: "Prevent cavities and gum disease", aciklama: "Kapsamlı diş muayeneleri ve koruyucu hekimlik uygulamaları ile dişlerinizi koruyoruz." },
+ { ikon: "✨", baslik: "Keep your teeth sparkling clean", aciklama: "Profesyonel temizleme ve beyazlatma teknikleriyle parıldayan sağlıklı gülüşler yaratıyoruz." },
+ { ikon: "🔍", baslik: "Early detection of dental issues", aciklama: "İleri teknoloji röntgen ve teşhis araçlarıyla sorunları büyümeden yakalıyoruz." },
+ ],
+ projeler: [
+ { baslik: "Teeth Straightening", sektor: "002 - Our Works", aciklama: "Impressive results with cleaning.", ikon: "✨", renk: "#EBF5F0", resim: "/teeth_straightening.png" },
+ { baslik: "Revitalized Cleaning", sektor: "002 - Our Works", aciklama: "A simple way to enhance your smile.", ikon: "🦷", renk: "#FAF7F2", resim: "/revitalized_cleaning.png" },
+ { baslik: "Dental Implant", sektor: "002 - Our Works", aciklama: "Gorgeous and durable smile updates.", ikon: "🔬", renk: "#EBF5F0", resim: "/dental_implant.png" },
+ ],
+ yorumlar: [
+ { yazar: "Melis Y.", yorum: "Harika bir diş sağlığı deneyimiydi. Tasarım muhteşem, ekip inanılmaz profesyonel. Odentries bir numara!", puan: 5, tarih: "1 hafta önce", emoji: "😊" },
+ { yazar: "Arda K.", yorum: "Klinik çok temiz ve ferah. Tedavi süresince hiçbir acı hissetmedim. Herkese tavsiye ederim.", puan: 5, tarih: "3 hafta önce", emoji: "👍" },
+ ],
+ },
+
+ "sicilia-tavola": {
+ slug: "sicilia-tavola",
+ template: "restoran2",
+ firma: {
+ adi: "Sicilia Tavola",
+ slogan: "Linen, Lemons & Wood-fired Heritage",
+ sehir: "İstanbul",
+ adres: "Karaköy Mah. Gümrük Sok. No:14, Beyoğlu / İstanbul",
+ telefon: "0212 555 77 88",
+ email: "ciao@siciliatavola.com",
+ logoEmoji: "🍋",
+ renkAna: "#0038A8",
+ renkKoyu: "#002266",
+ renkAcik: "#FDFBF7",
+ },
+ istatistikler: [
+ { deger: "1892", etiket: "Sicilian Baking Roots" },
+ { deger: "100%", etiket: "Organic Cold Pressed Oil" },
+ { deger: "4.9", etiket: "Average Gastronomy Rating" },
+ { deger: "12k+", etiket: "Happy Diners Annually" },
+ ],
+ hizmetler: [
+ { ikon: "alacarte", baslik: "À la Carte Gastronomy", aciklama: "Odun ateşinde pişen taze makarnalar, taze deniz mahsulleri ve Sicilya klasikleri." },
+ { ikon: "special", baslik: "Trattoria Geceleri", aciklama: "Özel canlı akordeon dinletileri ve şefin tadım menüleri eşliğinde Sicilya akşamları." },
+ { ikon: "catering", baslik: "Zeytinyağı Tadımı", aciklama: "Kendi bahçelerimizden gelen %100 soğuk sıkım sızma zeytinyağlarımızı keşfedin." },
+ { ikon: "delivery", baslik: "Tavola Evinizde", aciklama: "Özel korumalı kuryelerimizle en taze gurme lezzetleri kapınıza getiriyoruz." },
+ ],
+ menu: [
+ {
+ kategori: "Primi Piatti", ikon: "salad",
+ urunler: [
+ { ad: "Caprese di Burrata", aciklama: "Manda burrata, pembe domates dilimleri, taze fesleğen ve zeytinyağı", fiyat: "₺280" },
+ { ad: "Carpaccio di Polpo", aciklama: "İnce dilimlenmiş marine ahtapot, kapari, bebek roka ve limon emülsiyonu", fiyat: "₺340" },
+ { ad: "Focaccia al Rosmarino", aciklama: "Taş fırından yeni çıkmış deniz tuzu, taze biberiye ve sızma zeytinyağlı", fiyat: "₺180" },
+ ],
+ },
+ {
+ kategori: "Secondi", ikon: "steak",
+ urunler: [
+ { ad: "Tagliatelle al Ragu di Polpo", aciklama: "Ağır ateşte pişmiş ahtapot ragu, taze el yapımı tagliatelle", fiyat: "₺460" },
+ { ad: "Pizza Margherita DOP", aciklama: "Odun ateşinde taş fırın pizza, San Marzano domates, taze mozzarella di bufala", fiyat: "₺380" },
+ { ad: "Polpo alla Griglia", aciklama: "Izgara ahtapot kolları, kapari, cherry domates ve ezilmiş sarımsaklı bebek patates", fiyat: "₺680" },
+ ],
+ },
+ {
+ kategori: "Dolci", ikon: "dessert",
+ urunler: [
+ { ad: "Cannoli Siciliani", aciklama: "Çıtır hamur tüpleri içinde tatlı ricotta kreması, çikolata parçacıkları ve Antep fıstığı", fiyat: "₺190" },
+ { ad: "Tiramisu al Limone", aciklama: "Limon likörlü hafif mascarpone kreması, taze limon kabuğu rendesi ile", fiyat: "₺210" },
+ { ad: "Gelato di Pistacchio", aciklama: "Kendi imalatımız gerçek Bronte Antep fıstıklı İtalyan dondurması", fiyat: "₺160" },
+ ],
+ },
+ ],
+ yorumlar: [
+ { yazar: "Ender M.", yorum: "Limon kokuları ve çalan müzikler eşliğinde kendimizi Sicilya'da hissettik. Ahtapot makarna tek kelimeyle kusursuzdu.", puan: 5, tarih: "3 gün önce", emoji: "🍋" },
+ { yazar: "Zeynep S.", yorum: "Focaccia ekmeği ve sızma zeytinyağının kalitesi buranın zanaatkarlığını kanıtlıyor. Mutlaka rezervasyon yaptırın.", puan: 5, tarih: "2 hafta önce", emoji: "✨" },
+ ],
+ },
+ "cabhub-nyc": {
+ slug: "cabhub-nyc",
+ template: "taxi",
+ firma: {
+ adi: "CabHub NYC",
+ slogan: "Trusted & Premium Cab Services in New York",
+ sehir: "New York",
+ adres: "450 7th Ave, New York, NY 10123",
+ telefon: "+1 234 567 8900",
+ email: "booking@cabhubnyc.com",
+ logoEmoji: "🚕",
+ renkAna: "#F5C518",
+ renkKoyu: "#0B0C0E",
+ renkAcik: "#14161C",
+ },
+ istatistikler: [
+ { deger: "Economy Class", etiket: "Within the city. We run services within the city to any destination you want to go. $1.5/MI" },
+ { deger: "Standard Class", etiket: "Within the state. We run services within the state to any destination you want to go. $1.5/MI" },
+ { deger: "Business Class", etiket: "Within the country. We run services within the country to any destination you want to go. $1.5/MI" },
+ ],
+ hizmetler: [
+ { ikon: "pickup", baslik: "HOME PICKUP", aciklama: "We run services to serve you more better and to your convenience." },
+ { ikon: "booking", baslik: "FAST BOOKING", aciklama: "Our book method is very fast and easy. It won't stress you." },
+ { ikon: "bonus", baslik: "BONUSES FOR RIDE", aciklama: "When you run services frequently we give you different bonuses that can put a smile on your face." },
+ { ikon: "gps", baslik: "GPS SEARCHING", aciklama: "We run services incase you aren't sure of your destination. So you don't have to worry." },
+ ],
+ yorumlar: [
+ { yazar: "John Doe", yorum: "CabHub NYC provided the most reliable ride during my business trip. The standard class vehicle was pristine and the driver knew all the shortcuts.", puan: 5, tarih: "2 days ago", emoji: "⭐" },
+ { yazar: "Sarah Jenkins", yorum: "The fast booking system works like a charm. Home pickup was exactly on time and the GPS tracking made me feel incredibly secure.", puan: 5, tarih: "1 week ago", emoji: "⭐" }
+ ]
+ },
+ "cabhub-premium": {
+ slug: "cabhub-premium",
+ template: "taxi2",
+ firma: {
+ adi: "CabHub Premium",
+ slogan: "Minimalist & Chic Airport Transfers in NYC",
+ sehir: "New York",
+ adres: "500 5th Ave, New York, NY 10110",
+ telefon: "+1 800 555 0199",
+ email: "premium@cabhub.com",
+ logoEmoji: "⚡",
+ renkAna: "#E5A900",
+ renkKoyu: "#111317",
+ renkAcik: "#FCFAF7",
+ },
+ istatistikler: [
+ { deger: "Economy Class", etiket: "Chic city rides. Comfortable zero-emission trips to any destination within boroughs. $1.5/MI" },
+ { deger: "Standard Class", etiket: "Premium transfers. Verified luxury sedans covering tri-state airport hubs. $1.5/MI" },
+ { deger: "Business Class", etiket: "First class executive. Top-tier luxury vehicles with priority lane dispatch. $1.5/MI" },
+ ],
+ hizmetler: [
+ { ikon: "pickup", baslik: "LOUNGE PICKUP", aciklama: "Direct lounge or doorstep coordination for all airport coordinates." },
+ { ikon: "booking", baslik: "TAP RESERVATION", aciklama: "Ultra-fast smartphone booking client. Secure scheduling under 60 seconds." },
+ { ikon: "bonus", baslik: "MEMBER BENEFITS", aciklama: "Collect mileage dynamically. Redeem up to 40% savings on specialty trips." },
+ { ikon: "gps", baslik: "TRACKING GPS", aciklama: "Real-time satellite path tracking and automated flight delay syncing." },
+ ],
+ yorumlar: [
+ { yazar: "Alexander Wright", yorum: "The airport transfer from JFK was absolutely seamless. The driver met me at the lounge gate and the electric vehicle was in pristine condition.", puan: 5, tarih: "3 days ago", emoji: "👤" },
+ { yazar: "Emily Vance", yorum: "CabHub Premium is my absolute go-to for corporate travel. The light theme app booking is simple and the delay syncing works perfectly.", puan: 5, tarih: "2 weeks ago", emoji: "👤" }
+ ]
+ },
+ "vaatbot-ai": {
+ slug: "vaatbot-ai",
+ template: "chatbot",
+ firma: {
+ adi: "VaatBot AI",
+ slogan: "Supercharge Your Team with AI Conversations",
+ sehir: "Istanbul",
+ adres: "Levent Loft 1C, Buyukdere Cad. No:201, Sisli / Istanbul",
+ telefon: "+90 212 999 5544",
+ email: "hello@vaatbot.ai",
+ logoEmoji: "🤖",
+ renkAna: "#00E5FF",
+ renkKoyu: "#080710",
+ renkAcik: "#FF007A",
+ },
+ istatistikler: [
+ { deger: "Accuracy 100%", etiket: "Trained directly on your database, docs, and custom web URLs to guarantee zero hallucination." },
+ { deger: "3x Faster Response", etiket: "Sub-second low-latency instant response times across Slack, WhatsApp, and Web widgets." },
+ { deger: "-20% Bounce Rate", etiket: "Keep visitors deeply engaged and double visitor-to-lead subscription conversions." },
+ ],
+ hizmetler: [
+ { ikon: "languages", baslik: "50+ Languages", aciklama: "Speaks your customer's native tongue fluently, spanning English, Spanish, Turkish, and more." },
+ { ikon: "customizer", baslik: "Brand Customizer", aciklama: "Tailor colors, names, avatars, and greetings to fully respect your corporate branding system." },
+ { ikon: "widgets", baslik: "Flexible Widget", aciklama: "Deploy in seconds using our clean copy-paste JS script tag or customizable iframe containers." },
+ { ikon: "industries", baslik: "Any Industry", aciklama: "Highly optimized for E-commerce, SaaS, Real Estate, Health Clinics, and Customer Support channels." },
+ ],
+ yorumlar: [
+ { yazar: "Sahil Dobariya", yorum: "VaatBot transformed our customer feedback loop. We connected the AI widget in under 2 minutes, and it handles 80% of routine questions without any developer overhead.", puan: 5, tarih: "1 day ago", emoji: "⚡" },
+ { yazar: "Michael Vance", yorum: "The accuracy rate is astonishing. It indexes our Zendesk support articles and guides customers directly to links in real-time.", puan: 5, tarih: "1 week ago", emoji: "🤖" }
+ ]
+ },
+ "noir-velvet": {
+ slug: "noir-velvet",
+ template: "bar",
+ firma: {
+ adi: "Noir Velvet Lounge",
+ slogan: "Cocktail Stage Evenings",
+ sehir: "Istanbul",
+ adres: "Karakoy Cad. No:88, Beyoglu / Istanbul",
+ telefon: "+90 212 555 9090",
+ email: "cheers@noirvelvet.com",
+ logoEmoji: "🍸",
+ renkAna: "#D4AF37",
+ renkKoyu: "#0A0A0C",
+ renkAcik: "#1C1C22",
+ },
+ istatistikler: [
+ { deger: "Open Hours", etiket: "Weekday: 4:00 PM - 2:00 AM. Weekend: 4:00 PM - 4:00 AM." },
+ { deger: "Happy Hour", etiket: "Everyday: 5:00 PM - 8:00 PM. 20% off classic mixology cocktails." },
+ ],
+ hizmetler: [
+ { ikon: "signature", baslik: "Coco Spice", aciklama: "Spiced rum, pressed pineapple nectar, organic ginger syrup, grated nutmeg." },
+ { ikon: "signature", baslik: "Tequila Sunrise", aciklama: "Reposado tequila, fresh orange reduction, grenadine, lime wheel." },
+ { ikon: "signature", baslik: "Cuba Libre", aciklama: "Dark cask rum, fresh squeezed lime, house cola bitters." },
+ { ikon: "signature", baslik: "Gin Fizz", aciklama: "Botanical gin, fresh lemon juice, simple syrup, soda splash, egg white foam." },
+ ],
+ yorumlar: [
+ { yazar: "David K.", yorum: "The cocktails are meticulously staged. A perfect moody obsidian lounge with jazz chords and exceptional botanical gin selections.", puan: 5, tarih: "3 days ago", emoji: "🍸" },
+ { yazar: "Elena R.", yorum: "We booked the VIP counter. Watching the mixologist mist the crystal glassware with citrus zest was an absolute work of art.", puan: 5, tarih: "1 week ago", emoji: "✨" }
+ ]
+ },
+ "char-barrelhouse": {
+ slug: "char-barrelhouse",
+ template: "bar2",
+ firma: {
+ adi: "Char Barrelhouse",
+ slogan: "The Ultimate Craft & Spirit Experience",
+ sehir: "Istanbul",
+ adres: "Kadikoy Ritim Sok. No:19, Kadikoy / Istanbul",
+ telefon: "+90 216 444 8822",
+ email: "hello@charbarrel.com",
+ logoEmoji: "🥃",
+ renkAna: "#E63946",
+ renkKoyu: "#111215",
+ renkAcik: "#1E1F24",
+ },
+ istatistikler: [
+ { deger: "Mojito", etiket: "Capacity: 350ml • Alcohol: 12% • Relax: 80% • Fresh white rum, crushed spearmint, lime juice." },
+ { deger: "Mai Tai", etiket: "Capacity: 280ml • Alcohol: 18% • Relax: 90% • Jamaican amber rum, orange curaçao, orgeat syrup." },
+ { deger: "Rum Cosmo", etiket: "Capacity: 200ml • Alcohol: 22% • Relax: 95% • Cask-aged dark rum, cranberry infusion, triple sec." },
+ ],
+ hizmetler: [
+ { ikon: "experience", baslik: "WHISKEY TASTINGS", aciklama: "Explore curated flights of single malt scotch, bourbon, and rye guided by certified sommeliers." },
+ { ikon: "experience", baslik: "MASTERCLASS MIXOLOGY", aciklama: "Step behind the heavy oak bar counter and craft signature historical formulas under expert tuition." },
+ { ikon: "experience", baslik: "VIP PRIVATE BOOKING", aciklama: "Reserve the entire rustic stone fireplace chamber for corporate launches or private bachelorettes." },
+ ],
+ yorumlar: [
+ { yazar: "Marcus V.", yorum: "The heavy wooden barrels and charcoal smoke aroma set an outstanding vibe. The single malt tastings are second to none.", puan: 5, tarih: "2 days ago", emoji: "🥃" },
+ { yazar: "Sophia T.", yorum: "Outstanding Mai Tais! You can taste the quality of the raw Jamaican aged rum. We scheduled a private corporate masterclass.", puan: 5, tarih: "2 weeks ago", emoji: "⭐" }
+ ]
+ },
+ "cal-vestam-resort": {
+ slug: "cal-vestam-resort",
+ template: "hotel1",
+ firma: {
+ adi: "Cal Vestam Resort",
+ slogan: "Cal Vestam Rehial Felgor",
+ sehir: "Muğla",
+ adres: "Ölüdeniz Mah. Akdeniz Bulvarı No:140, Fethiye / Muğla",
+ telefon: "+90 252 666 4422",
+ email: "stay@calvestam.com",
+ logoEmoji: "🌴",
+ renkAna: "#14B8A6",
+ renkKoyu: "#0D9488",
+ renkAcik: "#F0FDFA",
+ },
+ istatistikler: [
+ { deger: "120+", etiket: "Signature Sea Suites" },
+ { deger: "3", etiket: "Panoramic Infinity Pools" },
+ { deger: "4.9", etiket: "Guest Experience Index" },
+ { deger: "100%", etiket: "Natural Olive Oil Soap & Spa" },
+ ],
+ hizmetler: [
+ { ikon: "pool", baslik: "INFINITY VESTAM POOL", aciklama: "Dive into our award-winning glass-edge infinity pools looking directly over Fethiye blue ridges." },
+ { ikon: "spa", baslik: "REHIAL SPA THERAPY", aciklama: "Indulge in organic olive leaf stone massages and mineral salt hydrotherapy curated by local experts." },
+ { ikon: "cuisine", baslik: "AL-FRESCO TERRACE DINING", aciklama: "Savor fresh garden ingredients and cold pressed citrus recipes under Mediterranean olive trees." },
+ ],
+ yorumlar: [
+ { yazar: "Clara M.", yorum: "The infinity pools at Cal Vestam are absolutely magical. Watching the sunset while looking over the mountains of Muğla felt like a dream.", puan: 5, tarih: "3 days ago", emoji: "🌴" },
+ { yazar: "Tobias W.", yorum: "Clean, elegant, and filled with Mediterranean light. The local citrus cocktails and al-fresco terrace dining were exceptional.", puan: 5, tarih: "1 week ago", emoji: "✨" },
+ ],
+ },
+ "bitterroot-bunkhouse": {
+ slug: "bitterroot-bunkhouse",
+ template: "hotel2",
+ firma: {
+ adi: "Bitterroot Bunkhouse",
+ slogan: "Book Your Cozy Wilderness Getaway Today",
+ sehir: "Montana",
+ adres: "Bitterroot Valley National Forest, Darby, MT 59829",
+ telefon: "+1 406 555 0122",
+ email: "cabin@bitterrootbunkhouse.com",
+ logoEmoji: "🌲",
+ renkAna: "#854D0E",
+ renkKoyu: "#1C1917",
+ renkAcik: "#F5F2EB",
+ },
+ istatistikler: [
+ { deger: "A-Frame", etiket: "Rustic hand-crafted red cedar cabins situated deep in Darby forest." },
+ { deger: "Fireplace", etiket: "Organic stone hearth fireplaces stocked with seasoned birch logwood." },
+ { deger: "Wilderness", etiket: "Direct access to river trout fishing, forest trails, and kayak lakes." },
+ ],
+ hizmetler: [
+ { ikon: "hosts", baslik: "MEET YOUR HOSTS", aciklama: "Local mountain guides coordinate custom trout fishing trips, wildflower paths, and local map secrets." },
+ { ikon: "cabin", baslik: "CABIN POLICIES", aciklama: "Respectful pet-friendly lodge parameters. Stocked kitchens with cast iron skillets and firewood reserves." },
+ { ikon: "booking", baslik: "DIRECT RESERVATION", aciklama: "Direct calendar sync with Airbnb, VRBO, or secure bunkhouse booking triggers without commissions." },
+ ],
+ yorumlar: [
+ { yazar: "Ethan R.", yorum: "The Bitterroot Bunkhouse is the ultimate mountain escape. The A-frame architecture combined with the stone fireplace was so cozy.", puan: 5, tarih: "4 days ago", emoji: "🔥" },
+ { yazar: "Sophia J.", yorum: "Waking up to the smell of pine trees and hot sourdough was incredible. The hosts were incredibly helpful with kayak trails.", puan: 5, tarih: "2 weeks ago", emoji: "🌲" },
+ ],
+ },
+ "apex-arc-hotel": {
+ slug: "apex-arc-hotel",
+ template: "hotel3",
+ firma: {
+ adi: "Apex Arc Estate",
+ slogan: "Designing Spaces That Inspire & Endure",
+ sehir: "Bodrum",
+ adres: "Yalıkavak Yat Limanı Yolu No:8, Bodrum / Muğla",
+ telefon: "+90 252 777 5533",
+ email: "villas@apexarcestate.com",
+ logoEmoji: "📐",
+ renkAna: "#0F172A",
+ renkKoyu: "#020617",
+ renkAcik: "#F8FAFC",
+ },
+ istatistikler: [
+ { deger: "Concrete", etiket: "Raw monolithic architectural concrete forms coupled with warm teak decking." },
+ { deger: "Smart Estate", etiket: "Fully integrated voice interfaces, automated ventilation, and solar grid reserves." },
+ { deger: "Sea View", etiket: "Cantilevered master chambers designed with absolute panoramic floor-to-ceiling glass." },
+ ],
+ hizmetler: [
+ { ikon: "arch", baslik: "ARCHITECTURAL TOURS", aciklama: "Private property walkthroughs showcasing carbon structures, raw concrete textures, and zero-edge pools." },
+ { ikon: "interior", baslik: "DESIGN MASTERCLASSES", aciklama: "Join our masterclasses on minimalist living, bespoke furniture layout, and sustainable concrete styling." },
+ { ikon: "vip", baslik: "EXECUTIVE LUXURY VILLA", aciklama: "Full estate buyouts with personal sommelier coordination, automated helipad dispatch, and high-security details." },
+ ],
+ yorumlar: [
+ { yazar: "David V.", yorum: "An absolute masterpiece of modern architecture. The raw concrete lines and cantilevered ocean deck at Apex Arc took our breath away.", puan: 5, tarih: "5 days ago", emoji: "📐" },
+ { yazar: "Zoe K.", yorum: "Elegant, brutalist-inspired minimalism at its absolute finest. Floor-to-ceiling glass and smart automated automation worked flawlessly.", puan: 5, tarih: "3 weeks ago", emoji: "✨" },
+ ],
+ },
+
+ // ── BODRUM CERRAHİ ────────────────────────────────────────────────────────
+ "bodrum-cerrahi": {
+ slug: "bodrum-cerrahi",
+ template: "bodrumcerrahi",
+ firma: {
+ adi: "Bodrum Cerrahi",
+ slogan: "Güven, Teknoloji, Sağlık",
+ sehir: "Bodrum",
+ adres: "Eskiçeşme Mah. Sadi Irmak Cad. No:17, Gümbet / Bodrum – Muğla",
+ telefon: "+90 252 319 4800",
+ email: "info@bodrumcerrahi.com",
+ logoEmoji: "🏥",
+ renkAna: "#1B6FA8",
+ renkKoyu: "#0D3F65",
+ renkAcik: "#EBF5FF",
+ },
+ istatistikler: [
+ { deger: "15+", etiket: "Yıllık Deneyim" },
+ { deger: "12", etiket: "Uzman Hekim" },
+ { deger: "4.7", etiket: "Google Puanı" },
+ { deger: "7/24", etiket: "Acil Servis" },
+ ],
+ hizmetler: [
+ { ikon: "surgery", baslik: "Genel Cerrahi", aciklama: "Ameliyathane, yatan hasta servisi ve cerrahi operasyonlarında tam donanımlı hizmet." },
+ { ikon: "orthopedics", baslik: "Ortopedi ve Travmatoloji", aciklama: "Menüsküs yırtığı, kırık tedavisi ve eklem cerrahisi alanlarında uzman yaklaşım." },
+ { ikon: "pediatrics", baslik: "Çocuk Sağlığı", aciklama: "Pediatri alanında çocuk gelişimi takibi ve hastalık tedavisi hizmetleri." },
+ { ikon: "gynecology", baslik: "Kadın Hastalıkları", aciklama: "Jinekoloji, gebelik takibi ve kadın sağlığına özel poliklinik hizmetleri." },
+ { ikon: "neurology", baslik: "Nöroloji", aciklama: "Baş ağrısı, epilepsi ve nörolojik hastalıkların tanı ve tedavisi." },
+ { ikon: "laboratory", baslik: "Tıbbi Laboratuvar", aciklama: "Hızlı ve güvenilir tahlil sonuçlarıyla kapsamlı laboratuvar hizmetleri." },
+ { ikon: "radiology", baslik: "Radyoloji", aciklama: "MR, bilgisayarlı tomografi ve ultrason ile ileri görüntüleme." },
+ { ikon: "gastro", baslik: "Gastroenteroloji", aciklama: "Endoskopi, kolonoskopi ve sindirim sistemi hastalıklarında uzman tanı." },
+ { ikon: "dietitian", baslik: "Beslenme ve Diyet", aciklama: "Uzman diyetisyen eşliğinde kişiye özel beslenme programları." },
+ ],
+ doktorlar: [
+ { ad: "Op. Dr. Erdal Kaleli", uzmanlik: "Genel Cerrah — Mesul Müdür", puan: "5.0", yil: "20", hasta: "3800", emoji: "👨⚕️" },
+ { ad: "Op. Dr. Murat Bozlar", uzmanlik: "Ortopedi ve Travmatoloji", puan: "4.9", yil: "15", hasta: "2200", emoji: "👨⚕️" },
+ { ad: "Dyt. Fulden Yürek", uzmanlik: "Beslenme ve Diyet", puan: "4.8", yil: "8", hasta: "1200", emoji: "👩⚕️" },
+ { ad: "Dr. Tatiana Arslan", uzmanlik: "Geleneksel ve Tamamlayıcı Tıp", puan: "4.9", yil: "12", hasta: "980", emoji: "👩⚕️" },
+ { ad: "Uzm. Dr. M. Hüsnücan İşgüven", uzmanlik: "Radyoloji", puan: "4.8", yil: "10", hasta: "1500", emoji: "👨⚕️" },
+ { ad: "Y. Doç. Dr. Hikmet Kerem Çağlayan", uzmanlik: "Anestezi ve Reanimasyon", puan: "5.0", yil: "14", hasta: "2100", emoji: "👨⚕️" },
+ { ad: "Uzm. Dr. Suat Kahraman", uzmanlik: "İç Hastalıkları — Dahiliye", puan: "4.9", yil: "11", hasta: "1800", emoji: "👨⚕️" },
+ { ad: "Uzm. Dr. İrfan Güler", uzmanlik: "Anestezi ve Reanimasyon", puan: "4.7", yil: "9", hasta: "1100", emoji: "👨⚕️" },
+ ],
+ yorumlar: [
+ { yazar: "Aylin K.", yorum: "Bodrum'da bu kalitede bir özel hastane bulmak gerçekten şaşırtıcı. Doktorlar çok ilgili, ameliyat süreci çok iyi yönetildi. Kesinlikle tavsiye ederim.", puan: 5, tarih: "2 hafta önce", emoji: "😊" },
+ { yazar: "Michael T.", yorum: "As a foreign patient I was amazed by the level of English spoken at the international desk. The orthopedic team was exceptional.", puan: 5, tarih: "1 ay önce", emoji: "🙂" },
+ { yazar: "Hasan B.", yorum: "Acil servise gece geldiğimizde anında ilgilendiler. 7/24 hizmet verdiklerini bu gece deneyimledim. Çok teşekkürler.", puan: 5, tarih: "3 hafta önce", emoji: "😄" },
+ { yazar: "Claudia R.", yorum: "The radiology department had state-of-the-art equipment and results came within the hour. Highly professional staff throughout.", puan: 5, tarih: "2 ay önce", emoji: "👍" },
+ ],
+ },
+
+ // ── ZENITH AI CHATBOT ───────────────────────────────────────────────────
+ "zenith-ai": {
+ slug: "zenith-ai",
+ template: "chatbot2",
+ firma: {
+ adi: "Zenith AI",
+ slogan: "Next-Generation Conversational Intelligence",
+ sehir: "Istanbul",
+ adres: "Kanyon Office Tower 12B, Buyukdere Cad. No:185, Sisli / Istanbul",
+ telefon: "+90 212 888 7755",
+ email: "hello@zenithai.com",
+ logoEmoji: "🧬",
+ renkAna: "#8B5CF6", // Premium Purple accent
+ renkKoyu: "#09090B", // Dark neutral
+ renkAcik: "#F4F4F5", // Neutral warm grey
+ },
+ istatistikler: [
+ { deger: "99.4%", etiket: "Doğruluk oranıyla halüsinasyonsuz AI konuşmaları garanti edilir." },
+ { deger: "240ms", etiket: "Yanıt gecikmesiyle Slack, WhatsApp ve web widget'larında anında cevaplar." },
+ { deger: "4.8x", etiket: "Müşteri etkileşimi ve dönüşüm oranlarında kanıtlanmış artış." },
+ ],
+ hizmetler: [
+ { ikon: "brain", baslik: "Akıllı Semantik İndeksleme", aciklama: "Notion, Zendesk, PDF'ler ve tüm web URL'lerinizi otomatik olarak analiz ederek markanızın kendi bilgi tabanını oluşturur." },
+ { ikon: "channel", baslik: "Çoklu Kanal Entegrasyonu", aciklama: "Web siteniz, Slack, WhatsApp, Telegram ve Discord kanallarınızda saniyeler içinde yayına alın." },
+ { ikon: "brand", baslik: "Kurumsal Özelleştirme", aciklama: "Renklerinizi, avatarınızı, bot isminizi ve tonunu kurumsal kimliğinize göre tamamen uyarlayın." },
+ { ikon: "sync", baslik: "Anlık Bilgi Senkronizasyonu", aciklama: "Web siteniz güncellendiğinde veya yeni dökümanlar yüklendiğinde, Zenith AI bilgiyi anında senkronize eder." },
+ ],
+ yorumlar: [
+ { yazar: "Alican Y.", yorum: "Kendi dökümanlarımızla eğitmemiz sadece 1 dakika sürdü. Dönüşüm oranlarımız %35 arttı.", puan: 5, tarih: "3 gün önce", emoji: "⚡" },
+ { yazar: "Sarah Mitchell", yorum: "The API integration is lightning-fast and the customer workspace matches our corporate branding flawlessly.", puan: 5, tarih: "2 hafta önce", emoji: "🤖" },
+ ]
+ },
+};
+
+export function getDemoBySlug(slug: string): DemoData | null {
+ return demos[slug] ?? null;
+}
diff --git a/docs/TEMPLATE_BRIEF.md b/docs/TEMPLATE_BRIEF.md
new file mode 100644
index 0000000..f3f1f91
--- /dev/null
+++ b/docs/TEMPLATE_BRIEF.md
@@ -0,0 +1,416 @@
+# Şablon Tasarım Rehberi
+### Ayris Tech — Premium Demo Sistemi
+
+---
+
+## Görevin
+
+Potansiyel müşterilere gönderilecek demo siteleri için sektöre özel Next.js şablonları yazıyorsun.
+
+Öncelik sırası: **1. Tasarım ve his → 2. Animasyon → 3. İçerik → 4. Teknik detaylar**
+
+Müşteri linke tıkladığında ilk 3 saniyede "bu benim için yapılmış, bu çok pahalı görünüyor" hissini yaşamalı. Kod çalışıyor mu çalışmıyor mu ikinci plandır — önce göz kamaştır.
+
+---
+
+## Tasarım Felsefesi
+
+### "Oha" Anı Zorunludur
+
+Her şablonun sayfaya girince insanı duraksatan **bir imza momenti** olmalı. Bu an tasarlanmış, hesaplanmış, sektöre özgün olmalı. Genel bir animasyon değil — o sektörün ruhunu yansıtan bir hareket.
+
+Referans seviye: **Awwwards Site of the Day**. Hedef his: "Bu siteyi kim yaptı, nasıl yaptı?"
+
+### Tasarım Kararlarında Öncelik Sırası
+
+```
+1. Boşluk ve nefes — section'lar arası ritim, padding cömertliği
+2. Tipografi gücü — başlıklar cesur ve büyük, hiyerarşi net
+3. Fotoğraf kalitesi — her fotoğraf kompozisyon düşünülerek seçilmeli
+4. Renk disiplini — max 2-3 renk, geri kalanı siyah/beyaz/gri
+5. Hareket kalitesi — az animasyon ama her biri mükemmel
+6. Detay titizliği — hover state'ler, geçişler, micro-interaction'lar
+```
+
+### Nasıl Düşünmeli
+
+Görseller verildiğinde şunu sor: **"Bu tasarımı 10.000 USD'ye satan ajans ne hissettirdi?"**
+
+- Boşlukla mı ezdi? (luxury whitespace)
+- Tipografiyle mi şok etti? (devasa başlık, küçük body)
+- Fotoğrafla mı sardı? (fullscreen, parallax, overlay)
+- Hareketle mi büyüledi? (curtain, reveal, magnetic)
+- Detayla mı ikna etti? (custom cursor, subtle grain, line animation)
+
+Cevap hangisi ise — oradan başla, diğerlerini o etrafına kur.
+
+---
+
+## İmza Moment Kütüphanesi
+
+Her şablona aşağıdakilerden **en az bir** tane koy. Birden fazla koyacaksan aralarına yeterli "sessizlik" bırak.
+
+### Sayfa Açılışı
+- **Curtain reveal** — siyah ekran ortadan ikiye ayrılır, fotoğraf ortaya çıkar
+- **Preloader çizgi** — ince bir çizgi soldan sağa ilerler, logo belirir, sahne açılır
+- **Staggered text entrance** — başlık kelime kelime veya karakter karakter düşer
+- **Scale-up reveal** — küçük merkezi bir görsel tam ekrana açılır
+
+### Scroll Animasyonları
+- **Parallax hero** — scroll ettikçe fotoğraf daha yavaş iner, metin daha hızlı çıkar
+- **Sticky + akan metin** — fotoğraf sabit kalır, metin onun üzerinden akar
+- **Horizontal scroll bölüm** — kartlar/menü yatay ilerler, mouse/touch ile sürüklenir
+- **Pinned section** — section scroll boyunca sabit kalır, içeriği değişir (tablar gibi)
+- **Text scale on scroll** — başlık küçükten büyüğe veya büyükten küçüğe dönüşür
+
+### Hover & Mikro
+- **Magnetic buton** — mouse yaklaştıkça buton sana doğru çekilir
+- **Custom cursor** — varsayılan cursor kaybolur, markaya özgü daire/metin gelir
+- **Image tilt** — kart hover'ında 3D perspektif eğimi (rotateX/Y)
+- **Clip-path reveal** — fotoğraf hover'da yukarıdan aşağı açılır
+- **Underline draw** — link hover'ında çizgi soldan sağa çizilir
+
+### Atmosfer
+- **Scrolling marquee** — sonsuz döngü metin bandı (iki yönde farklı hızda olursa daha iyi)
+- **Grain texture overlay** — tüm sayfa üstünde ince film grain (opacity 0.03-0.06)
+- **Ambient glow** — arka planda renk blobları yavaşça hareket eder
+- **Video loop** — hero'da sessiz, döngü video (restoran, otel için)
+
+---
+
+## Tipografi Kuralları
+
+Pahalı hissinin %40'ı tipografiden gelir.
+
+```
+Başlık boyutu: clamp(48px, 8vw, 120px) — küçük ekranda küçülür, büyük ekranda büyür
+Body boyutu: 16px minimum, 18px ideal
+Satır yüksekliği: başlıklarda 0.9-1.0, body'de 1.6-1.8
+Harf aralığı: büyük harf başlıklarda tracking-widest, serif başlıklarda -0.02em
+```
+
+**Font kombinasyonları (sektöre göre):**
+- Otel/Butik/Restoran → Playfair Display (serif) + Inter (sans) — klasik lüks
+- Mimari/Kurumsal → Inter Black + Inter Regular — modern güç
+- Bar/Gastro → Cormorant Garamond + Space Grotesk — sofistike
+- Klinik/SaaS → DM Sans veya Sora + monospace detay — temiz güven
+
+Başlık tek satırda yoksa **satır kırılmalarını elle kontrol et** — otomatik kırılma çirkin görünür.
+
+---
+
+## Renk ve Atmosfer Kuralları
+
+### Koyu Tema (restoran, bar, otel, gastro)
+- Arka plan: `#080810` veya `#0a0a0a` — tam siyah değil, hafif tonlu
+- Metin: `#ffffff` + `rgba(255,255,255,0.5)` ikincil
+- Aksant: firmanın ana rengi — sadece CTA, badge, vurgu için
+- Fotoğraflar üstünde: `rgba(0,0,0,0.3-0.5)` overlay — direkt koymadan
+
+### Açık Tema (klinik, mimari, kurumsal, butik)
+- Arka plan: `#ffffff` veya `#f8f7f4` (hafif warm) veya `#f5f0e8` (krem)
+- Metin: `#0a0a0a` veya `#1a1a1a`
+- Aksant: firmanın ana rengi
+- İkincil yüzeyler: `#f0f0f0` veya `rgba(0,0,0,0.04)`
+
+### Renk Disiplini
+- Ana renk: butonlar, başlık vurgusu, badge, aktif state
+- İkincil renk: hover state, border, gradient ikinci noktası
+- Nötr: arka planlar, kartlar, ayırıcılar
+- **Başka renk yok.** Emoji veya ikonlar nötr tutulur.
+
+---
+
+## Fotoğraf Kullanımı
+
+Fotoğraflar kod kadar önemli. Kötü fotoğraf iyi tasarımı mahveder.
+
+**Unsplash koleksiyonları (sektöre göre):**
+- Otel/Resort: `https://source.unsplash.com/1920x1080/?luxury,hotel,resort`
+- Restoran: `https://source.unsplash.com/1920x1080/?restaurant,food,gastronomy`
+- Bar: `https://source.unsplash.com/1920x1080/?cocktail,bar,dark`
+- Mimari: `https://source.unsplash.com/1920x1080/?architecture,interior,modern`
+- Klinik: `https://source.unsplash.com/1920x1080/?clinic,medical,clean`
+
+**Kurallar:**
+- Hero fotoğrafı her zaman `object-cover` + `object-position: center`
+- Dikey fotoğraflar (portrait) kart içinde daha dramatik görünür — kullan
+- Birden fazla fotoğraf varsa renk tonu tutarlı olsun (hepsi sıcak veya hepsi soğuk)
+- `picsum.photos` sadece hızlı test için — final görünümde Unsplash parametreli URL kullan
+
+---
+
+## Animasyon Kalitesi
+
+### Easing Değerleri
+```typescript
+// Smooth deceleration — genel kullanım
+ease: [0.25, 0.46, 0.45, 0.94] as [number,number,number,number]
+
+// Dramatic entrance — hero başlıklar
+ease: [0.16, 1, 0.3, 1] as [number,number,number,number]
+
+// Snappy — buton, badge, küçük elementler
+ease: [0.34, 1.56, 0.64, 1] as [number,number,number,number]
+
+// Linear — marquee, döngüler
+ease: "linear"
+```
+
+### Süre Kuralları
+```
+Micro (hover, badge): 0.15-0.25s
+Element entrance: 0.6-0.8s
+Section transition: 0.8-1.0s
+Page reveal / curtain: 1.0-1.4s
+Marquee döngü: 20-40s (içerik uzunluğuna göre)
+```
+
+### Stagger Ritmi
+```typescript
+// Çocuk sayısına göre stagger ayarla
+3-4 element: staggerChildren: 0.15
+5-8 element: staggerChildren: 0.08
+9+ element: staggerChildren: 0.05
+```
+
+### Animasyon Monotonluğu Kırma
+Her section aynı `fadeUp` ile başlarsa sayfa uyutur. Karıştır:
+- Hero: curtain veya scale reveal
+- Stats: sayaç animasyonu (AnimatedCounter)
+- Kartlar: stagger + hafif x offset (soldan veya sağdan)
+- Galeri: clip-path veya opacity-only (y hareketi olmadan)
+- CTA section: parallax arka plan + metin fade
+
+---
+
+## Lenis Smooth Scroll Kurulumu
+
+Her şablona ekle:
+
+```typescript
+"use client";
+import { useEffect } from "react";
+
+// Component içinde:
+useEffect(() => {
+ let lenis: any;
+ import("@studio-freight/lenis").then(({ default: Lenis }) => {
+ lenis = new Lenis({ duration: 1.2, easing: (t: number) => Math.min(1, 1.001 - Math.pow(2, -10 * t)) });
+ function raf(time: number) { lenis.raf(time); requestAnimationFrame(raf); }
+ requestAnimationFrame(raf);
+ });
+ return () => lenis?.destroy();
+}, []);
+```
+
+---
+
+## Section Tasarım Standartları
+
+### Hero
+- Her zaman viewport yüksekliği: `min-h-screen`
+- Fotoğraf varsa: `position: absolute, inset: 0, object-fit: cover` + koyu overlay
+- Başlık: clamp ile responsive, viewport'un %60-70'ini kaplamalı
+- CTA buton: tek, net, aksant renkli — ikinci buton varsa ghost/outline
+
+### Marquee Bandı (opsiyonel ama etkili)
+Hero ile sonraki section arasına koy. İki yönde farklı iki satır daha güçlü görünür.
+
+### İki Kolonlu (Split) Section
+```
+Sol: metin + CTA Sağ: tall fotoğraf (aspect-ratio: 3/4)
+Metin sola hizalı Fotoğraf slight overlap (negatif margin)
+```
+
+### Kart Grid'leri
+- 3'lü grid: her kart eşit, hover'da `y: -8` ve border glow
+- Masonry: sadece galeri için — CSS columns veya css-grid ile
+- Horizontal scroll: `overflow-x: auto`, `scrollbar-width: none`, touch-action: pan-x
+
+### CTA Section (Son Bölüm)
+En az bir kez tam genişlikte, fotoğraf arka planlı olsun. Başlık büyük, CTA tek.
+
+---
+
+## Tech Stack
+
+```json
+{
+ "zorunlu": [
+ "Next.js 14 App Router",
+ "Framer Motion v11",
+ "Tailwind CSS v3",
+ "TypeScript strict",
+ "@studio-freight/lenis"
+ ],
+ "gerektiğinde": [
+ "Three.js / @react-three/fiber (sadece ambient bg için, performans dikkat)",
+ "react-lottie-player (loading, boş state ikonları için)",
+ "usehooks-ts (useWindowSize, useIntersectionObserver)"
+ ],
+ "yasak": [
+ "jQuery",
+ "Bootstrap",
+ "CSS @keyframes animasyonları (Framer Motion kullan)",
+ "inline style ile animasyon (transform, opacity — Framer Motion kullan)"
+ ]
+}
+```
+
+**Framer Motion zorunlu kurallar:**
+- `ease` array'leri her zaman type assertion: `as [number,number,number,number]`
+- Scroll animasyonları: `useScroll` + `useTransform`
+- Section girişleri: `whileInView` + `viewport={{ once: true }}`
+- Layout animasyonları: `layout` prop — yükseklik değişimlerinde kullan
+
+---
+
+## Kalite Kontrol Listesi
+
+Kodu teslim etmeden önce şunları kontrol et:
+
+**Tasarım:**
+- [ ] Sayfaya girince ilk 3 saniyede "oha" dedirten bir şey var mı?
+- [ ] Boşluklar cömert mi — hiçbir element birbirine yapışık değil mi?
+- [ ] Başlıklar yeterince büyük mü — yarım metre uzaktan okunabilir mi?
+- [ ] Renk disiplini korunuyor mu — max 3 renk var mı?
+- [ ] Fotoğraflar kompozisyon olarak uygun mu?
+
+**Animasyon:**
+- [ ] Her section farklı animasyon mu kullanıyor (monotonluk yok)?
+- [ ] Easing değerleri sert mi yoksa yumuşak mı? (Sert olmamalı)
+- [ ] Lenis smooth scroll çalışıyor mu?
+- [ ] Hover state'lerin hepsi var mı?
+
+**Detay:**
+- [ ] Demo banner sabit mi: `"Bu site demo amaçlıdır — demo.ayristech.com"`
+- [ ] Mobile'da layout bozulmuyor mu?
+- [ ] TypeScript hataları var mı (`any` yok)?
+
+---
+
+## Proje Yapısı
+
+```
+demo-ayristech/
+├── app/
+│ ├── page.tsx # Showcase index
+│ └── [slug]/page.tsx # Dynamic routing
+├── components/
+│ └── templates/
+│ └── [SektörTemplate]/
+│ └── index.tsx # Her şablon kendi klasöründe
+├── data/
+│ └── demos.ts # Tüm demo verisi
+└── components/ui/
+ └── AnimatedCounter.tsx # Scroll-triggered sayaç
+```
+
+Yeni şablon eklerken:
+1. `components/templates/YeniTemplate/index.tsx` oluştur
+2. `data/demos.ts` interface'ine yeni sektör tipini ve alanları ekle
+3. `app/[slug]/page.tsx` routing'e `if (data.template === "yeni") return 
+
+ {/* Overlay velvet glow */}
+
+ 
+
+ 
+
+ 
+
+ 
+ 
+ 
+
+ {/* Floating Citrus Welcome Badge Overlay */}
+ 
+ 
+ {/* Small tag inside photo */}
+ 
+ 
+ 
+
+ {/* Floating badge rotating around */}
+ 
+ 
+
+ {/* Spinning stamp */}
+ 
+