---
import { Image } from 'astro:assets';
import facade from '../assets/images/facade.jpg';
---

<section id="food" class="py-32 bg-secondary/20 scroll-mt-20">
  <div class="max-w-6xl mx-auto px-6">
    <div class="grid md:grid-cols-2 gap-16 items-center">

      <!-- Image -->
      <div class="relative order-2 md:order-1">
        <Image
          src={facade}
          alt="Le Moulin des Rives"
          class="w-full h-[500px] object-cover rounded-sm"
        />
        <div class="absolute -top-5 -right-5 w-40 h-40 border border-primary/25 -z-10"></div>
      </div>

      <!-- Texte -->
      <div class="order-1 md:order-2">
        <span class="block text-xs tracking-[0.3em] uppercase text-primary mb-5">
          Restauration
        </span>
        <h2 class="font-serif text-5xl md:text-6xl font-light leading-tight mb-8">
          Des repas maison<br/>avec des produits locaux
        </h2>
        <p class="text-dark/70 leading-relaxed mb-6">
          Cuisine authentique et conviviale préparée à partir de produits
          frais et locaux. Chaque repas est une invitation à découvrir
          les saveurs du terroir auvergnat.
        </p>
        <p class="text-dark/70 leading-relaxed">
          Sur réservation : petits-déjeuners et dîners en table d'hôte.
        </p>
      </div>

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