From 041a064d44ae49fcab49ae2a91b9ffc2a2335b1a Mon Sep 17 00:00:00 2001
From: Jeff Emmett <jeffemmett@gmail.com>
Date: Sun, 12 Apr 2026 17:59:27 -0400
Subject: [PATCH] feat: add Jaguar Path landing page for Integration Circles
 event series

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>
---
 src/app/jaguar-path/page.tsx  | 227 ++++++++++++++++++++++++++++++++++
 src/components/Navigation.tsx |   1 +
 2 files changed, 228 insertions(+)
 create mode 100644 src/app/jaguar-path/page.tsx

diff --git a/src/app/jaguar-path/page.tsx b/src/app/jaguar-path/page.tsx
new file mode 100644
index 0000000..756aad7
--- /dev/null
+++ b/src/app/jaguar-path/page.tsx
@@ -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>
+    </>
+  );
+}
diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx
index e56795e..46b01c9 100644
--- a/src/components/Navigation.tsx
+++ b/src/components/Navigation.tsx
@@ -18,6 +18,7 @@ const navLinks = [
       { href: '/our-artisans', label: 'Our Artisans' },
     ],
   },
+  { href: '/jaguar-path', label: 'Jaguar Path' },
   { href: '/contact', label: 'Contact' },
 ];