Manoel Freitas
484ac77ce7
* feat: modalidades de casamento e etapas corporativas * feat: home editorial e header/footer conforme preview * docs: proposta openspec home editorial * test: CTA hero agora ancora #sobre conforme preview * test: speed browser suite via visit reuse Collapse route×viewport cartesian products, merge home motion asserts, skip existing VisualContentSeeder JPEGs, ignore Screenshots.
42 lines
3.2 KiB
PHP
42 lines
3.2 KiB
PHP
@props([])
|
|
|
|
<section
|
|
aria-labelledby="vertentes-heading"
|
|
class="home-chapter border-b border-amare-border bg-amare-bg"
|
|
data-chapter="vertentes"
|
|
id="vertentes"
|
|
>
|
|
<div class="container-amare py-16 md:py-24" data-reveal-group>
|
|
<div class="max-w-3xl space-y-4" data-reveal data-reveal-from="up">
|
|
<p class="text-xs font-bold uppercase tracking-[0.16em] text-amare-accent-deep">02 — Duas vertentes, uma mesma forma de cuidar</p>
|
|
<h2 id="vertentes-heading" class="text-[clamp(2.375rem,5vw,4rem)] font-medium leading-[1.05] tracking-[-0.02em] text-amare-text">Como podemos acompanhar você?</h2>
|
|
</div>
|
|
|
|
<div class="mt-12 grid gap-6 md:mt-16 md:grid-cols-2 md:gap-[24px]">
|
|
<article class="relative flex min-h-[420px] flex-col justify-end bg-amare-bg-deep p-8 md:p-10" data-reveal data-reveal-from="up">
|
|
<div aria-hidden="true" class="pointer-events-none absolute inset-x-0 top-0 h-[43%] bg-gradient-to-b from-amare-bg to-transparent"></div>
|
|
<div class="relative flex flex-col gap-5">
|
|
<p class="text-xs font-bold uppercase tracking-[0.16em] text-amare-accent-deep">Amare Casamentos</p>
|
|
<h3 class="text-[clamp(1.5625rem,2.7vw,2.125rem)] font-medium leading-tight text-amare-text">Planejamento e condução para viver o processo com mais leveza.</h3>
|
|
<p class="text-amare-text-muted">Do início da organização à reta final, modalidades pensadas para diferentes momentos do casal.</p>
|
|
<a href="#casamentos" class="mt-2 inline-flex min-h-[48px] items-center justify-center self-start border border-amare-accent px-6 text-xs font-bold uppercase tracking-[0.09em] text-amare-accent-deep transition-colors hover:bg-amare-accent hover:text-amare-accent-text">
|
|
Conhecer casamentos
|
|
</a>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="relative flex min-h-[420px] flex-col justify-end bg-amare-bg-deep p-8 md:p-10" data-reveal data-reveal-from="up">
|
|
<div aria-hidden="true" class="pointer-events-none absolute inset-x-0 top-0 h-[43%] bg-gradient-to-b from-amare-bg to-transparent"></div>
|
|
<div class="relative flex flex-col gap-5">
|
|
<p class="text-xs font-bold uppercase tracking-[0.16em] text-amare-accent-deep">Amare Corporate</p>
|
|
<h3 class="text-[clamp(1.5625rem,2.7vw,2.125rem)] font-medium leading-tight text-amare-text">Eventos empresariais com organização, intenção e execução segura.</h3>
|
|
<p class="text-amare-text-muted">Uma frente própria para projetos corporativos, com linguagem e necessidades diferentes das celebrações sociais.</p>
|
|
<a href="#corporate" class="mt-2 inline-flex min-h-[48px] items-center justify-center self-start border border-amare-accent px-6 text-xs font-bold uppercase tracking-[0.09em] text-amare-accent-deep transition-colors hover:bg-amare-accent hover:text-amare-accent-text">
|
|
Conhecer Corporate
|
|
</a>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|