<script setup>
defineProps({
  title: { type: String, required: true },
  description: { type: String, default: '' },
})
</script>

<template>
  <section class="hud-page-hero" role="region" :aria-label="title">
    <div class="hud-hud-corners" aria-hidden="true" />
    <div class="hud-page-hero-inner">
      <h2>{{ title }}</h2>
      <p v-if="description">{{ description }}</p>
      <div class="hud-hero-divider" aria-hidden="true" />
    </div>
  </section>
</template>
