<section id="ejemplos-basicos" class="rounded-3xl bg-gradient-to-br from-slate-800/50 to-slate-900/50 backdrop-blur-xl border border-white/10 p-8 shadow-2xl shadow-indigo-500/10">
  <h2 class="text-3xl sm:text-4xl font-bold mb-3 bg-clip-text text-transparent bg-gradient-to-r from-white to-indigo-200">🧭 Ejemplos Básicos</h2>
  <p class="text-slate-200">Un arranque rápido con los comandos más usados. Copia y pega en tu servidor:</p>

  <div class="grid gap-6 md:grid-cols-2">
    <div class="space-y-3 rounded-2xl border border-white/5 bg-slate-900/60 p-5">
      <h3 class="text-lg font-semibold text-white">👤 Perfil y progreso</h3>
      <div class="bg-slate-900/50 p-3 rounded-lg text-sm">
        <pre class="text-indigo-200 whitespace-pre-wrap">!player
!stats
!logros
!misiones
!cooldowns</pre>
      </div>
    </div>

    <div class="space-y-3 rounded-2xl border border-white/5 bg-slate-900/60 p-5">
      <h3 class="text-lg font-semibold text-white">🎮 Minijuegos</h3>
      <div class="bg-slate-900/50 p-3 rounded-lg text-sm">
        <pre class="text-indigo-200 whitespace-pre-wrap">!mina
!pescar
!pelear
!plantar</pre>
      </div>
      <p class="text-slate-300 text-xs">Tip: Puedes pasar nivel o herramienta, ej. <span class="font-mono">!mina 2 iron_pickaxe</span></p>
    </div>

    <div class="space-y-3 rounded-2xl border border-white/5 bg-slate-900/60 p-5">
      <h3 class="text-lg font-semibold text-white">🎒 Inventario y equipo</h3>
      <div class="bg-slate-900/50 p-3 rounded-lg text-sm">
        <pre class="text-indigo-200 whitespace-pre-wrap">!inventario
!equipar weapon iron_sword
!comer minor_healing_potion</pre>
      </div>
    </div>

    <div class="space-y-3 rounded-2xl border border-white/5 bg-slate-900/60 p-5">
      <h3 class="text-lg font-semibold text-white">💰 Economía</h3>
      <div class="bg-slate-900/50 p-3 rounded-lg text-sm">
        <pre class="text-indigo-200 whitespace-pre-wrap">!monedas
!tienda
!comprar health_potion 2
!craftear iron_sword</pre>
      </div>
    </div>
  </div>
</section>
