<script setup lang="ts">
const { t } = useI18n();
useSeoMeta({
  title: computed(() => t("joinUsSeo.title")),
  description: computed(() => t("joinUsSeo.description")),
  ogTitle: computed(() => t("joinUsSeo.ogTitle")),
  ogDescription: computed(() => t("joinUsSeo.ogDescription")),
  keywords: computed(() => t("joinUsSeo.keywords")),
});
</script>
<template>
  <main>
    <InternalHeaderSection
      video-url="/videos/join-us.mp4"
      :pages="[{ name: $t('joinus') }]"
    >
      <template #title>
        <h1>
          {{ $t("joinUsHero.title") }}
        </h1>
      </template>
    </InternalHeaderSection>
    <JoinUsJob />
    <div class="bg-gradient-even pb-section px-4">
      <SubscribeSection />
    </div>
  </main>
</template>
<style scoped></style>
