@extends('layouts.app')
@section('title', 'Mill-Direct Palm Oil Trading')

@section('content')
<section class="rounded-xl bg-slate-900 px-6 py-10 text-white md:px-12 md:py-16">
    <p class="text-xs font-semibold uppercase tracking-widest text-amber-400">Next-Gen Trading Hub by Drixem Group</p>
    <h1 class="mt-3 max-w-3xl text-3xl font-bold leading-tight md:text-5xl">Buy palm oil straight from verified mills and refineries.</h1>
    <p class="mt-4 max-w-2xl text-slate-300">Every seller and buyer is document-checked before activation. Prices come from the mill, with no broker layers and no hidden markup.</p>
    <div class="mt-6 flex flex-wrap gap-3">
        <a href="{{ route('marketplace.index') }}" class="rounded bg-crimson px-5 py-3 font-semibold hover:bg-crimson-dark">Browse mill-direct listings</a>
        <a href="{{ route('register') }}" class="rounded border border-slate-500 px-5 py-3 font-semibold hover:border-white">Get verified</a>
    </div>
    <div class="mt-8 flex flex-wrap gap-2 text-xs font-semibold">
        <span class="rounded-full bg-amber-500/20 px-3 py-1 text-amber-300">✔ Verified Mills &amp; Refineries</span>
        <span class="rounded-full bg-white/10 px-3 py-1">Zero-Markup Direct Trade</span>
        <span class="rounded-full bg-white/10 px-3 py-1">LC · SBLC · TT</span>
    </div>
</section>

<section class="mt-8 grid gap-4 md:grid-cols-3">
    @foreach ([
        ['1', 'Find your grade', 'Filter by FFA, M&I, IV, certification, origin, MOQ and incoterm.'],
        ['2', 'Submit one RFQ', 'Volume, destination port and delivery window. Matching mills are notified at once.'],
        ['3', 'Close in the deal room', 'Timestamped chat, proforma invoice, document vault and BL tracking.'],
    ] as [$n, $title, $body])
        <div class="rounded-lg border border-slate-200 bg-white p-5">
            <span class="grid h-8 w-8 place-items-center rounded-full bg-crimson text-sm font-bold text-white">{{ $n }}</span>
            <h2 class="mt-3 font-semibold">{{ $title }}</h2>
            <p class="mt-1 text-sm text-slate-600">{{ $body }}</p>
        </div>
    @endforeach
</section>

@if ($featured->isNotEmpty())
<section class="mt-10">
    <div class="flex items-end justify-between">
        <h2 class="text-xl font-bold">Latest mill-direct offers</h2>
        <a href="{{ route('marketplace.index') }}" class="text-sm font-semibold text-crimson">View all</a>
    </div>
    <div class="mt-4 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
        @foreach ($featured as $l)
            @include('partials.listing-card', ['l' => $l, 'rfqButton' => false])
        @endforeach
    </div>
</section>
@endif
@endsection