@extends('layouts.main')

@section('title', 'Privacy Policy')
@section('description', 'Our commitments around data collection, usage, storage, and your rights.')

@section('content')
<section id="privacy-root" x-data="pageHero()" x-init="Alpine.store('privacy', { ids })" class="relative overflow-hidden pt-28 lg:pt-32 pb-10 lg:pb-14">
    <div class="absolute inset-0 -z-10">
        <div class="absolute inset-0 bg-dark-gradient opacity-90"></div>
        <div class="absolute inset-0 bg-dots opacity-10"></div>
    </div>
    <div class="particles -z-0" aria-hidden="true">
        <template x-for="(p,i) in particles" :key="'pr-'+i">
            <span class="particle" :style="`--x:${p.x};--y:${p.y};--dx:${p.dx};--dy:${p.dy};--dur:${p.d};--delay:${p.delay};`"></span>
        </template>
    </div>
    <div class="container-custom text-center">
        <h1 :id="ids.title" class="font-heading text-4xl sm:text-5xl lg:text-6xl font-extrabold text-text-primary text-glow">Privacy Policy</h1>
        <p :id="ids.sub" class="mt-4 text-text-secondary text-lg max-w-3xl mx-auto">How we collect, use, and protect your information.</p>
    </div>
</section>

<section class="pb-20 lg:pb-28">
    <div class="container-custom space-y-6">
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">1. Information We Collect</h2>
            <p class="text-text-secondary">We collect information you provide (e.g., name, email), technical data (device, browser, IP), usage data (pages visited, interactions), and, if you opt in, wallet and on-chain activity related to features that require it.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">2. How We Use Information</h2>
            <ul class="list-disc ml-6 text-text-secondary space-y-2">
                <li>Provide and improve gameplay, features, and services</li>
                <li>Personalize experiences and communications</li>
                <li>Ensure platform safety and integrity</li>
                <li>Comply with legal obligations</li>
            </ul>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">3. Legal Bases</h2>
            <p class="text-text-secondary">Depending on your region, we rely on consent, contract performance, legitimate interests, and compliance with legal obligations as our legal bases for processing.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">4. Sharing & Transfers</h2>
            <p class="text-text-secondary">We may share data with service providers (e.g., hosting, analytics, email), strictly under agreements ensuring appropriate safeguards. Cross-border transfers include suitable protections as required by law.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">5. Data Retention</h2>
            <p class="text-text-secondary">We retain information only as long as needed for the purposes described or as required by law, then securely delete or anonymize it.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">6. Your Rights</h2>
            <p class="text-text-secondary">Subject to local laws, you may access, rectify, delete, or restrict processing of your data, and object or withdraw consent. Contact us to exercise these rights.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">7. Security</h2>
            <p class="text-text-secondary">We implement technical and organizational measures to protect your information. No method is 100% secure; we continuously improve our safeguards.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">8. Children</h2>
            <p class="text-text-secondary">Our services are not directed to children under applicable age thresholds. If you believe a child provided data, contact us for removal.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">9. Changes</h2>
            <p class="text-text-secondary">We may update this policy from time to time. Material changes will be communicated appropriately. Continued use indicates acceptance.</p>
        </article>
        <article class="card card-variant-dark">
            <h2 class="font-heading text-2xl text-text-primary mb-2">10. Contact</h2>
            <p class="text-text-secondary">Questions? Reach us at hello@arukurb.com or via the <a href="{{ route('contact') }}" class="text-accent-blue-primary hover:underline">contact page</a>.</p>
        </article>
    </div>
</section>
@endsection

@push('scripts')
<script>
    function pageHero(){
        const uid = () => 'id-' + Math.random().toString(36).slice(2, 8);
        return {
            ids: { title: uid(), sub: uid() },
            particles: Array.from({ length: 16 }).map(() => {
                const d = (Math.random() * 8 + 8).toFixed(2) + 's';
                const delay = (-Math.random() * 6).toFixed(2) + 's';
                const x = (Math.random() * 100).toFixed(2) + '%';
                const y = (Math.random() * 100).toFixed(2) + '%';
                const dx = ((Math.random() * 40) - 20).toFixed(0) + 'px';
                const dy = ((Math.random() * 40) - 20).toFixed(0) + 'px';
                return { x, y, dx, dy, d, delay };
            })
        }
    }
    document.addEventListener('DOMContentLoaded', () => {
        const ids = Alpine.store('privacy')?.ids || {};
        gsap.utils.toArray('.card-variant-dark').forEach((el, i) => {
            gsap.from(el, { y: 24, opacity: 0, duration: 0.6, ease: 'power2.out', delay: i * 0.04, scrollTrigger: { trigger: el, start: 'top 90%' } });
        });
        const mm = gsap.matchMedia();
        mm.add('(min-width: 1024px)', () => {
            const tl = gsap.timeline({ scrollTrigger: { trigger: '#privacy-root', start: 'top top', end: '+=320', scrub: true } });
            if (ids.title) tl.to('#' + ids.title, { yPercent: -10 }, 0);
            if (ids.sub) tl.to('#' + ids.sub, { yPercent: -16 }, 0);
        });
    });
</script>
@endpush