40 lines
1.2 KiB
Vue
40 lines
1.2 KiB
Vue
<script setup>
|
|
import { ctaSection as defaultCta } from "~/data/navigation";
|
|
|
|
defineProps({
|
|
cta: {
|
|
type: Object,
|
|
default: () => defaultCta,
|
|
},
|
|
sectionId: {
|
|
type: String,
|
|
default: "consult",
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<section :id="sectionId" class="relative overflow-hidden bg-gm-green py-20 text-white">
|
|
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top_right,rgba(255,255,255,0.18),transparent_40%)]" />
|
|
<div data-cta-orbit class="absolute left-[8%] right-[8%] top-10 h-px bg-white/30" />
|
|
<div data-cta-orbit class="absolute bottom-10 left-[14%] right-[14%] h-px bg-white/20" />
|
|
<div class="container-gm relative flex flex-col items-center justify-center text-center" data-reveal>
|
|
<p class="text-balance text-3xl font-semibold leading-tight md:text-[42px]">
|
|
{{ cta.title }}
|
|
</p>
|
|
<p v-if="cta.subtitle" class="mt-4 max-w-2xl text-base leading-8 text-white/80">
|
|
{{ cta.subtitle }}
|
|
</p>
|
|
<NuxtLink
|
|
:to="cta.href"
|
|
class="gm-btn gm-btn-secondary mt-8 px-8 text-base font-semibold"
|
|
>
|
|
{{ cta.button }}
|
|
</NuxtLink>
|
|
<div class="mt-6">
|
|
<SectionRouteLinks :routes="cta.routes" light />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</template>
|