i dont use social media so you can remove the icons on the bottom . i offer A Selection of the services provided
Remote Customer Support
Efficient remote support via ticketing systems and professional emails for seamless customer assistance.

Computer Hardware repair & upgrade
Expert computer hardware repair and upgrades for optimal performance.

BSOD Diagnosis & Repair
Specialized BSOD diagnosis and swift repair solutions for system stability.

Windows System Architect: Orchestrating Active Directory, RDP, and VPN Solutions
Strategic architect optimizing Windows environments with Active Directory, RDP, and VPN.

Network Infrastructure Specialist
Experienced in TCP/IP, LAN/WLAN, Wi-Fi, VPN, DHCP, Port Forwarding, Switching, and Routing

Digital Duplication
Cloning and Resilient Backup & Recovery Mastery

please ajust and imprive ui ux use bootstrap 5 and provide the full code :

<?php
$title = "SkyPulse IT Services";
$description = "Leading the way in IT solutions with innovation and excellence. Offering web development, IT consulting, cloud solutions, cybersecurity, and tech support.";
$aboutContent = "At SkyPulse.uk, we transform the way businesses operate by providing cutting-edge IT solutions. We focus on customer satisfaction and tailor our services to meet your unique needs.";
$services = [
    ["icon" => "laptop-code", "title" => "Web Development", "description" => "Building responsive and SEO-friendly websites to enhance your online presence."],
    ["icon" => "chalkboard-teacher", "title" => "IT Consulting", "description" => "Providing strategic IT guidance to help streamline your business operations."],
    ["icon" => "cloud", "title" => "Cloud Solutions", "description" => "Offering scalable cloud solutions to optimize your business performance."],
    ["icon" => "shield-alt", "title" => "Cybersecurity", "description" => "Implementing robust security measures to protect your data assets."],
    ["icon" => "headset", "title" => "Tech Support", "description" => "Delivering reliable tech support to resolve IT issues promptly."]
];
$contactDescription = "Whether you have questions or need assistance, feel free to contact us. We're here to support your IT journey.";
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="<?php echo htmlspecialchars($description); ?>">
    <meta name="keywords" content="IT Services, Web Development, IT Consulting, Cloud Solutions, Cybersecurity, Tech Support">
    <meta name="author" content="SkyPulse.uk">
    <title><?php echo htmlspecialchars($title); ?></title>
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
    <style>
        body {
            font-family: 'Arial', sans-serif;
            line-height: 1.6;
            color: #333;
            padding-top: 56px;
        }
        .navbar {
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 1000;
        }
        .jumbotron {
            background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('https://source.unsplash.com/1600x900/?technology') no-repeat center center;
            background-size: cover;
            color: #fff;
            height: 80vh;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }
        .content-section {
            padding: 60px 0;
        }
        .service-icon {
            font-size: 3em;
            color: #007bff;
            margin-bottom: 15px;
        }
        .modal-content {
            padding: 20px;
        }
        footer {
            background-color: #343a40;
            padding: 20px 0;
            text-align: center;
            color: #fff;
        }
        .social-icons a {
            color: #fff;
            transition: color 0.3s;
        }
        .social-icons a:hover {
            color: #007bff;
        }
    </style>
</head>
<body>

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <a class="navbar-brand" href="#">SkyPulse.uk</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item"><a class="nav-link" href="#" data-toggle="modal" data-target="#aboutModal">About</a></li>
            <li class="nav-item"><a class="nav-link" href="#" data-toggle="modal" data-target="#servicesModal">Services</a></li>
            <li class="nav-item"><a class="nav-link" href="#" data-toggle="modal" data-target="#contactModal">Contact</a></li>
            <li class="nav-item"><a class="nav-link" href="#" data-toggle="modal" data-target="#privacyModal">Privacy Policy</a></li>
        </ul>
    </div>
</nav>

<section class="jumbotron text-center">
    <h1 class="display-4"><?php echo htmlspecialchars($title); ?></h1>
    <p class="lead"><?php echo htmlspecialchars($description); ?></p>
</section>

<!-- About Modal -->
<div class="modal fade" id="aboutModal" tabindex="-1" aria-labelledby="aboutModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="aboutModalLabel">About Us</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p><?php echo htmlspecialchars($aboutContent); ?></p>
            </div>
        </div>
    </div>
</div>

<!-- Services Modal -->
<div class="modal fade" id="servicesModal" tabindex="-1" aria-labelledby="servicesModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="servicesModalLabel">Our Services</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row text-center">
                    <?php foreach ($services as $service): ?>
                        <div class="col-md-4 mb-4">
                            <div class='service-icon'><i class='fas fa-<?php echo $service["icon"]; ?>'></i></div>
                            <h4 class='mt-3'><?php echo $service["title"]; ?></h4>
                            <p><?php echo $service["description"]; ?></p>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Contact Modal -->
<div class="modal fade" id="contactModal" tabindex="-1" aria-labelledby="contactModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="contactModalLabel">Get in Touch</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p><?php echo htmlspecialchars($contactDescription); ?></p>
                <form id="contactForm" method="post">
                    <div class="form-group">
                        <input type="text" class="form-control" name="name" placeholder="Name" required>
                    </div>
                    <div class="form-group">
                        <input type="email" class="form-control" name="email" placeholder="Email" required>
                    </div>
                    <div class="form-group">
                        <textarea class="form-control" name="message" rows="4" placeholder="Message" required></textarea>
                    </div>
                    <button type="submit" class="btn btn-primary btn-block">Send Message</button>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Privacy Policy Modal -->
<div class="modal fade" id="privacyModal" tabindex="-1" aria-labelledby="privacyModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="privacyModalLabel">Privacy Policy</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>This Privacy Policy outlines how SkyPulse IT Services collects, uses, and protects your information. We adhere to the requirements set forth by Google AdSense.</p>
                <p>We collect user data to enhance our service and provide tailored advertisements. Your data privacy is a priority, and we implement security measures to safeguard information.</p>
                <p>For more details, please contact us directly at info@skypulse.uk.</p>
            </div>
        </div>
    </div>
</div>

<footer>
    <p>&copy; 2023 SkyPulse.uk - All Rights Reserved</p>
    <div class="social-icons">
        <a href="#" class="mx-2"><i class="fab fa-facebook-f"></i></a>
        <a href="#" class="mx-2"><i class="fab fa-twitter"></i></a>
        <a href="#" class="mx-2"><i class="fab fa-linkedin-in"></i></a>
    </div>
</footer>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script>
    $(document).ready(function() {
        // AJAX form submission
        $('#contactForm').on('submit', function(event) {
            event.preventDefault();
            $.ajax({
                type: 'POST',
                url: 'contact.php', // Replace with your server script to handle contact form submission
                data: $(this).serialize(),
                success: function(response) {
                    alert('Message sent successfully!');
                    $('#contactModal').modal('hide');
                    $('#contactForm')[0].reset();
                },
                error: function() {
                    alert('There was an error, please try again later.');
                }
            });
        });
    });
</script>

</body>
</html>