<template>
  <div>
    <section class="py-20 sm:py-32" :style="{ background: 'var(--bg)' }">
      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div class="max-w-2xl">
          <h1 class="text-4xl sm:text-5xl font-bold mb-6" style="color: var(--text)">
            Professionelle Technik<br><span style="color: var(--color-accent)">fuer Ihre Veranstaltung</span>
          </h1>
          <p class="text-lg mb-8" style="color: var(--text-muted)">
            HMS Licht & Ton - Veranstaltungstechnik aus Leipheim / Ellzee.
          </p>
          <NuxtLink to="/mietkatalog" class="hms-btn hms-btn-primary text-base px-8 py-4">Mietkatalog oeffnen</NuxtLink>
        </div>
      </div>
    </section>
  </div>
</template>

<script setup lang="ts">
</script>
