---
import BaseLayout from '../../layouts/BaseLayout.astro';
import Header from '../../components/Header.astro';
import Footer from '../../components/Footer.astro';

const lang = 'es' as const;
---

<BaseLayout
  title="Campus - Ornitonautas"
  description="Explora los ciclos formativos de informática: DAM, DAW, SMR, ASIR. Módulos, competencias y salidas profesionales."
>
  <Header lang={lang} />

  <main id="main-content">
    <section class="py-16 bg-gradient-to-br from-blue-50 to-white">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <h1 class="text-3xl font-bold text-slate-900 mb-4">Campus</h1>
        <p class="text-lg text-slate-600 max-w-3xl">
          Explora los ciclos formativos de informática. Cada ciclo incluye módulos, competencias profesionales y salidas laborales.
        </p>
      </div>
    </section>

    <section class="py-16 bg-white">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
          <a href="/campus/dam/" class="block p-8 bg-slate-50 rounded-xl border border-slate-200 hover:border-blue-300 hover:shadow-lg transition-all">
            <div class="text-sm font-medium text-blue-600 mb-3">Grado Superior</div>
            <h2 class="text-2xl font-bold text-slate-900 mb-3">DAM</h2>
            <p class="text-slate-600 mb-4">Desarrollo de Aplicaciones Multiplataforma. Aprende a crear aplicaciones para móvil, escritorio y web.</p>
            <div class="flex gap-4 text-sm text-slate-500">
              <span>2000 horas</span>
              <span>·</span>
              <span>2 cursos</span>
            </div>
          </a>

          <a href="/campus/daw/" class="block p-8 bg-slate-50 rounded-xl border border-slate-200 hover:border-blue-300 hover:shadow-lg transition-all">
            <div class="text-sm font-medium text-blue-600 mb-3">Grado Superior</div>
            <h2 class="text-2xl font-bold text-slate-900 mb-3">DAW</h2>
            <p class="text-slate-600 mb-4">Desarrollo de Aplicaciones Web. Crea sitios y aplicaciones web modernas con las últimas tecnologías.</p>
            <div class="flex gap-4 text-sm text-slate-500">
              <span>2000 horas</span>
              <span>·</span>
              <span>2 cursos</span>
            </div>
          </a>

          <a href="/campus/smr/" class="block p-8 bg-slate-50 rounded-xl border border-slate-200 hover:border-blue-300 hover:shadow-lg transition-all">
            <div class="text-sm font-medium text-blue-600 mb-3">Grado Medio</div>
            <h2 class="text-2xl font-bold text-slate-900 mb-3">SMR</h2>
            <p class="text-slate-600 mb-4">Sistemas Microinformáticos y Redes. Monta, configura y gestiona sistemas informáticos y redes.</p>
            <div class="flex gap-4 text-sm text-slate-500">
              <span>1400 horas</span>
              <span>·</span>
              <span>2 cursos</span>
            </div>
          </a>

          <a href="/campus/asir/" class="block p-8 bg-slate-50 rounded-xl border border-slate-200 hover:border-blue-300 hover:shadow-lg transition-all">
            <div class="text-sm font-medium text-blue-600 mb-3">Grado Superior</div>
            <h2 class="text-2xl font-bold text-slate-900 mb-3">ASIR</h2>
            <p class="text-slate-600 mb-4">Administración de Sistemas Informáticos en Red. Gestiona servidores, redes y seguridad empresarial.</p>
            <div class="flex gap-4 text-sm text-slate-500">
              <span>2000 horas</span>
              <span>·</span>
              <span>2 cursos</span>
            </div>
          </a>
        </div>
      </div>
    </section>
  </main>

  <Footer lang={lang} />
</BaseLayout>