<?php
declare(strict_types=1);
require_once __DIR__ . '/config.php';
require_once __DIR__ . '/includes/functions.php';
$team = team_all();
$pageTitle = 'Our Team — ' . setting('company_name', SITE_NAME);
$current = 'teams';
$breadcrumbTitle = 'Teams';
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>
      .team-pro-card {
        background: #ffffff;
        border: 1px solid #e8edf3;
        border-radius: 16px;
        padding: 26px 22px;
        text-align: center;
        height: 100%;
        transition: all 0.25s ease;
        box-shadow: 0 10px 28px rgba(4, 34, 62, 0.05);
      }

      .team-pro-card:hover {
        transform: translateY(-4px);
        border-color: var(--ot-theme-color);
        box-shadow: 0 14px 30px rgba(4, 34, 62, 0.1);
      }

      .team-pro-avatar {
        width: 132px;
        height: 132px;
        object-fit: cover;
        border-radius: 50%;
        border: 4px solid #ffffff;
        box-shadow: 0 8px 18px rgba(4, 34, 62, 0.16);
      }

      .team-pro-role {
        color: #5e6a7d;
        font-weight: 500;
      }

      .team-pro-divider {
        width: 54px;
        height: 3px;
        background: var(--ot-theme-color);
        border-radius: 999px;
        margin: 10px auto 14px;
      }
    </style>
    <section class="ot-space">
      <div class="container">
        <div class="ot-title-area text-center mb-50">
          <span class="ot-sec-subtitle">Our Team</span>
          <h3 class="ot-sec-title ot-text-anime-3">People Behind Your Solar Success</h3>
          <p class="ot-sec-text mx-auto" style="max-width:760px;">
            Meet the professionals at Bhatt Enterprises who plan, install, and support
            reliable solar solutions for residential and commercial customers.
          </p>
        </div>
        <div class="row gy-4 justify-content-center">
          <?php if ($team): ?>
            <?php foreach ($team as $m): ?>
              <div class="col-md-6 col-lg-4">
                <div class="team-pro-card">
                  <img
                    src="<?= h(img_url($m['image_path'] ?? null, 'assets/img/about/ab-user-1-1.png')) ?>"
                    alt="<?= h((string)$m['name']) ?>"
                    class="team-pro-avatar mb-3">
                  <h4 class="ot-box-title mb-1"><?= h((string)$m['name']) ?></h4>
                  <p class="team-pro-role mb-0"><?= h((string)($m['designation'] ?: 'Team Member')) ?></p>
                  <div class="team-pro-divider"></div>
                  <p class="ot-sec-text small mb-0"><?= nl2br(h((string)$m['bio'])) ?></p>
                </div>
              </div>
            <?php endforeach; ?>
          <?php else: ?>
            <div class="col-12">
              <div class="alert alert-info text-center mb-0">
                Team members will appear here once added from the admin panel.
              </div>
            </div>
          <?php endif; ?>
        </div>
      </div>
    </section>
  </main>
<?php require __DIR__ . '/includes/footer.php'; ?>
