<?php
declare(strict_types=1);
require_once __DIR__ . '/config.php';
require_once __DIR__ . '/includes/functions.php';
$slug = (string)($_GET['slug'] ?? '');
$p = $slug !== '' ? project_by_slug($slug) : null;
if (!$p) {
    http_response_code(404);
}
$pageTitle = $p ? ($p['title'] . ' — Portfolio') : 'Not found';
$current = 'portfolio';
$breadcrumbTitle = $p ? (string)$p['title'] : 'Project';
require __DIR__ . '/includes/head.php';
require __DIR__ . '/includes/preloader.php';
require __DIR__ . '/includes/offcanvas.php';
require __DIR__ . '/includes/header.php';
require __DIR__ . '/includes/breadcrumb.php';
?>
  <main>
    <style>
      .project-pro-image {
        border-radius: 16px;
        border: 1px solid #e7edf5;
        box-shadow: 0 14px 30px rgba(4, 34, 62, 0.1);
        width: 100%;
        max-height: 560px;
        object-fit: cover;
      }

      .project-pro-card {
        background: #fff;
        border: 1px solid #e7edf5;
        border-radius: 16px;
        padding: 28px 24px;
        box-shadow: 0 10px 28px rgba(4, 34, 62, 0.07);
      }

      .project-pro-badge {
        background: rgba(232, 136, 46, 0.18);
        border: 1px solid rgba(232, 136, 46, 0.4);
        color: var(--ot-title-color);
        border-radius: 999px;
        padding: 6px 12px;
        font-weight: 600;
        font-size: 12px;
      }

      .project-pro-meta {
        border-top: 1px dashed #d9e2ee;
        margin-top: 20px;
        padding-top: 18px;
      }
    </style>
    <?php if (!$p): ?>
      <section class="ot-space">
        <div class="container">
          <div class="alert alert-warning text-center mb-0">
            Project not found. <a href="portfolio.php">Back to portfolio</a>.
          </div>
        </div>
      </section>
    <?php else: ?>
      <section class="ot-space">
        <div class="container">
          <div class="ot-title-area text-center mb-45">
            <span class="ot-sec-subtitle">Project Details</span>
            <h3 class="ot-sec-title ot-text-anime-3"><?= h((string)$p['title']) ?></h3>
          </div>

          <div class="row g-4">
            <div class="col-lg-7">
              <img src="<?= h(img_url($p['image_path'] ?? null)) ?>" class="project-pro-image" alt="<?= h((string)$p['title']) ?>">
            </div>
            <div class="col-lg-5">
              <div class="project-pro-card h-100">
                <span class="project-pro-badge"><?= h((string)($p['category'] ?: 'Solar Project')) ?></span>
                <h1 class="ot-sec-title mt-15 mb-15"><?= h((string)$p['title']) ?></h1>
                <div class="ot-sec-text"><?= nl2br(h((string)$p['description'])) ?></div>

                <div class="project-pro-meta">
                  <p class="mb-2"><i class="fa-solid fa-circle-check text-success me-2"></i>Custom solution designed for the client requirement.</p>
                  <p class="mb-2"><i class="fa-solid fa-circle-check text-success me-2"></i>Professional execution with quality and safety focus.</p>
                  <p class="mb-0"><i class="fa-solid fa-circle-check text-success me-2"></i>Built for performance, savings, and long-term reliability.</p>
                </div>

                <div class="d-flex gap-2 flex-wrap mt-25">
                  <a href="contact.php" class="ot-btn-primary">Discuss Similar Project</a>
                  <a href="portfolio.php" class="ot-btn-primary yellow-btn">Back to Portfolio</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    <?php endif; ?>
  </main>
<?php require __DIR__ . '/includes/footer.php'; ?>
