{{-- /fermentos — el índice de la capa de contenido (docs/paginas/fermentos.md).
     Cada categoría es una sección aquí y una página propia. Sin CTA en la
     cabecera: quien llega viene a elegir. --}}
@extends('layouts.web')

@php($publicadas = $categorias->flatMap->guides->filter->esPublicadaWeb()->values())

@section('seo')
<x-seo title="Fermentos — kombucha, chucrut, kéfir, kimchi y más"
       description="Guías completas de fermentación casera: kombucha, kéfir de agua, chucrut, kimchi, vinagre y más. Con las cantidades y una horquilla de días honesta."
       :canonical="ruta('fermentos.index')" />
@endsection

@push('head')
<link rel="stylesheet" href="{{ asset_v('landing/pages/fermentos.css') }}">
@php($ld = [
    '@context' => 'https://schema.org',
    '@type'    => 'CollectionPage',
    'name'     => 'Fermentos',
    'url'      => ruta('fermentos.index'),
    'mainEntity' => [
        '@type' => 'ItemList',
        'itemListElement' => $publicadas->values()->map(fn ($g, $i) => [
            '@type'    => 'ListItem',
            'position' => $i + 1,
            'name'     => $g->name,
            'url'      => ruta('fermentos.show', $g->slug),
        ])->all(),
    ],
])
<script type="application/ld+json">{!! json_encode($ld, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE) !!}</script>
@endpush

@section('content')
<section class="section--tight" style="padding-top:48px">
  <div class="wrap">
    <div class="section-head center reveal">
      <p class="eyebrow">Fermentos y recetas</p>
      <h1>¿Qué vas a fermentar?</h1>
      <p class="lede">Cada guía trae el proceso completo, los ingredientes y una horquilla de días. Cuando creas una tanda, esos días se recalculan con la temperatura de tu cocina.</p>
    </div>
  </div>
</section>

<section class="section" style="padding-top:8px">
  <div class="wrap">
    @foreach($categorias as $cat)
      @continue($cat->guides->isEmpty())
      <div class="shelf reveal">
        <div class="shelf__head">
          <div>
            <h2>{{ $cat->name }}</h2>
            @if($cat->description)<p>{{ $cat->description }}</p>@endif
          </div>
          <a class="shelf__more" href="{{ ruta('fermentos.show', $cat->slug) }}">Ver {{ mb_strtolower($cat->name) }} →</a>
        </div>
        <div class="fgrid">
          @foreach($cat->guides as $g)
            <x-tarjeta-fermento :guide="$g" :show-cat="false" :eager="$loop->parent->first && $loop->index < 2" />
          @endforeach
        </div>
      </div>
    @endforeach
  </div>
</section>

{{-- Cierre §7: dos puertas concretas convierten mejor que un registro genérico --}}
<section class="section" style="background:var(--bg-canvas-deep)">
  <div class="wrap center">
    <div class="section-head center reveal" style="margin-bottom:18px">
      <h2>¿No sabes por dónde empezar?</h2>
      <p class="lede">Si es tu primera vez, el chucrut es difícil de estropear: col, sal y paciencia. Si ya has fermentado alguna vez y quieres el que más engancha, es la kombucha.</p>
    </div>
    <div class="hero__cta center" style="justify-content:center">
      <a class="btn btn--primary btn--lg" href="{{ ruta('fermentos.show', 'chucrut') }}">Empezar por el chucrut</a>
      <a class="btn btn--ghost btn--lg" href="{{ ruta('fermentos.show', 'kombucha') }}">Ir a por la kombucha</a>
    </div>
  </div>
</section>
@endsection