@extends('layouts.site')

@push('head')
@if(!empty($seo['meta_description']))
<meta name="description" content="{{ $seo['meta_description'] }}">
@endif
<meta property="og:type" content="article">
<meta property="og:title" content="{{ $seo['og_title'] }}">
@if(!empty($seo['og_description']))
<meta property="og:description" content="{{ $seo['og_description'] }}">
@endif
@if(!empty($seo['og_image']))
<meta property="og:image" content="{{ $seo['og_image'] }}">
@endif
<meta property="og:url" content="{{ $seo['og_url'] }}">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{ $seo['og_title'] }}">
@if(!empty($seo['og_description']))
<meta name="twitter:description" content="{{ $seo['og_description'] }}">
@endif
@if(!empty($seo['og_image']))
<meta name="twitter:image" content="{{ $seo['og_image'] }}">
@endif
<link rel="canonical" href="{{ $seo['og_url'] }}">
@endpush

@section('content')
<section class="projects-area">
  <div class="container">
    {{-- ── Header row ─────────────────────────────────────── --}}
    <div class="row">
      <div class="col-lg-12">
        <div class="single-project">

          {{-- Title + subline --}}
          <div class="project-info">
            <div class="row">
              <div class="col-lg-6 col-md-8">
                <h2>{!! $project['headline'] !!}</h2>
              </div>
              @if($project['subline'])
              <div class="col-lg-6 col-md-4">
                <div class="subtitle">{!! $project['subline'] !!}</div>
              </div>
              @endif
            </div>
          </div>

          {{-- Hero media --}}
          @if($project['hero'])
          <div class="thumbnail-wrap">
            @include('pages.partials.project-slot', ['slot' => $project['hero']])
          </div>
          @endif

          {{-- Client, awarded and description in the original template structure --}}
          @if($project['hero'] || $project['clientName'] || !empty($project['awarded']) || $project['description'])
          <div class="row mt-5">
            <div class="col-lg-6">
              <div class="project-info mb-0">
                @if($project['year'])
                <div class="client-info">
                  <h4>{{ trans('fp.YEAR') }}</h4>
                  <span>{{ $project['year'] }}</span>
                </div>
                @endif
                <div class="client-info">
                  <h4>{{ trans('fp.CLIENT') }}</h4>
                  @if($project['clientName'])
                  <span>{!! $project['clientName'] !!}</span>
                  @else
                  <span>-</span>
                  @endif
                </div>
                <div class="project-details">
                  @if(!empty($project['awarded']))
                  <h4>{{ trans('fp.AWARDED') }}</h4>
                    @foreach($project['awarded'] as $award)
                    <p>{!! $award !!}</p>
                    @endforeach
                  @endif
                </div>
              </div>
            </div>
            <div class="col-lg-6">
              <div class="description-text">
                @if($project['description'])
                  @php($description = trim($project['description']))
                  @if(str_contains($description, '<'))
                  {!! $description !!}
                  @else
                  <p>{!! nl2br(e($description)) !!}</p>
                  @endif
                @else
                <p>-</p>
                @endif
              </div>
            </div>
          </div>
          @endif

        </div>
      </div>
    </div>

    {{-- ── Content blocks ──────────────────────────────────── --}}
    @foreach($project['blocks'] as $block)
      @if(!empty($block['hidden']))
        @continue
      @endif

      @if($block['type'] === 'FullWidth' && ($block['slot']['type'] ?? '') === 'text')
        {{-- Text block: centred quote style --}}
        <div class="row project-content justify-content-center">
          <div class="col-lg-6 text-center">
            {!! $block['slot']['text'] !!}
          </div>
        </div>

      @elseif($block['type'] === 'FullWidth')
        <div class="row">
          <div class="col-lg-12">
            <div class="single-project">
              <div class="thumbnail-wrap">
                @include('pages.partials.project-slot', ['slot' => $block['slot']])
              </div>
            </div>
          </div>
        </div>

      @elseif($block['type'] === 'TwoColumns')
        <div class="row">
          <div class="col-lg-6 col-md-6">
            <div class="single-project">
              <div class="thumbnail-wrap">
                @include('pages.partials.project-slot', ['slot' => $block['left'], 'squareEmbed' => true])
              </div>
            </div>
          </div>
          <div class="col-lg-6 col-md-6">
            <div class="single-project">
              <div class="thumbnail-wrap">
                @include('pages.partials.project-slot', ['slot' => $block['right'], 'squareEmbed' => true])
              </div>
            </div>
          </div>
        </div>

      @endif

    @endforeach

  </div>

  {{-- ── Next project ─────────────────────────────────────── --}}
  @if(!empty($nextProject))
  <div class="container mt-4">
    <div class="row">
      <div class="col-lg-12">
        <div class="btn-wrapper">
          <a href="{{ $nextProject['url'] }}" class="common-btn">
            Next project <span><img src="{{ $assetBase }}/img/arrow.svg" alt=""></span>
          </a>
        </div>
      </div>
    </div>
  </div>
  @endif

</section>
@endsection