پرامپت لندینگ نرم‌افزار با دمو تعاملی

نقش: طراح محصول SaaS.

وظیفه: لندینگ برای [محصول SaaS] بساز که به‌جای اسکرین‌شات ثابت، «دموی تعاملی فیک» دارد:

- یک قاب مرورگر با CSS بساز که داخلش شبیه‌ساز پنل محصول است: ۳ تب (داشبورد/گزارش/تنظیمات) که با کلیک واقعاً محتوا عوض می‌شود (داده‌های نمونه فارسی، جدول و نمودار CSS)
- بالای دمو: «خودت امتحان کن — بدون ثبت‌نام»
- بعد از دمو: مزایا (۴ کارت)، یکپارچگی‌ها (لوگو متنی)، قیمت‌گذاری، CTA

چرا این ساختار؟ در پایان توضیح بده دموی تعاملی چطور نرخ ثبت‌نام را بالا می‌برد.

محدودیت: فقط HTML/CSS/JS خالص، بدون تصویر واقعی (همه UI داخل دمو با کد)، RTL، ریسپانسیو (دمو در موبایل اسکرول افقی ظریف داشته باشد).

خروجی: کد کامل در یک فایل.

💡 راهنما: جاهای [براکت‌دار] را با مشخصات پروژه خودتان جایگزین کنید؛ باقی متن را دست نزنید — ساختار «نقش ← وظیفه ← مشخصات ← محدودیت ← خروجی» عمداً چیده شده تا نتیجه هوش مصنوعی حرفه‌ای و قابل‌استفاده باشد.