<?php
require_once 'includes/header.php';

$slug = $_GET['slug'] ?? 'about';

$pages = [
    'about' => [
        'title' => 'About BITCrypto',
        'image' => 'https://images.pexels.com/photos/8370752/pexels-photo-8370752.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
        'content' => 'BITCrypto is a world-leading cryptocurrency exchange, providing advanced financial services to traders globally by using blockchain technology. We provide hundreds of token & futures trading pairs to help traders to optimize their strategy. BITCrypto is one of the top digital asset exchanges by trading volume, serving millions of users in over 100 countries.'
    ],
    'help-center' => [
        'title' => 'Help Center',
        'image' => 'https://images.pexels.com/photos/6771107/pexels-photo-6771107.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
        'content' => 'Our help center provides comprehensive guides and support for all your trading needs. From account setup to advanced trading strategies, we are here to help you navigate the world of crypto. Contact our 24/7 customer support for personalized assistance.'
    ],
    'security-info' => [
        'title' => 'Security First',
        'image' => 'https://images.pexels.com/photos/5980866/pexels-photo-5980866.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
        'content' => 'Security is our top priority. We use industry-leading security protocols to keep your funds and personal information safe. Our multi-cluster system architecture and cold storage solutions ensure the highest level of protection for your digital assets.'
    ],
    'privacy' => [
        'title' => 'Privacy Policy',
        'image' => 'https://images.pexels.com/photos/6771574/pexels-photo-6771574.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
        'content' => 'We are committed to protecting your privacy. This policy explains how we collect, use, and safeguard your information. We never share your data with third parties without your explicit consent.'
    ],
    'terms' => [
        'title' => 'Terms of Service',
        'image' => 'https://images.pexels.com/photos/7567443/pexels-photo-7567443.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1',
        'content' => 'By using BITCrypto, you agree to our terms of service. Our platform provides digital asset trading services and you are responsible for maintaining the security of your account and complying with local regulations.'
    ]
];

$page = $pages[$slug] ?? $pages['about'];
?>

<div class="container my-5 py-5">
    <div class="row justify-content-center">
        <div class="col-lg-10">
            <div class="card bg-dark border-secondary overflow-hidden shadow-lg" style="border-radius: 24px;">
                <div class="position-relative" style="height: 350px;">
                    <img src="<?php echo $page['image']; ?>" class="w-100 h-100 object-fit-cover" alt="Banner">
                    <div class="position-absolute top-0 start-0 w-100 h-100" style="background: linear-gradient(rgba(0,0,0,0.1), rgba(0,0,0,0.8));"></div>
                    <div class="position-absolute bottom-0 start-0 p-5">
                        <h1 class="display-4 fw-bold text-white"><?php echo t($page['title']); ?></h1>
                    </div>
                </div>
                <div class="p-5">
                    <div class="fs-5 text-muted lh-lg" style="text-align: justify;">
                        <?php echo $page['content']; ?>
                        <br><br>
                        <div class="row g-4 mt-4">
                            <div class="col-md-4">
                                <img src="https://images.pexels.com/photos/6770610/pexels-photo-6770610.jpeg?auto=compress&cs=tinysrgb&w=600" class="img-fluid rounded-4 mb-3" alt="Crypto 1">
                            </div>
                            <div class="col-md-4">
                                <img src="https://images.pexels.com/photos/844124/pexels-photo-844124.jpeg?auto=compress&cs=tinysrgb&w=600" class="img-fluid rounded-4 mb-3" alt="Crypto 2">
                            </div>
                            <div class="col-md-4">
                                <img src="https://images.pexels.com/photos/730547/pexels-photo-730547.jpeg?auto=compress&cs=tinysrgb&w=600" class="img-fluid rounded-4 mb-3" alt="Crypto 3">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .object-fit-cover { object-fit: cover; }
</style>

<?php require_once 'includes/footer.php'; ?>
