{{-- Galería de inspiración por categoría. En este eslabón (item 7) montamos
     SOLO el hero de galería; el grid de fotos y su endpoint son los items 8/9.
     La categoría activa llega tipada (enum GalleryCategory) desde routes/web.php. --}}
@extends('layouts.landing')

{{-- El <title> y demás metas los resuelve el SEO central (item 02): PageSeoService
     los DERIVA de la categoría activa ($category, enum GalleryCategory) vía el
     View::composer. Por eso ya no hay @section('title') acá. --}}

@section('hero')
  {{-- Imagen del hero: resuelta por el propio slug de la categoría
       ($category->heroImagePath(), convención resources/images/gallery/{slug}-hero.jpg
       — ver App\Enums\GalleryCategory). Agregar una categoría no toca esta vista. --}}
  <x-heroes.gallery-v2 :active="$category" :image="Vite::asset($category->heroImagePath())"
    :alt="$category->label() . ' inspiration'" />
@endsection

@section('content')
  {{-- Punto de montaje de la isla Preact de la galería (item 09). El div target
       lo hidrata resources/js/gallery (cargado por import() dinámico desde app.js
       SOLO en esta página). La categoría activa y la URL del endpoint del item 08
       salen de acá vía la ruta nombrada `gallery.images` — el JS no arma URLs ni
       conoce slugs. Sin JS, el div queda vacío (progressive enhancement). --}}
  <div data-gallery-grid data-category="{{ $category->value }}" data-endpoint="{{ route('gallery.images', $category) }}" class="min-h-160 flex items-center justify-center">
  </div>

@endsection