<?php include('db/connection.php'); 
// If no DB data, set fallback
if(empty($row[1])) {
    $company_name = "SDB INNOVATIONS PRIVATE LIMITED";
    $phone = "8171437264";
    $email = "sdbinnovation@mail.com";
    $address = "Nagla Radhe, Umari National Highway 19, Sirsaganj, Firozabad, UP - 283151";
    $reg_no = "U27500UP2026PTC240629";
} else {
    $company_name = $row[1];
    $phone = $row[3] ?? "8171437264";
    $email = $row[4] ?? "sdbinnovation@mail.com";
    $address = $row[5] ?? "Nagla Radhe, Umari National Highway 19, Sirsaganj, Firozabad, UP - 283151";
    $reg_no = $row[6] ?? "U27500UP2026PTC240629";
}
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title><?php echo $company_name; ?> || Vision & Mission</title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="SDB Innovations, vision, mission, direct selling company, MLM, business opportunity" name="keywords">
    <meta content="Discover the vision and mission of SDB Innovations - building a legacy of trust, empowerment, and innovation in direct selling." name="description">

    <!-- Favicon -->
    <link href="img/logo/logo22222.png" rel="icon">

    <!-- Google Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">

    <!-- Font Awesome 6 -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" rel="stylesheet">

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- AOS Animation -->
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">

    <!-- Custom CSS -->
    <style>
        * {
            font-family: 'Poppins', sans-serif;
        }
        
        :root {
            --primary: #8B5CF6;
            --secondary: #EC4899;
            --accent: #10B981;
            --dark: #1F2937;
            --light: #F9FAFB;
        }
        
        body {
            overflow-x: hidden;
            background: #f8fafc;
        }
        
        /* Modern Gradient Backgrounds */
        .gradient-primary {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        
        .gradient-secondary {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
        }
        
        .gradient-success {
            background: linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%);
        }
        
        /* Glass Morphism */
        .glass-card {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
            border-radius: 20px;
            padding: 2rem;
            transition: all 0.3s ease;
        }
        
        .glass-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0,0,0,0.2);
        }
        
        /* Modern Cards */
        .modern-card {
            background: white;
            border-radius: 20px;
            padding: 2rem;
            transition: all 0.3s ease;
            border: 1px solid rgba(0,0,0,0.05);
            box-shadow: 0 10px 30px rgba(0,0,0,0.05);
            height: 100%;
        }
        
        .modern-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.15);
        }
        
        /* Page Header */
        .page-header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            position: relative;
            overflow: hidden;
            padding: 120px 0 80px;
        }
        
        .page-header::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="%23ffffff" fill-opacity="0.1" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,154.7C960,171,1056,181,1152,165.3C1248,149,1344,107,1392,85.3L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>');
            background-repeat: no-repeat;
            background-position: bottom;
            background-size: cover;
            opacity: 0.3;
        }
        
        /* Floating Animation */
        .floating {
            animation: floating 3s ease-in-out infinite;
        }
        
        @keyframes floating {
            0% { transform: translateY(0px); }
            50% { transform: translateY(-20px); }
            100% { transform: translateY(0px); }
        }
        
        /* Vision & Mission Cards */
        .vision-card {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border-radius: 30px;
            padding: 3rem;
            position: relative;
            overflow: hidden;
            transition: all 0.5s ease;
            height: 100%;
        }
        
        .vision-card::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -50%;
            width: 200%;
            height: 200%;
            background: rgba(255,255,255,0.1);
            transform: rotate(45deg);
            transition: all 0.5s ease;
        }
        
        .vision-card:hover::before {
            transform: rotate(90deg);
        }
        
        .vision-card:hover {
            transform: scale(1.02);
            box-shadow: 0 30px 60px rgba(102, 126, 234, 0.5);
        }
        
        .mission-card {
            background: linear-gradient(135deg, #EC4899 0%, #8B5CF6 100%);
            color: white;
            border-radius: 30px;
            padding: 3rem;
            position: relative;
            overflow: hidden;
            transition: all 0.5s ease;
            height: 100%;
        }
        
        .mission-card::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: rgba(255,255,255,0.1);
            transform: rotate(-45deg);
            transition: all 0.5s ease;
        }
        
        .mission-card:hover::before {
            transform: rotate(-90deg);
        }
        
        .mission-card:hover {
            transform: scale(1.02);
            box-shadow: 0 30px 60px rgba(236, 72, 153, 0.5);
        }
        
        /* Icon Circle */
        .icon-circle {
            width: 80px;
            height: 80px;
            background: rgba(255,255,255,0.2);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 2rem;
            font-size: 2.5rem;
            transition: all 0.3s ease;
        }
        
        .vision-card:hover .icon-circle,
        .mission-card:hover .icon-circle {
            transform: rotate(360deg);
            background: rgba(255,255,255,0.3);
        }
        
        /* Goal Cards */
        .goal-card {
            background: white;
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            transition: all 0.3s ease;
            border: 1px solid #e5e7eb;
            height: 100%;
        }
        
        .goal-card:hover {
            transform: translateY(-10px);
            border-color: var(--primary);
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.2);
        }
        
        .goal-icon {
            width: 70px;
            height: 70px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 1.5rem;
            color: white;
            font-size: 1.8rem;
            transition: all 0.3s ease;
        }
        
        .goal-card:hover .goal-icon {
            transform: scale(1.1) rotate(360deg);
        }
        
        /* Value Pillars */
        .pillar-card {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border-radius: 15px;
            padding: 1.5rem;
            text-align: center;
            transition: all 0.3s ease;
            height: 100%;
        }
        
        .pillar-card:hover {
            transform: translateY(-10px) scale(1.05);
            box-shadow: 0 20px 40px rgba(102, 126, 234, 0.5);
        }
        
        /* Timeline */
        .timeline-item {
            position: relative;
            padding: 20px 20px 20px 60px;
            background: white;
            border-radius: 15px;
            margin-bottom: 20px;
            border-left: 5px solid var(--primary);
            transition: all 0.3s ease;
            box-shadow: 0 5px 20px rgba(0,0,0,0.05);
        }
        
        .timeline-item:hover {
            transform: translateX(10px);
            box-shadow: 0 10px 30px rgba(139, 92, 246, 0.2);
        }
        
        .timeline-icon {
            position: absolute;
            left: -15px;
            top: 50%;
            transform: translateY(-50%);
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 1.2rem;
            box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
        }
        
        /* Project Carousel */
        .project-item {
            background: white;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            margin: 10px;
        }
        
        .project-item:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.3);
        }
        
        .position-relative {
            overflow: hidden;
            height: 250px;
        }
        
        .position-relative img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: all 0.5s ease;
        }
        
        .project-item:hover img {
            transform: scale(1.1);
        }
        
        .project-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(102, 126, 234, 0.9);
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            opacity: 0;
            transition: all 0.3s ease;
        }
        
        .project-item:hover .project-overlay {
            opacity: 1;
        }
        
        .project-overlay a {
            transform: scale(0);
            transition: all 0.3s ease;
        }
        
        .project-item:hover .project-overlay a {
            transform: scale(1);
        }
        
        .project-overlay a:hover {
            background: white !important;
            color: var(--primary) !important;
        }
        
        /* Section Titles */
        .section-title {
            text-align: center;
            margin-bottom: 60px;
        }
        
        .section-title h2 {
            font-size: 2.5rem;
            font-weight: 800;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            margin-bottom: 20px;
            position: relative;
            display: inline-block;
        }
        
        .section-title h2::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 4px;
            background: linear-gradient(90deg, #667eea, #764ba2);
            border-radius: 2px;
        }
        
        .section-title p {
            font-size: 1.1rem;
            color: #6B7280;
            max-width: 700px;
            margin: 0 auto;
        }
        
        /* Quote Box */
        .quote-box {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border-radius: 20px;
            padding: 3rem;
            text-align: center;
            position: relative;
            overflow: hidden;
        }
        
        .quote-box::before {
            content: '"';
            position: absolute;
            top: -50px;
            left: 20px;
            font-size: 200px;
            color: rgba(255,255,255,0.1);
            font-family: serif;
        }
        
        .quote-box::after {
            content: '"';
            position: absolute;
            bottom: -100px;
            right: 20px;
            font-size: 200px;
            color: rgba(255,255,255,0.1);
            font-family: serif;
        }
        
        /* Back to Top Button */
        .back-to-top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 50px;
            height: 50px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            box-shadow: 0 5px 20px rgba(102, 126, 234, 0.5);
            cursor: pointer;
            transition: all 0.3s ease;
            z-index: 1000;
            opacity: 0;
            visibility: hidden;
        }
        
        .back-to-top.show {
            opacity: 1;
            visibility: visible;
        }
        
        .back-to-top:hover {
            transform: scale(1.1) rotate(360deg);
            background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
        }
        
        /* Responsive */
        @media (max-width: 768px) {
            .section-title h2 {
                font-size: 2rem;
            }
            
            .vision-card, .mission-card {
                padding: 2rem;
            }
        }
    </style>
</head>

<body>

    <!-- Topbar Start -->
    <?php include('assets/header.php'); ?>
    <!-- Navbar End -->

    <!-- Page Header Start -->
    <div class="page-header">
        <div class="container text-center py-5">
            <h1 class="display-3 text-white mb-4 animated fadeInDown" data-aos="fade-down">Vision & Mission</h1>
            <nav aria-label="breadcrumb" data-aos="fade-up">
                <ol class="breadcrumb justify-content-center">
                    <li class="breadcrumb-item"><a href="index.php" class="text-white">Home</a></li>
                    <li class="breadcrumb-item active text-white" aria-current="page">Vision & Mission</li>
                </ol>
            </nav>
        </div>
    </div>
    <!-- Page Header End -->

    <!-- Vision & Mission Main Section Start -->
    <div class="container-xxl py-5">
        <div class="container">
            <div class="row g-5">
                <!-- Vision Card -->
                <div class="col-lg-6" data-aos="fade-right">
                    <div class="vision-card">
                        <div class="icon-circle">
                            <i class="fas fa-eye"></i>
                        </div>
                        <h2 class="display-5 text-white mb-4">Our Vision</h2>
                        <p class="lead mb-4">"Horizontal and vertical growth with the establishment of our company as a provider of advanced business opportunities and wellness solutions!"</p>
                        <p class="text-white-50 mb-4">CMD Mr. Mohan Singh focuses on high quality, timely service delivery and affordable solutions. We help our members achieve their business goals and objectives in the most efficient way. High-quality services and products are provided by the company with full dedication and commitment. Our direct selling solutions are industry-leading and are designed to meet the current and future needs of our members.</p>
                        
                        <div class="row mt-5">
                            <div class="col-6">
                                <h3 class="text-white">25+</h3>
                                <p class="text-white-50">States Covered</p>
                            </div>
                            <div class="col-6">
                                <h3 class="text-white">50K+</h3>
                                <p class="text-white-50">Happy Members</p>
                            </div>
                        </div>
                        
                        <div class="mt-4">
                            <span class="badge bg-white text-primary p-2 me-2">ISO Certified</span>
                            <span class="badge bg-white text-primary p-2 me-2">MSME Registered</span>
                            <span class="badge bg-white text-primary p-2">Govt Approved</span>
                        </div>
                    </div>
                </div>
                
                <!-- Mission Card -->
                <div class="col-lg-6" data-aos="fade-left">
                    <div class="mission-card">
                        <div class="icon-circle">
                            <i class="fas fa-bullseye"></i>
                        </div>
                        <h2 class="display-5 text-white mb-4">Our Mission</h2>
                        <p class="lead mb-4">"Company's mission is the development of high-quality and affordable wellness products and business opportunities that empower individuals to achieve financial freedom."</p>
                        <p class="text-white-50 mb-4">The focus of our company is to help the success of our members. We ensure that our members enjoy great success by providing top-notch wellness products using specialized direct selling strategies. We are always striving to achieve excellence by providing high-quality business opportunities to our members across India.</p>
                        
                        <div class="row mt-5">
                            <div class="col-6">
                                <h3 class="text-white">100+</h3>
                                <p class="text-white-50">Products</p>
                            </div>
                            <div class="col-6">
                                <h3 class="text-white">10K+</h3>
                                <p class="text-white-50">Entrepreneurs</p>
                            </div>
                        </div>
                        
                        <div class="mt-4">
                            <span class="badge bg-white text-primary p-2 me-2">Quality Products</span>
                            <span class="badge bg-white text-primary p-2 me-2">Member Success</span>
                            <span class="badge bg-white text-primary p-2">24/7 Support</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Vision & Mission Main Section End -->

    <!-- Founder Quote Start -->
    <div class="container-xxl py-5 bg-light">
        <div class="container">
            <div class="quote-box" data-aos="zoom-in">
                <i class="fas fa-quote-left fa-3x mb-4 opacity-50"></i>
                <h3 class="text-white mb-4">"We are building a legacy of trust and empowerment, creating millionaires and transforming lives through innovative wellness products."</h3>
                <p class="text-white-50 mb-0">- Mr. Mohan Singh, CMD</p>
            </div>
        </div>
    </div>
    <!-- Founder Quote End -->

    <!-- Core Goals Start -->
    <div class="container-xxl py-5">
        <div class="container">
            <div class="section-title" data-aos="fade-up">
                <h2>Our Core Goals</h2>
                <p>Strategic objectives that guide our journey</p>
            </div>
            
            <div class="row g-4">
                <div class="col-md-3" data-aos="flip-left">
                    <div class="goal-card">
                        <div class="goal-icon">
                            <i class="fas fa-chart-line"></i>
                        </div>
                        <h5>Horizontal Growth</h5>
                        <p class="small text-muted">Expand across all 28 states and 8 union territories by 2025</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="flip-left" data-aos-delay="100">
                    <div class="goal-card">
                        <div class="goal-icon">
                            <i class="fas fa-arrow-up"></i>
                        </div>
                        <h5>Vertical Growth</h5>
                        <p class="small text-muted">Deepen market penetration in existing territories</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="flip-left" data-aos-delay="200">
                    <div class="goal-card">
                        <div class="goal-icon">
                            <i class="fas fa-cube"></i>
                        </div>
                        <h5>Product Innovation</h5>
                        <p class="small text-muted">Launch 50+ new wellness products by 2026</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="flip-left" data-aos-delay="300">
                    <div class="goal-card">
                        <div class="goal-icon">
                            <i class="fas fa-users"></i>
                        </div>
                        <h5>Member Success</h5>
                        <p class="small text-muted">Create 10,000+ successful entrepreneurs</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Core Goals End -->

    <!-- Value Pillars Start -->
    <div class="container-xxl py-5 bg-light">
        <div class="container">
            <div class="section-title" data-aos="fade-up">
                <h2>Our Value Pillars</h2>
                <p>The foundation of everything we do</p>
            </div>
            
            <div class="row g-4">
                <div class="col-md-3" data-aos="fade-up">
                    <div class="pillar-card">
                        <i class="fas fa-gem fa-3x mb-3"></i>
                        <h5 class="text-white">Quality</h5>
                        <p class="text-white-50 small">Premium wellness products</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="fade-up" data-aos-delay="100">
                    <div class="pillar-card" style="background: linear-gradient(135deg, #EC4899 0%, #8B5CF6 100%);">
                        <i class="fas fa-hand-holding-heart fa-3x mb-3"></i>
                        <h5 class="text-white">Trust</h5>
                        <p class="text-white-50 small">Transparent operations</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="fade-up" data-aos-delay="200">
                    <div class="pillar-card" style="background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);">
                        <i class="fas fa-lightbulb fa-3x mb-3"></i>
                        <h5 class="text-white">Innovation</h5>
                        <p class="text-white-50 small">Continuous improvement</p>
                    </div>
                </div>
                
                <div class="col-md-3" data-aos="fade-up" data-aos-delay="300">
                    <div class="pillar-card" style="background: linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%);">
                        <i class="fas fa-users fa-3x mb-3"></i>
                        <h5 class="text-white">Empowerment</h5>
                        <p class="text-white-50 small">Member success first</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Value Pillars End -->

    <!-- Journey Timeline Start -->
    <div class="container-xxl py-5">
        <div class="container">
            <div class="section-title" data-aos="fade-up">
                <h2>Our Journey Towards Vision</h2>
                <p>Milestones we've achieved and future goals</p>
            </div>
            
            <div class="row" data-aos="fade-up">
                <div class="col-lg-8 mx-auto">
                    <div class="timeline-item">
                        <div class="timeline-icon"><i class="fas fa-calendar-alt"></i></div>
                        <h4>2023 - Foundation</h4>
                        <p>SDB Innovations Private Limited was established with a vision to create meaningful impact.</p>
                    </div>
                    
                    <div class="timeline-item">
                        <div class="timeline-icon"><i class="fas fa-certificate"></i></div>
                        <h4>2024 - Certifications Achieved</h4>
                        <p>ISO certification, MSME registration, and Government of India approval obtained.</p>
                    </div>
                    
                    <div class="timeline-item">
                        <div class="timeline-icon"><i class="fas fa-trophy"></i></div>
                        <h4>2025 - Current Milestone</h4>
                        <p>50,000+ members across 25+ states with 100+ wellness products.</p>
                    </div>
                    
                    <div class="timeline-item">
                        <div class="timeline-icon"><i class="fas fa-globe"></i></div>
                        <h4>2026 - Vision Forward</h4>
                        <p>Pan-India presence, global expansion, and 10,000+ entrepreneurs.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Journey Timeline End -->

    <!-- Our Projects/Services Start -->
    <div class="container-xxl pt-5 bg-light">
        <div class="container">
            <div class="section-title" data-aos="fade-up">
                <h2>Our Key Focus Areas</h2>
                <p>Driving innovation and excellence in direct selling</p>
            </div>
            
            <div class="owl-carousel project-carousel wow fadeInUp" data-aos="fade-up">
                <div class="project-item mb-5">
                    <div class="position-relative">
                        <img class="img-fluid" src="img/project-1.jpg" alt="Wellness Products">
                        <div class="project-overlay">
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="img/project-1.jpg" data-lightbox="project"><i class="fa fa-eye"></i></a>
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="#"><i class="fa fa-link"></i></a>
                        </div>
                    </div>
                    <div class="p-4">
                        <a class="d-block h5" href="#">Wellness Product Innovation</a>
                        <span class="text-muted">Alkaline water purifiers, EMS massagers, anti-radiation chips</span>
                    </div>
                </div>
                
                <div class="project-item mb-5">
                    <div class="position-relative">
                        <img class="img-fluid" src="img/project-2.jpg" alt="Business Opportunity">
                        <div class="project-overlay">
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="img/project-2.jpg" data-lightbox="project"><i class="fa fa-eye"></i></a>
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="#"><i class="fa fa-link"></i></a>
                        </div>
                    </div>
                    <div class="p-4">
                        <a class="d-block h5" href="#">Direct Selling Platform</a>
                        <span class="text-muted">Autopool system, royalty income, multiple growth opportunities</span>
                    </div>
                </div>
                
                <div class="project-item mb-5">
                    <div class="position-relative">
                        <img class="img-fluid" src="img/project-3.jpg" alt="Training Programs">
                        <div class="project-overlay">
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="img/project-3.jpg" data-lightbox="project"><i class="fa fa-eye"></i></a>
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="#"><i class="fa fa-link"></i></a>
                        </div>
                    </div>
                    <div class="p-4">
                        <a class="d-block h5" href="#">Member Training & Development</a>
                        <span class="text-muted">MSME programs, leadership workshops, business development</span>
                    </div>
                </div>
                
                <div class="project-item mb-5">
                    <div class="position-relative">
                        <img class="img-fluid" src="img/project-4.jpg" alt="Social Impact">
                        <div class="project-overlay">
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="img/project-4.jpg" data-lightbox="project"><i class="fa fa-eye"></i></a>
                            <a class="btn btn-lg-square btn-light rounded-circle m-1" href="#"><i class="fa fa-link"></i></a>
                        </div>
                    </div>
                    <div class="p-4">
                        <a class="d-block h5" href="#">Social Impact Initiatives</a>
                        <span class="text-muted">Education support, cloth donations, environment protection</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Our Projects End -->

    <!-- Leadership Quote Start -->
    <div class="container-xxl py-5">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-md-4" data-aos="fade-right">
                    <img src="img/team-1.jpg" class="img-fluid rounded-circle shadow-lg" alt="Mr. Mohan Singh">
                </div>
                <div class="col-md-8" data-aos="fade-left">
                    <div class="modern-card">
                        <i class="fas fa-quote-left fa-3x text-primary mb-3"></i>
                        <h4 class="mb-3">Message from CMD</h4>
                        <p class="lead">"At SDB Innovations, we believe in creating value that goes beyond business. Our vision is to empower every individual who joins us with the tools, training, and opportunities to build a better future. We are committed to quality, transparency, and the success of our members."</p>
                        <p class="fw-bold mb-0">- Mr. Mohan Singh</p>
                        <p class="text-primary">Chairman & Managing Director</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Leadership Quote End -->

    <!-- Footer Start -->
    <?php include('assets/footer.php'); ?>

    <!-- Back to Top -->
    <a href="#" class="back-to-top" id="backToTop">
        <i class="bi bi-arrow-up"></i>
    </a>

    <!-- JavaScript Libraries -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
    <script src="lib/wow/wow.min.js"></script>
    <script src="lib/easing/easing.min.js"></script>
    <script src="lib/waypoints/waypoints.min.js"></script>
    <script src="lib/owlcarousel/owl.carousel.min.js"></script>
    <script src="lib/lightbox/js/lightbox.min.js"></script>

    <!-- Template Javascript -->
    <script src="js/main.js"></script>
    
    <script>
        // Initialize AOS
        AOS.init({
            duration: 1000,
            once: true,
            offset: 100
        });
        
        // Hide spinner on load
        window.addEventListener('load', function() {
            setTimeout(function() {
                document.getElementById('spinner').classList.remove('show');
            }, 500);
        });
        
        // Back to top button
        window.addEventListener('scroll', function() {
            const backToTop = document.getElementById('backToTop');
            if (window.scrollY > 300) {
                backToTop.classList.add('show');
            } else {
                backToTop.classList.remove('show');
            }
        });
        
        // Smooth scroll to top
        document.getElementById('backToTop').addEventListener('click', function(e) {
            e.preventDefault();
            window.scrollTo({
                top: 0,
                behavior: 'smooth'
            });
        });
        
        // Initialize Owl Carousel
        $('.project-carousel').owlCarousel({
            loop: true,
            margin: 30,
            nav: true,
            dots: false,
            autoplay: true,
            autoplayTimeout: 5000,
            responsive: {
                0: { items: 1 },
                600: { items: 2 },
                1000: { items: 3 }
            }
        });
    </script>
</body>

</html>