admin/40234-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tokenize coaching landing design

Browse Source
This commit is contained in:
Flatlogic Bot 2026-06-09 11:37:23 +00:00
parent b55c4cdb40
commit 9fb010bc3b
1 changed files with 110 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

210
frontend/src/pages/index.tsx
View File

@ -5,6 +5,27 @@ import Link from 'next/link';
import LayoutGuest from '../layouts/Guest';
import { getPageTitle } from '../config';
const ui = {
page: 'bg-[#fffdf9] text-[#19192d]',
banner: 'bg-gradient-to-r from-[#35b7a5] via-[#95b76e] to-[#c38a25] text-white',
navShell: 'rounded-full bg-white shadow-[0_18px_60px_rgba(31,31,50,0.08)] ring-1 ring-[#19192d]/5',
ink: 'text-[#19192d]',
muted: 'text-[#72798a]',
accent: 'text-[#35b7a5]',
gold: 'text-[#b17a1e]',
border: 'border-[#19192d]/10',
surface: 'bg-white',
softSurface: 'bg-[#fbf8f1]',
darkPanel: 'bg-[#19192d] text-white',
darkMuted: 'text-white/70',
button: 'bg-gradient-to-r from-[#36b39f] to-[#b98624] text-white shadow-[0_18px_45px_rgba(54,179,159,0.24)] transition hover:brightness-105',
section: 'mx-auto max-w-7xl px-5 py-20 lg:px-8',
card: 'rounded-[1.75rem] border border-[#19192d]/10 bg-white shadow-[0_18px_50px_rgba(31,31,50,0.05)]',
softCard: 'rounded-[1.75rem] border border-[#19192d]/10 bg-[#fbf8f1]',
overline: 'text-sm font-bold uppercase tracking-[0.28em] text-[#b17a1e]',
heading: 'font-serif font-semibold tracking-tight text-[#19192d]',
};
const trustItems = ['Coach-reviewed AI', 'Private client records', 'Built for coaching'];
const stats = [
@ -19,6 +40,13 @@ const workflow = [
['Before the next session', 'Surface open commitments, recent patterns, and a focused opening question.'],
];
const trustCards = [
['Your method', 'Capture language, frameworks, and recurring patterns from real sessions.'],
['Your approval', 'Review notes, prompts, resources, and messages before they reach the client.'],
['Your data', 'Keep client records structured around confidentiality and role-based access.'],
['Your client portal', 'Share only the commitments, resources, and reflections that move the work forward.'],
];
const testimonials = [
[
'The session recap caught the exact leadership pattern I wanted to revisit. I edited one sentence and sent it.',
@ -44,27 +72,27 @@ export default function Starter() {
<title>{getPageTitle('Coaching Workspace')}</title>
</Head>
<main className="min-h-screen bg-[#fffdf9] text-[#19192d]">
<div className="bg-gradient-to-r from-[#35b7a5] via-[#97b879] to-[#c38a25] px-5 py-5 text-center text-lg text-white">
<main className={`min-h-screen ${ui.page}`}>
<div className={`${ui.banner} px-5 py-5 text-center text-lg`}>
<p className="text-xs font-bold uppercase tracking-[0.34em]">Still human</p>
<p className="mt-2 text-2xl font-medium">AI is not a coach. Keep the real relationship at the center.</p>
<p className="mt-3 text-lg text-white/90">
Launch a modern coaching workspace.
<Link href="/login/" className="ml-2 font-semibold underline decoration-white underline-offset-4">
Open workspace
Open workspace
</Link>
</p>
</div>
<header className="relative z-20 px-5 pt-7">
<div className="mx-auto flex max-w-6xl items-center justify-between gap-5 rounded-full bg-white px-7 py-5 shadow-[0_18px_60px_rgba(31,31,50,0.08)] ring-1 ring-[#19192d]/5">
<div className={`mx-auto flex max-w-6xl items-center justify-between gap-5 px-7 py-5 ${ui.navShell}`}>
<Link href="/" className="flex items-center gap-3 text-lg font-semibold tracking-tight">
<span className="flex h-11 w-11 items-center justify-center rounded-2xl bg-[#fff5e7] text-2xl font-black text-[#37ad9f]">
<span className="flex h-11 w-11 items-center justify-center rounded-2xl bg-[#f3fbf8] text-2xl font-black text-[#35b7a5]">
C
</span>
<span className="sr-only">Coaching SaaS Workspace</span>
</Link>
<nav className="hidden items-center gap-8 text-lg font-medium text-[#25263d] md:flex">
<nav className={`hidden items-center gap-8 text-lg font-medium ${ui.ink} md:flex`}>
<a href="#how-it-works">How it works</a>
<a href="#coachee">Coachee</a>
<a href="#pricing">Pricing</a>
@ -73,43 +101,33 @@ export default function Starter() {
<a href="#events">Events</a>
<a href="#pricing">Packages</a>
</nav>
<div className="flex items-center gap-3">
<Link
href="/register/"
className="rounded-full bg-gradient-to-r from-[#36b39f] to-[#b98624] px-7 py-3 text-base font-semibold text-white shadow-[0_12px_35px_rgba(54,179,159,0.25)] transition hover:brightness-105"
>
Join waitlist
</Link>
</div>
<Link href="/register/" className={`rounded-full px-7 py-3 text-base font-semibold ${ui.button}`}>
Join waitlist
</Link>
</div>
</header>
<section className="mx-auto max-w-7xl px-5 pb-20 pt-8 text-center lg:px-8">
<div className="mx-auto max-w-5xl">
<p className="mb-8 text-sm font-bold uppercase tracking-[0.28em] text-[#b17a1e]">
For leadership and executive coaches
</p>
<h1 className="font-serif text-6xl font-semibold leading-[1.12] tracking-tight text-[#19192d] md:text-7xl xl:text-[6.7rem]">
<p className={`mb-8 ${ui.overline}`}>For leadership and executive coaches</p>
<h1 className={`${ui.heading} text-6xl leading-[1.12] md:text-7xl xl:text-[6.7rem]`}>
What happens when your best coaching{' '}
<span className="text-[#35b7a5]">keeps going.</span>
<span className={ui.accent}>keeps going.</span>
</h1>
<p className="mx-auto mt-9 max-w-3xl text-2xl leading-10 text-[#72798a]">
<p className={`mx-auto mt-9 max-w-3xl text-2xl leading-10 ${ui.muted}`}>
Show up fully present. No note-taking. No admin. Your workspace captures what makes
your coaching yours, so clients stay connected to the work between sessions.
</p>
<div className="mt-12 flex justify-center">
<Link
href="/register/"
className="rounded-full bg-gradient-to-r from-[#36b39f] to-[#b98624] px-10 py-5 text-lg font-semibold text-white shadow-[0_18px_45px_rgba(54,179,159,0.24)] transition hover:brightness-105"
>
<Link href="/register/" className={`rounded-full px-10 py-5 text-lg font-semibold ${ui.button}`}>
Join waitlist
</Link>
</div>
<p className="mt-6 text-lg text-[#5f6575]">$14/client/month. Everything included.</p>
<div className="mx-auto mt-10 flex max-w-3xl flex-wrap justify-center gap-x-9 gap-y-4 text-lg text-[#72798a]">
<p className={`mt-6 text-lg ${ui.muted}`}>$14/client/month. Everything included.</p>
<div className={`mx-auto mt-10 flex max-w-3xl flex-wrap justify-center gap-x-9 gap-y-4 text-lg ${ui.muted}`}>
{trustItems.map((item) => (
<span key={item} className="flex items-center gap-2">
<span className="text-[#35b7a5]">✦</span>
<span className={ui.accent}>✦</span>
{item}
</span>
))}
@ -118,28 +136,28 @@ export default function Starter() {
<div className="relative mx-auto mt-16 max-w-4xl">
<div className="absolute -inset-12 rounded-full bg-[#35b7a5]/10 blur-3xl" />
<div className="relative rounded-[2rem] border border-[#19192d]/10 bg-white p-4 shadow-[0_24px_80px_rgba(31,31,50,0.10)]">
<div className="rounded-[1.5rem] bg-[#17130d] p-4 text-[#fff7ec]">
<div className={`relative rounded-[2rem] border p-4 shadow-[0_24px_80px_rgba(31,31,50,0.10)] ${ui.border} ${ui.surface}`}>
<div className={`rounded-[1.5rem] p-4 ${ui.darkPanel}`}>
<div className="mb-4 flex items-center justify-between">
<div>
<p className="text-xs uppercase tracking-[0.16em] text-[#f3b35c]">Session insights</p>
<p className="text-xs uppercase tracking-[0.16em] text-[#c79a38]">Session insights</p>
<h2 className="mt-1 text-2xl font-semibold">Maya Chen · Session 4</h2>
</div>
<span className="rounded-full bg-[#f3b35c] px-3 py-1 text-sm font-semibold text-[#17130d]">
<span className="rounded-full bg-[#c79a38] px-3 py-1 text-sm font-semibold text-white">
Review
</span>
</div>
<div className="grid grid-cols-1 gap-3 md:grid-cols-3">
{['Delegation trust', 'Decision rights', 'Founder visibility'].map((topic) => (
<div key={topic} className="rounded-2xl bg-[#fff7ec]/10 p-4">
<p className="text-sm font-medium text-[#fff7ec]">{topic}</p>
<div key={topic} className="rounded-2xl bg-white/10 p-4">
<p className="text-sm font-medium text-white">{topic}</p>
</div>
))}
</div>
<div className="mt-4 rounded-2xl bg-[#fff7ec] p-5 text-[#17130d]">
<p className="text-sm font-semibold uppercase tracking-[0.14em] text-[#8d6125]">Commitments</p>
<div className="mt-4 rounded-2xl bg-white p-5 text-[#19192d]">
<p className={`text-sm font-semibold uppercase tracking-[0.14em] ${ui.gold}`}>Commitments</p>
<ul className="mt-4 space-y-3 text-sm leading-6">
<li>Draft a decision-rights matrix before Friday.</li>
<li>Choose three decisions the team can own without founder approval.</li>
@ -148,27 +166,27 @@ export default function Starter() {
</div>
<div className="mt-4 grid grid-cols-1 gap-4 lg:grid-cols-[0.9fr_1.1fr]">
<div className="rounded-2xl bg-[#fff7ec]/10 p-5">
<p className="text-sm font-semibold text-[#f3b35c]">Pattern</p>
<p className="mt-2 leading-7 text-[#f6ead5]">
<div className="rounded-2xl bg-white/10 p-5">
<p className="text-sm font-semibold text-[#c79a38]">Pattern</p>
<p className={`mt-2 leading-7 ${ui.darkMuted}`}>
Maya is moving from control as quality assurance toward explicit decision boundaries.
</p>
</div>
<div className="rounded-2xl bg-[#fff7ec]/10 p-5">
<p className="text-sm font-semibold text-[#f3b35c]">Follow-up draft</p>
<p className="mt-2 leading-7 text-[#f6ead5]">
<div className="rounded-2xl bg-white/10 p-5">
<p className="text-sm font-semibold text-[#c79a38]">Follow-up draft</p>
<p className={`mt-2 leading-7 ${ui.darkMuted}`}>
This week is about making delegation visible enough that trust can become operational.
</p>
</div>
</div>
</div>
<div className="absolute -bottom-8 right-8 hidden w-80 rounded-3xl border border-[#19192d]/10 bg-white p-5 text-left shadow-[0_22px_60px_rgba(31,31,50,0.14)] lg:block">
<p className="text-xs font-semibold uppercase tracking-[0.16em] text-[#8d6125]">Client message</p>
<p className="mt-3 leading-7 text-[#5c5143]">
<div className={`absolute -bottom-8 right-8 hidden w-80 p-5 text-left lg:block ${ui.card}`}>
<p className={`text-xs font-semibold uppercase tracking-[0.16em] ${ui.gold}`}>Client message</p>
<p className={`mt-3 leading-7 ${ui.muted}`}>
“The board conversation went better than expected. I led with the narrative instead of defending the roadmap.”
</p>
<p className="mt-4 rounded-2xl bg-[#f3eddf] p-3 text-sm font-medium">
<p className={`mt-4 rounded-2xl p-3 text-sm font-medium ${ui.softSurface}`}>
Suggested reply: What changed in the room when you led that way?
</p>
</div>
@ -176,34 +194,34 @@ export default function Starter() {
</div>
</section>
<section className="border-y border-[#19192d]/10 bg-[#fbf8f1] px-5 py-10">
<section className={`border-y px-5 py-10 ${ui.border} ${ui.softSurface}`}>
<div className="mx-auto grid max-w-7xl grid-cols-1 gap-6 md:grid-cols-3">
{stats.map(([value, label]) => (
<div key={value} className="border-l border-[#2e2417]/15 pl-5">
<p className="font-serif text-5xl font-semibold text-[#17130d]">{value}</p>
<p className="mt-3 max-w-sm leading-7 text-[#5c5143]">{label}</p>
<div key={value} className={`border-l pl-5 ${ui.border}`}>
<p className={`${ui.heading} text-5xl`}>{value}</p>
<p className={`mt-3 max-w-sm leading-7 ${ui.muted}`}>{label}</p>
</div>
))}
</div>
</section>
<section id="how-it-works" className="mx-auto max-w-7xl px-5 py-20 lg:px-8">
<section id="how-it-works" className={ui.section}>
<div className="grid grid-cols-1 gap-10 lg:grid-cols-[0.8fr_1.2fr]">
<div>
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#8d6125]">The new practice rhythm</p>
<h2 className="mt-4 font-serif text-5xl font-semibold leading-tight md:text-6xl">
<p className={ui.overline}>The new practice rhythm</p>
<h2 className={`${ui.heading} mt-4 text-5xl leading-tight md:text-6xl`}>
Before, between, and after every session.
</h2>
</div>
<div className="grid grid-cols-1 gap-4">
{workflow.map(([title, copy], index) => (
<div key={title} className="grid grid-cols-[3rem_1fr] gap-5 rounded-3xl border border-[#2e2417]/10 bg-[#fff8ec] p-5">
<div className="flex h-12 w-12 items-center justify-center rounded-full bg-[#17130d] font-semibold text-[#fff7ec]">
<div key={title} className={`grid grid-cols-[3rem_1fr] gap-5 p-5 ${ui.card}`}>
<div className="flex h-12 w-12 items-center justify-center rounded-full bg-[#35b7a5] font-semibold text-white">
{index + 1}
</div>
<div>
<h3 className="text-xl font-semibold">{title}</h3>
<p className="mt-2 leading-7 text-[#5c5143]">{copy}</p>
<p className={`mt-2 leading-7 ${ui.muted}`}>{copy}</p>
</div>
</div>
))}
@ -211,33 +229,33 @@ export default function Starter() {
</div>
</section>
<section id="session-memory" className="bg-[#17130d] px-5 py-20 text-[#fff7ec]">
<section id="session-memory" className={`px-5 py-20 ${ui.darkPanel}`}>
<div className="mx-auto grid max-w-7xl grid-cols-1 gap-10 lg:grid-cols-[0.95fr_1.05fr] lg:px-8">
<div className="flex flex-col justify-center">
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#f3b35c]">Session memory</p>
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#c79a38]">Session memory</p>
<h2 className="mt-4 font-serif text-5xl font-semibold leading-tight md:text-6xl">
Stop opening old notes before every call.
</h2>
<p className="mt-6 text-lg leading-8 text-[#d8cbb6]">
<p className={`mt-6 text-lg leading-8 ${ui.darkMuted}`}>
The workspace pulls together open commitments, themes across sessions, client messages,
and a suggested opening question. You review everything first.
</p>
<div className="mt-8 grid grid-cols-2 gap-4">
{['Open commitments', 'Client patterns', 'Shared notes', 'Prep questions'].map((item) => (
<div key={item} className="rounded-2xl border border-[#fff7ec]/10 bg-[#fff7ec]/5 p-4">
<div key={item} className="rounded-2xl border border-white/10 bg-white/5 p-4">
<p className="font-semibold">{item}</p>
</div>
))}
</div>
</div>
<div className="rounded-[2rem] border border-[#fff7ec]/10 bg-[#fff7ec] p-5 text-[#17130d]">
<div className="flex flex-wrap items-center justify-between gap-4 border-b border-[#2e2417]/10 pb-5">
<div className={`rounded-[2rem] border p-5 ${ui.border} ${ui.surface} ${ui.ink}`}>
<div className={`flex flex-wrap items-center justify-between gap-4 border-b pb-5 ${ui.border}`}>
<div>
<p className="text-sm font-semibold uppercase tracking-[0.16em] text-[#8d6125]">Session prep</p>
<p className={`text-sm font-semibold uppercase tracking-[0.16em] ${ui.gold}`}>Session prep</p>
<h3 className="mt-1 text-2xl font-semibold">Maya Chen · Session 5</h3>
</div>
<span className="rounded-full bg-[#e7f2df] px-4 py-2 text-sm font-semibold text-[#356133]">
<span className="rounded-full bg-[#e8f6f2] px-4 py-2 text-sm font-semibold text-[#248b7e]">
Ready when you are
</span>
</div>
@ -248,23 +266,23 @@ export default function Starter() {
['2', 'open commitments'],
['3', 'goals in focus'],
].map(([value, label]) => (
<div key={label} className="rounded-2xl bg-[#f3eddf] p-4">
<div key={label} className={`rounded-2xl p-4 ${ui.softSurface}`}>
<p className="text-3xl font-semibold">{value}</p>
<p className="mt-1 text-sm text-[#5c5143]">{label}</p>
<p className={`mt-1 text-sm ${ui.muted}`}>{label}</p>
</div>
))}
</div>
<div className="mt-5 rounded-2xl border border-[#2e2417]/10 p-5">
<p className="text-sm font-semibold uppercase tracking-[0.14em] text-[#8d6125]">Top thread</p>
<div className={`mt-5 rounded-2xl border p-5 ${ui.border}`}>
<p className={`text-sm font-semibold uppercase tracking-[0.14em] ${ui.gold}`}>Top thread</p>
<p className="mt-3 text-lg font-semibold">Decision rights are clear on paper, but still feel risky in practice.</p>
<p className="mt-3 leading-7 text-[#5c5143]">
<p className={`mt-3 leading-7 ${ui.muted}`}>
The last two sessions both returned to trust, escalation rules, and what Maya needs to see before stepping back.
</p>
</div>
<div className="mt-5 rounded-2xl bg-[#17130d] p-5 text-[#fff7ec]">
<p className="text-sm font-semibold text-[#f3b35c]">Suggested opening</p>
<div className={`mt-5 rounded-2xl p-5 ${ui.darkPanel}`}>
<p className="text-sm font-semibold text-[#c79a38]">Suggested opening</p>
<p className="mt-3 text-xl leading-8">
“Where did delegation feel cleaner this week, and where did your body still want to take the wheel?”
</p>
@ -273,52 +291,47 @@ export default function Starter() {
</div>
</section>
<section id="trust" className="mx-auto max-w-7xl px-5 py-20 lg:px-8">
<section id="trust" className={ui.section}>
<div className="grid grid-cols-1 gap-10 lg:grid-cols-[0.9fr_1.1fr]">
<div>
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#8d6125]">Coach supervised</p>
<h2 className="mt-4 font-serif text-5xl font-semibold leading-tight md:text-6xl">
<p className={ui.overline}>Coach supervised</p>
<h2 className={`${ui.heading} mt-4 text-5xl leading-tight md:text-6xl`}>
The AI proposes. The coach decides.
</h2>
<p className="mt-6 text-lg leading-8 text-[#5c5143]">
<p className={`mt-6 text-lg leading-8 ${ui.muted}`}>
Private notes stay private. Shared notes are approved. Client-facing content carries the coach's voice,
not a generic chatbot voice.
</p>
</div>
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
{[
['Your method', 'Capture language, frameworks, and recurring patterns from real sessions.'],
['Your approval', 'Review notes, prompts, resources, and messages before they reach the client.'],
['Your data', 'Keep client records structured around confidentiality and role-based access.'],
['Your client portal', 'Share only the commitments, resources, and reflections that move the work forward.'],
].map(([title, copy]) => (
<div key={title} className="rounded-3xl border border-[#2e2417]/10 bg-[#fff8ec] p-6">
{trustCards.map(([title, copy]) => (
<div key={title} className={`p-6 ${ui.card}`}>
<h3 className="text-xl font-semibold">{title}</h3>
<p className="mt-3 leading-7 text-[#5c5143]">{copy}</p>
<p className={`mt-3 leading-7 ${ui.muted}`}>{copy}</p>
</div>
))}
</div>
</div>
</section>
<section className="bg-[#fff8ec] px-5 py-20">
<section id="events" className={`px-5 py-20 ${ui.softSurface}`}>
<div className="mx-auto max-w-7xl">
<div className="mb-8 flex flex-col justify-between gap-4 md:flex-row md:items-end">
<div>
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#8d6125]">Built with coaches</p>
<h2 className="mt-4 font-serif text-5xl font-semibold">Designed for real client work.</h2>
<p className={ui.overline}>Built with coaches</p>
<h2 className={`${ui.heading} mt-4 text-5xl`}>Designed for real client work.</h2>
</div>
<Link href="/register/" className="rounded-full bg-[#17130d] px-6 py-3 text-center font-semibold text-[#fff7ec]">
<Link href="/register/" className={`rounded-full px-6 py-3 text-center font-semibold ${ui.button}`}>
Start your workspace
</Link>
</div>
<div className="grid grid-cols-1 gap-4 md:grid-cols-3">
{testimonials.map(([quote, name, role]) => (
<figure key={name} className="rounded-3xl border border-[#2e2417]/10 bg-[#f3eddf] p-6">
<blockquote className="leading-8 text-[#3b3023]">“{quote}”</blockquote>
<figure key={name} className={`p-6 ${ui.card}`}>
<blockquote className={`leading-8 ${ui.ink}`}>“{quote}”</blockquote>
<figcaption className="mt-6">
<p className="font-semibold">{name}</p>
<p className="text-sm text-[#5c5143]">{role}</p>
<p className={`text-sm ${ui.muted}`}>{role}</p>
</figcaption>
</figure>
))}
@ -327,37 +340,34 @@ export default function Starter() {
</section>
<section id="pricing" className="px-5 py-20">
<div className="mx-auto grid max-w-7xl grid-cols-1 overflow-hidden rounded-[2rem] border border-[#2e2417]/10 bg-[#17130d] text-[#fff7ec] lg:grid-cols-[0.9fr_1.1fr]">
<div className={`mx-auto grid max-w-7xl grid-cols-1 overflow-hidden rounded-[2rem] border lg:grid-cols-[0.9fr_1.1fr] ${ui.border} ${ui.darkPanel}`}>
<div className="p-8 md:p-12">
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#f3b35c]">Template package</p>
<p className="text-sm font-semibold uppercase tracking-[0.18em] text-[#c79a38]">Template package</p>
<h2 className="mt-4 font-serif text-5xl font-semibold leading-tight">
Launch a coaching practice with the workspace already inside.
</h2>
</div>
<div className="bg-[#fff7ec] p-8 text-[#17130d] md:p-12">
<div className={`p-8 md:p-12 ${ui.surface} ${ui.ink}`}>
<h3 className="text-2xl font-semibold">Executive Momentum</h3>
<p className="mt-3 leading-7 text-[#5c5143]">
<p className={`mt-3 leading-7 ${ui.muted}`}>
A ready-made package page, client records, session memory, prep briefs, resources, and portal flow.
</p>
<div className="mt-7 grid grid-cols-1 gap-3 sm:grid-cols-2">
{['6 coaching sessions', 'AI-assisted session notes', 'Shared resources', 'Client portal access'].map((item) => (
<div key={item} className="rounded-2xl bg-[#f3eddf] p-4 font-medium">
<div key={item} className={`rounded-2xl p-4 font-medium ${ui.softSurface}`}>
{item}
</div>
))}
</div>
<Link
href="/register/"
className="mt-8 inline-flex rounded-full bg-[#17130d] px-7 py-4 font-semibold text-[#fff7ec]"
>
<Link href="/register/" className={`mt-8 inline-flex rounded-full px-7 py-4 font-semibold ${ui.button}`}>
Create workspace
</Link>
</div>
</div>
</section>
<footer className="border-t border-[#2e2417]/10 px-5 py-10">
<div className="mx-auto flex max-w-7xl flex-col justify-between gap-5 text-sm text-[#5c5143] md:flex-row">
<footer className={`border-t px-5 py-10 ${ui.border}`}>
<div className={`mx-auto flex max-w-7xl flex-col justify-between gap-5 text-sm md:flex-row ${ui.muted}`}>
<p>© 2026 Coaching SaaS Workspace. Coaching beyond the session.</p>
<div className="flex gap-5">
<Link href="/privacy-policy/">Privacy Policy</Link>