// landing-sections.jsx — "why" → footer (filen.io-style)
const { useState: useStateLS, useRef: useRefLS, useEffect: useEffectLS } = React;
// ─── "WHY YOU NEED ROSTEALTH" — 3 columns w/ dotted connector + glow icons ─────
const WhySection = () => {
const r = useReveal();
const cols = [
{ color: '#22D3EE', glow: 'rgba(129,140,248,0.5)', icon: , title: 'All features', body: "RoStealth offers a wide range of tracking features, delivering a complete community overview. You'll feel at home really fast." },
{ color: '#5EEAD4', glow: 'rgba(192,132,252,0.5)', icon: , title: 'Public data only', body: 'RoStealth reads only data Roblox already makes public. No passwords, no account access, no private data — ever.' },
{ color: '#34D399', glow: 'rgba(52,211,153,0.5)', icon: , title: 'Transparent', body: 'No hidden bots or shady scripts running in the background. Just the official public Roblox API, used honestly.' },
];
return (
{/* dotted connector */}
{cols.map((c, i) => (
{c.icon}
{/* glow beam underneath */}
{c.title}
{c.body}
))}
);
};
// ─── "ALL-IN-ONE SOLUTION" — 4 column feature grid ─────────────────────────────
const FeaturesSection = () => {
const ref = useRefLS(null);
useEffectLS(() => {
const el = ref.current; if (!el) return;
const cells = Array.from(el.children);
cells.forEach((c, i) => { c.classList.add('reveal'); c.style.transitionDelay = `${(i % 4) * 50}ms`; });
let done = false;
const show = () => { if (done) return; done = true; cells.forEach(c => c.classList.add('in')); };
let io;
try { io = new IntersectionObserver(es => es.forEach(e => { if (e.isIntersecting) show(); }), { threshold: 0.05 }); io.observe(el); } catch (_) { show(); }
const t = setTimeout(show, 1500);
return () => { io && io.disconnect(); clearTimeout(t); };
}, []);
const feats = [
{ icon: , title: 'Built for everybody', body: 'Made for clan leaders, group owners, moderators, and anyone who runs a Roblox community.' },
{ icon: , title: 'Ease of use', body: 'Our clean dashboard makes both beginners and power users feel right at home.' },
{ icon: , title: 'Pricing like no other', body: 'No subscriptions or hidden fees — every feature is included for one flat $5 pass.' },
{ icon: , title: 'Real-time', body: 'Status refreshes every 30 seconds, so your board reflects changes almost as they happen.' },
{ icon: , title: 'Discord alerts', body: 'Route any status change straight to your server with custom webhook conditions.' },
{ icon: , title: 'Full API access', body: 'Pull the same live data into your own bots with a clean, documented REST API.' },
{ icon: , title: 'Track whole groups', body: 'Monitor an entire clan by its Group ID — member count, active members, and ranks.' },
{ icon: , title: 'Flag & triage', body: 'Mark members worth a closer look. Flagged accounts float to the top and surface in alerts.' },
];
return (
{feats.map((f, i) => {
const col = i % 4, row = Math.floor(i / 4);
return (
);
};
const FAQ = () => {
const faqs = [
['Is this allowed? Is it spying?', "RoStealth only reads data Roblox already makes public — the same presence and profile info anyone can see on a profile page. No private data, no account access, and no passwords are ever involved."],
['Do you need my Roblox password?', "Never. RoStealth authenticates you with your own RoStealth account and reads public Roblox data through the official public API."],
['How fast do statuses update?', "Your pass refreshes every 30 seconds, so the board reflects changes almost as they happen."],
['What does a pass include?', "Everything: unlimited users and groups, real-time updates, 30-day history, Discord alerts, custom conditions, and API access — full access for 30 days from purchase."],
['Is RoStealth affiliated with Roblox?', "No. RoStealth is an independent tool and is not affiliated with, endorsed by, or sponsored by Roblox Corporation."],
];
return (