File Manager

Editing:index.php

<?php require APPROOT . '/views/layouts/header.php'; ?>

<section class="hero-section" style="background-image: url('<?php echo URLROOT; ?>/assets/img/hero_bg.jpg'); background-size: cover; background-position: center;">
  <div class="hero-overlay" style="background: linear-gradient(135deg, rgba(28,46,35,0.85) 0%, rgba(18,30,23,0.7) 100%);"></div>
  <div class="container hero-content text-center">
    <div class="row justify-content-center">
      <div class="col-lg-10 col-xl-9 fade-in-up">
        <div class="hero-glass-box text-white">
          <h1 class="display-3 font-outfit fw-bold mb-4">Beyond <span class="text-gold">Protecting</span></h1>
          <p class="lead mb-5 fs-4">A pioneer in the security industry with over 3 decades in Sri Lanka providing end to end solutions.</p>
          <div class="d-flex justify-content-center gap-3 mt-4">
            <a href="<?php echo URLROOT; ?>/pages/services" class="btn btn-gold btn-lg px-5 rounded-pill">Our Services</a>
            <a href="<?php echo URLROOT; ?>/pages/contact" class="btn btn-outline-light btn-lg px-5 rounded-pill">Contact Us</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

<section class="ai-section section-padding">
  <div class="ai-pulse" style="top: -100px; right: -100px;"></div>
  <div class="ai-pulse" style="bottom: -100px; left: -100px; animation-delay: 2s;"></div>
  <div class="container position-relative z-index-2">
    <div class="row align-items-center">
      <div class="col-lg-6 mb-5 mb-lg-0 fade-in-up">
        <div class="d-flex align-items-center mb-3">
          <i class="fas fa-robot text-gold fs-2 me-3"></i>
          <h2 class="font-outfit fw-bold mb-0">AI Powered Security Management</h2>
        </div>
        <div class="bg-gold" style="width: 60px; height: 3px; border-radius: 2px; margin-bottom: 25px;"></div>
        <p class="lead" style="line-height: 1.8;">
          "Leveraging advanced artificial intelligence, real-time monitoring, smart surveillance, and predictive security analytics to provide next-generation protection for businesses, properties, and individuals."
        </p>
        <ul class="list-unstyled mt-4">
          <li class="mb-3 d-flex align-items-center"><i class="fas fa-check-circle text-gold me-3"></i> Real-time Threat Detection</li>
          <li class="mb-3 d-flex align-items-center"><i class="fas fa-check-circle text-gold me-3"></i> Smart Surveillance Analytics</li>
          <li class="mb-3 d-flex align-items-center"><i class="fas fa-check-circle text-gold me-3"></i> Predictive Risk Assessment</li>
        </ul>
      </div>
      <div class="col-lg-5 offset-lg-1 fade-in-up delay-1 text-center">
        
        <div class="position-relative d-inline-block rounded-4 overflow-hidden shadow-lg border border-white border-opacity-10">
          <img src="<?php echo URLROOT; ?>/assets/img/security_ops.png" alt="AI Security Management" class="img-fluid rounded-4" style="max-height: 400px; width: auto; object-fit: cover;">
        </div>
      </div>
    </div>
  </div>
</section>

<section class="section-padding bg-light-gray">
  <div class="container">
    <div class="row align-items-center g-5">
      <div class="col-lg-5 fade-in-up">
        <div class="section-title text-start">
          <h2>Why Protective Force?</h2>
        </div>
        <p class="fs-5 mb-4 text-secondary" style="line-height: 1.8;">
          Here is why we have been in the industry for nearly 3 decades having a team consisting of ex military personnel and Police where we believe we have the right team suitable to cater for you!
        </p>
        <a href="<?php echo URLROOT; ?>/pages/about" class="btn btn-navy text-white px-4 py-2 rounded-pill shadow-sm bg-navy">Read Our Story <i class="fas fa-arrow-right ms-2"></i></a>
      </div>
      
      
      <div class="col-lg-4 col-md-6 fade-in-up delay-1">
        <div class="d-flex flex-column gap-3">
          <div class="position-relative rounded-4 overflow-hidden shadow border border-white border-2">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_patrol.png" alt="Security Guard on Patrol" class="w-100" style="object-fit: cover; height: 210px; object-position: center center; display:block;">
            <div class="position-absolute bottom-0 start-0 w-100 px-3 py-2" style="background: linear-gradient(transparent, rgba(28,46,35,0.85));">
              <span class="text-white fw-semibold small"><i class="fas fa-shield-alt me-1 text-gold"></i> On-Site Patrol</span>
            </div>
          </div>
          <div class="position-relative rounded-4 overflow-hidden shadow border border-white border-2">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_cctv_ops.png" alt="CCTV Monitoring" class="w-100" style="object-fit: cover; height: 210px; object-position: center center; display:block;">
            <div class="position-absolute bottom-0 start-0 w-100 px-3 py-2" style="background: linear-gradient(transparent, rgba(28,46,35,0.85));">
              <span class="text-white fw-semibold small"><i class="fas fa-video me-1 text-gold"></i> 24/7 Monitoring</span>
            </div>
          </div>
        </div>
      </div>

<div class="col-lg-3 col-md-6 fade-in-up delay-2">
        <div class="d-flex flex-column gap-4">
          <div class="bg-white p-4 rounded-4 shadow-sm text-center border-bottom border-gold border-3">
            <i class="fas fa-history text-gold fs-1 mb-3"></i>
            <h4 class="font-outfit fw-bold">3 Decades</h4>
            <p class="text-muted mb-0 small">Of Industry Experience</p>
          </div>
          <div class="bg-white p-4 rounded-4 shadow-sm text-center border-bottom border-gold border-3">
            <i class="fas fa-user-shield text-gold fs-1 mb-3"></i>
            <h4 class="font-outfit fw-bold">Ex-Military</h4>
            <p class="text-muted mb-0 small">Trained Professionals</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

<div class="cctv-banner-strip fade-in-up" style="position: relative; height: 260px; overflow: hidden;">
  <img src="<?php echo URLROOT; ?>/assets/img/cctv_camera.jpg" alt="CCTV Surveillance" class="w-100" style="object-fit: cover; height: 100%; object-position: center 40%;">
  <div style="position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,46,35,0.92) 0%,rgba(28,46,35,0.5) 50%,rgba(0,0,0,0.2) 100%); display:flex; align-items:center; padding: 0 5%;">
    <div>
      <h3 class="text-white font-outfit fw-bold mb-2" style="font-size:1.8rem;">Advanced Surveillance Solutions</h3>
      <p class="text-white-50 mb-3" style="max-width:480px;">State-of-the-art CCTV installation and 24/7 monitoring by trained professionals.</p>
      <a href="<?php echo URLROOT; ?>/pages/services" class="btn btn-gold rounded-pill px-4 py-2 fw-semibold">Explore Services <i class="fas fa-arrow-right ms-2"></i></a>
    </div>
  </div>
</div>

<section class="section-padding">
  <div class="container">
    <div class="section-title text-center fade-in-up">
      <h2>What We Provide</h2>
    </div>
    <div class="row g-4 mt-2">

<div class="col-lg-4 col-md-6 fade-in-up">
        <div class="service-card text-center overflow-hidden">
          <div class="service-card-img" style="height:220px; overflow:hidden;">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_commercial.png" alt="Commercial Security" class="w-100" style="height:220px; object-fit:cover; object-position:center 30%; display:block; transition: transform 0.4s ease;">
          </div>
          <div class="p-4">
            <div class="service-icon mx-auto"><i class="fas fa-building"></i></div>
            <h4 class="font-outfit fw-bold mb-3">Commercial Security</h4>
            <p class="text-muted">Providing highly trained personnel for commercial properties to ensure safety and secure premises.</p>
          </div>
        </div>
      </div>

<div class="col-lg-4 col-md-6 fade-in-up delay-1">
        <div class="service-card text-center overflow-hidden">
          <div class="service-card-img" style="height:220px; overflow:hidden;">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_cctv_ops.png" alt="CCTV Operators" class="w-100" style="height:220px; object-fit:cover; object-position:center 20%; display:block; transition: transform 0.4s ease;">
          </div>
          <div class="p-4">
            <div class="service-icon mx-auto"><i class="fas fa-video"></i></div>
            <h4 class="font-outfit fw-bold mb-3">CCTV Operators</h4>
            <p class="text-muted">Expert operators for your CCTV surveillance systems, ensuring 24/7 monitoring.</p>
          </div>
        </div>
      </div>

<div class="col-lg-4 col-md-6 fade-in-up delay-2">
        <div class="service-card text-center overflow-hidden">
          <div class="service-card-img" style="height:220px; overflow:hidden;">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_bodyguard.png" alt="Bodyguards" class="w-100" style="height:220px; object-fit:cover; object-position:center 15%; display:block; transition: transform 0.4s ease;">
          </div>
          <div class="p-4">
            <div class="service-icon mx-auto"><i class="fas fa-user-secret"></i></div>
            <h4 class="font-outfit fw-bold mb-3">Bodyguards</h4>
            <p class="text-muted">Personal protection for executives and high-profile individuals.</p>
          </div>
        </div>
      </div>

<div class="col-lg-4 col-md-6 fade-in-up delay-1">
        <div class="service-card text-center overflow-hidden">
          <div class="service-card-img" style="height:220px; overflow:hidden;">
            <img src="<?php echo URLROOT; ?>/assets/img/svc_cctv_install.png" alt="CCTV Installation" class="w-100" style="height:220px; object-fit:cover; object-position:center 25%; display:block; transition: transform 0.4s ease;">
          </div>
          <div class="p-4">
            <div class="service-icon mx-auto"><i class="fas fa-tools"></i></div>
            <h4 class="font-outfit fw-bold mb-3">CCTV Installation</h4>
            <p class="text-muted">Professional installation of surveillance systems for homes, businesses and institutions.</p>
          </div>
        </div>
      </div>

</div>
    <div class="text-center mt-5 fade-in-up">
      <a href="<?php echo URLROOT; ?>/pages/services" class="btn btn-outline-navy border-2 rounded-pill px-5 py-2 text-navy fw-bold" style="border-color: var(--navy)">View All Services</a>
    </div>
  </div>
</section>

<section class="testimonials-section section-padding py-5">
  <div class="container py-4">
    <div class="section-title text-center text-white fade-in-up mb-5">
      <h2 class="text-white">What Our Clients Say</h2>
    </div>
    <div class="row g-4 mt-2">
      <?php if(!empty($data['testimonials'])): ?>
        <?php foreach($data['testimonials'] as $index => $t): ?>
          <div class="col-lg-4 col-md-6 fade-in-up delay-<?php echo ($index % 3 + 1); ?>">
            <div class="testimonial-card">
              <div>
                <div class="testimonial-quote-icon mb-3">
                  <i class="fas fa-quote-left text-green-accent"></i>
                </div>
                <p class="testimonial-text">
                  "<?php echo htmlspecialchars($t->content); ?>"
                </p>
              </div>
              <div class="testimonial-client-meta">
                <div class="testimonial-client-avatar">
                  <?php echo strtoupper(substr($t->client_name, 0, 1)); ?>
                </div>
                <div>
                  <h6 class="testimonial-client-name"><?php echo htmlspecialchars($t->client_name); ?></h6>
                  <span class="text-white-50 small">Verified Partner</span>
                </div>
              </div>
            </div>
          </div>
        <?php endforeach; ?>
      <?php else: ?>
        <div class="col-12 text-center text-muted">
          <p>No testimonials available at this time.</p>
        </div>
      <?php endif; ?>
    </div>
  </div>
</section>

<section class="section-padding bg-navy text-white overflow-hidden py-5">
  <div class="container text-center">
    <div class="section-title text-white fade-in-up mb-4">
      <h2 class="text-white">Our Trusted Partners</h2>
    </div>
    <div class="marquee-container mt-5 fade-in-up delay-1">
      <div class="marquee-content">
        <?php
        $partners_path = APPROOT . '/../public/assets/img/partners';
        if (is_dir($partners_path)) {
            $files = scandir($partners_path);
            $logo_files = array_filter($files, function($f) {
                return $f !== '.' && $f !== '..' && preg_match('/\.(jpg|jpeg|png|gif)$/i', $f);
            });
            // Double the list of logos for infinite loop
            $logo_list = array_merge($logo_files, $logo_files);
            foreach ($logo_list as $file) {
                echo '
                <div class="marquee-item">
                  <img src="'.URLROOT.'/assets/img/partners/'.$file.'" alt="Partner Logo">
                </div>';
            }
        } else {
            echo '<div class="text-white-50">CBL · RIU Hotels · GLOMARK · SPAR · Softlogic · Aitken Spence</div>';
        }
        ?>
      </div>
    </div>
  </div>
</section>

<?php require APPROOT . '/views/layouts/footer.php'; ?>

Cancel

🤩 File Manager - Mr.X

Editing:index.php