<?php require_once 'config.php'; ?>

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

<head>
    <meta charset="utf-8">

    <?php

    //Title and Seo Section
    $current_page = basename($_SERVER['PHP_SELF']);

    $page_titles = [
        'index.php' => '| Engineering Excellence in Kuwait & UAE',
        'about.php' => '| About Us',
        'service.php' => '| Our Services',
        'contact.php' => '| Contact Us'
    ];

    $page_seo = [
        'index.php' => [
            'keyword' => 'Al faraj Power Station Contracting L.L.C | Engineering Excellence in Kuwait & UAE',
            'description' => 'Construction company delivering high-quality solutions'
        ],
        'about.php' => [
            'keyword' => 'About Us',
            'description' => 'Learn more about Al faraj Power Station Contracting L.L.Chistory, mission, and leadership team.'
        ],
        'service.php' => [
            'keyword' => 'Our Services',
            'description' => 'Discover the wide range of industrial and engineering services we offer.'
        ],
        'contact.php' => [
            'keyword' => 'Contact Us',
            'description' => 'Reach out to Al faraj Power Station Contracting L.L.C for inquiries, quotes, or support.'
        ]
    ];

    $page_meta = [
        'index.php' => [
            'title' => 'Al faraj Power Station Contracting L.L.C | Engineering Excellence in Kuwait & UAE',
            'description' => 'Construction company delivering high-quality solutions'
        ],
        'about.php' => [
            'title' => 'About Us',
            'description' => 'Learn more about Al faraj Power Station Contracting L.L.C history, mission, and leadership team.'
        ],
        'service.php' => [
            'title' => 'Our Services',
            'description' => 'Discover the wide range of industrial and engineering services we offer.'
        ],
        'contact.php' => [
            'title' => 'Contact Us',
            'description' => 'Reach out to Al faraj Power Station Contracting L.L.C for inquiries, quotes, or support.'
        ]
    ];

    // Set fallback/default if not found
    $og_title = isset($page_meta[$current_page]['title']) ? $page_meta[$current_page]['title'] : 'Al faraj Power Station Contracting L.L.C';
    $og_description = isset($page_meta[$current_page]['description']) ? $page_meta[$current_page]['description'] : 'Reliable engineering excellence tailored to your needs.';
    $page_title_suffix = isset($page_titles[$current_page]) ? $page_titles[$current_page] : '';
    $seo_keyword = isset($page_meta[$current_page]['keyword']) ? $page_meta[$current_page]['keyword'] : 'Al faraj Power Station Contracting L.L.C';
    $seo_description = isset($page_meta[$current_page]['description']) ? $page_meta[$current_page]['description'] : 'Reliable engineering excellence tailored to your needs.';

    //End Title and Seo Section
    ?>

    <title>Al faraj Power Station Contracting L.L.C <?= $page_title_suffix ?  $page_title_suffix : '' ?></title>
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="<?= $seo_keyword ?>" name="keywords">
    <meta content="<?= $seo_description ?>" name="description">
    <meta property="og:title" content="<?= $og_title ?  $og_title : 'Al faraj Power Station Contracting L.L.C' ?>" />
    <meta property="og:description" content="<?= $og_description ?>" />
    <meta property="og:image" content="<?= url('img/logo.webp') ?>" />
    <meta property="og:type" content="website" />


    <!-- Favicon -->
    <link href="<?= url('img/favicon.ico') ?>" rel="icon">

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

    <!-- CSS Libraries -->
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
    <link href="lib/flaticon/font/flaticon.css" rel="stylesheet">
    <link href="lib/animate/animate.min.css" rel="stylesheet">
    <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
    <link href="lib/lightbox/css/lightbox.min.css" rel="stylesheet">
    <link href="lib/slick/slick.css" rel="stylesheet">
    <link href="lib/slick/slick-theme.css" rel="stylesheet">

    <!-- Template Stylesheet -->
    <link href="css/style.css" rel="stylesheet">

    <!-- JavaScript Libraries -->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <!-- For swal alerts -->

    <style>
        .error {
            color: #dc3545;
            font-size: 0.875em;
            margin-top: 0.25rem;
        }
    </style>
</head>

<body>
    <div class="">
        <!-- Top Bar Start -->
        <div class="top-bar">
            <div class="container-fluid">
                <div class="row align-items-center">
                    <div class="col-lg-4 col-md-12">
                        <div class="logo">
                            <a href="index.php">
                                <img src="img/logo.webp" alt="Logo">
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-8 col-md-7 d-none d-lg-block">
                        <div class="row justify-content-end">
                            <div class="col-4">
                                <div class="top-bar-item">
                                    <div class="top-bar-icon email">
                                        <img src="img/phone.webp">
                                    </div>
                                    <div class="top-bar-text">
                                        <h3>Call Us</h3>
                                        <p>+971 4261 3593</p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="top-bar-item email">
                                    <img src="img/email.webp">
                                    <div class="top-bar-text">
                                        <h3>Email Us</h3>
                                        <p>Info@alfarajdubai.com</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Top Bar End -->

        <!-- Nav Bar Start -->
        <div class="nav-bar">
            <div class="container-fluid">
                <nav class="navbar navbar-expand-lg bg-dark navbar-dark py-4 py-lg-3">
                    <a href="#" class="navbar-brand"></a>
                    <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navbarCollapse" style="position: absolute;right: 10px;">
                        <span class="navbar-toggler-icon"></span>
                    </button>

                    <div class="collapse navbar-collapse justify-content-between" id="navbarCollapse">
                        <div class="navbar-nav mr-auto">
                            <!-- <a href="team.php" class="nav-item nav-link">Team</a>
                                <a href="portfolio.php" class="nav-item nav-link">Project</a>
                                <div class="nav-item dropdown">
                                    <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Pages</a>
                                    <div class="dropdown-menu">
                                        <a href="blog.php" class="dropdown-item">Blog Page</a>
                                        <a href="single.php" class="dropdown-item">Single Page</a>
                                    </div> -->
                        </div>
                        <a href="index.php" class="nav-item nav-link active">Home</a>
                        <a href="about.php" class="nav-item nav-link">About</a>
                        <a href="service.php" class="nav-item nav-link">Service</a>
                        <a href="contact.php" class="nav-item nav-link">Contact</a>
                    </div>
                    <div class="ml-auto">
                        <a class="btn" href="contact.php">Get A Quote</a>
                    </div>
            </div>
            </nav>
        </div>
    </div>
    <!-- Nav Bar End -->