<?php require_once __DIR__ . '/_site_content.php'; ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php sc_text('consulting', 'meta_title', 'Consulting Services - SmartThink', $region); ?></title>
    <!-- Core CSS frameworks -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <!-- Project styles -->
    <link rel="stylesheet" href="../assets/css/style.css">
    <link rel="stylesheet" href="../assets/css/modern-ux.css">
    <link rel="stylesheet" href="../assets/css/capgemini-theme.css">
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet">
</head>
<body>
    <!-- Scroll Progress Bar -->
    <div class="scroll-progress" id="scrollProgress"></div>

    <!-- Regional Selector Banner -->
    <div class="regional-banner">
        <div class="container">
            <div class="region-selector">
                <span class="region-label">Select Your Region:</span>
                <div class="region-options">
                    <button class="region-btn active" data-region="usa">🇺🇸 USA</button>
                    <button class="region-btn" data-region="europe">🇪🇺 Europe</button>
                    <button class="region-btn" data-region="africa">🌍 Africa</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Modern Navigation Header -->
    <header class="modern-header">
        <nav class="navbar navbar-expand-lg">
            <div class="container">
                <a class="navbar-brand" href="index.php">
                    <div class="brand-logo">
                        <img src="../assets/images/logo.jpeg" alt="SmartThink" class="logo-img">
                        <span class="brand-text">SmartThink</span>
                    </div>
                </a>

                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNav">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="mainNav">
                    <ul class="navbar-nav mx-auto">
                        <li class="nav-item"><a class="nav-link" href="index.php">Home</a></li>
                        <li class="nav-item"><a class="nav-link" href="about.php">About Us</a></li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle active" href="services.php" id="servicesDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Services</a>
                            <ul class="dropdown-menu" aria-labelledby="servicesDropdown">
                                <li><a class="dropdown-item" href="training.php">Training</a></li>
                                <li><a class="dropdown-item active" href="consulting.php">Consulting</a></li>
                                <li><a class="dropdown-item" href="recruitment.php">Recruitment</a></li>
                            </ul>
                        </li>
                        <li class="nav-item"><a class="nav-link" href="courses.php">Courses</a></li>
                   
                        <li class="nav-item"><a class="nav-link" href="contact.php">Contact Us</a></li>
                    </ul>
                    <ul class="navbar-nav ms-auto">
                        <li class="nav-item">
                            <a class="nav-link login-btn" href="../lms/login.php">
                                <i class="fas fa-sign-in-alt"></i> Login
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link register-btn" href="../lms/register.php">
                                <i class="fas fa-user-plus"></i> Register
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
    </header>

    <!-- Consulting Hero Section -->
    <section class="page-hero">
        <div class="hero-background"></div>
        <div class="hero-overlay"></div>
        <div class="container">
            <div class="row align-items-center min-vh-60">
                <div class="col-lg-8 mx-auto text-center">
                    <div class="hero-content-modern">
                        <div class="hero-badge">
                            <span class="badge-text"><?php sc_text('consulting', 'hero_badge', 'Cybersecurity &amp; IT Consulting', $region); ?></span>
                        </div>
                        <h1 class="hero-title-modern"><?php sc_text('consulting', 'hero_title', 'Designing Secure, Resilient Digital Platforms', $region); ?></h1>
                        <p class="hero-subtitle-modern"><?php sc_html('consulting', 'hero_subtitle', 'Work with experienced security consultants and solution architects to assess risk, harden infrastructure, and align with global standards.', $region); ?></p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Consulting Offerings Section -->
    <section class="our-story-section">
        <div class="container">
            <div class="section-header-modern text-left mb-5">
                <h2 class="section-title-modern"><?php sc_text('consulting', 'offerings_title', 'Advisory &amp; Implementation Services', $region); ?></h2>
                <p class="section-subtitle-modern"><?php sc_html('consulting', 'offerings_subtitle', 'From quick assessments to full transformation programmes.', $region); ?></p>
            </div>
            <div class="row g-4">
                <div class="col-lg-4">
                    <div class="contact-info-card">
                        <div class="info-icon">
                            <i class="fas fa-bug-slash"></i>
                        </div>
                        <h3>Security Assessments</h3>
                        <p>Vulnerability assessments, security posture reviews, gap analysis and remediation roadmaps tailored to your environment.</p>
                        <a href="contact.php" class="btn btn-outline">Request Assessment</a>
                    </div>
                </div>
                <div class="col-lg-4">
                    <div class="contact-info-card">
                        <div class="info-icon">
                            <i class="fas fa-diagram-project"></i>
                        </div>
                        <h3>Architecture &amp; Design</h3>
                        <p>Secure network, cloud and application architectures aligned to zero‑trust principles and best practice frameworks.</p>
                        <a href="contact.php" class="btn btn-outline">Talk to an Architect</a>
                    </div>
                </div>
                <div class="col-lg-4">
                    <div class="contact-info-card">
                        <div class="info-icon">
                            <i class="fas fa-list-check"></i>
                        </div>
                        <h3>Compliance &amp; Governance</h3>
                        <p>Guidance for ISO 27001, GDPR, PCI‑DSS, HIPAA and regional data protection laws with practical implementation support.</p>
                        <a href="contact.php" class="btn btn-outline">Plan Compliance</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Why SmartThink3 Consulting Section -->
    <section class="mission-vision-section">
        <div class="container">
            <div class="row g-4">
                <div class="col-lg-6">
                    <div class="mission-card">
                        <div class="card-icon">
                            <i class="fas fa-people-group"></i>
                        </div>
                        <h3>Embedded With Your Team</h3>
                        <p>Our consultants integrate with your security, IT and business stakeholders, ensuring recommendations are realistic and actionable for your context.</p>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="vision-card">
                        <div class="card-icon">
                            <i class="fas fa-gauge-high"></i>
                        </div>
                        <h3>Outcomes, Not Just Reports</h3>
                        <p>We focus on measurable risk reduction, improved detection and response, and better user experiences across your digital platforms.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Connect With Us Section -->
    <section class="cta-section">
        <div class="container">
            <div class="cta-content text-center">
                <h2><?php sc_text('consulting', 'cta_title', 'Schedule a Security Consultation', $region); ?></h2>
                <p><?php sc_html('consulting', 'cta_text', 'Discuss your current challenges and roadmap with our cybersecurity consulting team.', $region); ?></p>
                <div class="cta-actions justify-content-center flex-wrap">
                    <div class="social-links-large">
                        <a href="#" class="social-link">
                            <i class="fab fa-linkedin"></i>
                            <span>LinkedIn</span>
                        </a>
                        <a href="#" class="social-link">
                            <i class="fab fa-twitter"></i>
                            <span>Twitter / X</span>
                        </a>
                        <a href="#" class="social-link">
                            <i class="fab fa-facebook"></i>
                            <span>Facebook</span>
                        </a>
                        <a href="#" class="social-link">
                            <i class="fab fa-instagram"></i>
                            <span>Instagram</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- WhatsApp Widget -->
    <div class="whatsapp-widget" id="whatsappWidget">
        <div class="whatsapp-button">
            <i class="fab fa-whatsapp"></i>
        </div>
        <div class="whatsapp-chat">
            <div class="chat-header">
                <h4>SmartThink Support</h4>
                <span class="status">Online</span>
            </div>
            <div class="chat-messages" id="chatMessages">
                <div class="message bot">
                    Have a consulting question? Send us the details and we'll respond shortly.
                </div>
            </div>
            <div class="chat-input">
                <input type="text" id="chatInput" placeholder="Type your message...">
                <button id="sendMessage"><i class="fas fa-paper-plane"></i></button>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <footer class="main-footer">
        <div class="container">
            <div class="row">
                <div class="col-lg-4">
                    <div class="footer-brand">
                            <img src="../assets/images/smartthinklogos.jpeg" alt="SmartThink" class="footer-logo">
                        <p><?php sc_html('home', 'footer_about', 'Partnering with organisations to build secure, resilient digital ecosystems.', $region); ?></p>
                        <div class="social-links">
                            <a href="#"><i class="fab fa-facebook"></i></a>
                            <a href="#"><i class="fab fa-twitter"></i></a>
                            <a href="#"><i class="fab fa-linkedin"></i></a>
                            <a href="#"><i class="fab fa-instagram"></i></a>
                        </div>
                    </div>
                </div>

                <div class="col-lg-2">
                    <div class="footer-links">
                        <h4>Quick Links</h4>
                        <ul>
                            <li><a href="index.php">Home</a></li>
                            <li><a href="about.php">About Us</a></li>
                            <li><a href="courses.php">Courses</a></li>
                            <li><a href="services.php">Services</a></li>
                        </ul>
                    </div>
                </div>

                <div class="col-lg-2">
                    <div class="footer-links">
                        <h4>Resources</h4>
                        <ul>
                            <li><a href="blog.html">Blog</a></li>
                            <li><a href="#">FAQs</a></li>
                            <li><a href="#">Support</a></li>
                            <li><a href="#">Careers</a></li>
                        </ul>
                    </div>
                </div>

                <div class="col-lg-4">
                    <div class="footer-newsletter">
                        <h4>Subscribe to Our Newsletter</h4>
                        <p>Receive security insights, best practices and feature updates.</p>
                        <form class="newsletter-form">
                            <input type="email" placeholder="Your email address">
                            <button type="submit">Subscribe</button>
                        </form>
                    </div>
                </div>
            </div>

            <div class="footer-bottom">
                <div class="row">
                    <div class="col-md-6">
                        <p><?php sc_html('home', 'footer_copyright', '&copy; 2026 SmartThink. All rights reserved.', $region); ?></p>
                    </div>
                    <div class="col-md-6">
                        <div class="footer-bottom-links">
                            <a href="#">Privacy Policy</a>
                            <a href="#">Terms of Service</a>
                            <a href="#">Cookie Policy</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>

    <!-- Scripts -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js"></script>
    <script src="../assets/js/main.js"></script>
    <script src="../assets/js/modern-interactions.js"></script>
</body>
</html>
