import { jsx, jsxs, Fragment } from "react/jsx-runtime";
import { initReactI18next, useTranslation } from "react-i18next";
import * as React from "react";
import { useEffect, useMemo, useRef, useState } from "react";
import { Slot } from "@radix-ui/react-slot";
import { cva } from "class-variance-authority";
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
import i18n from "i18next";
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
import { ChevronRight, Check, Circle, Sparkles, UserCheck, Clock3, GraduationCap, CalendarClock, LineChart, Video, HelpCircle, Plus, BadgeCheck, Building2, MapPin, Mail, User, MessageSquare, Send, ArrowUp, BookOpen, X, Home, Map, Globe, Menu, Clock, Globe2, Users, CalendarDays, BarChart3, ScanLine, Trophy, Heart, Mic, UserPlus } from "lucide-react";
import * as LabelPrimitive from "@radix-ui/react-label";
import { toast } from "sonner";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
  {
    variants: {
      variant: {
        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
        outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
        ghost: "hover:bg-accent hover:text-accent-foreground",
        link: "text-primary underline-offset-4 hover:underline"
      },
      size: {
        default: "h-9 px-4 py-2",
        sm: "h-8 rounded-md px-3 text-xs",
        lg: "h-10 rounded-md px-8",
        icon: "h-9 w-9"
      }
    },
    defaultVariants: {
      variant: "default",
      size: "default"
    }
  }
);
const Button = React.forwardRef(
  ({ className, variant, size, asChild = false, ...props }, ref) => {
    const Comp = asChild ? Slot : "button";
    return /* @__PURE__ */ jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref, ...props });
  }
);
Button.displayName = "Button";
const logo = "/assets/iqraa-logo-DETVKLeS.png";
function IqraaLogo({ className = "h-10 w-auto" }) {
  return /* @__PURE__ */ jsx("img", { src: logo, alt: "Iqraa", className });
}
const ar = {
  nav: {
    features: "المميزات",
    about: "من نحن",
    download: "تحميل",
    cta: "احصل على التطبيق"
  },
  hero: {
    badge: "متاح على المتاجر",
    title_1: "اقرأ.. تعلّم.. تأمّل",
    title_2: "تطوّر كل يوم",
    subtitle: "صديقُ الحفّاظ، ورفيقُ المُتقنين، وأنيسُ القُرّاء… إقراء.",
    ios: "حمّل لـ iOS",
    android: "حمّل لـ Android",
    loved: "مئات الآلاف يثقون بإقراء"
  },
  footer: { rights: "جميع الحقوق محفوظة." },
  lang: { toggle: "اللغة" },
  cube: {
    face1: "معلم متاح في أي وقت من الليل أو النهار",
    face2: "وصول سهل للتعلم... ذكوراً وإناثاً وأطفالاً",
    face3: "أدوات تعلم مميزة بداخل الجلسة",
    face4: "متابعة الإنجازات.. وسد الفجوات",
    face5: "مجتمع تواصل اجتماعي... قرآني",
    face6: "تجربة مجانية، ثم باقات اشتراك تناسب الجميع"
  },
  features: {
    eyebrow: "كل ما تحتاجه في رحلتك مع القرآن",
    title_1: "تجربة قرآنية",
    title_2: "متكاملة بين يديك",
    subtitle: "من الجلسة المباشرة إلى متابعة كل آية… كل شيء في مكان واحد.",
    live: { title: "جلسات حية", desc: "صوت وصورة، لحظة بلحظة." },
    teachers: { title: "معلمون مجازون", desc: "أسانيد متصلة وخبرة متميزة." },
    everyone: { title: "للجميع", desc: "رجال • نساء • أطفال." },
    always: { title: "٢٤/٧", desc: "على مدار الساعة." },
    readings: { title: "كل القراءات", desc: "العشر الكبرى والصغرى." },
    schedule: { title: "جدولة مرنة", desc: "اختر وقتك الأنسب." },
    plans: { title: "خطط متكاملة", desc: "مسارات تعلم مدروسة." },
    reports: { title: "تقارير دقيقة", desc: "أداؤك بالأرقام." },
    mushaf: { title: "مصحف تفاعلي", desc: "يحصر أخطاءك آية آية." },
    achievements: { title: "إنجازات", desc: "تتبع كل خطوة تخطوها." },
    community: { title: "مجتمع قرآني", desc: "أصدقاء يشاركونك." },
    recordings: { title: "تسجيل الجلسات", desc: "راجع كل جلسة لاحقاً." },
    friends: { title: "أضف الأصدقاء", desc: "تابعوا بعضكم وتنافسوا." }
  },
  journey: {
    eyebrow: "رحلتك مع إقراء",
    title_1: "من أول تسجيل",
    title_2: "إلى مجتمع متكامل",
    subtitle: "تعرّف على رحلة المستخدم خطوة بخطوة داخل التطبيق.",
    progress: "المرحلة",
    of: "من",
    stages: {
      s1: "التسجيل",
      s2: "الرئيسية",
      s3: "البحث عن معلم",
      s4: "طلب جلسة",
      s5: "الجلسة",
      s6: "تقييم الجلسة",
      s7: "متابعة الإنجازات",
      s8: "الجلسات السابقة",
      s9: "استعراض التقارير",
      s10: "مصحف تفاعلي مخصص",
      s11: "لوحة الشرف",
      s12: "إضافة الأصدقاء",
      s13: "إرسال هدايا للأصدقاء"
    },
    captions: {
      c1: "عملية تسجيل بسيطة وسريعة بدون الإفصاح عن بيانات أو معلومات غير ضرورية.",
      c2: "شاشة رئيسية غنية بها كل ما تحتاجه: أرقامك ورصيدك من الدقائق وجلساتك المجدولة وعدد الأيام التي لم تنقطع فيها عن التعلم، مع إمكانية طلب جلسة بضغطة زر واحد.",
      c3: "يمكنك تصفح ملفات المعلمين واختيار من يناسبك منهم. اطمئن، فالمعلمون الذين يظهرون لك متوافقون مع جنسك وقراءتك واللغات التي تجيدها.",
      c4: "اطلب جلسة بالصوت فقط أو بالصوت والصورة مع معلم متاح ومؤهل ومتوافق مع مفضلاتك. الجلسة ستبدأ خلال ثوانٍ من طلبها.",
      c5: "خلال الجلسة، يمكنك الاستفادة من مجموعة من أدوات التعلم، بما في ذلك مصحف تفاعلي يحصر أخطاءك الحالية ويذكرك بأخطائك السابقة.",
      c6: "تستطيع تقييم المعلم بعد انتهاء الجلسة. تقييمك يتحكم في نسبة ظهوره لك مستقبلاً، ويمكنك إضافته للمفضلة ليظهر دائماً في المقدمة.",
      c7: "تستطيع متابعة إنجازاتك من خلال خريطة تفاعلية لسور القرآن. الخريطة تنبهك للسور التي لم تتقنها وتعطيك معلومات عن مدى تقدمك.",
      c8: "يمكنك الرجوع لجلساتك السابقة واستعراض تقارير جلسات بعينها، مع إمكانية إعادة تشغيلها والاستفادة منها مرة أخرى.",
      c9: "راقب أداءك العام عبر تقارير مفصّلة تحصر التحديات التي تواجهك في تعلم القرآن وتعطيك توصيات لمعالجتها.",
      c10: "المصحف في إقراء ليس مصحفاً عادياً، بل أداة تفاعلية بالغة القوة تساعدك على تتبع أخطائك ومعالجتها.",
      c11: "وجودك في لوحة الشرف يعني أنك طالب مميز حريص على التعلم… لا تدع اسمك يخرج من هذه القائمة أبداً.",
      c12: "يمكنك البحث عن الأصدقاء وإضافتهم والتفاعل مع منشوراتهم والدردشة معهم.",
      c13: "يمكنك مشاركة رصيدك مع الأصدقاء وإرسال الهدايا لهم."
    }
  },
  faq: {
    eyebrow: "الأسئلة الشائعة",
    title_1: "كل ما تريد معرفته",
    title_2: "عن تطبيق إقراء",
    subtitle: "إجابات سريعة وواضحة لأكثر الأسئلة تكراراً.",
    items: {
      q1: { q: "ما هو تطبيق إقراء؟ وكيف يعمل؟", a: "تطبيق إقراء هو منصة متكاملة لتعلم القرآن الكريم من خلال جلسات مباشرة بالصوت والصورة مع معلمين ومعلمات مجازين. يمكنك اختيار الوقت المناسب لك، حجز الجلسات، وبدء رحلتك في التعلم بسهولة من أي مكان." },
      q2: { q: "هل يمكنني اختيار المعلم أو المعلمة؟", a: "نعم، يمكنك اختيار المعلم أو المعلمة بما يناسبك، كما أن التطبيق يوفر خيارات مناسبة للرجال والنساء والأطفال لضمان تجربة مريحة وآمنة للجميع." },
      q3: { q: "هل التطبيق متاح في أي وقت؟", a: "نعم، التطبيق متاح على مدار الساعة (24/7)، ويمكنك حجز الجلسات في الوقت الذي يناسبك وفق جدولك اليومي." },
      q4: { q: "هل أحتاج إلى خبرة سابقة لتعلم القرآن عبر التطبيق؟", a: "لا، التطبيق مناسب لجميع المستويات، سواء كنت مبتدئاً أو لديك خبرة سابقة. يتم توفير خطط تعليمية مخصصة تناسب مستواك وأهدافك." },
      q5: { q: "كيف يتم تنظيم الجلسات؟", a: "يمكنك الحصول على جلسة فورية مع معلم متاح من اختيارك في أي وقت، كما يمكنك جدولة الجلسات بسهولة من داخل التطبيق، واختيار المواعيد المناسبة لك، مع إمكانية التعديل أو إعادة الجدولة عند الحاجة." },
      q6: { q: "هل يتم متابعة تقدمي في التعلم؟", a: "نعم، يوفر التطبيق تقارير أداء مفصلة تساعدك على متابعة مستواك وتطورك، مع إمكانية تتبع إنجازاتك خطوة بخطوة." },
      q7: { q: "هل يمكنني إعادة مشاهدة الجلسات؟", a: "نعم، يتم تسجيل الجلسات ويمكنك الرجوع إليها في أي وقت لمراجعة ما تم تعلمه." },
      q8: { q: "هل يدعم التطبيق جميع القراءات؟", a: "نعم، يدعم التطبيق جميع القراءات القرآنية، مما يتيح لك التعلم وفق القراءة التي تفضلها." },
      q9: { q: "هل يوجد مصحف داخل التطبيق؟", a: "نعم، يحتوي التطبيق على مصحف تفاعلي يساعدك أثناء التعلم، ويجعل متابعة التلاوة أسهل وأكثر وضوحاً." },
      q10: { q: "هل يمكنني التواصل مع مستخدمين آخرين؟", a: "نعم، يمكنك إضافة أصدقاء والانضمام إلى مجتمع قرآني داخل التطبيق، مما يساعدك على الاستمرار والتحفيز." },
      q11: { q: "هل التطبيق مناسب للأطفال؟", a: "نعم، التطبيق مناسب للأطفال ويوفر بيئة تعليمية آمنة، مع معلمين متخصصين في التعامل مع مختلف الأعمار." },
      q12: { q: "كيف أبدأ؟", a: "يمكنك تحميل التطبيق، إنشاء حساب، ثم حجز أول جلسة لك بسهولة والبدء فوراً في رحلتك مع القرآن." }
    }
  },
  about: {
    eyebrow: "عن الشركة",
    title_1: "شركة إقراء",
    title_2: "لتقنية المعلومات",
    p1: "شركة إقراء لتقنية المعلومات هي شركة سعودية ذات مسؤولية محدودة مسجلة في المملكة العربية السعودية بسجل تجاري رقم (1010562765) وعضوية في الغرفة التجارية برقم (486697)، ومقرها الرياض، وهي متخصصة في مجال ابتكار وتنفيذ التطبيقات القرآنية.",
    p2: "للشركة أفرع ووكلاء في عدد من الدول العربية، وتستهدف إقامة المزيد من الشراكات حول العالم بهدف التوسع في تطوير التطبيق وتغطية أكبر عدد من اللغات الحية، وإتاحة معلمين ومعلمات من جنسيات مختلفة يتواصلون مع الطلاب بلغات مختلفة حسب احتياجاتهم، ومراعاة فروق التوقيت بين الشرق والغرب.",
    chip_global: "حضور عالمي",
    chip_languages: "لغات متعددة",
    image_alt: "حضور عالمي لشركة إقراء",
    stats: {
      cr: { label: "السجل التجاري" },
      chamber: { label: "عضوية الغرفة التجارية" },
      hq: { label: "المقر الرئيسي", value: "الرياض، السعودية" }
    }
  },
  contact: {
    eyebrow: "تواصل معنا",
    title_1: "نحن هنا",
    title_2: "للاستماع إليك",
    intro: "هل لديك سؤال أو اقتراح أو فكرة شراكة؟ أرسل لنا رسالة وسنرد عليك في أقرب وقت ممكن.",
    name: "الاسم",
    name_ph: "اسمك الكامل",
    email: "البريد الإلكتروني",
    email_ph: "you@example.com",
    subject: "الموضوع",
    subject_ph: "عمَّ تريد التحدث؟",
    body: "الرسالة",
    body_ph: "اكتب رسالتك هنا...",
    send: "إرسال الرسالة",
    sending: "جارٍ الإرسال...",
    back_to_top: "العودة إلى الرئيسية",
    toast: {
      missing: "من فضلك أكمل جميع الحقول.",
      toolong: "بعض الحقول طويلة جداً.",
      sent: "تم فتح بريدك لإرسال الرسالة."
    }
  },
  menu: {
    home: "الرئيسية",
    home_desc: "العودة إلى الواجهة",
    features: "المميزات",
    features_desc: "ما يقدمه إقراء",
    journey: "الرحلة",
    journey_desc: "تجربة المستخدم خطوة بخطوة",
    faq: "الأسئلة الشائعة",
    faq_desc: "إجابات على ما يهمك",
    about: "عن الشركة",
    about_desc: "تعرّف علينا أكثر",
    contact: "تواصل معنا",
    contact_desc: "أرسل لنا رسالة",
    terms: "الشروط والأحكام",
    privacy: "سياسة الخصوصية"
  }
};
const en = {
  nav: { features: "Features", about: "About", download: "Download", cta: "Get the App" },
  hero: {
    badge: "Available on stores",
    title_1: "Read. Learn. Reflect.",
    title_2: "Grow every day.",
    subtitle: "A friend to memorizers, a companion to those who master, and a comfort to readers… Iqraa.",
    ios: "Download iOS",
    android: "Download Android",
    loved: "Trusted by hundreds of thousands"
  },
  footer: { rights: "All rights reserved." },
  lang: { toggle: "Language" },
  cube: {
    face1: "A teacher available any time, day or night",
    face2: "Easy access to learning — for men, women, and children",
    face3: "Distinctive learning tools inside every session",
    face4: "Track your achievements and close the gaps",
    face5: "A Qur'anic social community",
    face6: "Free trial, then subscription plans for everyone"
  },
  features: {
    eyebrow: "Everything you need on your journey with the Qur'an",
    title_1: "A complete Qur'anic experience",
    title_2: "in the palm of your hand",
    subtitle: "From a live session to following every verse… everything in one place.",
    live: { title: "Live sessions", desc: "Audio and video, moment by moment." },
    teachers: { title: "Certified teachers", desc: "Connected chains of transmission and proven expertise." },
    everyone: { title: "For everyone", desc: "Men • Women • Children." },
    always: { title: "24/7", desc: "Available around the clock." },
    readings: { title: "All recitations", desc: "The major and minor ten." },
    schedule: { title: "Flexible scheduling", desc: "Pick the time that suits you." },
    plans: { title: "Complete plans", desc: "Thoughtful learning paths." },
    reports: { title: "Detailed reports", desc: "Your performance, in numbers." },
    mushaf: { title: "Interactive Mushaf", desc: "Catches your mistakes verse by verse." },
    achievements: { title: "Achievements", desc: "Track every step you take." },
    community: { title: "Qur'anic community", desc: "Friends who share the journey." },
    recordings: { title: "Session recordings", desc: "Review every session later." },
    friends: { title: "Add friends", desc: "Follow each other and compete." }
  },
  journey: {
    eyebrow: "Your journey with Iqraa",
    title_1: "From your first sign-up",
    title_2: "to a complete community",
    subtitle: "Discover the user journey step by step inside the app.",
    progress: "Stage",
    of: "of",
    stages: {
      s1: "Sign up",
      s2: "Home",
      s3: "Find a teacher",
      s4: "Request a session",
      s5: "The session",
      s6: "Rate the session",
      s7: "Track achievements",
      s8: "Past sessions",
      s9: "Browse reports",
      s10: "A personalized interactive Mushaf",
      s11: "Honor board",
      s12: "Add friends",
      s13: "Send gifts to friends"
    },
    captions: {
      c1: "A simple, fast sign-up — no unnecessary data or information required.",
      c2: "A rich home screen with everything you need: your stats, your minute balance, your scheduled sessions, and your learning streak — with a one-tap session request.",
      c3: "Browse teacher profiles and pick the one who fits you. Rest assured, the teachers shown are matched to your gender, recitation, and the languages you speak.",
      c4: "Request an audio-only or audio+video session with a qualified teacher matched to your preferences. The session begins within seconds.",
      c5: "During the session, use a suite of learning tools, including an interactive Mushaf that catches your current mistakes and reminds you of past ones.",
      c6: "Rate the teacher after the session ends. Your rating influences how often they appear, and you can favorite them so they always show first.",
      c7: "Track your achievements through an interactive map of the Qur'an's surahs. The map flags surahs you haven't mastered and shows your progress.",
      c8: "Revisit past sessions and view detailed reports for any of them, with the option to replay and benefit from them again.",
      c9: "Monitor your overall performance through detailed reports that pinpoint the challenges you face and recommend ways to address them.",
      c10: "The Mushaf in Iqraa isn't an ordinary one — it's a powerful interactive tool to help you track and address your mistakes.",
      c11: "Being on the honor board means you're a distinguished, dedicated student… don't let your name slip from this list.",
      c12: "Search for friends, add them, react to their posts, and chat with them.",
      c13: "Share your minute balance with friends and send them gifts."
    }
  },
  faq: {
    eyebrow: "FAQ",
    title_1: "Everything you want to know",
    title_2: "about the Iqraa app",
    subtitle: "Quick, clear answers to the most common questions.",
    items: {
      q1: { q: "What is the Iqraa app and how does it work?", a: "Iqraa is an integrated platform for learning the Holy Qur'an through live audio and video sessions with certified male and female teachers. Choose a time that suits you, book your sessions, and start your learning journey easily from anywhere." },
      q2: { q: "Can I choose the teacher?", a: "Yes — you can choose the teacher that suits you. The app provides options for men, women, and children to ensure a comfortable and safe experience for everyone." },
      q3: { q: "Is the app available at any time?", a: "Yes, the app is available 24/7. You can book sessions at the time that fits your daily schedule." },
      q4: { q: "Do I need prior experience to learn the Qur'an through the app?", a: "No — the app suits all levels, whether you're a beginner or already have experience. Personalized learning plans are tailored to your level and goals." },
      q5: { q: "How are sessions organized?", a: "You can get an instant session with an available teacher of your choice at any time, or schedule sessions easily inside the app and pick times that suit you, with the ability to edit or reschedule when needed." },
      q6: { q: "Is my learning progress tracked?", a: "Yes — the app provides detailed performance reports that help you follow your level and progress, and lets you track your achievements step by step." },
      q7: { q: "Can I rewatch sessions?", a: "Yes — sessions are recorded and you can return to them at any time to review what you learned." },
      q8: { q: "Does the app support all recitations?", a: "Yes — the app supports all Qur'anic recitations, so you can learn according to your preferred recitation." },
      q9: { q: "Is there a Mushaf inside the app?", a: "Yes — the app includes an interactive Mushaf that helps you while learning and makes following the recitation easier and clearer." },
      q10: { q: "Can I connect with other users?", a: "Yes — you can add friends and join a Qur'anic community inside the app, which helps you stay motivated and consistent." },
      q11: { q: "Is the app suitable for children?", a: "Yes — the app is suitable for children and provides a safe learning environment with teachers experienced in working with all ages." },
      q12: { q: "How do I get started?", a: "Download the app, create an account, then easily book your first session and start your journey with the Qur'an right away." }
    }
  },
  about: {
    eyebrow: "About the company",
    title_1: "Iqraa",
    title_2: "Information Technology Co.",
    p1: "Iqraa Information Technology is a Saudi limited liability company registered in the Kingdom of Saudi Arabia under commercial registration No. (1010562765) and Chamber of Commerce membership No. (486697), headquartered in Riyadh, specializing in creating and delivering Qur'anic applications.",
    p2: "The company has branches and agents in several Arab countries, and aims to establish more partnerships around the world to expand the app, cover more living languages, provide teachers of various nationalities who communicate with students in different languages as needed, and account for time zone differences between East and West.",
    chip_global: "Global presence",
    chip_languages: "Multiple languages",
    image_alt: "Global presence of Iqraa",
    stats: {
      cr: { label: "Commercial registration" },
      chamber: { label: "Chamber membership" },
      hq: { label: "Headquarters", value: "Riyadh, Saudi Arabia" }
    }
  },
  contact: {
    eyebrow: "Contact us",
    title_1: "We're here",
    title_2: "to listen",
    intro: "Have a question, suggestion, or partnership idea? Send us a message and we'll get back to you as soon as possible.",
    name: "Name",
    name_ph: "Your full name",
    email: "Email",
    email_ph: "you@example.com",
    subject: "Subject",
    subject_ph: "What would you like to discuss?",
    body: "Message",
    body_ph: "Write your message here...",
    send: "Send message",
    sending: "Sending...",
    back_to_top: "Back to top",
    toast: {
      missing: "Please complete all fields.",
      toolong: "Some fields are too long.",
      sent: "Your email client has been opened to send the message."
    }
  },
  menu: {
    home: "Home",
    home_desc: "Back to the front page",
    features: "Features",
    features_desc: "What Iqraa offers",
    journey: "Journey",
    journey_desc: "The user experience step by step",
    faq: "FAQ",
    faq_desc: "Answers to what matters to you",
    about: "About the company",
    about_desc: "Get to know us better",
    contact: "Contact us",
    contact_desc: "Send us a message",
    terms: "Terms & Conditions",
    privacy: "Privacy Policy"
  }
};
const id = {
  nav: { features: "Fitur", about: "Tentang", download: "Unduh", cta: "Dapatkan Aplikasi" },
  hero: {
    badge: "Tersedia di store",
    title_1: "Baca. Pelajari. Renungkan.",
    title_2: "Berkembang setiap hari.",
    subtitle: "Sahabat para penghafal, pendamping para ahli, dan teman para pembaca… Iqraa.",
    ios: "Unduh untuk iOS",
    android: "Unduh untuk Android",
    loved: "Dipercaya ratusan ribu pengguna"
  },
  footer: { rights: "Hak cipta dilindungi undang-undang." },
  lang: { toggle: "Bahasa" },
  cube: {
    face1: "Guru tersedia kapan saja, siang atau malam",
    face2: "Akses mudah untuk belajar — pria, wanita, dan anak-anak",
    face3: "Alat belajar istimewa di dalam setiap sesi",
    face4: "Pantau pencapaian dan tutup kesenjangan",
    face5: "Komunitas sosial Qur'ani",
    face6: "Uji coba gratis, lalu paket langganan untuk semua"
  },
  features: {
    eyebrow: "Semua yang Anda butuhkan dalam perjalanan bersama Al-Qur'an",
    title_1: "Pengalaman Qur'ani yang lengkap",
    title_2: "dalam genggaman Anda",
    subtitle: "Dari sesi langsung hingga mengikuti setiap ayat… semuanya di satu tempat.",
    live: { title: "Sesi langsung", desc: "Audio dan video, momen demi momen." },
    teachers: { title: "Guru bersertifikat", desc: "Sanad bersambung dan keahlian terpercaya." },
    everyone: { title: "Untuk semua", desc: "Pria • Wanita • Anak-anak." },
    always: { title: "24/7", desc: "Tersedia sepanjang waktu." },
    readings: { title: "Semua qira'at", desc: "Sepuluh qira'at besar dan kecil." },
    schedule: { title: "Jadwal fleksibel", desc: "Pilih waktu yang paling sesuai." },
    plans: { title: "Rencana lengkap", desc: "Jalur belajar yang terstruktur." },
    reports: { title: "Laporan terperinci", desc: "Performa Anda dalam angka." },
    mushaf: { title: "Mushaf interaktif", desc: "Mencatat kesalahan ayat demi ayat." },
    achievements: { title: "Pencapaian", desc: "Lacak setiap langkah Anda." },
    community: { title: "Komunitas Qur'ani", desc: "Teman yang menemani perjalanan." },
    recordings: { title: "Rekaman sesi", desc: "Tinjau ulang setiap sesi nanti." },
    friends: { title: "Tambah teman", desc: "Saling mengikuti dan bersaing." }
  },
  journey: {
    eyebrow: "Perjalanan Anda dengan Iqraa",
    title_1: "Dari pendaftaran pertama",
    title_2: "hingga komunitas yang utuh",
    subtitle: "Pelajari perjalanan pengguna langkah demi langkah di dalam aplikasi.",
    progress: "Tahap",
    of: "dari",
    stages: {
      s1: "Pendaftaran",
      s2: "Beranda",
      s3: "Cari guru",
      s4: "Minta sesi",
      s5: "Sesi belajar",
      s6: "Nilai sesi",
      s7: "Pantau pencapaian",
      s8: "Sesi sebelumnya",
      s9: "Lihat laporan",
      s10: "Mushaf interaktif personal",
      s11: "Papan kehormatan",
      s12: "Tambah teman",
      s13: "Kirim hadiah ke teman"
    },
    captions: {
      c1: "Proses pendaftaran sederhana dan cepat tanpa harus mengungkap data atau informasi yang tidak perlu.",
      c2: "Beranda yang kaya dengan semua yang Anda butuhkan: statistik, saldo menit, sesi yang dijadwalkan, dan jumlah hari belajar tanpa putus, dengan kemampuan meminta sesi cukup satu sentuhan.",
      c3: "Anda dapat menjelajahi profil guru dan memilih yang sesuai. Tenang saja, guru yang ditampilkan sesuai dengan jenis kelamin, qira'at, dan bahasa yang Anda kuasai.",
      c4: "Minta sesi audio saja atau audio dan video bersama guru yang tersedia, berkualifikasi, dan sesuai preferensi Anda. Sesi dimulai dalam hitungan detik.",
      c5: "Selama sesi, Anda dapat memanfaatkan beragam alat belajar, termasuk Mushaf interaktif yang mencatat kesalahan saat ini dan mengingatkan kesalahan sebelumnya.",
      c6: "Anda dapat menilai guru setelah sesi berakhir. Penilaian Anda memengaruhi seberapa sering ia muncul, dan Anda dapat menambahkannya ke favorit agar selalu tampil di depan.",
      c7: "Pantau pencapaian Anda melalui peta interaktif surah-surah Al-Qur'an. Peta ini menandai surah yang belum dikuasai dan menampilkan kemajuan Anda.",
      c8: "Anda dapat membuka kembali sesi sebelumnya dan melihat laporan sesi tertentu, dengan kemampuan memutar ulang dan memanfaatkannya kembali.",
      c9: "Pantau performa keseluruhan melalui laporan terperinci yang mencatat tantangan yang Anda hadapi dan memberi rekomendasi untuk mengatasinya.",
      c10: "Mushaf di Iqraa bukan mushaf biasa, melainkan alat interaktif yang sangat kuat untuk membantu Anda melacak dan memperbaiki kesalahan.",
      c11: "Berada di papan kehormatan berarti Anda adalah pelajar yang istimewa dan tekun… jangan biarkan nama Anda keluar dari daftar ini.",
      c12: "Anda dapat mencari teman, menambahkan mereka, berinteraksi dengan unggahan mereka, dan mengobrol bersama.",
      c13: "Anda dapat berbagi saldo dengan teman dan mengirim hadiah kepada mereka."
    }
  },
  faq: {
    eyebrow: "Pertanyaan Umum",
    title_1: "Semua yang ingin Anda ketahui",
    title_2: "tentang aplikasi Iqraa",
    subtitle: "Jawaban cepat dan jelas untuk pertanyaan yang paling sering diajukan.",
    items: {
      q1: { q: "Apa itu aplikasi Iqraa dan bagaimana cara kerjanya?", a: "Aplikasi Iqraa adalah platform terintegrasi untuk belajar Al-Qur'an Al-Karim melalui sesi langsung berbasis audio dan video bersama guru-guru bersertifikat. Anda dapat memilih waktu yang sesuai, memesan sesi, dan memulai perjalanan belajar dengan mudah dari mana saja." },
      q2: { q: "Apakah saya bisa memilih guru?", a: "Ya, Anda dapat memilih guru sesuai kebutuhan. Aplikasi ini menyediakan opsi yang sesuai untuk pria, wanita, dan anak-anak demi pengalaman yang nyaman dan aman bagi semua." },
      q3: { q: "Apakah aplikasi tersedia kapan saja?", a: "Ya, aplikasi tersedia 24/7. Anda dapat memesan sesi pada waktu yang sesuai dengan jadwal harian Anda." },
      q4: { q: "Apakah saya perlu pengalaman sebelumnya untuk belajar Al-Qur'an melalui aplikasi?", a: "Tidak, aplikasi cocok untuk semua tingkatan, baik pemula maupun yang sudah berpengalaman. Disediakan rencana belajar khusus yang sesuai dengan tingkat dan tujuan Anda." },
      q5: { q: "Bagaimana sesi diatur?", a: "Anda dapat memperoleh sesi instan dengan guru pilihan yang tersedia kapan saja, atau menjadwalkan sesi dengan mudah di dalam aplikasi, memilih waktu yang sesuai, dengan opsi mengubah atau menjadwal ulang bila perlu." },
      q6: { q: "Apakah kemajuan belajar saya dipantau?", a: "Ya, aplikasi menyediakan laporan performa terperinci yang membantu Anda memantau tingkat dan perkembangan, serta melacak pencapaian langkah demi langkah." },
      q7: { q: "Apakah saya bisa menonton ulang sesi?", a: "Ya, sesi direkam dan Anda dapat membukanya kapan saja untuk mengulang materi yang telah dipelajari." },
      q8: { q: "Apakah aplikasi mendukung semua qira'at?", a: "Ya, aplikasi mendukung semua qira'at Al-Qur'an, sehingga Anda dapat belajar sesuai qira'at yang Anda sukai." },
      q9: { q: "Apakah ada Mushaf di dalam aplikasi?", a: "Ya, aplikasi memiliki Mushaf interaktif yang membantu Anda saat belajar, dan membuat mengikuti tilawah lebih mudah dan jelas." },
      q10: { q: "Apakah saya bisa terhubung dengan pengguna lain?", a: "Ya, Anda dapat menambahkan teman dan bergabung dengan komunitas Qur'ani di dalam aplikasi, yang membantu Anda tetap konsisten dan termotivasi." },
      q11: { q: "Apakah aplikasi cocok untuk anak-anak?", a: "Ya, aplikasi cocok untuk anak-anak dan menyediakan lingkungan belajar yang aman dengan guru-guru yang berpengalaman menangani berbagai usia." },
      q12: { q: "Bagaimana cara memulai?", a: "Unduh aplikasinya, buat akun, lalu pesan sesi pertama Anda dengan mudah dan langsung memulai perjalanan dengan Al-Qur'an." }
    }
  },
  about: {
    eyebrow: "Tentang perusahaan",
    title_1: "Iqraa",
    title_2: "Teknologi Informasi",
    p1: "Iqraa Teknologi Informasi adalah perseroan terbatas asal Saudi yang terdaftar di Kerajaan Arab Saudi dengan nomor registrasi komersial (1010562765) dan keanggotaan Kamar Dagang nomor (486697), berkantor pusat di Riyadh, dan berfokus pada inovasi serta pengembangan aplikasi-aplikasi Qur'ani.",
    p2: "Perusahaan memiliki cabang dan agen di sejumlah negara Arab, dan menargetkan kemitraan global yang lebih luas untuk mengembangkan aplikasi, mencakup lebih banyak bahasa hidup, menyediakan guru dari berbagai kewarganegaraan yang berkomunikasi dengan siswa dalam beragam bahasa sesuai kebutuhan, serta memperhatikan perbedaan zona waktu antara Timur dan Barat.",
    chip_global: "Kehadiran global",
    chip_languages: "Banyak bahasa",
    image_alt: "Kehadiran global Iqraa",
    stats: {
      cr: { label: "Registrasi komersial" },
      chamber: { label: "Keanggotaan Kamar Dagang" },
      hq: { label: "Kantor pusat", value: "Riyadh, Arab Saudi" }
    }
  },
  contact: {
    eyebrow: "Hubungi kami",
    title_1: "Kami di sini",
    title_2: "untuk mendengarkan",
    intro: "Punya pertanyaan, saran, atau ide kemitraan? Kirimkan pesan dan kami akan membalas secepat mungkin.",
    name: "Nama",
    name_ph: "Nama lengkap Anda",
    email: "Email",
    email_ph: "anda@contoh.com",
    subject: "Subjek",
    subject_ph: "Apa yang ingin Anda bicarakan?",
    body: "Pesan",
    body_ph: "Tulis pesan Anda di sini...",
    send: "Kirim pesan",
    sending: "Mengirim...",
    back_to_top: "Kembali ke atas",
    toast: {
      missing: "Mohon lengkapi semua kolom.",
      toolong: "Beberapa kolom terlalu panjang.",
      sent: "Klien email Anda telah dibuka untuk mengirim pesan."
    }
  },
  menu: {
    home: "Beranda",
    home_desc: "Kembali ke halaman depan",
    features: "Fitur",
    features_desc: "Apa yang ditawarkan Iqraa",
    journey: "Perjalanan",
    journey_desc: "Pengalaman pengguna langkah demi langkah",
    faq: "Pertanyaan Umum",
    faq_desc: "Jawaban untuk hal yang penting",
    about: "Tentang perusahaan",
    about_desc: "Kenali kami lebih dekat",
    contact: "Hubungi kami",
    contact_desc: "Kirimkan pesan kepada kami",
    terms: "Syarat & Ketentuan",
    privacy: "Kebijakan Privasi"
  }
};
const ur = {
  nav: { features: "خصوصیات", about: "ہمارے بارے میں", download: "ڈاؤن لوڈ", cta: "ایپ حاصل کریں" },
  hero: {
    badge: "اسٹورز پر دستیاب",
    title_1: "پڑھیں، سیکھیں، غور کریں",
    title_2: "ہر دن ترقی کریں",
    subtitle: "حفّاظ کا دوست، ماہرین کا ساتھی، اور قارئین کا انیس… اقراء۔",
    ios: "iOS کے لیے ڈاؤن لوڈ کریں",
    android: "Android کے لیے ڈاؤن لوڈ کریں",
    loved: "لاکھوں قارئین کا بھروسہ"
  },
  footer: { rights: "جملہ حقوق محفوظ ہیں۔" },
  lang: { toggle: "زبان" },
  cube: {
    face1: "ایک استاد جو دن یا رات کسی بھی وقت دستیاب ہے",
    face2: "سیکھنے تک آسان رسائی — مرد، خواتین اور بچوں کے لیے",
    face3: "ہر سیشن کے اندر منفرد تعلیمی اوزار",
    face4: "کامیابیوں کی پیروی کریں اور خلا کو پُر کریں",
    face5: "ایک قرآنی سماجی کمیونٹی",
    face6: "مفت آزمائش، پھر سب کے لیے سبسکرپشن پیکجز"
  },
  features: {
    eyebrow: "قرآن کے ساتھ آپ کے سفر میں ضروری ہر چیز",
    title_1: "ایک مکمل قرآنی تجربہ",
    title_2: "آپ کی مٹھی میں",
    subtitle: "براہِ راست سیشن سے لے کر ہر آیت کی پیروی تک… سب کچھ ایک ہی جگہ۔",
    live: { title: "براہِ راست سیشنز", desc: "آواز اور تصویر، لمحہ بہ لمحہ۔" },
    teachers: { title: "مجاز اساتذہ", desc: "مسلسل اسناد اور نمایاں تجربہ۔" },
    everyone: { title: "سب کے لیے", desc: "مرد • خواتین • بچے۔" },
    always: { title: "۲۴/۷", desc: "چوبیس گھنٹے دستیاب۔" },
    readings: { title: "تمام قراءات", desc: "عشرہ کبریٰ اور صغریٰ۔" },
    schedule: { title: "لچکدار شیڈولنگ", desc: "اپنا موزوں وقت چنیں۔" },
    plans: { title: "مکمل منصوبے", desc: "سوچے سمجھے سیکھنے کے راستے۔" },
    reports: { title: "تفصیلی رپورٹس", desc: "اعداد میں آپ کی کارکردگی۔" },
    mushaf: { title: "تعاملی مصحف", desc: "آیت بہ آیت آپ کی غلطیاں نوٹ کرتا ہے۔" },
    achievements: { title: "کامیابیاں", desc: "ہر قدم کا حساب رکھیں۔" },
    community: { title: "قرآنی کمیونٹی", desc: "وہ دوست جو ساتھ چلیں۔" },
    recordings: { title: "سیشن کی ریکارڈنگ", desc: "بعد میں ہر سیشن دیکھیں۔" },
    friends: { title: "دوست شامل کریں", desc: "ایک دوسرے کی پیروی اور مقابلہ۔" }
  },
  journey: {
    eyebrow: "اقراء کے ساتھ آپ کا سفر",
    title_1: "پہلی رجسٹریشن سے",
    title_2: "ایک مکمل کمیونٹی تک",
    subtitle: "ایپ کے اندر صارف کے سفر کو قدم بہ قدم جانیں۔",
    progress: "مرحلہ",
    of: "از",
    stages: {
      s1: "رجسٹریشن",
      s2: "ہوم",
      s3: "استاد تلاش کریں",
      s4: "سیشن طلب کریں",
      s5: "سیشن",
      s6: "سیشن کی درجہ بندی",
      s7: "کامیابیوں کی پیروی",
      s8: "گزشتہ سیشنز",
      s9: "رپورٹس کا جائزہ",
      s10: "ذاتی تعاملی مصحف",
      s11: "اعزازی بورڈ",
      s12: "دوست شامل کریں",
      s13: "دوستوں کو تحائف بھیجیں"
    },
    captions: {
      c1: "غیر ضروری ڈیٹا یا معلومات کے بغیر سادہ اور تیز رجسٹریشن کا عمل۔",
      c2: "ایک بھرپور ہوم اسکرین جس میں آپ کے درکار سب کچھ ہے: آپ کے اعداد، منٹوں کا بیلنس، شیڈول شدہ سیشنز اور بلا تعطل سیکھنے کے دن، ایک ٹیپ سے سیشن طلب کرنے کی سہولت کے ساتھ۔",
      c3: "آپ اساتذہ کے پروفائلز دیکھ کر اپنی پسند کا انتخاب کر سکتے ہیں۔ مطمئن رہیں، آپ کو دکھائے جانے والے اساتذہ آپ کی جنس، قرات اور آپ کی جانی جانے والی زبانوں کے مطابق ہیں۔",
      c4: "صرف آواز یا آواز و تصویر کے ساتھ ایک دستیاب، اہل اور آپ کی پسند کے مطابق استاد سے سیشن طلب کریں۔ سیشن چند سیکنڈز میں شروع ہو جائے گا۔",
      c5: "سیشن کے دوران آپ سیکھنے کے کئی ٹولز سے فائدہ اٹھا سکتے ہیں، بشمول ایک تعاملی مصحف جو آپ کی موجودہ غلطیاں نوٹ کرتا ہے اور پچھلی غلطیاں یاد دلاتا ہے۔",
      c6: "سیشن ختم ہونے پر آپ استاد کی درجہ بندی کر سکتے ہیں۔ آپ کی درجہ بندی مستقبل میں اس کے ظاہر ہونے کی شرح کو متاثر کرتی ہے، اور آپ اسے پسندیدہ میں شامل کر سکتے ہیں تاکہ ہمیشہ سب سے پہلے ظاہر ہو۔",
      c7: "آپ قرآن کی سورتوں کے تعاملی نقشے کے ذریعے اپنی کامیابیوں کی پیروی کر سکتے ہیں۔ نقشہ ان سورتوں کی نشاندہی کرتا ہے جنہیں آپ نے ابھی مہارت سے نہیں سیکھا اور آپ کی پیشرفت بتاتا ہے۔",
      c8: "آپ اپنے گزشتہ سیشنز پر واپس جا سکتے ہیں اور مخصوص سیشنز کی رپورٹس دیکھ سکتے ہیں، انہیں دوبارہ چلانے اور دوبارہ فائدہ اٹھانے کی سہولت کے ساتھ۔",
      c9: "تفصیلی رپورٹس کے ذریعے اپنی مجموعی کارکردگی پر نظر رکھیں جو قرآن سیکھنے میں آپ کو درپیش چیلنجز کی نشاندہی اور حل کے لیے سفارشات دیتی ہیں۔",
      c10: "اقراء کا مصحف کوئی عام مصحف نہیں بلکہ ایک طاقتور تعاملی آلہ ہے جو آپ کی غلطیوں کا سراغ لگانے اور اصلاح میں مدد کرتا ہے۔",
      c11: "اعزازی بورڈ پر آپ کی موجودگی کا مطلب ہے کہ آپ ایک ممتاز اور سیکھنے کے شوقین طالب علم ہیں… اپنے نام کو اس فہرست سے کبھی نکلنے نہ دیں۔",
      c12: "آپ دوست تلاش کر کے انہیں شامل کر سکتے ہیں، ان کی پوسٹس پر تبصرہ اور ان سے گفتگو کر سکتے ہیں۔",
      c13: "آپ اپنا بیلنس دوستوں کے ساتھ شیئر اور انہیں تحائف بھیج سکتے ہیں۔"
    }
  },
  faq: {
    eyebrow: "عمومی سوالات",
    title_1: "وہ سب کچھ جو آپ جاننا چاہتے ہیں",
    title_2: "اقراء ایپ کے بارے میں",
    subtitle: "اکثر پوچھے جانے والے سوالات کے فوری اور واضح جوابات۔",
    items: {
      q1: { q: "اقراء ایپ کیا ہے اور یہ کیسے کام کرتا ہے؟", a: "اقراء ایپ مجاز اساتذہ کے ساتھ براہِ راست آواز و تصویر کے سیشنز کے ذریعے قرآن کریم سیکھنے کا ایک مکمل پلیٹ فارم ہے۔ آپ اپنے لیے موزوں وقت منتخب کر سکتے ہیں، سیشنز بک کر سکتے ہیں اور کہیں سے بھی آسانی سے سیکھنے کا سفر شروع کر سکتے ہیں۔" },
      q2: { q: "کیا میں استاد منتخب کر سکتا ہوں؟", a: "جی ہاں، آپ اپنی ضرورت کے مطابق استاد منتخب کر سکتے ہیں، نیز ایپ مردوں، خواتین اور بچوں کے لیے موزوں اختیارات فراہم کرتی ہے تاکہ سب کے لیے آرام دہ اور محفوظ تجربہ یقینی بنایا جا سکے۔" },
      q3: { q: "کیا ایپ ہر وقت دستیاب ہے؟", a: "جی ہاں، ایپ چوبیس گھنٹے دستیاب ہے، اور آپ اپنے روزمرہ شیڈول کے مطابق وقت پر سیشنز بک کر سکتے ہیں۔" },
      q4: { q: "کیا ایپ کے ذریعے قرآن سیکھنے کے لیے پچھلا تجربہ ضروری ہے؟", a: "نہیں، ایپ تمام سطحوں کے لیے موزوں ہے، چاہے آپ مبتدی ہوں یا تجربہ کار۔ آپ کی سطح اور اہداف کے مطابق ذاتی تعلیمی منصوبے فراہم کیے جاتے ہیں۔" },
      q5: { q: "سیشنز کا انتظام کیسے ہوتا ہے؟", a: "آپ اپنی پسند کے دستیاب استاد سے کسی بھی وقت فوری سیشن حاصل کر سکتے ہیں، یا ایپ کے اندر آسانی سے سیشنز شیڈول کر کے موزوں اوقات منتخب کر سکتے ہیں، ضرورت پر ترمیم یا دوبارہ شیڈول کرنے کی سہولت کے ساتھ۔" },
      q6: { q: "کیا میری سیکھنے کی پیشرفت پر نظر رکھی جاتی ہے؟", a: "جی ہاں، ایپ تفصیلی کارکردگی رپورٹس فراہم کرتی ہے جو آپ کی سطح اور ترقی پر نظر رکھنے میں مدد دیتی ہیں، اور ہر قدم پر کامیابیوں کا حساب رکھتی ہیں۔" },
      q7: { q: "کیا میں سیشنز دوبارہ دیکھ سکتا ہوں؟", a: "جی ہاں، سیشنز ریکارڈ کیے جاتے ہیں اور آپ ان پر کسی بھی وقت واپس جا کر دہرا سکتے ہیں۔" },
      q8: { q: "کیا ایپ تمام قراءات کی حمایت کرتی ہے؟", a: "جی ہاں، ایپ تمام قرآنی قراءات کی حمایت کرتی ہے، تاکہ آپ اپنی پسندیدہ قرات کے مطابق سیکھ سکیں۔" },
      q9: { q: "کیا ایپ کے اندر مصحف موجود ہے؟", a: "جی ہاں، ایپ میں ایک تعاملی مصحف ہے جو سیکھنے کے دوران آپ کی مدد کرتا ہے اور تلاوت کی پیروی کو آسان اور واضح بناتا ہے۔" },
      q10: { q: "کیا میں دوسرے صارفین سے رابطہ کر سکتا ہوں؟", a: "جی ہاں، آپ دوست شامل کر سکتے ہیں اور ایپ کے اندر قرآنی کمیونٹی میں شامل ہو سکتے ہیں، جو آپ کو مستقل اور حوصلہ مند رکھنے میں مدد کرتی ہے۔" },
      q11: { q: "کیا ایپ بچوں کے لیے موزوں ہے؟", a: "جی ہاں، ایپ بچوں کے لیے موزوں ہے اور مختلف عمروں کے ساتھ تجربہ رکھنے والے اساتذہ کے ساتھ محفوظ تعلیمی ماحول فراہم کرتی ہے۔" },
      q12: { q: "میں شروع کیسے کروں؟", a: "ایپ ڈاؤن لوڈ کریں، اکاؤنٹ بنائیں، پھر آسانی سے اپنا پہلا سیشن بک کریں اور قرآن کے ساتھ اپنے سفر کا فوری آغاز کریں۔" }
    }
  },
  about: {
    eyebrow: "کمپنی کے بارے میں",
    title_1: "اقراء",
    title_2: "انفارمیشن ٹیکنالوجی کمپنی",
    p1: "اقراء انفارمیشن ٹیکنالوجی ایک سعودی محدود ذمہ داری کمپنی ہے جو مملکتِ سعودی عرب میں تجارتی رجسٹریشن نمبر (1010562765) اور چیمبر آف کامرس کی رکنیت نمبر (486697) کے ساتھ رجسٹرڈ ہے، جس کا صدر دفتر ریاض میں ہے، اور قرآنی ایپلی کیشنز کی تخلیق و نفاذ میں مہارت رکھتی ہے۔",
    p2: "کمپنی کے کئی عرب ممالک میں شعبہ جات اور ایجنٹس ہیں، اور یہ دنیا بھر میں مزید شراکت داری قائم کرنے کا ارادہ رکھتی ہے تاکہ ایپ کی توسیع کی جا سکے، زیادہ سے زیادہ زندہ زبانوں کا احاطہ ہو، مختلف قومیتوں کے اساتذہ دستیاب ہوں جو طلباء سے ان کی ضرورت کے مطابق مختلف زبانوں میں رابطہ کریں، اور مشرق و مغرب کے درمیان وقت کے فرق کا خیال رکھا جائے۔",
    chip_global: "عالمی موجودگی",
    chip_languages: "متعدد زبانیں",
    image_alt: "اقراء کی عالمی موجودگی",
    stats: {
      cr: { label: "تجارتی رجسٹریشن" },
      chamber: { label: "چیمبر کی رکنیت" },
      hq: { label: "صدر دفتر", value: "ریاض، سعودی عرب" }
    }
  },
  contact: {
    eyebrow: "ہم سے رابطہ کریں",
    title_1: "ہم یہاں ہیں",
    title_2: "آپ کو سننے کے لیے",
    intro: "کوئی سوال، تجویز یا شراکت داری کا خیال؟ ہمیں پیغام بھیجیں اور ہم جلد از جلد جواب دیں گے۔",
    name: "نام",
    name_ph: "آپ کا پورا نام",
    email: "ای میل",
    email_ph: "you@example.com",
    subject: "موضوع",
    subject_ph: "آپ کس بارے میں بات کرنا چاہتے ہیں؟",
    body: "پیغام",
    body_ph: "اپنا پیغام یہاں لکھیں...",
    send: "پیغام بھیجیں",
    sending: "بھیجا جا رہا ہے...",
    back_to_top: "اوپر واپس جائیں",
    toast: {
      missing: "براہِ کرم تمام خانے مکمل کریں۔",
      toolong: "کچھ خانے بہت طویل ہیں۔",
      sent: "پیغام بھیجنے کے لیے آپ کا ای میل کلائنٹ کھول دیا گیا ہے۔"
    }
  },
  menu: {
    home: "ہوم",
    home_desc: "صفحۂ اول پر واپس",
    features: "خصوصیات",
    features_desc: "اقراء کیا پیش کرتا ہے",
    journey: "سفر",
    journey_desc: "صارف کا تجربہ قدم بہ قدم",
    faq: "عمومی سوالات",
    faq_desc: "آپ کی اہم باتوں کے جوابات",
    about: "کمپنی کے بارے میں",
    about_desc: "ہمیں مزید جانیں",
    contact: "رابطہ کریں",
    contact_desc: "ہمیں پیغام بھیجیں",
    terms: "شرائط و ضوابط",
    privacy: "رازداری کی پالیسی"
  }
};
const resources = {
  ar: { translation: ar },
  en: { translation: en },
  id: { translation: id },
  ur: { translation: ur }
};
if (!i18n.isInitialized) {
  i18n.use(initReactI18next).init({
    resources,
    lng: "ar",
    fallbackLng: "ar",
    interpolation: { escapeValue: false }
  });
}
const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
  DropdownMenuPrimitive.SubTrigger,
  {
    ref,
    className: cn(
      "flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
      inset && "pl-8",
      className
    ),
    ...props,
    children: [
      children,
      /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto" })
    ]
  }
));
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  DropdownMenuPrimitive.SubContent,
  {
    ref,
    className: cn(
      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin)",
      className
    ),
    ...props
  }
));
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
  DropdownMenuPrimitive.Content,
  {
    ref,
    sideOffset,
    className: cn(
      "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
      "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin)",
      className
    ),
    ...props
  }
) }));
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
  DropdownMenuPrimitive.Item,
  {
    ref,
    className: cn(
      "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",
      inset && "pl-8",
      className
    ),
    ...props
  }
));
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
const DropdownMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
  DropdownMenuPrimitive.CheckboxItem,
  {
    ref,
    className: cn(
      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
      className
    ),
    checked,
    ...props,
    children: [
      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
      children
    ]
  }
));
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
const DropdownMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
  DropdownMenuPrimitive.RadioItem,
  {
    ref,
    className: cn(
      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
      className
    ),
    ...props,
    children: [
      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }),
      children
    ]
  }
));
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
  DropdownMenuPrimitive.Label,
  {
    ref,
    className: cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className),
    ...props
  }
));
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  DropdownMenuPrimitive.Separator,
  {
    ref,
    className: cn("-mx-1 my-1 h-px bg-muted", className),
    ...props
  }
));
DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
function LanguageProvider({ children }) {
  const { i18n: i18n2 } = useTranslation();
  useEffect(() => {
    const stored = typeof window !== "undefined" ? localStorage.getItem("iqraa-lang") : null;
    const lang = stored === "en" || stored === "id" || stored === "ur" ? stored : "ar";
    if (i18n2.language !== lang) i18n2.changeLanguage(lang);
  }, [i18n2]);
  useEffect(() => {
    if (typeof document === "undefined") return;
    const dir = i18n2.language === "ar" || i18n2.language === "ur" ? "rtl" : "ltr";
    document.documentElement.setAttribute("dir", dir);
    document.documentElement.setAttribute("lang", i18n2.language);
  }, [i18n2.language]);
  return /* @__PURE__ */ jsx(Fragment, { children });
}
function easeInOut(t) {
  return t < 0.5 ? 2 * t * t : 1 - Math.pow(-2 * t + 2, 2) / 2;
}
function SceneStack({ scenes }) {
  const { starts, extras, revealCost, totalSteps } = useMemo(() => {
    const extras2 = scenes.map((s) => s.extraSteps ?? 0);
    const revealCost2 = scenes.map((_, i) => i === 0 ? 0 : 1);
    const starts2 = [];
    let acc = 0;
    for (let i = 0; i < scenes.length; i++) {
      starts2.push(acc);
      acc += revealCost2[i] + extras2[i];
    }
    return { starts: starts2, extras: extras2, revealCost: revealCost2, totalSteps: acc };
  }, [scenes]);
  const continuousRef = useRef([]);
  continuousRef.current = scenes.map((s) => !!s.continuous);
  const [progress, setProgress] = useState(0);
  useEffect(() => {
    let dominant = 0;
    let bestActive = -1;
    for (let i = 0; i < scenes.length; i++) {
      const revealRaw = revealCost[i] === 0 ? 1 : Math.min(Math.max((progress - starts[i]) / revealCost[i], 0), 1);
      const nextStart = i + 1 < scenes.length ? starts[i + 1] : Infinity;
      const leaveRaw = nextStart === Infinity ? 0 : Math.min(
        Math.max((progress - nextStart) / (revealCost[i + 1] || 1), 0),
        1
      );
      const act = easeInOut(revealRaw) * (1 - easeInOut(leaveRaw));
      if (act > bestActive) {
        bestActive = act;
        dominant = i;
      }
    }
    window.dispatchEvent(
      new CustomEvent("scenestack:active", { detail: { index: dominant } })
    );
  }, [progress, scenes, starts, revealCost]);
  const targetRef = useRef(0);
  const currentRef = useRef(0);
  const rafRef = useRef(0);
  const lockRef = useRef(false);
  const continuousRangeAt = (pos) => {
    for (let i = 0; i < scenes.length; i++) {
      if (!continuousRef.current[i]) continue;
      if (extras[i] <= 0) continue;
      const subStart = starts[i] + revealCost[i];
      const subEnd = subStart + extras[i];
      if (pos > subStart && pos < subEnd) {
        return { from: subStart, to: subEnd };
      }
    }
    return null;
  };
  const setProgressDirect = (next) => {
    const v = Math.max(0, Math.min(totalSteps, next));
    cancelAnimationFrame(rafRef.current);
    lockRef.current = false;
    currentRef.current = v;
    targetRef.current = Math.round(v);
    setProgress(v);
  };
  const animateTo = (next) => {
    targetRef.current = Math.max(0, Math.min(totalSteps, next));
    cancelAnimationFrame(rafRef.current);
    const start = currentRef.current;
    const end = targetRef.current;
    const distance = Math.abs(end - start);
    if (distance < 1e-3) return;
    const duration = Math.min(900, 380 + distance * 180);
    const t0 = performance.now();
    const ease = (t) => t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
    const tick = (now) => {
      const t = Math.min(1, (now - t0) / duration);
      const v = start + (end - start) * ease(t);
      currentRef.current = v;
      setProgress(v);
      if (t < 1) {
        rafRef.current = requestAnimationFrame(tick);
      } else {
        lockRef.current = false;
      }
    };
    lockRef.current = true;
    rafRef.current = requestAnimationFrame(tick);
  };
  const advance = (dir) => {
    if (lockRef.current) return false;
    const cur = Math.round(currentRef.current);
    const next = cur + dir;
    if (next < 0 || next > totalSteps) return false;
    animateTo(next);
    return true;
  };
  useEffect(() => {
    const onJump = (e) => {
      const detail = e.detail;
      if (!detail) return;
      const idx = Math.max(0, Math.min(scenes.length - 1, detail.index));
      const target = starts[idx] + revealCost[idx];
      if (typeof target === "number") animateTo(target);
    };
    window.addEventListener("scenestack:jump", onJump);
    let wheelAccum = 0;
    let wheelResetTimer;
    const onWheel = (e) => {
      const dy = e.deltaY;
      if (Math.abs(dy) < 1) return;
      const range = continuousRangeAt(currentRef.current);
      if (range) {
        const PX_PER_STEP = 320;
        const delta = dy / PX_PER_STEP;
        const next = currentRef.current + delta;
        if (next > range.from && next < range.to) {
          setProgressDirect(next);
          e.preventDefault();
          return;
        }
        setProgressDirect(next <= range.from ? range.from : range.to);
      }
      if (lockRef.current) {
        e.preventDefault();
        return;
      }
      wheelAccum += dy;
      if (wheelResetTimer) window.clearTimeout(wheelResetTimer);
      wheelResetTimer = window.setTimeout(() => {
        wheelAccum = 0;
      }, 180);
      const threshold = 24;
      if (Math.abs(wheelAccum) >= threshold) {
        const dir = wheelAccum > 0 ? 1 : -1;
        const moved = advance(dir);
        if (moved) {
          e.preventDefault();
          wheelAccum = 0;
        }
      } else {
        e.preventDefault();
      }
    };
    let touchStartY = 0;
    let touchLastY = 0;
    let touchActive = false;
    let touchContinuous = false;
    const onTouchStart = (e) => {
      if (e.touches.length !== 1) return;
      touchStartY = e.touches[0].clientY;
      touchLastY = touchStartY;
      touchActive = true;
      touchContinuous = !!continuousRangeAt(currentRef.current);
    };
    const onTouchMove = (e) => {
      if (!touchActive) return;
      if (touchContinuous) {
        const range = continuousRangeAt(currentRef.current);
        if (range) {
          const y = e.touches[0].clientY;
          const dyFrame = touchLastY - y;
          touchLastY = y;
          const PX_PER_STEP_TOUCH = 140;
          const next = currentRef.current + dyFrame / PX_PER_STEP_TOUCH;
          if (next > range.from && next < range.to) {
            setProgressDirect(next);
            e.preventDefault();
            return;
          }
          setProgressDirect(next <= range.from ? range.from : range.to);
          touchContinuous = false;
          touchStartY = y;
          e.preventDefault();
          return;
        }
        touchContinuous = false;
      }
      const dy = touchStartY - e.touches[0].clientY;
      if (lockRef.current) {
        e.preventDefault();
        return;
      }
      if (Math.abs(dy) > 40) {
        const dir = dy > 0 ? 1 : -1;
        const moved = advance(dir);
        if (moved) {
          e.preventDefault();
          touchActive = false;
        }
      } else {
        e.preventDefault();
      }
    };
    const onTouchEnd = () => {
      touchActive = false;
    };
    const onKey = (e) => {
      if (e.key === "ArrowDown" || e.key === "PageDown" || e.key === " " || e.key === "ArrowRight") {
        if (advance(1)) e.preventDefault();
      } else if (e.key === "ArrowUp" || e.key === "PageUp" || e.key === "ArrowLeft") {
        if (advance(-1)) e.preventDefault();
      }
    };
    window.addEventListener("wheel", onWheel, { passive: false });
    window.addEventListener("touchstart", onTouchStart, { passive: true });
    window.addEventListener("touchmove", onTouchMove, { passive: false });
    window.addEventListener("touchend", onTouchEnd, { passive: true });
    window.addEventListener("keydown", onKey);
    return () => {
      cancelAnimationFrame(rafRef.current);
      if (wheelResetTimer) window.clearTimeout(wheelResetTimer);
      window.removeEventListener("wheel", onWheel);
      window.removeEventListener("touchstart", onTouchStart);
      window.removeEventListener("touchmove", onTouchMove);
      window.removeEventListener("touchend", onTouchEnd);
      window.removeEventListener("keydown", onKey);
      window.removeEventListener("scenestack:jump", onJump);
    };
  }, [totalSteps, starts, revealCost, scenes.length]);
  return /* @__PURE__ */ jsx("div", { className: "relative h-[100svh] w-full md:h-screen", children: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 h-[100svh] w-full overflow-hidden md:h-screen", children: scenes.map((scene, i) => {
    const revealRaw = revealCost[i] === 0 ? 1 : Math.min(
      Math.max((progress - starts[i]) / revealCost[i], 0),
      1
    );
    const nextStart = i + 1 < scenes.length ? starts[i + 1] : Infinity;
    const leaveRaw = nextStart === Infinity ? 0 : Math.min(
      Math.max(
        (progress - nextStart) / (revealCost[i + 1] || 1),
        0
      ),
      1
    );
    const reveal = easeInOut(revealRaw);
    const leave = easeInOut(leaveRaw);
    const active = reveal * (1 - leave);
    const subStart = starts[i] + revealCost[i];
    const sub = extras[i] > 0 ? Math.min(
      Math.max((progress - subStart) / extras[i], 0),
      1
    ) : 0;
    const translateY = (1 - reveal) * 100;
    const isFirst = i === 0;
    const isLast = i === scenes.length - 1;
    return /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": active < 0.05,
        className: "absolute inset-0 will-change-transform",
        style: {
          zIndex: i + 1,
          background: scene.background,
          transform: `translate3d(0, ${translateY}vh, 0)`,
          opacity: 1,
          transformOrigin: "center center",
          transition: "none",
          visibility: active < 1e-3 && reveal < 1e-3 ? "hidden" : "visible"
        },
        children: /* @__PURE__ */ jsx("div", { className: "h-full w-full", children: scene.render({
          active,
          leave,
          index: i,
          isFirst,
          isLast,
          subProgress: sub
        }) })
      },
      scene.id
    );
  }) }) });
}
function parallaxY(active, depth, amount = 60) {
  return (1 - active) * amount * (1 - depth);
}
const s1 = "/assets/01-signin-Cg2psY1q.png";
const heroScreen = "/assets/02-home-D6Bg5yrw.png";
const s3 = "/assets/03-teachers-BwnGg0Qb.png";
const s4 = "/assets/04-session-loading-B_wdXmxP.png";
const s5 = "/assets/05-session-DUlohUaZ.png";
const s6 = "/assets/06-rate-BIGXboR1.png";
const s7 = "/assets/07-achievements-DgW5sHdy.png";
const s8 = "/assets/08-session-details-D2Z87iGz.png";
const s9 = "/assets/09-mistakes-BQIHXEJK.png";
const s10 = "/assets/10-mushaf-Btfr_eX-.png";
const s11 = "/assets/11-wall-of-fame-D1m2lL2P.png";
const s12 = "/assets/12-friends-DwVgyhtD.png";
const s13 = "/assets/13-gift-COi4ARiO.png";
const SCREENS = [
  s1,
  heroScreen,
  s3,
  s4,
  s5,
  s6,
  s7,
  s8,
  s9,
  s10,
  s11,
  s12,
  s13
];
const STAGE_KEYS = [
  "s1",
  "s2",
  "s3",
  "s4",
  "s5",
  "s6",
  "s7",
  "s8",
  "s9",
  "s10",
  "s11",
  "s12",
  "s13"
];
const CAPTION_KEYS = [
  "c1",
  "c2",
  "c3",
  "c4",
  "c5",
  "c6",
  "c7",
  "c8",
  "c9",
  "c10",
  "c11",
  "c12",
  "c13"
];
function JourneyScene({
  active,
  subProgress
}) {
  const { t } = useTranslation();
  const total = SCREENS.length;
  const p = Math.max(0, Math.min(1, subProgress));
  const stepFloat = p * (total - 1);
  const step = Math.round(stepFloat);
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden bg-background text-foreground", children: [
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: { background: "var(--gradient-soft)" }
      }
    ),
    /* @__PURE__ */ jsxs(
      "div",
      {
        className: "container relative mx-auto h-full px-4 sm:px-6 pt-4 md:pt-12 pb-[calc(env(safe-area-inset-bottom)+0.5rem)] md:py-8 lg:py-10 flex flex-col overflow-hidden",
        style: {
          opacity: 0.4 + 0.6 * active,
          paddingBottom: "calc(env(safe-area-inset-bottom) + 0.5rem)"
        },
        children: [
          /* @__PURE__ */ jsxs("div", { className: "shrink-0 max-w-3xl", children: [
            /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary/20 bg-primary/5 px-3 py-1 text-[11px] sm:text-xs font-medium text-primary", children: [
              /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-primary animate-pulse" }),
              t("journey.eyebrow")
            ] }),
            /* @__PURE__ */ jsxs("h2", { className: "hidden md:block mt-2 sm:mt-3 text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight text-primary leading-[1.05]", children: [
              t("journey.title_1"),
              /* @__PURE__ */ jsx("br", {}),
              /* @__PURE__ */ jsx("span", { className: "italic font-light text-primary/70", children: t("journey.title_2") })
            ] })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "mt-2 md:mt-6 flex-1 min-h-0 flex flex-col md:grid md:grid-cols-12 md:gap-6 lg:gap-8 md:items-stretch", children: [
            /* @__PURE__ */ jsx("aside", { className: "hidden md:flex md:col-span-4 lg:col-span-3 flex-col min-h-0", children: /* @__PURE__ */ jsx(StagesList, { step }) }),
            /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0 md:col-span-4 lg:col-span-5 flex items-center justify-center order-1 md:order-none max-h-[70svh] md:max-h-none", children: /* @__PURE__ */ jsx(PhoneFrame, { screens: SCREENS, step }) }),
            /* @__PURE__ */ jsx("div", { className: "shrink-0 mt-3 md:mt-0 md:col-span-4 lg:col-span-4 flex flex-col justify-center md:min-h-0 order-2 md:order-none", children: /* @__PURE__ */ jsx(CaptionPanel, { step, t, total }) })
          ] }),
          /* @__PURE__ */ jsx("div", { className: "md:hidden mt-2 shrink-0", children: /* @__PURE__ */ jsx(MobileProgress, { step, total, t }) })
        ]
      }
    )
  ] });
}
function StagesList({ step }) {
  const { t } = useTranslation();
  const total = STAGE_KEYS.length;
  const fill = total === 1 ? 1 : step / (total - 1);
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full flex", children: [
    /* @__PURE__ */ jsx("div", { className: "relative w-1.5 ms-auto h-full rounded-full bg-primary/10 overflow-hidden", children: /* @__PURE__ */ jsx(
      "div",
      {
        className: "absolute top-0 left-0 right-0 rounded-full bg-gradient-to-b from-primary to-primary/70 transition-all duration-500 ease-out",
        style: { height: `${fill * 100}%` }
      }
    ) }),
    /* @__PURE__ */ jsx("ol", { className: "flex-1 flex flex-col justify-between py-1 pe-3 me-2 overflow-hidden", children: STAGE_KEYS.map((k, i) => {
      const done = i < step;
      const current = i === step;
      return /* @__PURE__ */ jsxs(
        "li",
        {
          className: "flex items-center gap-2 text-[11px] lg:text-xs",
          style: {
            opacity: current ? 1 : done ? 0.85 : 0.4,
            transform: current ? "translateX(0)" : "translateX(-2px)",
            transition: "opacity .4s ease, transform .4s ease"
          },
          children: [
            /* @__PURE__ */ jsx(
              "span",
              {
                className: `flex h-3 w-3 lg:h-3.5 lg:w-3.5 shrink-0 items-center justify-center rounded-full border transition-colors ${current ? "bg-primary text-primary-foreground border-primary" : done ? "bg-primary/15 text-primary border-primary/30" : "bg-background text-muted-foreground border-primary/15"}`,
                "aria-hidden": true
              }
            ),
            /* @__PURE__ */ jsx(
              "span",
              {
                className: `truncate ${current ? "font-bold text-primary" : "text-foreground/80"}`,
                children: t(`journey.stages.${k}`)
              }
            )
          ]
        },
        k
      );
    }) })
  ] });
}
function PhoneFrame({
  screens,
  step
}) {
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: "relative shrink-0",
      style: {
        // Drive size by HEIGHT (fills available flex space) and derive width
        // from the 9:19.5 aspect ratio so the phone always looks like a phone.
        // maxHeight keeps it from overflowing the section on tall screens;
        // maxWidth keeps it from getting wider than the viewport.
        height: "100%",
        aspectRatio: "897 / 1920",
        maxHeight: "100%",
        maxWidth: "min(88vw, 460px)"
      },
      children: [
        /* @__PURE__ */ jsx(
          "div",
          {
            "aria-hidden": true,
            className: "absolute -inset-8 rounded-[60px] blur-3xl opacity-40 pointer-events-none",
            style: { background: "var(--gradient-hero)" }
          }
        ),
        /* @__PURE__ */ jsx(
          "div",
          {
            className: "relative h-full w-full rounded-[40px] p-[8px] shadow-[0_30px_80px_-20px_rgba(18,55,42,0.45)]",
            style: {
              background: "linear-gradient(145deg, #1a4733 0%, #0d2a1f 50%, #1a4733 100%)"
            },
            children: /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden rounded-[34px] bg-black", children: [
              /* @__PURE__ */ jsx("div", { className: "absolute left-1/2 top-2 z-20 h-4 w-20 -translate-x-1/2 rounded-full bg-black" }),
              screens.map((src, i) => {
                const isActive = i === step;
                return /* @__PURE__ */ jsx(
                  "img",
                  {
                    src,
                    alt: "",
                    draggable: false,
                    loading: i === 0 ? "eager" : "lazy",
                    className: "absolute inset-0 h-full w-full object-cover transition-all duration-700 ease-out",
                    style: {
                      opacity: isActive ? 1 : 0,
                      transform: isActive ? "translateY(0) scale(1)" : i < step ? "translateY(-12px) scale(0.98)" : "translateY(12px) scale(0.98)"
                    }
                  },
                  i
                );
              }),
              /* @__PURE__ */ jsx(
                "div",
                {
                  "aria-hidden": true,
                  className: "pointer-events-none absolute inset-0",
                  style: {
                    background: "linear-gradient(135deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 100%)"
                  }
                }
              )
            ] })
          }
        )
      ]
    }
  );
}
function CaptionPanel({
  step,
  total,
  t
}) {
  const stageKey = STAGE_KEYS[step];
  const captionKey = CAPTION_KEYS[step];
  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
    /* @__PURE__ */ jsx(
      "h3",
      {
        dir: "auto",
        className: "text-xl sm:text-2xl lg:text-3xl font-bold text-primary leading-snug animate-fade-in",
        children: t(`journey.stages.${stageKey}`)
      },
      `title-${step}`
    ),
    /* @__PURE__ */ jsx(
      "p",
      {
        dir: "auto",
        className: "mt-3 text-sm sm:text-base lg:text-lg text-foreground/80 leading-relaxed animate-fade-in",
        children: t(`journey.captions.${captionKey}`)
      },
      `cap-${step}`
    )
  ] });
}
function MobileProgress({
  step,
  total,
  t
}) {
  const fill = total === 1 ? 1 : step / (total - 1);
  return /* @__PURE__ */ jsxs("div", { children: [
    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-[11px] text-muted-foreground mb-1.5", children: [
      /* @__PURE__ */ jsx("span", { children: t(`journey.stages.${STAGE_KEYS[step]}`) }),
      /* @__PURE__ */ jsx("span", {})
    ] }),
    /* @__PURE__ */ jsx("div", { className: "h-1.5 w-full rounded-full bg-primary/10 overflow-hidden", children: /* @__PURE__ */ jsx(
      "div",
      {
        className: "h-full rounded-full bg-gradient-to-r from-primary to-primary/70 transition-all duration-500 ease-out",
        style: { width: `${fill * 100}%` }
      }
    ) })
  ] });
}
const pattern = "/assets/iqraa-pattern-C73ndlaH.png";
const FAQ_ITEMS = [
  { key: "q1", icon: Sparkles },
  { key: "q2", icon: UserCheck },
  { key: "q3", icon: Clock3 },
  { key: "q4", icon: GraduationCap },
  { key: "q5", icon: CalendarClock },
  { key: "q6", icon: LineChart },
  { key: "q7", icon: Video }
];
function FaqScene({ active }) {
  const { t } = useTranslation();
  const [openKey, setOpenKey] = useState("q1");
  const featured = FAQ_ITEMS.find((it) => it.key === openKey) ?? FAQ_ITEMS[0];
  const others = FAQ_ITEMS.filter((it) => it.key !== featured.key);
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden bg-primary text-primary-foreground", children: [
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(60% 55% at 85% 10%, color-mix(in oklab, var(--primary-glow) 70%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.9, 50)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(50% 45% at 10% 90%, color-mix(in oklab, var(--secondary) 40%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.8, 70)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 opacity-[0.05] pointer-events-none",
        style: {
          backgroundImage: `url(${pattern})`,
          backgroundSize: "120px",
          backgroundRepeat: "repeat",
          transform: `translate3d(0, ${parallaxY(active, 0.95, 40)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsxs("div", { className: "container relative mx-auto px-5 sm:px-6 h-full flex flex-col pt-16 pb-6 md:py-8 lg:py-10 overflow-y-auto no-scrollbar", children: [
      /* @__PURE__ */ jsxs(
        "div",
        {
          className: "max-w-3xl shrink-0",
          style: {
            transform: `translate3d(0, ${parallaxY(active, 0.3, 40)}px, 0)`
          },
          children: [
            /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary-foreground/25 bg-primary-foreground/5 px-3 py-1 text-[11px] sm:text-xs font-medium text-primary-foreground/85", children: [
              /* @__PURE__ */ jsx(HelpCircle, { className: "h-3.5 w-3.5" }),
              t("faq.eyebrow")
            ] }),
            /* @__PURE__ */ jsxs("h2", { className: "hidden md:block mt-3 sm:mt-4 text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight leading-[1.05]", children: [
              t("faq.title_1"),
              /* @__PURE__ */ jsx("br", {}),
              /* @__PURE__ */ jsx("span", { className: "italic font-light text-secondary", children: t("faq.title_2") })
            ] }),
            /* @__PURE__ */ jsx("p", { className: "mt-2 sm:mt-3 text-xs sm:text-sm md:text-base text-primary-foreground/75 max-w-xl", children: t("faq.subtitle") })
          ]
        }
      ),
      /* @__PURE__ */ jsx(
        "div",
        {
          className: "mt-4 md:hidden grid grid-cols-1 gap-2.5 items-start",
          style: {
            transform: `translate3d(0, ${parallaxY(active, 0.1, 50)}px, 0)`
          },
          children: FAQ_ITEMS.slice(0, 6).map((item) => {
            const Icon = item.icon;
            const isOpen = openKey === item.key;
            return /* @__PURE__ */ jsx(
              "button",
              {
                type: "button",
                onClick: () => setOpenKey(isOpen ? null : item.key),
                className: `group text-start relative overflow-hidden rounded-2xl border backdrop-blur-sm transition-all duration-300 hover:border-primary-foreground/30 ${isOpen ? "border-secondary/60 bg-primary-foreground/[0.10]" : "border-primary-foreground/15 bg-primary-foreground/[0.06]"}`,
                "aria-expanded": isOpen,
                children: /* @__PURE__ */ jsx("div", { className: "relative p-3.5 md:p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
                  /* @__PURE__ */ jsx(
                    "span",
                    {
                      className: `shrink-0 inline-flex h-10 w-10 md:h-11 md:w-11 items-center justify-center rounded-xl border transition-all ${isOpen ? "bg-secondary text-primary border-secondary scale-105" : "bg-primary-foreground/10 text-primary-foreground border-primary-foreground/20"}`,
                      children: /* @__PURE__ */ jsx(Icon, { className: "h-5 w-5", strokeWidth: 1.75 })
                    }
                  ),
                  /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
                    /* @__PURE__ */ jsx("p", { className: "text-sm md:text-[15px] font-semibold leading-snug pe-2", children: t(`faq.items.${item.key}.q`) }),
                    /* @__PURE__ */ jsx(
                      "div",
                      {
                        className: "overflow-hidden transition-all duration-500 ease-out",
                        style: {
                          maxHeight: isOpen ? "400px" : "0px",
                          opacity: isOpen ? 1 : 0,
                          marginTop: isOpen ? "0.5rem" : "0"
                        },
                        children: /* @__PURE__ */ jsx("p", { className: "text-xs md:text-sm text-primary-foreground/75 leading-relaxed", children: t(`faq.items.${item.key}.a`) })
                      }
                    )
                  ] }),
                  /* @__PURE__ */ jsx(
                    "span",
                    {
                      className: `shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-full border transition-all duration-300 ${isOpen ? "bg-secondary text-primary border-secondary rotate-45" : "bg-primary-foreground/10 text-primary-foreground border-primary-foreground/20"}`,
                      "aria-hidden": true,
                      children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" })
                    }
                  )
                ] }) })
              },
              item.key
            );
          })
        }
      ),
      /* @__PURE__ */ jsxs(
        "div",
        {
          className: "mt-4 md:mt-6 lg:mt-7 hidden md:flex flex-col gap-3",
          style: {
            transform: `translate3d(0, ${parallaxY(active, 0.1, 50)}px, 0)`
          },
          children: [
            (() => {
              const Icon = featured.icon;
              return /* @__PURE__ */ jsxs(
                "div",
                {
                  className: "relative overflow-hidden rounded-2xl border border-secondary/60 bg-primary-foreground/[0.10] backdrop-blur-sm transition-all duration-500",
                  children: [
                    /* @__PURE__ */ jsx(
                      "div",
                      {
                        "aria-hidden": true,
                        className: "absolute inset-0 pointer-events-none opacity-60",
                        style: {
                          background: "radial-gradient(60% 100% at 50% 0%, color-mix(in oklab, var(--secondary) 25%, transparent), transparent 70%)"
                        }
                      }
                    ),
                    /* @__PURE__ */ jsx("div", { className: "relative p-5 lg:p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4", children: [
                      /* @__PURE__ */ jsx("span", { className: "shrink-0 inline-flex h-12 w-12 items-center justify-center rounded-xl border bg-secondary text-primary border-secondary", children: /* @__PURE__ */ jsx(Icon, { className: "h-6 w-6", strokeWidth: 1.75 }) }),
                      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
                        /* @__PURE__ */ jsx("p", { className: "text-base lg:text-lg font-semibold leading-snug", children: t(`faq.items.${featured.key}.q`) }),
                        /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm lg:text-[15px] text-primary-foreground/80 leading-relaxed", children: t(`faq.items.${featured.key}.a`) })
                      ] }),
                      /* @__PURE__ */ jsx(
                        "span",
                        {
                          className: "shrink-0 inline-flex h-8 w-8 items-center justify-center rounded-full border bg-secondary text-primary border-secondary rotate-45",
                          "aria-hidden": true,
                          children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" })
                        }
                      )
                    ] }) })
                  ]
                },
                featured.key
              );
            })(),
            /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-3", children: others.map((item) => {
              const Icon = item.icon;
              return /* @__PURE__ */ jsx(
                "button",
                {
                  type: "button",
                  onClick: () => setOpenKey(item.key),
                  className: "group text-start relative overflow-hidden rounded-2xl border border-primary-foreground/15 bg-primary-foreground/[0.06] backdrop-blur-sm transition-all duration-300 hover:border-primary-foreground/30 hover:bg-primary-foreground/[0.09]",
                  children: /* @__PURE__ */ jsx("div", { className: "relative p-3.5 lg:p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
                    /* @__PURE__ */ jsx("span", { className: "shrink-0 inline-flex h-10 w-10 items-center justify-center rounded-xl border bg-primary-foreground/10 text-primary-foreground border-primary-foreground/20 transition-all group-hover:bg-primary-foreground/15", children: /* @__PURE__ */ jsx(Icon, { className: "h-5 w-5", strokeWidth: 1.75 }) }),
                    /* @__PURE__ */ jsx("p", { className: "flex-1 min-w-0 text-sm lg:text-[15px] font-semibold leading-snug pe-2", children: t(`faq.items.${item.key}.q`) }),
                    /* @__PURE__ */ jsx(
                      "span",
                      {
                        className: "shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-full border bg-primary-foreground/10 text-primary-foreground border-primary-foreground/20 transition-all group-hover:bg-primary-foreground/15",
                        "aria-hidden": true,
                        children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" })
                      }
                    )
                  ] }) })
                },
                item.key
              );
            }) })
          ]
        }
      )
    ] })
  ] });
}
function AboutScene({ active }) {
  const { t } = useTranslation();
  const stats = [
    { icon: BadgeCheck, label: t("about.stats.cr.label"), value: "1010562765" },
    { icon: Building2, label: t("about.stats.chamber.label"), value: "486697" },
    { icon: MapPin, label: t("about.stats.hq.label"), value: t("about.stats.hq.value") }
  ];
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden bg-background text-foreground", children: [
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: { background: "var(--gradient-soft)" }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(55% 50% at 90% 5%, color-mix(in oklab, var(--secondary) 35%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.85, 60)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(45% 40% at 5% 95%, color-mix(in oklab, var(--primary-glow) 30%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.8, 70)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx("div", { className: "container relative mx-auto px-5 sm:px-6 h-full flex flex-col justify-start md:justify-center pt-16 pb-6 md:py-8 lg:py-10 overflow-y-auto no-scrollbar", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto w-full max-w-4xl", children: [
      /* @__PURE__ */ jsxs(
        "div",
        {
          className: "text-center",
          style: { transform: `translate3d(0, ${parallaxY(active, 0.3, 40)}px, 0)` },
          children: [
            /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary/20 bg-primary/5 px-3 py-1 text-[11px] sm:text-xs font-medium text-primary", children: [
              /* @__PURE__ */ jsx(Building2, { className: "h-3.5 w-3.5" }),
              t("about.eyebrow")
            ] }),
            /* @__PURE__ */ jsxs("h2", { className: "hidden md:block mt-3 sm:mt-4 text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight text-primary leading-[1.05]", children: [
              t("about.title_1"),
              " ",
              /* @__PURE__ */ jsx("span", { className: "italic font-light text-primary/70", children: t("about.title_2") })
            ] })
          ]
        }
      ),
      /* @__PURE__ */ jsxs(
        "div",
        {
          className: "mt-5 sm:mt-8 md:mt-10",
          style: { transform: `translate3d(0, ${parallaxY(active, 0.1, 50)}px, 0)` },
          children: [
            /* @__PURE__ */ jsx("p", { className: "text-sm sm:text-base md:text-lg text-foreground/85 leading-relaxed text-center", children: t("about.p1") }),
            /* @__PURE__ */ jsx("p", { className: "mt-3 sm:mt-4 text-sm sm:text-base md:text-lg text-foreground/85 leading-relaxed text-center", children: t("about.p2") }),
            /* @__PURE__ */ jsx("div", { className: "mt-5 sm:mt-8 md:mt-10 grid grid-cols-3 gap-2.5 sm:gap-3", children: stats.map((s, i) => {
              const Icon = s.icon;
              return /* @__PURE__ */ jsxs(
                "div",
                {
                  className: "rounded-2xl border border-primary/15 bg-background/70 backdrop-blur-sm p-3 sm:p-5 hover:border-primary/30 transition-colors text-center",
                  children: [
                    /* @__PURE__ */ jsx("span", { className: "inline-flex h-9 w-9 sm:h-10 sm:w-10 items-center justify-center rounded-xl bg-primary/10 text-primary border border-primary/15 mx-auto", children: /* @__PURE__ */ jsx(Icon, { className: "h-4.5 w-4.5 sm:h-5 sm:w-5", strokeWidth: 1.75 }) }),
                    /* @__PURE__ */ jsx("p", { className: "mt-2 sm:mt-2.5 text-[10px] sm:text-[11px] uppercase tracking-wide text-muted-foreground leading-tight", children: s.label }),
                    /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs sm:text-base font-semibold text-primary truncate", children: s.value })
                  ]
                },
                i
              );
            }) })
          ]
        }
      )
    ] }) })
  ] });
}
const Input = React.forwardRef(
  ({ className, type, ...props }, ref) => {
    return /* @__PURE__ */ jsx(
      "input",
      {
        type,
        className: cn(
          "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
          className
        ),
        ref,
        ...props
      }
    );
  }
);
Input.displayName = "Input";
const Textarea = React.forwardRef(
  ({ className, ...props }, ref) => {
    return /* @__PURE__ */ jsx(
      "textarea",
      {
        className: cn(
          "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
          className
        ),
        ref,
        ...props
      }
    );
  }
);
Textarea.displayName = "Textarea";
const labelVariants = cva(
  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
);
const Label = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props }));
Label.displayName = LabelPrimitive.Root.displayName;
function ContactScene({ active }) {
  const { t } = useTranslation();
  const [name, setName] = useState("");
  const [email, setEmail] = useState("");
  const [subject, setSubject] = useState("");
  const [body, setBody] = useState("");
  const [sending, setSending] = useState(false);
  function handleSubmit(e) {
    e.preventDefault();
    if (!name.trim() || !email.trim() || !subject.trim() || !body.trim()) {
      toast.error(t("contact.toast.missing"));
      return;
    }
    if (name.length > 100 || email.length > 255 || subject.length > 150 || body.length > 1500) {
      toast.error(t("contact.toast.toolong"));
      return;
    }
    setSending(true);
    const to = "info@iqraa.app";
    const mailto = `mailto:${to}?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(`${body}

— ${name} <${email}>`)}`;
    window.location.href = mailto;
    setTimeout(() => {
      setSending(false);
      toast.success(t("contact.toast.sent"));
    }, 600);
  }
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden bg-primary text-primary-foreground", children: [
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(55% 50% at 12% 10%, color-mix(in oklab, var(--primary-glow) 65%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.9, 50)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 pointer-events-none",
        style: {
          background: "radial-gradient(45% 40% at 95% 95%, color-mix(in oklab, var(--secondary) 35%, transparent), transparent 70%)",
          transform: `translate3d(0, ${parallaxY(active, 0.8, 70)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(
      "div",
      {
        "aria-hidden": true,
        className: "absolute inset-0 opacity-[0.05] pointer-events-none",
        style: {
          backgroundImage: `url(${pattern})`,
          backgroundSize: "180px",
          backgroundRepeat: "repeat",
          transform: `translate3d(0, ${parallaxY(active, 0.95, 40)}px, 0)`
        }
      }
    ),
    /* @__PURE__ */ jsx(FloatingIcons, { active }),
    /* @__PURE__ */ jsxs("div", { className: "container relative mx-auto px-5 sm:px-6 h-full flex flex-col justify-start md:justify-center pt-14 pb-32 md:pb-8 md:py-8 lg:py-10 overflow-y-auto no-scrollbar", children: [
      /* @__PURE__ */ jsxs("div", { className: "mx-auto w-full max-w-5xl grid lg:grid-cols-2 gap-6 md:gap-10 items-center", children: [
        /* @__PURE__ */ jsxs(
          "div",
          {
            className: "hidden lg:flex flex-col items-start",
            style: { transform: `translate3d(0, ${parallaxY(active, 0.25, 50)}px, 0)` },
            children: [
              /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary-foreground/25 bg-primary-foreground/5 px-3 py-1 text-xs font-medium text-primary-foreground/85", children: [
                /* @__PURE__ */ jsx(Mail, { className: "h-3.5 w-3.5" }),
                t("contact.eyebrow")
              ] }),
              /* @__PURE__ */ jsxs("h2", { className: "mt-4 text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight leading-[1.05]", children: [
                t("contact.title_1"),
                " ",
                /* @__PURE__ */ jsx("span", { className: "italic font-light text-secondary", children: t("contact.title_2") })
              ] }),
              /* @__PURE__ */ jsx("p", { className: "mt-4 text-base md:text-lg text-primary-foreground/75 leading-relaxed max-w-md", children: t("contact.intro") })
            ]
          }
        ),
        /* @__PURE__ */ jsxs("div", { className: "lg:hidden text-center", children: [
          /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary-foreground/25 bg-primary-foreground/5 px-3 py-1 text-[11px] font-medium text-primary-foreground/85", children: [
            /* @__PURE__ */ jsx(Mail, { className: "h-3.5 w-3.5" }),
            t("contact.eyebrow")
          ] }),
          /* @__PURE__ */ jsxs("h2", { className: "hidden md:block mt-3 text-2xl sm:text-3xl font-bold tracking-tight leading-[1.05]", children: [
            t("contact.title_1"),
            " ",
            /* @__PURE__ */ jsx("span", { className: "italic font-light text-secondary", children: t("contact.title_2") })
          ] }),
          /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-primary-foreground/75 leading-relaxed", children: t("contact.intro") })
        ] }),
        /* @__PURE__ */ jsxs(
          "form",
          {
            onSubmit: handleSubmit,
            className: "relative rounded-3xl border border-primary-foreground/15 bg-primary-foreground/[0.06] backdrop-blur-md p-5 sm:p-7 md:p-8 space-y-4",
            style: {
              boxShadow: "var(--shadow-elegant)",
              transform: `translate3d(0, ${parallaxY(active, 0.15, 40)}px, 0)`
            },
            children: [
              /* @__PURE__ */ jsxs("div", { className: "grid sm:grid-cols-2 gap-3 sm:gap-4", children: [
                /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
                  /* @__PURE__ */ jsxs(Label, { htmlFor: "contact-name", className: "text-xs text-primary-foreground/75 inline-flex items-center gap-1.5", children: [
                    /* @__PURE__ */ jsx(User, { className: "h-3.5 w-3.5" }),
                    t("contact.name")
                  ] }),
                  /* @__PURE__ */ jsx(
                    Input,
                    {
                      id: "contact-name",
                      value: name,
                      onChange: (e) => setName(e.target.value),
                      maxLength: 100,
                      placeholder: t("contact.name_ph"),
                      className: "h-10 bg-primary-foreground/10 border-primary-foreground/20 text-primary-foreground placeholder:text-primary-foreground/50 focus-visible:ring-secondary/50"
                    }
                  )
                ] }),
                /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
                  /* @__PURE__ */ jsxs(Label, { htmlFor: "contact-email", className: "text-xs text-primary-foreground/75 inline-flex items-center gap-1.5", children: [
                    /* @__PURE__ */ jsx(Mail, { className: "h-3.5 w-3.5" }),
                    t("contact.email")
                  ] }),
                  /* @__PURE__ */ jsx(
                    Input,
                    {
                      id: "contact-email",
                      type: "email",
                      value: email,
                      onChange: (e) => setEmail(e.target.value),
                      maxLength: 255,
                      placeholder: t("contact.email_ph"),
                      className: "h-10 bg-primary-foreground/10 border-primary-foreground/20 text-primary-foreground placeholder:text-primary-foreground/50 focus-visible:ring-secondary/50"
                    }
                  )
                ] })
              ] }),
              /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
                /* @__PURE__ */ jsxs(Label, { htmlFor: "contact-subject", className: "text-xs text-primary-foreground/75 inline-flex items-center gap-1.5", children: [
                  /* @__PURE__ */ jsx(Sparkles, { className: "h-3.5 w-3.5" }),
                  t("contact.subject")
                ] }),
                /* @__PURE__ */ jsx(
                  Input,
                  {
                    id: "contact-subject",
                    value: subject,
                    onChange: (e) => setSubject(e.target.value),
                    maxLength: 150,
                    placeholder: t("contact.subject_ph"),
                    className: "h-10 bg-primary-foreground/10 border-primary-foreground/20 text-primary-foreground placeholder:text-primary-foreground/50 focus-visible:ring-secondary/50"
                  }
                )
              ] }),
              /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
                /* @__PURE__ */ jsxs(Label, { htmlFor: "contact-body", className: "text-xs text-primary-foreground/75 inline-flex items-center gap-1.5", children: [
                  /* @__PURE__ */ jsx(MessageSquare, { className: "h-3.5 w-3.5" }),
                  t("contact.body")
                ] }),
                /* @__PURE__ */ jsx(
                  Textarea,
                  {
                    id: "contact-body",
                    value: body,
                    onChange: (e) => setBody(e.target.value),
                    maxLength: 1500,
                    rows: 5,
                    placeholder: t("contact.body_ph"),
                    className: "resize-none bg-primary-foreground/10 border-primary-foreground/20 text-primary-foreground placeholder:text-primary-foreground/50 focus-visible:ring-secondary/50 min-h-[110px]"
                  }
                ),
                /* @__PURE__ */ jsxs("p", { className: "text-[10px] text-primary-foreground/60 text-end", children: [
                  body.length,
                  "/1500"
                ] })
              ] }),
              /* @__PURE__ */ jsxs(
                Button,
                {
                  type: "submit",
                  disabled: sending,
                  className: "w-full h-11 bg-secondary hover:bg-secondary/90 text-primary shadow-[var(--shadow-elegant)] hover:scale-[1.02] transition-transform font-semibold",
                  children: [
                    /* @__PURE__ */ jsx(Send, { className: "h-4 w-4" }),
                    sending ? t("contact.sending") : t("contact.send")
                  ]
                }
              )
            ]
          }
        )
      ] }),
      /* @__PURE__ */ jsx("div", { className: "mt-6 md:mt-8 flex justify-center", children: /* @__PURE__ */ jsxs(
        "button",
        {
          type: "button",
          onClick: () => {
            window.dispatchEvent(
              new CustomEvent("scenestack:jump", { detail: { index: 0 } })
            );
          },
          className: "inline-flex items-center gap-2 rounded-full border border-primary-foreground/25 bg-primary-foreground/10 hover:bg-primary-foreground/15 px-5 py-2.5 text-sm font-medium text-primary-foreground/90 transition-all hover:scale-[1.03] backdrop-blur-md",
          children: [
            /* @__PURE__ */ jsx(ArrowUp, { className: "h-4 w-4" }),
            t("contact.back_to_top")
          ]
        }
      ) })
    ] })
  ] });
}
function FloatingIcons({ active }) {
  const items = [
    { Icon: Mail, top: "12%", left: "6%", size: 28, depth: 0.3, delay: 0 },
    { Icon: Sparkles, top: "20%", left: "88%", size: 22, depth: 0.5, delay: 1 },
    { Icon: MessageSquare, top: "78%", left: "10%", size: 26, depth: 0.4, delay: 2 },
    { Icon: BookOpen, top: "82%", left: "85%", size: 24, depth: 0.35, delay: 0.5 }
  ];
  return /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 pointer-events-none hidden md:block", children: items.map(({ Icon, top, left, size, depth, delay }, i) => /* @__PURE__ */ jsx(
    "div",
    {
      className: "absolute text-primary-foreground/20",
      style: {
        top,
        left,
        transform: `translate3d(0, ${parallaxY(active, depth, 50)}px, 0)`,
        animation: `tile-float 6s ease-in-out ${delay}s infinite`
      },
      children: /* @__PURE__ */ jsx(Icon, { style: { width: size, height: size }, strokeWidth: 1.5 })
    },
    i
  )) });
}
const ITEMS = [
  { id: "hero", index: 0, labelKey: "menu.home", icon: Home },
  { id: "features", index: 1, labelKey: "menu.features", icon: Sparkles },
  { id: "journey", index: 2, labelKey: "menu.journey", icon: Map },
  { id: "faq", index: 3, labelKey: "menu.faq", icon: HelpCircle },
  { id: "about", index: 4, labelKey: "menu.about", icon: Building2 },
  { id: "contact", index: 5, labelKey: "menu.contact", icon: Mail }
];
function SiteMenuTrigger({ tone = "light" }) {
  const isDark = tone === "dark";
  return /* @__PURE__ */ jsx(
    "button",
    {
      type: "button",
      "aria-label": "Open menu",
      onClick: () => window.dispatchEvent(new CustomEvent("sitemenu:open")),
      className: isDark ? "inline-flex h-11 w-11 items-center justify-center rounded-full border border-primary-foreground/25 bg-primary-foreground/10 backdrop-blur text-primary-foreground hover:bg-primary-foreground/20 transition-colors" : "inline-flex h-11 w-11 items-center justify-center rounded-full border border-primary/20 bg-background/70 backdrop-blur text-primary hover:bg-primary/10 transition-colors",
      children: /* @__PURE__ */ jsx(Menu, { className: "h-5 w-5" })
    }
  );
}
const LANGUAGES = [
  { code: "ar", label: "العربية" },
  { code: "en", label: "English" },
  { code: "id", label: "Bahasa Indonesia" },
  { code: "ur", label: "اردو" }
];
function FloatingSiteMenuTrigger({
  toneByScene
}) {
  const [activeIndex, setActiveIndex] = useState(0);
  useEffect(() => {
    const onActive = (e) => {
      const detail = e.detail;
      if (detail) setActiveIndex(detail.index);
    };
    window.addEventListener("scenestack:active", onActive);
    return () => window.removeEventListener("scenestack:active", onActive);
  }, []);
  const visible = activeIndex > 0;
  const tone = toneByScene[activeIndex] ?? "light";
  return /* @__PURE__ */ jsx(
    "div",
    {
      "aria-hidden": !visible,
      className: `fixed top-4 end-4 z-50 transition-all duration-300 ${visible ? "opacity-100 translate-y-0 pointer-events-auto" : "opacity-0 -translate-y-2 pointer-events-none"}`,
      children: /* @__PURE__ */ jsx(SiteMenuTrigger, { tone })
    }
  );
}
function SiteMenu() {
  const { t } = useTranslation();
  const { i18n: i18n2 } = useTranslation();
  const [open, setOpen] = useState(false);
  const selectLang = (code) => {
    i18n2.changeLanguage(code);
    if (typeof window !== "undefined") localStorage.setItem("iqraa-lang", code);
  };
  useEffect(() => {
    const onOpen = () => setOpen(true);
    window.addEventListener("sitemenu:open", onOpen);
    return () => window.removeEventListener("sitemenu:open", onOpen);
  }, []);
  useEffect(() => {
    if (!open) return;
    const onKey = (e) => {
      if (e.key === "Escape") setOpen(false);
    };
    window.addEventListener("keydown", onKey);
    return () => window.removeEventListener("keydown", onKey);
  }, [open]);
  const jump = (index) => {
    setOpen(false);
    window.setTimeout(() => {
      window.dispatchEvent(new CustomEvent("scenestack:jump", { detail: { index } }));
    }, 180);
  };
  return /* @__PURE__ */ jsxs(
    "div",
    {
      role: "dialog",
      "aria-modal": "true",
      "aria-hidden": !open,
      className: `fixed inset-0 z-[100] ${open ? "pointer-events-auto" : "pointer-events-none"}`,
      children: [
        /* @__PURE__ */ jsx(
          "div",
          {
            onClick: () => setOpen(false),
            className: `absolute inset-0 bg-primary transition-opacity duration-300 ${open ? "opacity-100" : "opacity-0"}`
          }
        ),
        /* @__PURE__ */ jsx(
          "div",
          {
            "aria-hidden": true,
            className: "absolute inset-0 pointer-events-none transition-opacity duration-500",
            style: {
              backgroundImage: `url(${pattern})`,
              backgroundSize: "220px",
              backgroundRepeat: "repeat",
              opacity: open ? 0.06 : 0
            }
          }
        ),
        /* @__PURE__ */ jsx(
          "div",
          {
            "aria-hidden": true,
            className: `absolute inset-0 pointer-events-none transition-opacity duration-500 ${open ? "opacity-100" : "opacity-0"}`,
            style: {
              background: "radial-gradient(50% 45% at 85% 10%, color-mix(in oklab, var(--primary-glow) 60%, transparent), transparent 70%), radial-gradient(45% 40% at 10% 95%, color-mix(in oklab, var(--secondary) 35%, transparent), transparent 70%)"
            }
          }
        ),
        /* @__PURE__ */ jsxs(
          "div",
          {
            className: `relative h-full w-full text-primary-foreground flex flex-col overflow-y-auto transition-all duration-500 ${open ? "opacity-100 translate-y-0" : "opacity-0 -translate-y-4"}`,
            children: [
              /* @__PURE__ */ jsx("div", { className: "container mx-auto px-6 pt-6 shrink-0", children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-center", children: [
                /* @__PURE__ */ jsx(
                  "button",
                  {
                    type: "button",
                    "aria-label": "Close menu",
                    onClick: () => setOpen(false),
                    className: "absolute end-0 inline-flex h-11 w-11 items-center justify-center rounded-full border border-primary-foreground/25 bg-primary-foreground/10 text-primary-foreground hover:bg-primary-foreground/20 transition-colors",
                    children: /* @__PURE__ */ jsx(X, { className: "h-5 w-5" })
                  }
                ),
                /* @__PURE__ */ jsx(IqraaLogo, { className: "h-12 md:h-14 w-auto brightness-0 invert" })
              ] }) }),
              /* @__PURE__ */ jsx("nav", { className: "flex-1 flex items-center justify-center px-6 py-6 sm:py-10 min-h-0", children: /* @__PURE__ */ jsx("ul", { className: "w-full max-w-3xl grid grid-cols-1 sm:grid-cols-2 gap-2.5 sm:gap-4", children: ITEMS.map((item, i) => {
                const Icon = item.icon;
                return /* @__PURE__ */ jsx(
                  "li",
                  {
                    style: {
                      transitionDelay: open ? `${100 + i * 50}ms` : "0ms"
                    },
                    className: `transition-all duration-500 ${open ? "opacity-100 translate-y-0" : "opacity-0 translate-y-3"}`,
                    children: /* @__PURE__ */ jsxs(
                      "button",
                      {
                        type: "button",
                        onClick: () => jump(item.index),
                        className: "group w-full flex items-center gap-3 sm:gap-4 rounded-2xl border border-primary-foreground/15 bg-primary-foreground/[0.06] hover:bg-primary-foreground/[0.12] hover:border-primary-foreground/30 transition-colors p-3 sm:p-5 text-start",
                        children: [
                          /* @__PURE__ */ jsx("span", { className: "inline-flex h-10 w-10 sm:h-12 sm:w-12 shrink-0 items-center justify-center rounded-xl bg-primary-foreground/10 border border-primary-foreground/15 text-secondary group-hover:scale-110 transition-transform", children: /* @__PURE__ */ jsx(Icon, { className: "h-5 w-5", strokeWidth: 1.75 }) }),
                          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
                            /* @__PURE__ */ jsx("p", { className: "text-sm sm:text-lg font-semibold leading-tight", children: t(item.labelKey) }),
                            /* @__PURE__ */ jsx("p", { className: "text-[11px] sm:text-xs text-primary-foreground/60 mt-0.5 line-clamp-2", children: t(`${item.labelKey}_desc`) })
                          ] }),
                          /* @__PURE__ */ jsxs("span", { className: "text-primary-foreground/40 text-xs sm:text-sm tabular-nums shrink-0", children: [
                            "0",
                            i + 1
                          ] })
                        ]
                      }
                    )
                  },
                  item.id
                );
              }) }) }),
              /* @__PURE__ */ jsxs("div", { className: "container mx-auto px-6 pb-6 pt-2 text-center space-y-3 shrink-0", children: [
                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 flex-wrap", children: [
                  /* @__PURE__ */ jsx(Globe, { className: "h-4 w-4 text-primary-foreground/60", "aria-hidden": true }),
                  LANGUAGES.map((l) => {
                    const activeLang = i18n2.language === l.code;
                    return /* @__PURE__ */ jsx(
                      "button",
                      {
                        type: "button",
                        onClick: () => selectLang(l.code),
                        className: `px-3 py-1.5 rounded-full text-xs sm:text-sm border transition-colors ${activeLang ? "border-secondary/60 bg-secondary/15 text-secondary" : "border-primary-foreground/20 bg-primary-foreground/5 text-primary-foreground/80 hover:bg-primary-foreground/10 hover:border-primary-foreground/40"}`,
                        children: l.label
                      },
                      l.code
                    );
                  })
                ] }),
                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-5 text-xs sm:text-sm", children: [
                  /* @__PURE__ */ jsx(
                    "a",
                    {
                      href: "/terms",
                      target: "_blank",
                      rel: "noopener noreferrer",
                      className: "text-primary-foreground/80 hover:text-secondary underline-offset-4 hover:underline transition-colors",
                      children: t("menu.terms")
                    }
                  ),
                  /* @__PURE__ */ jsx("span", { className: "h-1 w-1 rounded-full bg-primary-foreground/30", "aria-hidden": true }),
                  /* @__PURE__ */ jsx(
                    "a",
                    {
                      href: "/privacy",
                      target: "_blank",
                      rel: "noopener noreferrer",
                      className: "text-primary-foreground/80 hover:text-secondary underline-offset-4 hover:underline transition-colors",
                      children: t("menu.privacy")
                    }
                  )
                ] }),
                /* @__PURE__ */ jsx("p", { className: "text-xs text-primary-foreground/50", children: t("footer.rights") })
              ] })
            ]
          }
        )
      ]
    }
  );
}
function HeroVisual({
  active,
  size = "lg"
}) {
  const isLg = size === "lg";
  return /* @__PURE__ */ jsxs(
    "div",
    {
      className: isLg ? "relative mx-auto w-full max-w-[252px] aspect-[9/19] " : "relative mx-auto w-[33vw] max-w-[138px] aspect-[9/19]",
      children: [
        /* @__PURE__ */ jsx(
          "div",
          {
            "aria-hidden": true,
            className: "absolute -inset-10 rounded-[80px] blur-3xl opacity-60 pointer-events-none",
            style: { background: "var(--gradient-hero)" }
          }
        ),
        /* @__PURE__ */ jsxs(Fragment, { children: [
          /* @__PURE__ */ jsx(
            "div",
            {
              "aria-hidden": true,
              className: `absolute rounded-full pointer-events-none blur-2xl opacity-60 ${isLg ? "-inset-8" : "-inset-4"}`,
              style: {
                background: "radial-gradient(circle, color-mix(in oklab, var(--primary) 35%, transparent) 0%, transparent 70%)"
              }
            }
          ),
          /* @__PURE__ */ jsx(
            "div",
            {
              "aria-hidden": true,
              className: `absolute rounded-full pointer-events-none ${isLg ? "-inset-6" : "-inset-3"}`,
              style: {
                border: `${isLg ? "1.25px" : "1px"} dashed color-mix(in oklab, var(--primary) 45%, transparent)`,
                boxShadow: "0 0 18px color-mix(in oklab, var(--primary) 22%, transparent)",
                transform: `rotate(${18 + active * 6}deg)`,
                transition: "transform .8s ease-out"
              }
            }
          ),
          /* @__PURE__ */ jsx(
            "div",
            {
              "aria-hidden": true,
              className: `absolute rounded-full pointer-events-none ${isLg ? "-inset-3" : "-inset-1.5"}`,
              style: {
                border: `${isLg ? "2px" : "1.5px"} dashed color-mix(in oklab, var(--secondary) 90%, transparent)`,
                boxShadow: "0 0 32px color-mix(in oklab, var(--secondary) 55%, transparent), inset 0 0 16px color-mix(in oklab, var(--secondary) 20%, transparent)",
                transform: `rotate(${-22 - active * 6}deg)`,
                transition: "transform .8s ease-out"
              }
            }
          )
        ] }),
        /* @__PURE__ */ jsx(
          "div",
          {
            className: "relative h-full w-full rounded-[38px] p-[7px] shadow-[0_30px_80px_-20px_rgba(18,55,42,0.45)]",
            style: {
              background: "linear-gradient(145deg, #1a4733 0%, #0d2a1f 50%, #1a4733 100%)",
              transform: `translate3d(0, ${parallaxY(active, 0.18, 30)}px, 0)`
            },
            children: /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden rounded-[32px] bg-black", children: [
              /* @__PURE__ */ jsx("div", { className: "absolute left-1/2 top-2 z-20 h-3.5 w-16 -translate-x-1/2 rounded-full bg-black" }),
              /* @__PURE__ */ jsx(
                "img",
                {
                  src: heroScreen,
                  alt: "إقراء — الواجهة الرئيسية",
                  draggable: false,
                  className: "absolute inset-0 h-full w-full object-cover"
                }
              ),
              /* @__PURE__ */ jsx(
                "div",
                {
                  "aria-hidden": true,
                  className: "pointer-events-none absolute inset-0",
                  style: {
                    background: "linear-gradient(135deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 100%)"
                  }
                }
              )
            ] })
          }
        ),
        /* @__PURE__ */ jsxs(
          FloatCard,
          {
            active,
            depth: 0.45,
            className: isLg ? "absolute -top-2 -start-10 md:-start-14" : "absolute -top-1 -start-3",
            delay: 0,
            size,
            children: [
              /* @__PURE__ */ jsx("span", { className: "inline-flex h-7 w-7 items-center justify-center rounded-full bg-primary/10 text-primary", children: /* @__PURE__ */ jsx(GraduationCap, { className: "h-3.5 w-3.5" }) }),
              /* @__PURE__ */ jsxs("div", { className: "leading-tight", children: [
                /* @__PURE__ */ jsx("p", { className: "font-bold text-primary text-sm", children: "+1000" }),
                /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground", children: "معلم" })
              ] })
            ]
          }
        ),
        /* @__PURE__ */ jsxs(
          FloatCard,
          {
            active,
            depth: 0.35,
            className: isLg ? "absolute top-[28%] -end-12 md:-end-16" : "absolute top-[28%] -end-4",
            delay: 1.2,
            size,
            children: [
              /* @__PURE__ */ jsx("span", { className: "inline-flex h-7 w-7 items-center justify-center rounded-full bg-secondary/20 text-secondary", children: /* @__PURE__ */ jsx(Clock, { className: "h-3.5 w-3.5" }) }),
              /* @__PURE__ */ jsxs("div", { className: "leading-tight", children: [
                /* @__PURE__ */ jsx("p", { className: "font-bold text-primary text-sm", children: "45,000" }),
                /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground", children: "ساعة تعلم" })
              ] })
            ]
          }
        ),
        /* @__PURE__ */ jsxs(
          FloatCard,
          {
            active,
            depth: 0.5,
            className: isLg ? "absolute bottom-[22%] -start-14 md:-start-20" : "absolute bottom-[22%] -start-5",
            delay: 0.6,
            size,
            children: [
              /* @__PURE__ */ jsx("span", { className: "inline-flex h-7 w-7 items-center justify-center rounded-full bg-primary/10 text-primary", children: /* @__PURE__ */ jsx(Globe2, { className: "h-3.5 w-3.5" }) }),
              /* @__PURE__ */ jsxs("div", { className: "leading-tight", children: [
                /* @__PURE__ */ jsx("p", { className: "font-bold text-primary text-sm", children: "190" }),
                /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground", children: "دولة" })
              ] })
            ]
          }
        ),
        /* @__PURE__ */ jsxs(
          FloatCard,
          {
            active,
            depth: 0.4,
            className: isLg ? "absolute -bottom-3 -end-8 md:-end-12" : "absolute -bottom-2 -end-3",
            delay: 1.8,
            size,
            children: [
              /* @__PURE__ */ jsx("span", { className: "inline-flex h-7 w-7 items-center justify-center rounded-full bg-secondary/20 text-secondary", children: /* @__PURE__ */ jsx(Video, { className: "h-3.5 w-3.5" }) }),
              /* @__PURE__ */ jsxs("div", { className: "leading-tight", children: [
                /* @__PURE__ */ jsx("p", { className: "font-bold text-primary text-sm", children: "8M+" }),
                /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground", children: "جلسة" })
              ] })
            ]
          }
        )
      ]
    }
  );
}
function FloatCard({
  children,
  className,
  active,
  depth,
  delay,
  size
}) {
  return /* @__PURE__ */ jsx(
    "div",
    {
      className: `${className ?? ""} z-10 flex items-center gap-2 rounded-2xl border border-primary/15 bg-background/90 backdrop-blur-md px-3 py-2 shadow-[var(--shadow-elegant)]`,
      style: {
        transform: `translate3d(0, ${parallaxY(active, depth, 30)}px, 0)`,
        animation: `tile-float 6s ease-in-out ${delay}s infinite`,
        ...size === "sm" ? { transform: `scale(0.85) translate3d(0, ${parallaxY(active, depth, 30)}px, 0)` } : null
      },
      children
    }
  );
}
const avatar1 = "/assets/avatar-1-DGb07oqs.png";
const avatar2 = "/assets/avatar-2-CI8-mmKq.png";
const avatar3 = "/assets/avatar-3-CTi2ojkV.png";
const avatar4 = "/assets/avatar-4-B1Zbp0FP.png";
const avatar5 = "/assets/avatar-5-K97w7hrj.png";
const avatar6 = "/assets/avatar-6-C_w6J0Cv.png";
const avatar7 = "/assets/avatar-7-BWFzi3a5.png";
const avatar8 = "/assets/avatar-8-DCEt3hh5.png";
function Index() {
  return /* @__PURE__ */ jsx(LanguageProvider, { children: /* @__PURE__ */ jsx(IndexContent, {}) });
}
function IndexContent() {
  const {
    t
  } = useTranslation();
  useEffect(() => {
    const prevHtml = document.documentElement.style.overflow;
    const prevBody = document.body.style.overflow;
    document.documentElement.style.overflow = "hidden";
    document.body.style.overflow = "hidden";
    return () => {
      document.documentElement.style.overflow = prevHtml;
      document.body.style.overflow = prevBody;
    };
  }, []);
  const scenes = [{
    id: "hero",
    background: "var(--background)",
    render: ({
      active
    }) => /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden bg-background", children: [
      /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 pointer-events-none", style: {
        background: "var(--gradient-soft)"
      } }),
      /* @__PURE__ */ jsx("div", { className: "relative z-20 container mx-auto px-6 pt-10 md:pt-6", children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-center", children: [
        /* @__PURE__ */ jsx("div", { className: "absolute end-0", children: /* @__PURE__ */ jsx(SiteMenuTrigger, { tone: "light" }) }),
        /* @__PURE__ */ jsx(IqraaLogo, { className: "h-14 md:h-16 w-auto" })
      ] }) }),
      /* @__PURE__ */ jsx("div", { className: "container relative mx-auto px-5 sm:px-6 pt-2 pb-6 md:pt-6 lg:pt-8 h-[calc(100%-4.5rem)] md:h-[calc(100%-5rem)] flex items-center overflow-y-auto lg:overflow-visible", children: /* @__PURE__ */ jsxs("div", { className: "grid lg:grid-cols-2 gap-6 lg:gap-16 items-center w-full", children: [
        /* @__PURE__ */ jsxs("div", { className: "order-1", style: {
          transform: `translate3d(0, ${parallaxY(active, 0.2, 50)}px, 0)`
        }, children: [
          /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary/20 bg-primary/5 px-3 py-1 text-[11px] sm:text-xs font-medium text-primary", children: [
            /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-primary animate-pulse" }),
            t("hero.badge")
          ] }),
          /* @__PURE__ */ jsxs("h1", { className: "mt-3 sm:mt-4 text-3xl sm:text-4xl md:text-6xl lg:text-7xl font-bold tracking-tight text-primary leading-[1.05]", children: [
            t("hero.title_1"),
            /* @__PURE__ */ jsx("br", {}),
            /* @__PURE__ */ jsx("span", { className: "italic font-light", children: t("hero.title_2") })
          ] }),
          /* @__PURE__ */ jsx("p", { className: "mt-3 sm:mt-4 text-sm sm:text-base md:text-xl text-muted-foreground max-w-xl leading-relaxed", children: t("hero.subtitle") }),
          /* @__PURE__ */ jsxs("div", { className: "mt-4 sm:mt-6 flex flex-wrap gap-3", children: [
            /* @__PURE__ */ jsx(Button, { size: "default", className: "bg-primary hover:bg-primary/90 text-primary-foreground h-10 md:h-12 px-5 md:px-8 text-sm md:text-base shadow-[var(--shadow-elegant)] hover:scale-105 transition-transform", asChild: true, children: /* @__PURE__ */ jsx("a", { href: "https://onelink.to/4nsa44", target: "_blank", rel: "noopener noreferrer", children: t("hero.ios") }) }),
            /* @__PURE__ */ jsx(Button, { size: "default", variant: "outline", className: "h-10 md:h-12 px-5 md:px-8 text-sm md:text-base border-primary/30 text-primary hover:bg-primary/5", asChild: true, children: /* @__PURE__ */ jsx("a", { href: "https://onelink.to/4nsa44", target: "_blank", rel: "noopener noreferrer", children: t("hero.android") }) })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "mt-4 sm:mt-6 flex items-center gap-3 sm:gap-6 text-xs sm:text-sm text-muted-foreground", children: [
            /* @__PURE__ */ jsxs("div", { className: "flex -space-x-2 rtl:space-x-reverse items-center", children: [
              [avatar1, avatar2, avatar3, avatar4, avatar5, avatar6, avatar7, avatar8].map((src, i) => /* @__PURE__ */ jsx("img", { src, alt: "", loading: "lazy", width: 32, height: 32, className: "h-7 w-7 sm:h-8 sm:w-8 rounded-full border-2 border-background bg-muted object-cover" }, i)),
              /* @__PURE__ */ jsx("span", { className: "ms-2 inline-flex h-7 w-7 sm:h-8 sm:w-8 items-center justify-center rounded-full border-2 border-background bg-primary/10 text-primary text-xs font-bold", children: "+" })
            ] }),
            /* @__PURE__ */ jsx("p", { children: t("hero.loved") })
          ] })
        ] }),
        /* @__PURE__ */ jsx("div", { className: "hidden lg:flex order-2 items-center justify-center", style: {
          transform: `translate3d(0, ${parallaxY(active, 0.12, 40)}px, 0)`
        }, children: /* @__PURE__ */ jsx(HeroVisual, { active, size: "lg" }) }),
        /* @__PURE__ */ jsx("div", { className: "lg:hidden order-2 mt-6 mb-2 flex justify-center", children: /* @__PURE__ */ jsx(HeroVisual, { active, size: "sm" }) })
      ] }) })
    ] })
  }, {
    id: "features",
    background: "var(--primary)",
    render: ({
      active
    }) => /* @__PURE__ */ jsx(FeaturesScene, { active })
  }, {
    id: "journey",
    background: "var(--background)",
    // 13 screenshots → 12 sub-steps so each scroll/swipe advances by
    // exactly one screen.
    extraSteps: 12,
    // Continuous scroll inside this scene's runway (snap behavior is kept
    // for entering and leaving). See SceneStack `continuous`.
    continuous: true,
    render: ({
      active,
      subProgress
    }) => /* @__PURE__ */ jsx(JourneyScene, { active, subProgress })
  }, {
    id: "faq",
    background: "var(--primary)",
    render: ({
      active
    }) => /* @__PURE__ */ jsx(FaqScene, { active })
  }, {
    id: "about",
    background: "var(--background)",
    render: ({
      active
    }) => /* @__PURE__ */ jsx(AboutScene, { active })
  }, {
    id: "contact",
    background: "var(--primary)",
    render: ({
      active
    }) => /* @__PURE__ */ jsx(ContactScene, { active })
  }];
  return /* @__PURE__ */ jsxs("div", { className: "bg-background text-foreground no-scrollbar", children: [
    /* @__PURE__ */ jsx(SceneStack, { scenes }),
    /* @__PURE__ */ jsx(FloatingSiteMenuTrigger, { toneByScene: ["light", "dark", "light", "dark", "light", "dark"] }),
    /* @__PURE__ */ jsx(SiteMenu, {})
  ] });
}
const FEATURE_TILES = [{
  key: "live",
  icon: Video,
  span: "col-span-2 row-span-2",
  hero: true,
  delay: 0,
  depth: 0
}, {
  key: "teachers",
  icon: GraduationCap,
  span: "col-span-2 row-span-1",
  delay: 0.4,
  depth: 0.2
}, {
  key: "everyone",
  icon: Users,
  span: "col-span-1 row-span-1",
  delay: 0.8,
  depth: 0.3
}, {
  key: "always",
  icon: Clock,
  span: "col-span-1 row-span-1",
  delay: 1.2,
  depth: 0.1
}, {
  key: "readings",
  icon: BookOpen,
  span: "col-span-2 row-span-1",
  delay: 0.6,
  depth: 0.25
}, {
  key: "schedule",
  icon: CalendarDays,
  span: "col-span-1 row-span-1",
  delay: 1.4,
  depth: 0.15
}, {
  key: "plans",
  icon: Map,
  span: "col-span-1 row-span-1",
  delay: 0.2,
  depth: 0.35
}, {
  key: "reports",
  icon: BarChart3,
  span: "col-span-1 row-span-1",
  delay: 1,
  depth: 0.2
}, {
  key: "mushaf",
  icon: ScanLine,
  span: "col-span-2 row-span-1",
  delay: 0.5,
  depth: 0.1
}, {
  key: "achievements",
  icon: Trophy,
  span: "col-span-1 row-span-1",
  delay: 1.6,
  depth: 0.3
}, {
  key: "community",
  icon: Heart,
  span: "col-span-1 row-span-1",
  delay: 0.3,
  depth: 0.25
}, {
  key: "recordings",
  icon: Mic,
  span: "col-span-1 row-span-1",
  delay: 1.1,
  depth: 0.2
}, {
  key: "friends",
  icon: UserPlus,
  span: "col-span-1 row-span-1",
  delay: 0.9,
  depth: 0.35
}];
function FeaturesScene({
  active
}) {
  const {
    t
  } = useTranslation();
  return /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full overflow-hidden text-primary-foreground", children: [
    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 pointer-events-none", style: {
      background: "radial-gradient(60% 55% at 80% 15%, color-mix(in oklab, var(--primary-glow) 60%, transparent), transparent 70%)",
      transform: `translate3d(0, ${parallaxY(active, 0.9, 50)}px, 0)`
    } }),
    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 pointer-events-none", style: {
      background: "radial-gradient(50% 45% at 15% 85%, color-mix(in oklab, var(--secondary) 35%, transparent), transparent 70%)",
      transform: `translate3d(0, ${parallaxY(active, 0.8, 70)}px, 0)`
    } }),
    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute inset-0 opacity-[0.05] pointer-events-none", style: {
      backgroundImage: `url(${pattern})`,
      backgroundSize: "180px",
      backgroundRepeat: "repeat",
      transform: `translate3d(0, ${parallaxY(active, 0.95, 40)}px, 0)`
    } }),
    /* @__PURE__ */ jsxs("div", { className: "container mx-auto px-5 sm:px-6 h-full flex flex-col justify-center pt-16 pb-6 md:py-8 lg:py-10 overflow-y-auto lg:overflow-hidden", children: [
      /* @__PURE__ */ jsxs("div", { className: "max-w-3xl mb-4 md:mb-6 lg:mb-8 shrink-0", style: {
        transform: `translate3d(0, ${parallaxY(active, 0.3, 40)}px, 0)`
      }, children: [
        /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-2 rounded-full border border-primary-foreground/25 bg-primary-foreground/5 px-3 py-1 text-[11px] sm:text-xs font-medium text-primary-foreground/85", children: [
          /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-secondary animate-pulse" }),
          t("features.eyebrow")
        ] }),
        /* @__PURE__ */ jsxs("h2", { className: "hidden md:block mt-3 sm:mt-4 text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight leading-[1.05]", children: [
          t("features.title_1"),
          /* @__PURE__ */ jsx("br", {}),
          /* @__PURE__ */ jsx("span", { className: "italic font-light text-secondary", children: t("features.title_2") })
        ] }),
        /* @__PURE__ */ jsx("p", { className: "hidden md:block mt-2 sm:mt-3 text-xs sm:text-sm md:text-base text-primary-foreground/75 max-w-xl", children: t("features.subtitle") })
      ] }),
      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-4 md:grid-cols-6 auto-rows-[minmax(64px,1fr)] md:auto-rows-[minmax(72px,90px)] lg:auto-rows-[minmax(80px,110px)] gap-2 sm:gap-3 md:gap-3 lg:gap-4 min-h-0", style: {
        transform: `translate3d(0, ${parallaxY(active, 0, 60)}px, 0)`
      }, children: FEATURE_TILES.map((tile, idx) => /* @__PURE__ */ jsx(FeatureTileCard, { tile, idx, active }, tile.key)) })
    ] })
  ] });
}
function FeatureTileCard({
  tile,
  idx,
  active
}) {
  const {
    t
  } = useTranslation();
  const Icon = tile.icon;
  const py = parallaxY(active, 1 - tile.depth, 30);
  const rot = (idx % 2 === 0 ? 1 : -1) * (1 - active) * 1.2;
  return /* @__PURE__ */ jsxs("div", { className: `${tile.span} group relative rounded-2xl md:rounded-3xl border border-primary-foreground/15 bg-primary-foreground/[0.06] backdrop-blur-sm overflow-hidden transition-colors hover:bg-primary-foreground/[0.10] hover:border-primary-foreground/25`, style: {
    transform: `translate3d(0, ${py}px, 0) rotate(${rot}deg)`,
    animation: `tile-float 6s ease-in-out ${tile.delay}s infinite`
  }, children: [
    tile.hero && /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "absolute -inset-px pointer-events-none rounded-2xl md:rounded-3xl", style: {
      background: "radial-gradient(70% 60% at 30% 20%, color-mix(in oklab, var(--secondary) 35%, transparent), transparent 70%)"
    } }),
    /* @__PURE__ */ jsxs("div", { className: `relative h-full w-full p-3 sm:p-4 md:p-5 flex ${tile.hero ? "flex-col justify-between" : "flex-col justify-between"}`, children: [
      /* @__PURE__ */ jsx("div", { className: `inline-flex items-center justify-center rounded-xl md:rounded-2xl bg-primary-foreground/10 border border-primary-foreground/15 ${tile.hero ? "h-11 w-11 md:h-14 md:w-14" : "h-8 w-8 md:h-10 md:w-10"}`, children: /* @__PURE__ */ jsx(Icon, { className: `text-primary-foreground ${tile.hero ? "h-5 w-5 md:h-7 md:w-7" : "h-4 w-4 md:h-5 md:w-5"}`, strokeWidth: 1.75 }) }),
      /* @__PURE__ */ jsxs("div", { className: "mt-2 md:mt-3", children: [
        /* @__PURE__ */ jsx("p", { className: `font-semibold leading-tight ${tile.hero ? "text-base sm:text-lg md:text-2xl" : "text-xs sm:text-sm md:text-base"}`, children: t(`features.${tile.key}.title`) }),
        /* @__PURE__ */ jsx("p", { className: `text-primary-foreground/70 leading-snug mt-1 ${tile.hero ? "text-xs sm:text-sm md:text-base" : "text-[10px] sm:text-xs md:text-sm hidden sm:block"}`, children: t(`features.${tile.key}.desc`) })
      ] }),
      tile.hero && /* @__PURE__ */ jsxs("div", { className: "absolute top-3 left-3 md:top-4 md:left-4 inline-flex items-center gap-1.5 rounded-full bg-primary-foreground/10 border border-primary-foreground/20 px-2 py-0.5 text-[10px] md:text-xs", children: [
        /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-secondary animate-pulse" }),
        "LIVE"
      ] })
    ] })
  ] });
}
export {
  Index as component
};
