@extends('frontend.layouts.master')

@php
  $hero = $services['hero'] ?? [];
  $intro = $services['intro'] ?? [];
  $cards = $services['cards'] ?? [];
  $cta = $services['cta'] ?? [];
  $heroTitle = e($hero['title'] ?? 'Our').' <span class="text-gradient">'.e($hero['title_accent'] ?? 'Services').'</span>';
@endphp

@section('title', $pageMeta['meta_title'] ?? 'Our Services | FBA UK LTD')
@section('meta_description', $pageMeta['meta_description'] ?? 'End-to-end education support for Home and International students with FBA UK LTD.')
@section('meta_keywords', $pageMeta['meta_keywords'] ?? 'education services, student admissions, student finance, fba uk')
@section('meta_robots', $pageMeta['meta_robots'] ?? 'index, follow')
@section('canonical', $pageMeta['canonical_url'] ?? url()->current())
@section('og_title', $pageMeta['og_title'] ?? ($pageMeta['meta_title'] ?? 'Our Services | FBA UK LTD'))
@section('og_description', $pageMeta['og_description'] ?? ($pageMeta['meta_description'] ?? ''))
@section('og_image', $pageMeta['og_image'] ?? asset('frontend/assets/images/Fbalogo.webp'))

@section('content')
@include('frontend.partials.page-hero', [
  'currentPage' => $hero['breadcrumb'] ?? 'Services',
  'title' => $heroTitle,
  'subtitle' => $hero['subtitle'] ?? '',
  'bgImage' => $pageMeta['breadcrumb_image'] ?? null,
])

<section class="services-page-section" aria-labelledby="services-heading">
  <div class="container services-page-wrap">
    <header class="services-page-intro reveal-up">
      <h2 id="services-heading" class="services-page-intro__title">{{ $intro['title'] ?? '' }}</h2>
      <p>{{ $intro['text'] ?? '' }}</p>
    </header>

    <div class="row g-4 services-page-grid">
      @foreach($cards as $i => $card)
        <div class="col-md-6 col-xl-4 reveal-up" @if($i % 3 !== 0) data-delay="{{ ($i % 3) * 50 }}" @endif>
          <article class="service-list-card">
            <span class="service-list-card__icon" aria-hidden="true"><i class="{{ $card['icon'] ?? 'fas fa-circle' }}"></i></span>
            <h3 class="service-list-card__title">{{ $card['title'] ?? '' }}</h3>
            <p class="service-list-card__text">{{ $card['text'] ?? '' }}</p>
          </article>
        </div>
      @endforeach
    </div>

    @if(!empty($cta['title']) || !empty($cta['primary_label']))
      <div class="services-page-cta reveal-up" data-delay="100">
        <div class="services-page-cta__inner">
          <div>
            <h3>{{ $cta['title'] ?? '' }}</h3>
            <p>{{ $cta['text'] ?? '' }}</p>
          </div>
          <div class="services-page-cta__actions">
            @if(!empty($cta['primary_label']))
              <a href="{{ url($cta['primary_url'] ?? '/contact') }}" class="btn btn-primary"><i class="fas fa-paper-plane" aria-hidden="true"></i> {{ $cta['primary_label'] }}</a>
            @endif
            @if(!empty($cta['secondary_label']))
              <a href="{{ url($cta['secondary_url'] ?? '/courses') }}" class="btn btn-outline-primary">{{ $cta['secondary_label'] }}</a>
            @endif
          </div>
        </div>
      </div>
    @endif
  </div>
</section>
@endsection