b9cc3c6349
Add the /plans, /about, /blog and /contact routes, a Company dropdown in the navbar, and a shared 3D about-bus tile. Group components into ui, layout, home, plans, about, blog and contact folders. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
59 lines
2.9 KiB
TypeScript
59 lines
2.9 KiB
TypeScript
import { AboutBus } from "@/components/about/about-bus";
|
||
import { Reveal } from "@/components/ui/reveal";
|
||
|
||
const principles = [
|
||
{ title: "Simple", description: "Powerful technology shouldn’t feel complicated." },
|
||
{ title: "Connected", description: "Your systems should work together." },
|
||
{ title: "Scalable", description: "Your software should grow with your business." },
|
||
{ title: "Intelligence", description: "AI should help your team, not replace the people who know your business." },
|
||
];
|
||
|
||
export function About() {
|
||
return (
|
||
<section className="relative overflow-hidden py-20 lg:py-28">
|
||
<div className="mx-auto grid max-w-6xl items-start gap-12 px-4 sm:px-6 lg:grid-cols-[7fr_5fr] lg:gap-16">
|
||
<div className="flex flex-col gap-8">
|
||
<div className="flex flex-col gap-4">
|
||
<h2 className="text-4xl font-medium tracking-tight text-[#11192d] sm:text-5xl">About Voyager</h2>
|
||
<p className="text-base text-[#11192d]/70 sm:text-justify">
|
||
<span className="font-bold">Technology That Makes Tourism Businesses Simpler</span>
|
||
<br />
|
||
Voyager is an AI-powered business operating platform for tour operators, transportation companies, rental
|
||
businesses and tourism enterprises. Voyager was created around a simple idea: Tour operators shouldn’t have
|
||
to build their business around their software. The software should adapt to the business. Voyager brings
|
||
tour booking, ticketing, operations, fleet management, CRM, payments, communication, distribution,
|
||
marketing and AI together in one connected platform.
|
||
</p>
|
||
</div>
|
||
|
||
<div className="flex flex-col gap-4">
|
||
<h3 className="text-2xl font-medium text-[#11192d]">Our Principles</h3>
|
||
<div className="grid gap-4 sm:grid-cols-2">
|
||
{principles.map((p, i) => (
|
||
<Reveal key={p.title} delay={i * 80}>
|
||
<div className="flex h-full flex-col gap-2 rounded-3xl bg-[#0160d4]/3 px-6 py-4">
|
||
<h4 className="text-2xl font-medium text-[#11192d]">{p.title}</h4>
|
||
<p className="text-base text-[#11192d]/70">{p.description}</p>
|
||
</div>
|
||
</Reveal>
|
||
))}
|
||
<Reveal delay={principles.length * 80} className="sm:col-span-2">
|
||
<div className="flex flex-col gap-2 rounded-3xl bg-[#0160d4]/3 px-6 py-4">
|
||
<h4 className="text-2xl font-medium text-[#11192d]">Affordable</h4>
|
||
<p className="text-base text-[#11192d]/70">
|
||
Enterprise-level capability shouldn’t require enterprise-level complexity.
|
||
</p>
|
||
</div>
|
||
</Reveal>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<Reveal delay={100} className="relative mx-auto w-64 sm:w-72 lg:mx-0">
|
||
<AboutBus />
|
||
</Reveal>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|