Poulpe
3e90e911bc
Co-founders (Baptiste Moulin / Quentin / Radu Mihail) with a complementarity matrix, a three-phase timeline (pilot → mesh → network) and a contact block with mailto CTAs. Index page composes the full scroll narrative. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
90 lines
4.7 KiB
Plaintext
90 lines
4.7 KiB
Plaintext
---
|
|
const email = 'contact@nowyousea.fr';
|
|
---
|
|
|
|
<section id="contact" class="section">
|
|
<div class="container-narrow">
|
|
<div class="relative overflow-hidden rounded-3xl border border-tide-400/20 bg-gradient-to-br from-abyss-800/70 via-abyss-900/70 to-abyss-950 p-8 md:p-14">
|
|
<!-- Ambient -->
|
|
<div class="pointer-events-none absolute inset-0 opacity-80">
|
|
<div class="absolute -top-24 -right-24 h-96 w-96 rounded-full bg-tide-500/20 blur-3xl"></div>
|
|
<div class="absolute -bottom-24 -left-24 h-96 w-96 rounded-full bg-lagoon-500/15 blur-3xl"></div>
|
|
</div>
|
|
|
|
<div class="relative grid gap-10 lg:grid-cols-[1.1fr_1fr] lg:items-center">
|
|
<div>
|
|
<span class="eyebrow">Contact</span>
|
|
<h2 class="h-section mt-4">Parlons de votre port, de votre façade, de votre parc.</h2>
|
|
<p class="lead mt-6">
|
|
Vous gérez un port, une aire marine protégée, ou un projet éolien ? Vous cherchez un
|
|
outil de terrain pour produire des données environnementales sans y consacrer un
|
|
budget de recherche ? Écrivez-nous — on revient vite.
|
|
</p>
|
|
|
|
<div class="mt-8 flex flex-wrap gap-3">
|
|
<a href={`mailto:${email}?subject=Demande%20de%20d%C3%A9mo%20NowYouSea`} class="btn btn-primary">
|
|
<svg viewBox="0 0 24 24" class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<rect x="3" y="5" width="18" height="14" rx="2"/>
|
|
<path d="M3 7l9 6 9-6"/>
|
|
</svg>
|
|
Demander une démo
|
|
</a>
|
|
<a href={`mailto:${email}`} class="btn btn-ghost">
|
|
{email}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid gap-4">
|
|
<div class="rounded-xl border border-white/10 bg-white/[0.03] p-5">
|
|
<div class="flex items-start gap-4">
|
|
<span class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-tide-500/15 text-tide-400 ring-1 ring-tide-400/30">
|
|
<svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<rect x="3" y="5" width="18" height="14" rx="2"/>
|
|
<path d="M3 7l9 6 9-6"/>
|
|
</svg>
|
|
</span>
|
|
<div>
|
|
<div class="text-[11px] font-medium uppercase tracking-widest text-foam-100/55">Email</div>
|
|
<a href={`mailto:${email}`} class="mt-1 block font-display text-foam-50 hover:text-tide-400">{email}</a>
|
|
<p class="mt-1 text-xs text-foam-100/55">Réponse sous 48h ouvrées.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-xl border border-white/10 bg-white/[0.03] p-5">
|
|
<div class="flex items-start gap-4">
|
|
<span class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-lagoon-500/15 text-lagoon-400 ring-1 ring-lagoon-400/30">
|
|
<svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<path d="M12 2a10 10 0 1 0 10 10"/>
|
|
<path d="M12 2v10l7 4"/>
|
|
</svg>
|
|
</span>
|
|
<div>
|
|
<div class="text-[11px] font-medium uppercase tracking-widest text-foam-100/55">Démo terrain</div>
|
|
<p class="mt-1 text-sm text-foam-50">Sur sollicitation — présentation de l'architecture & de prototypes.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-xl border border-white/10 bg-white/[0.03] p-5">
|
|
<div class="flex items-start gap-4">
|
|
<span class="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-violet-500/15 text-violet-300 ring-1 ring-violet-400/30">
|
|
<svg viewBox="0 0 24 24" class="h-5 w-5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
|
<path d="M4 6h16v12H4z"/>
|
|
<path d="M4 10h16"/>
|
|
<circle cx="8" cy="14" r="1" fill="currentColor"/>
|
|
</svg>
|
|
</span>
|
|
<div>
|
|
<div class="text-[11px] font-medium uppercase tracking-widest text-foam-100/55">Partenariats</div>
|
|
<p class="mt-1 text-sm text-foam-50">Ports, collectivités, AMP, opérateurs éoliens, bureaux d'études.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|