feat: add Jaguar Path landing page for Integration Circles event series
CI/CD / deploy (push) Successful in 1m17s Details

New event landing page at /jaguar-path for Ximena's Zurich Integration Circles
(April & May 2025) with hero, offerings grid, dates, and Eventfrog/Instagram CTAs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-04-12 17:59:27 -04:00
parent b2658e0c34
commit 041a064d44
2 changed files with 228 additions and 0 deletions

View File

@ -0,0 +1,227 @@
import type { Metadata } from 'next';
import Image from 'next/image';
export const metadata: Metadata = {
title: 'The Jaguar Path — Integration Circles | XHIVA',
description: 'A space to pause, cleanse, and reconnect. Integration Circles in Zurich — April & May 2025. Limited to 12 people.',
};
const offerings = [
{
title: 'Energetic Cleansing',
description: 'Release what no longer serves you through guided somatic and energetic practices.',
},
{
title: 'Reconnect',
description: 'Return to your body, your breath, and your inner knowing.',
},
{
title: 'Deepen Intuition',
description: 'Strengthen the bridge between your rational mind and intuitive wisdom.',
},
{
title: 'Embrace Transformation',
description: 'Step into a new cycle with clarity, grounding and intention.',
},
];
const cycles = [
{
label: 'Cycle 1',
dates: '13 April — 27 April 2025',
sessions: ['Sunday 13 April', 'Sunday 20 April', 'Sunday 27 April'],
},
{
label: 'Cycle 2',
dates: '11 May — 25 May 2025',
sessions: ['Sunday 11 May', 'Sunday 18 May', 'Sunday 25 May'],
},
];
export default function JaguarPathPage() {
return (
<>
{/* Hero */}
<section className="page-hero relative flex flex-col items-center justify-center text-center px-6">
<div className="absolute inset-0 z-0">
<Image
src="/images/art/mujer-jaguar.webp"
alt="Mujer Jaguar"
fill
className="object-cover"
priority
/>
<div className="absolute inset-0 bg-gradient-to-b from-[#0f0f0f]/80 via-[#0f0f0f]/70 to-[#0f0f0f]/90" />
</div>
<div className="relative z-10 max-w-4xl mx-auto">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-4">
A NEW SERIES BY XIMENA
</p>
<h1 className="text-5xl md:text-7xl font-light tracking-wider mb-4 text-[var(--text-light)]">
The Jaguar Path
</h1>
<p className="font-sans-alt text-sm tracking-widest text-[var(--text-light)] opacity-80 mb-6">
Integration Circles
</p>
<div className="divider"></div>
<p className="text-lg md:text-xl max-w-2xl mx-auto leading-relaxed text-[var(--text-light)] opacity-80">
Zurich &middot; April &amp; May 2025
</p>
</div>
</section>
{/* Description */}
<section className="section bg-white">
<div className="max-w-3xl mx-auto text-center">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-4">
THE INVITATION
</p>
<h2 className="text-4xl font-light mb-6">
A Space to Return
</h2>
<div className="divider"></div>
<p className="text-lg md:text-xl leading-relaxed opacity-80">
A space to pause, cleanse, and reconnect. These Integration Circles are intimate
gatherings designed to support you through transitions, emotional release and the
deep work of remembering who you are. Rooted in somatic intelligence, ancestral
memory and intuitive practice, each circle offers a container of clarity, presence
and transformation.
</p>
</div>
</section>
{/* What Each Circle Offers */}
<section className="section">
<div className="max-w-5xl mx-auto">
<div className="text-center mb-12">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-4">
THE OFFERING
</p>
<h2 className="text-4xl font-light mb-6">
What Each Circle Offers
</h2>
<div className="divider"></div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
{offerings.map((item, index) => (
<div key={index} className="text-center p-8 border border-black/10 rounded-lg">
<span className="font-sans-alt text-2xl font-light text-[var(--accent-gold)] block mb-3">
{String(index + 1).padStart(2, '0')}
</span>
<h3 className="text-xl font-light tracking-wide mb-3">{item.title}</h3>
<p className="text-base leading-relaxed opacity-70">{item.description}</p>
</div>
))}
</div>
</div>
</section>
{/* Details */}
<section className="section dark-section">
<div className="max-w-3xl mx-auto text-center">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-4">
THE DETAILS
</p>
<h2 className="text-4xl font-light mb-6">
What to Expect
</h2>
<div className="divider"></div>
<div className="space-y-6 text-lg leading-relaxed opacity-80">
<p>
Each session includes individual energetic cleansing, crystal work, and rap
(traditional plant medicine song) to support your process. You will be held
in a safe, sacred space where the body can release, the mind can soften, and
the spirit can recalibrate.
</p>
<p>
These circles are not therapy they are ritual containers for those ready to
do the inner work with honesty, grounding and compassion.
</p>
</div>
</div>
</section>
{/* Dates & Logistics */}
<section className="section bg-white">
<div className="max-w-4xl mx-auto">
<div className="text-center mb-12">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-4">
DATES &amp; LOGISTICS
</p>
<h2 className="text-4xl font-light mb-6">
Two Cycles, Three Sessions Each
</h2>
<div className="divider"></div>
</div>
<div className="grid md:grid-cols-2 gap-8 mb-12">
{cycles.map((cycle) => (
<div key={cycle.label} className="text-center p-8 border border-black/10 rounded-lg">
<p className="font-sans-alt text-xs tracking-[0.2em] text-[var(--accent-gold)] mb-3">
{cycle.label.toUpperCase()}
</p>
<h3 className="text-2xl font-light mb-4">{cycle.dates}</h3>
<ul className="space-y-2">
{cycle.sessions.map((session) => (
<li key={session} className="text-base opacity-70">{session}</li>
))}
</ul>
</div>
))}
</div>
<div className="text-center space-y-4">
<p className="font-sans-alt text-sm tracking-widest text-[var(--accent-gold)]">
LIMITED TO 12 PEOPLE PER CIRCLE
</p>
<p className="text-lg opacity-70">
Zurich, Switzerland
</p>
</div>
</div>
</section>
{/* CTA */}
<section className="section relative overflow-hidden">
<div className="absolute inset-0 z-0 bg-[#0f0f0f]">
<Image
src="/images/art/mujer-jaguar.webp"
alt="Mujer Jaguar"
fill
className="object-cover opacity-20"
/>
</div>
<div className="max-w-3xl mx-auto relative z-10 text-center">
<h2 className="text-4xl md:text-5xl font-light mb-6 text-[var(--text-light)]">
Reserve Your Place
</h2>
<div className="divider"></div>
<p className="text-lg leading-relaxed mb-12 opacity-80 max-w-2xl mx-auto text-[var(--text-light)]">
If you feel called to walk this path, secure your spot through Eventfrog
or learn more on Instagram.
</p>
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
<a
href="https://eventfrog.ch/JaguarPath-Circles"
target="_blank"
rel="noopener noreferrer"
className="btn-filled"
style={{ background: 'var(--accent-gold)', borderColor: 'var(--accent-gold)' }}
>
Book on Eventfrog
</a>
<a
href="https://www.instagram.com/p/DWxVw1AgufY/"
target="_blank"
rel="noopener noreferrer"
className="btn-outline-light"
>
View on Instagram
</a>
</div>
</div>
</section>
</>
);
}

View File

@ -18,6 +18,7 @@ const navLinks = [
{ href: '/our-artisans', label: 'Our Artisans' },
],
},
{ href: '/jaguar-path', label: 'Jaguar Path' },
{ href: '/contact', label: 'Contact' },
];