{s.h}
{s.body}
{s.lesson}
// mobile-landing.jsx — Pain-led, bilingual mobile-first landing page // Sections: Hero → Pain Hook → Core Edu → 5 Stories → +Accordion → // Solution → Mechanism → Before/After → Diagnostic → Who-this-is-for → Final CTA const { useState: useStateMFL, useEffect: useEffectMFL, useRef: useRefMFL } = React; /* ─────────────────── COPY (AR / EN) ─────────────────── */ const COPY = { ar: { dir: "rtl", nav: { brand: "Clinic Growth Ops", cta: "تحليل مجاني", ctaShort: "إحجز استشارة مجانية الأن" }, hero: { eyebrow: "لعيادات زراعة الشعر", h1Pre: "المزيد من الـ Leads", h1Bold: "لا يعني دائمًا", h1Post: "المزيد من الإيراد — التموضع الصحيح، الشريحة الصحيحة، ونظام التأهيل الصحيح هم ما يصنعون", h1Accent: "النمو الحقيقي", lede: "نساعد عيادات زراعة الشعر على إعادة تموضع العرض، جذب الشريحة المناسبة، تأهيل الفرص حسب قيمتها التجارية، وبناء مسار اكتساب قابل للقياس من أول اهتمام إلى الحجز والاستشارة والقرار.", cta: "احصل على تحليل مجاني للتموضع ومسار الاكتساب", micro: "في التحليل نراجع أين تخسر عيادتك فرصًا إيرادية: التموضع، الشريحة، الصفحة، Lead Magnet، التأهيل، المتابعة، الحجز، المراجعات، والـ KPIs.", }, pain: { sid: "01 · PAIN HOOK", h2Pre: "هل هذا يحدث", h2Accent: "داخل عيادتك؟", items: [ ["تصرف على الإعلانات، لكن أغلب الرسائل تسأل:", "“بقداش؟”"], ["تحصل على أرقام، لكن", "لا تعرف من الجاد ومن الفضولي"], ["أشخاص يحجزون", "ثم لا يحضرون"], ["فرص ساخنة تضيع لأن", "المتابعة تأخرت"], ["الفريق يدخل المحادثة", "بدون معرفة كافية"], ["لا توجد رحلة واضحة", "من الإعلان إلى الحجز"], ["لا تعرف أين تخسر المال:", "الإعلان؟ التأهيل؟ المتابعة؟ الإغلاق؟"], ], transitionEyebrow: "الخلاصة", transition: "زيادة الميزانية ليست الحل. التموضع الصحيح، الشريحة الصحيحة، ونظام التأهيل الصحيح هم ما يصنعون النمو الحقيقي.", cta: "اكتشف أين تضيع الفرص", }, edu: { sid: "03 · CORE EDUCATION", h2Pre: "إعلان جيد بدون نظام تحويل =", h2Accent: "مال يُحرق بهدوء", body: "الإعلان يستطيع جذب الانتباه. لكن الانتباه وحده لا يعني حجزًا. راغب زراعة الشعر يحتاج رحلة منطقية:", journey: ["يرى الإعلان", "يفهم الخدمة", "يثق", "يحصل على قيمة", "يُؤهَّل", "يحجز", "تتم متابعته", "يصل للفريق بمعلومات واضحة", "تُتتبع النتيجة"], key: "إذا انكسرت أي مرحلة من هذه الرحلة، تبدأ الخسارة.", }, storiesTitle: { sid: "11 · WHERE OPPORTUNITIES LEAK", h2: "ست قصص تسرّب تختبئ داخل عيادات زراعة الشعر" }, stories: [ { n: "STORY 01 · TARGETING", h: "حين تستهدف \u201Cكل من يعاني من تساقط الشعر\u201D… تحصل على فضول أكثر من الجدية.", viz: "broad-targeting", body: <>عيادة تطلق حملة عامة: “زراعة الشعر بأحدث التقنيات.” رسائل كثيرة، أسئلة كثيرة عن السعر — لكن القليل فقط مناسب فعلًا للحجز. المشكلة ليست أن الإعلان لم يجذب اهتمامًا، بل أنه جذب اهتمامًا واسعًا وغير مصفّى.>, lesson: "الاستهداف لا يبحث عن “من يهتم”، بل عن الشخص الأقرب للقرار: مشكلة واضحة، دافع قوي، توقع منطقي، وقدرة على الخطوة التالية.", }, { n: "STORY 02 · LEAD MAGNET", h: "\u201Cاترك رقمك وسنتصل بك\u201D لم يعد كافيًا.", viz: "weak-form", body: <>شخص مهتم يضغط على الإعلان، يجد فورمًا: اسم، هاتف، مدينة. لا يشعر أنه حصل على شيء. لا يعرف هل حالته مناسبة، ولا نطاق التكلفة، ولا الخطوة التالية — وقد ينسى أصلًا لماذا ترك رقمه.>, lesson: "Lead Magnet قوي لا يأخذ المعلومات فقط — يعطي قيمة أولًا. تقدير مبدئي للتكلفة أو تقييم أولي للحالة يجعل الشخص أكثر استعدادًا لإكمال الرحلة.", }, { n: "STORY 03 · EDUCATION", h: "الشخص غير المتعلّم يقارن بالسعر فقط.", viz: "price-cloud", body: <>حين لا تشرح العيادة الفرق بين التقنية، عدد البصيلات، جودة التشخيص، الخبرة، والنتائج الواقعية، يبقى سؤال واحد فقط في ذهن المهتم: “كم السعر؟” وهنا تدخل العيادة في مقارنة خطيرة مع أي عرض أرخص.>, lesson: "التثقيف ليس محتوى جميلًا فقط — هو أداة تحويل. كلما فهم الشخص أكثر، أصبح قراره أقل سطحية وأكثر ارتباطًا بالقيمة والثقة.", }, { n: "STORY 04 · FOLLOW-UP", h: "ليس كل من لم يحجز غير مهتم.", viz: "followup", body: <>أحيانًا هو مهتم لكنه مشغول، أحيانًا يحتاج تذكيرًا، أحيانًا يريد رؤية تجربة شخص آخر، وأحيانًا ينتظر أن يشعر بالثقة. إذا توقفت المتابعة بعد أول رسالة، فأنت تترك المال على الطاولة.>, lesson: "المتابعة ليست إزعاجًا إذا كانت مبنية على قيمة. المتابعة الصحيحة تعلّم، تطمئن، وتدفع للخطوة التالية.", }, { n: "STORY 05 · REVIEWS", h: "إذا كان عملاؤك السعداء لا يتركون مراجعات… منافسوك يبدون أقوى.", viz: "reviews", body: <>راغب زراعة الشعر سيبحث عنك قبل الحجز. سيرى Google، سيرى Facebook، سيقارن، وسيسأل نفسه: “هل أثق بهذه العيادة؟” إذا لم تتحول التجارب الجيدة إلى Reviews، تبقى الثقة ناقصة على الإنترنت — حتى لو كانت الخدمة جيدة في الواقع.>, lesson: "Google Reviews وFacebook Reviews ليست رفاهية — هي جزء من قرار الحجز.", }, { n: "STORY 06 · POSITIONING", h: "التموضع الضعيف يجعل عيادتك تنافس بالسعر فقط.", viz: "price-cloud", body: <>عندما تبدو عيادتك مثل أي عيادة زراعة شعر أخرى، يصبح لدى العميل معيار مقارنة سهل: السعر. لا يرى لماذا الطبيب مختلف. لا يفهم لماذا طريقة التشخيص مهمة. لا يرى قيمة المتابعة. لا يفهم الفرق بين تجربة منظمة وتجربة عشوائية. لذلك يسأل: “بقداش؟” ليس لأنه يهتم بالسعر فقط، بل لأن العيادة لم تعطه سببًا أفضل للمقارنة.>, lesson: "التموضع الأفضل يساعد الشريحة الصحيحة على فهم لماذا عيادتك هي الاختيار المناسب — قبل أن تصل إلى الاستشارة.", }, ], accordion: { title: "مشاكل أخرى نراجعها في التشخيص", items: [ "ضعف كشف الاعتراضات الحقيقية قبل الاستشارة", "غياب التأهيل بين الفضولي والجاد والجاهز", "غياب رحلة عميل واضحة من الإعلان إلى النتيجة", "عدم تتبع ما يحدث بعد الحجز والحضور والإغلاق", "عدم تحويل التجارب الناجحة إلى قصص ثقة", "ضعف المتابعة بعد العملية", "صرف إعلاني بدون نظام إغلاق مستدام", ], }, solution: { sid: "04 · WHAT WE BUILD", h2: "نبني نظام تحويل، لا حملة عابرة.", lede: "نظام يساعد عيادتك على:", items: [ "جذب المهتمين المناسبين، لا الجمهور العام", "صفحة هبوط تقود لخطوة واحدة واضحة", "Lead Magnet ذكي يعطي قيمة أولية", "تأهيل الفرص حسب الجدية والاستعداد", "كشف الاعتراضات الحقيقية مبكرًا", "متابعة منظمة حسب مرحلة كل فرصة", "تسهيل الحجز وتسليم الفريق سياقًا أوضح", "تتبع ما يحدث بعد الحجز حتى الإغلاق", "تقوية الثقة عبر Google + Facebook Reviews", "رؤية واضحة لأين تضيع الفرص بالأرقام", ], }, mechanism: { sid: "05 · HOW IT WORKS", h2: "كيف يعمل النظام", steps: [ ["جذب موجّه", "نستهدف الأشخاص الأقرب للاهتمام الجاد بزراعة الشعر، لا جمهورًا عشوائيًا."], ["صفحة هبوط للتحويل", "صفحة لا تشرح فقط — بل تقود الزائر إلى خطوة واحدة واضحة."], ["Lead Magnet ذكي", "تجربة تفاعلية تساعد المهتم على فهم نطاق التكلفة أو ملاءمة حالته."], ["تأهيل وتقييم", "نفرّق بين الفضولي، المتردد، الجاد، والجاهز للحجز فورًا."], ["متابعة منظمة", "رسائل تذكير وتثقيف وتحفيز حسب مرحلة كل فرصة."], ["حجز وتتبع", "كل فرصة في مسار واضح: حجزت؟ حضرت؟ ماذا بعد الاستشارة؟"], ["مراجعات وثقة", "نظام منظّم لجمع Google + Facebook Reviews وتقوية السمعة."], ], }, beforeAfter: { sid: "06 · BEFORE / AFTER", h2: "الفرق ليس في الإعلان — في النظام كله.", before: ["حملات بدون وضوح كافٍ", "استفسارات كثيرة بجودة غير معروفة", "متابعة عشوائية", "لا يوجد Lead Magnet قوي", "ضعف في كشف الاعتراضات", "فرص تضيع بسبب التأخير", "لا توجد رحلة واضحة", "مراجعات غير مستغلة", "ميزانية تضيع بدون رؤية"], after: ["استهداف أدق وأنضج", "صفحة تقود للقرار", "تجربة ذكية تعطي قيمة أولًا", "تأهيل للفرص", "متابعة مبنية على المرحلة", "حجز أكثر تنظيمًا", "معلومات أوضح قبل الاستشارة", "تتبع من الإعلان إلى النتيجة", "قرارات مبنية على أرقام"], }, diagnostic: { sid: "07 · DIAGNOSIS CALL", h2: "مكالمة التشخيص المجانية", sub: "لا نبيع لك \u201Cباقة إعلانات\u201D. نراجع معك:", qs: [ "هل الاستهداف الحالي يجذب الجادين؟", "هل الصفحة الحالية تقنع؟", "هل يوجد Lead Magnet فعلي؟", "هل يتم تأهيل الفرص؟", "هل توجد متابعة كافية؟", "هل يعرف الفريق الاعتراضات قبل الاستشارة؟", "هل يتم تتبع الحجز والحضور والإغلاق؟", "هل تستفيد العيادة من Google + Facebook Reviews؟", "أين أكبر خسارة مخفية اليوم؟", ], micro: "مناسب لعيادات زراعة الشعر التي تريد نموًا أوضح، جودة فرص أعلى، وتتبعًا أفضل للعائد.", }, fit: { sid: "08 · IS THIS FOR YOU?", h2: "هل هذا مناسب لعيادتك؟", yes: { tag: "نعم", title: "هذا مناسب لك إذا…", items: [ "عندك عيادة تقدم خدمة زراعة الشعر", "تصرف على الإعلانات بدون رؤية واضحة للعائد", "تحصل على استفسارات بجودة متفاوتة", "تريد حجوزات أكثر جدية", "تريد تقليل الفرص الضائعة", "تريد متابعة منظمة", "تريد تقوية الثقة عبر المراجعات", "تريد نظامًا يمكن تحسينه بالأرقام", ]}, no: { tag: "لا", title: "هذا ليس لك إذا…", items: [ "تبحث فقط عن أرخص إعلانات", "تريد أكبر عدد رسائل بغض النظر عن الجودة", "لا تريد تتبع ما يحدث بعد الحجز", "لا تريد تنظيم رحلة العميل المحتمل", "لا تريد مشاركة بيانات النتائج لتحسين النظام", ]}, }, final: { sid: "02 · BEFORE YOU SCALE", h2Pre: "اعرف", h2Accent: "أين تخسر الفرص", h2Post: "قبل زيادة ميزانية الإعلانات", sub: "في تحليل مجاني، نحدد أين يبدأ التسريب — التموضع، الشريحة، الصفحة، التأهيل، المتابعة، أو التحويل.", leaks: ["التموضع", "الشريحة", "الصفحة", "Lead Magnet", "التأهيل", "المتابعة", "الحجز", "تتبع الاستشارة", "المراجعات", "KPIs"], cta: "اعرف أين تخسر الفرص قبل زيادة ميزانيتك", micro: "تحليل مجاني · ساعة واحدة · لعيادات زراعة الشعر · لا تخمين، لا التزام.", }, foot: "CLINIC GROWTH OPS · HAIR-TX SYSTEMS", }, en: { dir: "ltr", nav: { brand: "Clinic Growth Ops", cta: "Free analysis", ctaShort: "Book a free consultation" }, hero: { eyebrow: "FOR HAIR TRANSPLANT CLINICS", h1Pre: "More leads", h1Bold: "don’t always mean", h1Post: " more revenue. Right positioning, right segment, and the right qualification system are what create", h1Accent: "real growth", lede: "We help hair transplant clinics reposition their offer, attract the right segment, qualify opportunities by commercial value, and build a measurable acquisition path — from first interest to booking, consultation, and decision.", cta: "Get a free positioning & acquisition flow analysis", micro: "In the analysis we review where opportunities leak today: positioning, segment, landing page, lead magnet, qualification, follow-up, booking, reviews, and KPIs.", }, pain: { sid: "01 · PAIN HOOK", h2Pre: "Does this happen", h2Accent: "inside your clinic?", items: [ ["You spend money on ads — but most messages just ask:", "“How much does it cost?”"], ["You get contact details, but", "you don’t know who is serious"], ["People book consultations", "and never show up"], ["Hot opportunities disappear because", "follow-up is late or inconsistent"], ["Your team enters conversations", "without enough context"], ["There is no clear journey", "from ad click to booking"], ["You can’t clearly see where money is lost:", "the ad? qualification? follow-up? close?"], ], transitionEyebrow: "Bottom line", transition: "Increasing ad budget is not the answer. The right positioning, the right segment, and the right qualification system are what create real growth.", cta: "Find where opportunities leak", }, edu: { sid: "03 · CORE EDUCATION", h2Pre: "A good ad without a conversion system =", h2Accent: "money quietly burning.", body: "Ads create attention. Attention alone does not create bookings. A person considering a hair transplant needs a logical journey:", journey: ["Sees the ad", "Understands the offer", "Trusts the clinic", "Receives initial value", "Gets qualified", "Books", "Is followed up with", "Team gets context", "Result is tracked"], key: "If one part of this journey breaks, money starts leaking.", }, storiesTitle: { sid: "11 · WHERE OPPORTUNITIES LEAK", h2: "Six leakage stories hiding inside hair transplant clinics" }, stories: [ { n: "STORY 01 · TARGETING", h: "When you target “everyone with hair loss”, you attract curiosity, not commitment.", viz: "broad-targeting", body: <>A clinic launches a general campaign: “Advanced hair transplant techniques available now.” Messages flow in. People ask about price. But only a small slice are actually close to booking. The ad didn’t fail to create interest — it attracted interest that was too broad and unfiltered.>, lesson: "Targeting should not only ask “who is interested” — it should ask who is closest to action: a clear problem, strong motivation, realistic expectations, and readiness to take the next step.", }, { n: "STORY 02 · LEAD MAGNET", h: "“Leave your phone number and we will contact you” is no longer enough.", viz: "weak-form", body: <>Someone clicks the ad and lands on a simple form: name, phone, city. They don’t feel they received anything. They don’t know if their case is suitable, the cost range, or what comes next — and minutes later they may forget why they submitted at all.>, lesson: "A strong lead magnet doesn’t only collect information — it gives value first. An initial cost range or a suitability pre-check makes the prospect more likely to continue the journey.", }, { n: "STORY 03 · EDUCATION", h: "An uneducated prospect compares only by price.", viz: "price-cloud", body: <>When you don’t explain technique, graft count, diagnosis quality, doctor experience, and realistic outcomes, the prospect is left with one question: “How much?” And once the decision becomes price-only, your clinic is compared against the cheapest offer in the market.>, lesson: "Education is not just content — it’s a conversion asset. The more a person understands, the more their decision shifts from price to value and trust.", }, { n: "STORY 04 · FOLLOW-UP", h: "Not everyone who doesn’t book is uninterested.", viz: "followup", body: <>Sometimes they’re interested but busy. Sometimes they need a reminder. Sometimes they want to see another person’s journey. Sometimes they’re waiting to feel more trust. If follow-up stops after the first message, you leave money on the table.>, lesson: "Follow-up is not annoying when it’s valuable. Good follow-up educates, reassures, reminds, and moves the person to the next logical step.", }, { n: "STORY 05 · REVIEWS", h: "If happy clients don’t leave reviews, your competitors look stronger online.", viz: "reviews", body: <>A person considering a hair transplant will search you up before booking. They check Google. They check Facebook. They compare. They ask themselves: “Can I trust this clinic?” If good experiences don’t turn into reviews, online trust stays weaker than your real service.>, lesson: "Google + Facebook reviews are not decoration — they’re part of the booking decision.", }, { n: "STORY 06 · POSITIONING", h: "Weak positioning forces your clinic to compete only on price.", viz: "price-cloud", body: <>When your clinic looks like any other hair transplant clinic, the customer is left with one easy yardstick: price. They don’t see why the doctor is different. They don’t understand why diagnosis matters. They don’t see the value of follow-up. So they ask: “How much?” — not because price is their only concern, but because the clinic never gave them a better reason to compare.>, lesson: "Better positioning helps the right segment understand why your clinic is the right choice — before they even reach the consultation.", }, ], accordion: { title: "Other leaks we check in the diagnosis", items: [ "Weak discovery of real objections before consultation", "No qualification between curious, serious, and ready", "No clear customer journey from ad to outcome", "No tracking of booking, attendance, or close", "Successful journeys never turned into trust assets", "Weak post-operation follow-up", "Ad spend without sustainable closing process", ], }, solution: { sid: "04 · WHAT WE BUILD", h2: "We build a conversion system, not a temporary campaign.", lede: "A system that helps your clinic:", items: [ "Attract better-fit prospects, not a broad audience", "Send them to a conversion-focused landing page", "Give them initial value via a smart lead magnet", "Qualify opportunities by seriousness and readiness", "Reveal real objections earlier", "Follow up consistently, by stage", "Make booking easier and hand the team better context", "Track what happens after the booking", "Strengthen trust via Google + Facebook reviews", "See clearly where opportunities are leaking", ], }, mechanism: { sid: "05 · HOW IT WORKS", h2: "How the system works", steps: [ ["Focused attraction", "We target people more likely to be serious about hair transplant — not a broad, generally-curious audience."], ["Conversion landing page", "A page that doesn’t only explain — it guides the visitor toward one clear next step."], ["Smart lead magnet", "An interactive experience that gives initial value: cost range or suitability pre-check."], ["Qualification", "We separate the curious, the hesitant, the serious, and the booking-ready."], ["Structured follow-up", "Educational and reminder-based follow-up tuned to the prospect’s stage."], ["Booking & tracking", "Every opportunity enters a visible journey: booked, attended, closed, lost, or nurturing."], ["Reviews & trust", "We help collect and grow Google + Facebook reviews in a structured way."], ], }, beforeAfter: { sid: "06 · BEFORE / AFTER", h2: "The difference isn’t the ad — it’s the whole system.", before: ["Campaigns run without enough clarity", "Inquiries arrive, quality is uncertain", "Random, ad-hoc follow-up", "No real lead magnet", "Hidden objections", "Hot opportunities disappear", "No clear customer journey", "Reviews underused", "Budget lost without visibility"], after: ["Sharper, more mature targeting", "Landing page supports the decision", "Lead magnet gives value first", "Prospects are qualified", "Stage-based follow-up", "Booking becomes manageable", "Better context before consultation", "Full journey is trackable", "Decisions based on numbers"], }, diagnostic: { sid: "07 · DIAGNOSIS CALL", h2: "The free diagnosis call", sub: "This is not a call to sell you “more ads.” We review:", qs: [ "Is your targeting attracting serious prospects?", "Does your landing page convert or lose visitors?", "Do you have a real lead magnet?", "Are prospects being qualified?", "Is follow-up strong enough?", "Does the team know objections before the consultation?", "Are booking, attendance, and close being tracked?", "Are you collecting enough Google + Facebook reviews?", "Where is the biggest hidden leak today?", ], micro: "For hair transplant clinics that want clearer growth, better-quality opportunities, and better visibility on return on ad spend.", }, fit: { sid: "08 · IS THIS FOR YOU?", h2: "Is this for your clinic?", yes: { tag: "YES", title: "This is for you if…", items: [ "You run or manage a hair transplant clinic", "You spend on ads without clearly seeing the return", "You receive inquiries of inconsistent quality", "You want more serious bookings", "You want fewer lost opportunities", "You want better, structured follow-up", "You want stronger trust through reviews", "You want a system that improves with data", ]}, no: { tag: "NO", title: "This is not for you if…", items: [ "You only want the cheapest possible ads", "You only care about message volume, not quality", "You don’t want to track what happens after booking", "You don’t want to organize the customer journey", "You don’t want to share outcome data", ]}, }, final: { sid: "02 · BEFORE YOU SCALE", h2Pre: "Find", h2Accent: "where opportunities are leaking", h2Post: "before scaling your ad spend", sub: "In a free analysis, we identify where the leak starts — positioning, segment, page, qualification, follow-up, or conversion.", leaks: ["Positioning", "Segment", "Page", "Lead magnet", "Qualification", "Follow-up", "Booking", "Consultation tracking", "Reviews", "KPIs"], cta: "Find where opportunities leak before scaling spend", micro: "Free analysis · 1 hour · hair transplant clinics only · no guessing, no obligation.", }, foot: "CLINIC GROWTH OPS · HAIR-TX SYSTEMS", }, }; /* ─────────────────── SHARED PRIMITIVES ─────────────────── */ // Diagnostics are Arabic-only content. When the landing page is in English, // skip the Arabic diagnostic and route straight to the localized booking form. function diagnosticHref(htmlFile, lang) { if (lang === "en") return "book.html?lang=en"; return htmlFile; } function ArrowGlyph({ dir }) { // Always visually points to the start of the call (toward CTA destination) return ( ); } function SectionId({ children }) { return
{h.lede}
{h.micro}
{p.transition}
{e.body}
{/* Journey diagram — number + label on the same row, never collapse */}{e.key}
{s.body}
{s.lesson}
{s.lede}
{it}
{st[1]}
{d.sub}
{q}
{d.micro}
{f.sub}
{f.micro}