@extends('layouts.app') @section('meta')

<title>Elected Representatives & Officials | Nagar Panchayat Govardhan</title>

<meta
  name="description"
  content="List of elected representatives and officials of Nagar Panchayat Govardhan, Mathura district, Uttar Pradesh."
/>

<meta
  name="keywords"
  content="Nagar Panchayat Govardhan Officials, Govardhan Municipality Representatives, Chairperson Govardhan Mathura"
/>

<link rel="canonical" href="{{ url()->current() }}" />

@endsection @section('content')

<!-- ===== PAGE HEADER ===== -->

<section class="page-header text-white text-center d-flex align-items-center">
  <div class="container">
    <h1 class="fw-bold">Elected Representatives & Officials</h1>

    <p class="mb-0">Nagar Panchayat Govardhan, Mathura</p>
  </div>
</section>

<!-- ===== BREADCRUMB ===== -->

<div class="breadcrumb-wrapper py-3">
  <div class="container">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb mb-0">
        <li class="breadcrumb-item">
          <a href="{{ route('index') }}">Home</a>
        </li>

        <li class="breadcrumb-item active">Officials</li>
      </ol>
    </nav>
  </div>
</div>

<!-- ===== OFFICIALS SECTION ===== -->

<section class="py-5">
  <div class="container">
    <div class="text-center mb-5">
      <h2 class="fw-bold text-danger-emphasis">
        Elected Representatives & Officials
      </h2>

      <p class="text-muted">
        Administrative leadership of Nagar Panchayat Govardhan
      </p>
    </div>

    <div class="row g-4 justify-content-center">
      <!-- CHAIRPERSON -->

      <div class="col-lg-3 col-md-6">
        <div class="staff-card text-center p-4 shadow rounded">
          <img
            src="https://cdn-icons-png.flaticon.com/512/3135/3135715.png"
            class="img-fluid rounded-circle mb-3"
            width="120"
            alt="Chairperson Govardhan"
          />

          <h5 class="fw-bold">Smt. Prabha Devi</h5>

          <p class="text-muted mb-0">Chairperson</p>
        </div>
      </div>

      <!-- EXECUTIVE OFFICER -->

      <div class="col-lg-3 col-md-6">
        <div class="staff-card text-center p-4 shadow rounded">
          <img
            src="https://cdn-icons-png.flaticon.com/512/3135/3135823.png"
            class="img-fluid rounded-circle mb-3"
            width="120"
            alt="Executive Officer"
          />

          <h5 class="fw-bold">Shri [Name]</h5>

          <p class="text-muted mb-0">Executive Officer</p>
        </div>
      </div>

      <!-- SENIOR CLERK -->

      <div class="col-lg-3 col-md-6">
        <div class="staff-card text-center p-4 shadow rounded">
          <img
            src="https://cdn-icons-png.flaticon.com/512/3135/3135768.png"
            class="img-fluid rounded-circle mb-3"
            width="120"
            alt="Senior Clerk"
          />

          <h5 class="fw-bold">Smt. [Name]</h5>

          <p class="text-muted mb-0">Senior Clerk</p>
        </div>
      </div>
    </div>
  </div>
</section>

@endsection