@extends('frontend.layouts.app')
@section('content')
@include('frontend.partials.page-header', ['pageTitle'=>'Our Departments', 'pageSubtitle'=>'7 departments · 16 programs at UG, PG & doctoral levels', 'breadcrumbs'=>[['name'=>'Departments']]])
<section class="py-14"><div class="max-w-7xl mx-auto px-4">
<div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-6">
@foreach($departments as $dept)
<a href="/departments/{{ $dept->slug }}" class="dept-card bg-white rounded-2xl overflow-hidden border border-gray-100 shadow-sm hover:shadow-lg group" data-aos="fade-up" data-aos-delay="{{ $loop->index * 60 }}">
<div class="h-1.5 w-full" style="background:{{ $dept->color }}"></div>
<div class="p-6">
<div class="flex items-center gap-4 mb-4">
<div class="w-14 h-14 rounded-xl flex items-center justify-center text-white text-2xl group-hover:scale-110 transition flex-shrink-0" style="background:{{ $dept->color }}">
<i class="{{ $dept->icon_class ?? 'fas fa-graduation-cap' }}"></i>
</div>
<div>
<h3 class="font-bold text-gray-900 group-hover:text-primary-700 transition text-[15px] leading-snug">{{ $dept->name }}</h3>
<p class="text-gray-500 text-xs mt-0.5">{{ $dept->short_name }} · Est. {{ $dept->established_year }}</p>
</div>
</div>
<div class="flex items-center justify-between text-xs text-gray-500">
<span><i class="fas fa-users mr-1"></i>{{ $dept->faculty->count() }} Faculty</span>
<span><i class="fas fa-book mr-1"></i>{{ $dept->programs->count() }} Programs</span>
<span><i class="fas fa-user-graduate mr-1"></i>{{ $dept->intake }}/yr</span>
</div>
</div>
</a>
@endforeach
</div>
</div></section>
@endsection