feat: Implement initial website structure with core pages, layout, and reusable UI components, alongside ESLint configuration and SEO setup.
This commit is contained in:
1elle1
@@ -0,0 +1,242 @@
|
||||
import { Container } from "@/components/ui/Container";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import { Card } from "@/components/ui/Card";
|
||||
import { FadeIn } from "@/components/ui/FadeIn";
|
||||
import { Calendar, ArrowRight } from "lucide-react";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Aktuelles",
|
||||
description:
|
||||
"Bleiben Sie auf dem Laufenden über Neuigkeiten, Events und Angebote bei Sportbox Reutte.",
|
||||
openGraph: {
|
||||
title: "Aktuelles | Sportbox Reutte",
|
||||
description:
|
||||
"Neuigkeiten, Events und Angebote bei Sportbox Reutte – Ihrem Fitnessstudio in Reutte, Tirol.",
|
||||
url: "https://sportbox-reutte.at/aktuelles",
|
||||
},
|
||||
};
|
||||
|
||||
const BLOG_POSTS = [
|
||||
{
|
||||
title: "5 Tipps für den perfekten Trainingsstart",
|
||||
excerpt:
|
||||
"Sie möchten mit dem Training beginnen, wissen aber nicht wo? Unsere Experten teilen ihre besten Tipps für Einsteiger.",
|
||||
date: "2026-01-15",
|
||||
category: "Tipps",
|
||||
},
|
||||
{
|
||||
title: "Neue Gruppenkurse ab Februar",
|
||||
excerpt:
|
||||
"Ab Februar erweitern wir unser Kursangebot: HIIT, Functional Training und Pilates neu im Programm.",
|
||||
date: "2026-01-10",
|
||||
category: "Neuigkeiten",
|
||||
},
|
||||
{
|
||||
title: "Ernährung und Training: Was wirklich zählt",
|
||||
excerpt:
|
||||
"Unsere Ernährungsberaterin Lisa Mayer erklärt, wie Sie Ihre Ernährung optimal auf Ihr Training abstimmen.",
|
||||
date: "2026-01-05",
|
||||
category: "Ernährung",
|
||||
},
|
||||
{
|
||||
title: "Rückblick: Community Workout im Dezember",
|
||||
excerpt:
|
||||
"Über 40 Teilnehmer beim letzten Community Workout – ein Rückblick auf einen großartigen Abend.",
|
||||
date: "2025-12-20",
|
||||
category: "Events",
|
||||
},
|
||||
{
|
||||
title: "Krafttraining für Anfänger: Der richtige Einstieg",
|
||||
excerpt:
|
||||
"Thomas Huber zeigt die wichtigsten Grundübungen und erklärt, worauf Anfänger achten sollten.",
|
||||
date: "2025-12-15",
|
||||
category: "Training",
|
||||
},
|
||||
{
|
||||
title: "Yoga und Fitness: Die perfekte Kombination",
|
||||
excerpt:
|
||||
"Warum Yoga die ideale Ergänzung zu Ihrem Krafttraining ist und wie Sie beide Disziplinen verbinden können.",
|
||||
date: "2025-12-10",
|
||||
category: "Yoga",
|
||||
},
|
||||
] as const;
|
||||
|
||||
const EVENTS = [
|
||||
{
|
||||
title: "Community Workout – Open Air",
|
||||
date: "15. März 2026",
|
||||
time: "10:00 – 12:00 Uhr",
|
||||
description: "Gemeinsames Training im Freien für alle Fitnesslevel.",
|
||||
},
|
||||
{
|
||||
title: "Ernährungs-Workshop",
|
||||
date: "22. März 2026",
|
||||
time: "14:00 – 16:00 Uhr",
|
||||
description:
|
||||
"Lernen Sie, wie Sie Ihre Mahlzeiten optimal für Ihre Ziele planen.",
|
||||
},
|
||||
{
|
||||
title: "Fitness-Challenge: 30 Tage",
|
||||
date: "1. April 2026",
|
||||
time: "Start: jederzeit",
|
||||
description:
|
||||
"30 Tage, 30 Challenges – machen Sie mit und erreichen Sie neue Bestleistungen.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
function formatDate(dateString: string): string {
|
||||
return new Date(dateString).toLocaleDateString("de-AT", {
|
||||
day: "numeric",
|
||||
month: "long",
|
||||
year: "numeric",
|
||||
});
|
||||
}
|
||||
|
||||
export default function AktuellesPage() {
|
||||
return (
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<section className="pt-32 pb-[var(--spacing-section)] md:pt-40 md:pb-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-secondary/60 mb-4">
|
||||
Aktuelles
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<h1
|
||||
className="font-bold max-w-2xl"
|
||||
style={{
|
||||
fontSize: "clamp(var(--text-3xl), 4vw, var(--text-5xl))",
|
||||
lineHeight: "1.1",
|
||||
letterSpacing: "var(--text-5xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Neuigkeiten & Events
|
||||
</h1>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.2}>
|
||||
<p className="mt-6 max-w-xl text-secondary/70" style={{ fontSize: "var(--text-lg)" }}>
|
||||
Bleiben Sie auf dem Laufenden über Neuigkeiten, Events und
|
||||
Angebote in unserem Fitnessstudio.
|
||||
</p>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Blog Posts */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-2"
|
||||
style={{
|
||||
fontSize: "var(--text-2xl)",
|
||||
lineHeight: "var(--text-2xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Beiträge
|
||||
</h2>
|
||||
<p className="text-muted mb-10">
|
||||
Tipps, Neuigkeiten und Wissenswertes rund um Fitness und Gesundheit.
|
||||
</p>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{BLOG_POSTS.map((post, index) => (
|
||||
<FadeIn key={post.title} delay={index * 0.05}>
|
||||
<article>
|
||||
<Card className="h-full flex flex-col">
|
||||
<div className="flex items-center gap-3 mb-4">
|
||||
<span className="text-xs uppercase tracking-widest text-muted font-medium">
|
||||
{post.category}
|
||||
</span>
|
||||
<span className="text-xs text-muted">
|
||||
{formatDate(post.date)}
|
||||
</span>
|
||||
</div>
|
||||
<h3 className="text-base font-bold mb-2">{post.title}</h3>
|
||||
<p className="text-sm text-muted flex-1">{post.excerpt}</p>
|
||||
<div className="mt-4 flex items-center gap-1 text-sm font-medium text-primary">
|
||||
<span>Weiterlesen</span>
|
||||
<ArrowRight size={14} aria-hidden="true" />
|
||||
</div>
|
||||
</Card>
|
||||
</article>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Events */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-neutral">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-2"
|
||||
style={{
|
||||
fontSize: "var(--text-2xl)",
|
||||
lineHeight: "var(--text-2xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Kommende Events
|
||||
</h2>
|
||||
<p className="text-muted mb-10">
|
||||
Workshops, Community-Events und mehr – seien Sie dabei.
|
||||
</p>
|
||||
</FadeIn>
|
||||
<div className="space-y-4">
|
||||
{EVENTS.map((event, index) => (
|
||||
<FadeIn key={event.title} delay={index * 0.1}>
|
||||
<Card className="bg-background">
|
||||
<div className="flex flex-col md:flex-row md:items-center gap-4 md:gap-8">
|
||||
<div className="flex items-center gap-3 md:min-w-48">
|
||||
<Calendar size={18} className="text-muted" aria-hidden="true" />
|
||||
<div>
|
||||
<p className="text-sm font-bold">{event.date}</p>
|
||||
<p className="text-xs text-muted">{event.time}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h3 className="text-base font-bold">{event.title}</h3>
|
||||
<p className="text-sm text-muted mt-1">{event.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* CTA */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container className="text-center">
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-4"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Nichts verpassen
|
||||
</h2>
|
||||
<p className="text-secondary/70 mb-8 max-w-lg mx-auto">
|
||||
Kontaktieren Sie uns für aktuelle Informationen zu Events und
|
||||
Angeboten.
|
||||
</p>
|
||||
<Button
|
||||
href="/leistungen#kontakt"
|
||||
variant="secondary"
|
||||
className="border-secondary text-secondary hover:bg-secondary hover:text-primary"
|
||||
>
|
||||
Jetzt Termin buchen
|
||||
</Button>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
+33
-5
@@ -1,9 +1,33 @@
|
||||
import type { Metadata, Viewport } from "next";
|
||||
import { Inter } from "next/font/google";
|
||||
import "@/theme/globals.css";
|
||||
import "@/theme/stylesheet.css";
|
||||
import { Header } from "@/components/layout/Header";
|
||||
import { Footer } from "@/components/layout/Footer";
|
||||
|
||||
const inter = Inter({
|
||||
subsets: ["latin"],
|
||||
display: "swap",
|
||||
variable: "--font-inter",
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Website",
|
||||
description: "Generated website",
|
||||
title: {
|
||||
default: "Sportbox Reutte – Dein Fitnessstudio in Reutte",
|
||||
template: "%s | Sportbox Reutte",
|
||||
},
|
||||
description:
|
||||
"Willkommen bei Sportbox Reutte – Ihr Fitnessstudio für individuelle Trainingspläne und persönliche Betreuung in Reutte, Tirol.",
|
||||
metadataBase: new URL("https://sportbox-reutte.at"),
|
||||
openGraph: {
|
||||
type: "website",
|
||||
locale: "de_AT",
|
||||
url: "https://sportbox-reutte.at",
|
||||
siteName: "Sportbox Reutte",
|
||||
title: "Sportbox Reutte – Dein Fitnessstudio in Reutte",
|
||||
description:
|
||||
"Ihr Fitnessstudio für individuelle Trainingspläne und persönliche Betreuung in Reutte, Tirol.",
|
||||
},
|
||||
robots: {
|
||||
index: true,
|
||||
follow: true,
|
||||
@@ -13,7 +37,7 @@ export const metadata: Metadata = {
|
||||
export const viewport: Viewport = {
|
||||
width: "device-width",
|
||||
initialScale: 1,
|
||||
themeColor: "#ffffff",
|
||||
themeColor: "#000000",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
@@ -22,8 +46,12 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="de">
|
||||
<body>{children}</body>
|
||||
<html lang="de" className={inter.variable}>
|
||||
<body>
|
||||
<Header />
|
||||
{children}
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,227 @@
|
||||
import { Container } from "@/components/ui/Container";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import { SectionHeading } from "@/components/ui/SectionHeading";
|
||||
import { Card } from "@/components/ui/Card";
|
||||
import { FadeIn } from "@/components/ui/FadeIn";
|
||||
import { ContactForm } from "@/components/ui/ContactForm";
|
||||
import { FaqSection } from "@/components/sections/FaqSection";
|
||||
import { Dumbbell, Users, Apple, Flower2, Zap, HeartPulse } from "lucide-react";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Leistungen",
|
||||
description:
|
||||
"Informieren Sie sich über unser vielfältiges Kursangebot und individuelle Trainingsmöglichkeiten bei Sportbox Reutte.",
|
||||
openGraph: {
|
||||
title: "Leistungen | Sportbox Reutte",
|
||||
description:
|
||||
"Vielfältiges Kursangebot und individuelle Trainingsmöglichkeiten bei Sportbox Reutte in Reutte, Tirol.",
|
||||
url: "https://sportbox-reutte.at/leistungen",
|
||||
},
|
||||
};
|
||||
|
||||
const SERVICES = [
|
||||
{
|
||||
icon: Dumbbell,
|
||||
title: "Personal Training",
|
||||
description:
|
||||
"Individuell abgestimmte Trainingspläne mit persönlicher Betreuung durch zertifizierte Trainer. Ideal für gezielte Ziele wie Muskelaufbau, Gewichtsreduktion oder Rehabilitation.",
|
||||
features: [
|
||||
"1:1 Betreuung",
|
||||
"Individueller Trainingsplan",
|
||||
"Regelmäßige Fortschrittskontrolle",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
title: "Gruppenkurse",
|
||||
description:
|
||||
"Vielfältige Kurse für jedes Fitnesslevel – von HIIT über Functional Training bis Pilates. Gemeinsam trainieren motiviert und macht Spaß.",
|
||||
features: [
|
||||
"Verschiedene Kursformate",
|
||||
"Für alle Levels",
|
||||
"Motivierende Gruppenatmosphäre",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Apple,
|
||||
title: "Ernährungsberatung",
|
||||
description:
|
||||
"Professionelle Beratung durch unsere diplomierte Ernährungsberaterin. Wir helfen Ihnen, Ihre Ernährung optimal auf Ihre Trainingsziele abzustimmen.",
|
||||
features: [
|
||||
"Persönlicher Ernährungsplan",
|
||||
"Sportgerechte Ernährung",
|
||||
"Nachhaltige Umstellung",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Flower2,
|
||||
title: "Yoga & Mobility",
|
||||
description:
|
||||
"Finden Sie Balance zwischen Kraft und Flexibilität. Unsere Yoga- und Mobility-Kurse verbessern Ihre Beweglichkeit und reduzieren Stress.",
|
||||
features: [
|
||||
"Verschiedene Yoga-Stile",
|
||||
"Stretching & Mobility",
|
||||
"Atemtechniken",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Krafttraining",
|
||||
description:
|
||||
"Strukturiertes Krafttraining an modernen Geräten und mit freien Gewichten. Von Grundlagen bis Wettkampfvorbereitung.",
|
||||
features: [
|
||||
"Moderne Geräte",
|
||||
"Freie Gewichte",
|
||||
"Technikschulung",
|
||||
],
|
||||
},
|
||||
{
|
||||
icon: HeartPulse,
|
||||
title: "Gesundheitstraining",
|
||||
description:
|
||||
"Präventives und rehabilitatives Training für mehr Wohlbefinden im Alltag. Ideal für Rückengesundheit, Haltungsverbesserung und allgemeine Fitness.",
|
||||
features: [
|
||||
"Rückentraining",
|
||||
"Haltungsanalyse",
|
||||
"Präventives Training",
|
||||
],
|
||||
},
|
||||
] as const;
|
||||
|
||||
export default function LeistungenPage() {
|
||||
return (
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<section className="pt-32 pb-[var(--spacing-section)] md:pt-40 md:pb-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-secondary/60 mb-4">
|
||||
Leistungen
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<h1
|
||||
className="font-bold max-w-2xl"
|
||||
style={{
|
||||
fontSize: "clamp(var(--text-3xl), 4vw, var(--text-5xl))",
|
||||
lineHeight: "1.1",
|
||||
letterSpacing: "var(--text-5xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Was wir für Sie tun können.
|
||||
</h1>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.2}>
|
||||
<p className="mt-6 max-w-xl text-secondary/70" style={{ fontSize: "var(--text-lg)" }}>
|
||||
Vielfältige Angebote für Ihre individuellen Fitnessziele –
|
||||
professionell, persönlich und auf Sie abgestimmt.
|
||||
</p>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Services */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Unser Angebot"
|
||||
subtitle="Von Personal Training bis Ernährungsberatung – wir haben für jeden das Richtige."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{SERVICES.map((service, index) => (
|
||||
<FadeIn key={service.title} delay={index * 0.08}>
|
||||
<Card className="h-full flex flex-col">
|
||||
<service.icon
|
||||
size={28}
|
||||
className="mb-4 text-primary"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<h3 className="text-lg font-bold mb-2">{service.title}</h3>
|
||||
<p className="text-sm text-muted mb-4 flex-1">
|
||||
{service.description}
|
||||
</p>
|
||||
<ul className="space-y-1.5">
|
||||
{service.features.map((feature) => (
|
||||
<li
|
||||
key={feature}
|
||||
className="text-sm text-foreground flex items-start gap-2"
|
||||
>
|
||||
<span className="mt-1.5 w-1 h-1 bg-primary rounded-full shrink-0" aria-hidden="true" />
|
||||
{feature}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* FAQ */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-neutral">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Häufige Fragen"
|
||||
subtitle="Antworten auf die häufigsten Fragen rund um Sportbox Reutte."
|
||||
/>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<FaqSection />
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Contact Form */}
|
||||
<section id="kontakt" className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||||
<FadeIn>
|
||||
<div>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-muted mb-4">
|
||||
Kontakt
|
||||
</p>
|
||||
<h2
|
||||
className="font-bold mb-6"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
letterSpacing: "var(--text-3xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Jetzt Termin vereinbaren.
|
||||
</h2>
|
||||
<p className="text-muted leading-relaxed mb-6">
|
||||
Haben Sie Fragen oder möchten Sie ein Probetraining
|
||||
vereinbaren? Schreiben Sie uns – wir melden uns schnellstmöglich
|
||||
bei Ihnen.
|
||||
</p>
|
||||
<div className="space-y-3 text-sm text-muted">
|
||||
<p>
|
||||
<span className="font-medium text-foreground">E-Mail:</span>{" "}
|
||||
kontakt@sportbox-reutte.at
|
||||
</p>
|
||||
<p>
|
||||
<span className="font-medium text-foreground">Telefon:</span>{" "}
|
||||
+43 123 456 789
|
||||
</p>
|
||||
<p>
|
||||
<span className="font-medium text-foreground">Adresse:</span>{" "}
|
||||
Reutte, Tirol, Österreich
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.15}>
|
||||
<ContactForm />
|
||||
</FadeIn>
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
+251
-2
@@ -1,7 +1,256 @@
|
||||
export default function Page() {
|
||||
import { Container } from "@/components/ui/Container";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import { SectionHeading } from "@/components/ui/SectionHeading";
|
||||
import { Card } from "@/components/ui/Card";
|
||||
import { FadeIn } from "@/components/ui/FadeIn";
|
||||
import { Dumbbell, Users, Clock, Heart } from "lucide-react";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Sportbox Reutte – Dein Fitnessstudio in Reutte",
|
||||
description:
|
||||
"Willkommen bei Sportbox Reutte – Ihr Fitnessstudio für individuelle Trainingspläne und persönliche Betreuung in Reutte, Tirol.",
|
||||
openGraph: {
|
||||
title: "Sportbox Reutte – Dein Fitnessstudio in Reutte",
|
||||
description:
|
||||
"Ihr Fitnessstudio für individuelle Trainingspläne und persönliche Betreuung in Reutte, Tirol.",
|
||||
url: "https://sportbox-reutte.at",
|
||||
},
|
||||
};
|
||||
|
||||
const FEATURES = [
|
||||
{
|
||||
icon: Dumbbell,
|
||||
title: "Individuelle Betreuung",
|
||||
description:
|
||||
"Persönliche Trainingspläne, abgestimmt auf Ihre Ziele und Ihr Fitnesslevel.",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
title: "Starke Community",
|
||||
description:
|
||||
"Trainieren Sie in einer motivierenden Gemeinschaft, die Sie unterstützt und inspiriert.",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
title: "Flexible Zeiten",
|
||||
description:
|
||||
"Großzügige Öffnungszeiten, damit Fitness in Ihren Alltag passt.",
|
||||
},
|
||||
{
|
||||
icon: Heart,
|
||||
title: "Ganzheitlicher Ansatz",
|
||||
description:
|
||||
"Körperliche Fitness, mentale Gesundheit und Ernährung – alles unter einem Dach.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
const SERVICES_PREVIEW = [
|
||||
{
|
||||
title: "Personal Training",
|
||||
description:
|
||||
"Eins-zu-Eins Betreuung durch zertifizierte Trainer für maximale Ergebnisse.",
|
||||
},
|
||||
{
|
||||
title: "Gruppenkurse",
|
||||
description:
|
||||
"Von Yoga bis Krafttraining – vielfältige Kurse für jedes Fitnesslevel.",
|
||||
},
|
||||
{
|
||||
title: "Ernährungsberatung",
|
||||
description:
|
||||
"Professionelle Beratung für eine Ernährung, die Ihre Trainingsziele unterstützt.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<main>
|
||||
<p>Ready</p>
|
||||
{/* Hero Section */}
|
||||
<section className="relative flex items-center min-h-screen bg-primary text-secondary">
|
||||
<Container className="py-32 md:py-40">
|
||||
<FadeIn>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-secondary/60 mb-6">
|
||||
Fitnessstudio in Reutte, Tirol
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<h1
|
||||
className="font-bold max-w-3xl"
|
||||
style={{
|
||||
fontSize: "clamp(var(--text-4xl), 5vw, var(--text-6xl))",
|
||||
lineHeight: "1.1",
|
||||
letterSpacing: "var(--text-5xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Dein Weg zu mehr
|
||||
<br />
|
||||
Fitness beginnt hier.
|
||||
</h1>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.2}>
|
||||
<p className="mt-6 max-w-xl text-secondary/70" style={{ fontSize: "var(--text-lg)" }}>
|
||||
Individuelle Trainingspläne, persönliche Betreuung und eine
|
||||
motivierende Community. Willkommen bei Sportbox Reutte.
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.3}>
|
||||
<div className="mt-10 flex flex-col sm:flex-row gap-4">
|
||||
<Button href="/leistungen#kontakt" variant="secondary" className="border-secondary text-secondary hover:bg-secondary hover:text-primary">
|
||||
Jetzt Termin buchen
|
||||
</Button>
|
||||
<Button href="/über-uns" variant="ghost" className="text-secondary/80 hover:text-secondary">
|
||||
Mehr über uns erfahren
|
||||
</Button>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Features Section */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Warum Sportbox Reutte?"
|
||||
subtitle="Wir bieten mehr als nur ein Fitnessstudio – wir sind Ihr Partner auf dem Weg zu einem gesünderen Leben."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
{FEATURES.map((feature, index) => (
|
||||
<FadeIn key={feature.title} delay={index * 0.1}>
|
||||
<Card className="text-center h-full">
|
||||
<feature.icon
|
||||
size={32}
|
||||
className="mx-auto mb-4 text-primary"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<h3 className="text-base font-bold mb-2">{feature.title}</h3>
|
||||
<p className="text-sm text-muted">{feature.description}</p>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* About Teaser Section */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-neutral">
|
||||
<Container>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||
<FadeIn>
|
||||
<div
|
||||
className="aspect-[4/3] bg-accent/40 flex items-center justify-center"
|
||||
style={{ borderRadius: "var(--radius-md)" }}
|
||||
>
|
||||
<p className="text-muted text-sm">PLACEHOLDER: Studio-Bild</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.15}>
|
||||
<div>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-muted mb-4">
|
||||
Über uns
|
||||
</p>
|
||||
<h2
|
||||
className="font-bold mb-6"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
letterSpacing: "var(--text-3xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Mehr als nur Training – eine Gemeinschaft.
|
||||
</h2>
|
||||
<p className="text-muted mb-6 leading-relaxed">
|
||||
Bei Sportbox Reutte stehen Sie im Mittelpunkt. Unser erfahrenes
|
||||
Team begleitet Sie auf Ihrem individuellen Weg – ob Einsteiger
|
||||
oder Fortgeschrittener. Gemeinsam erreichen wir Ihre Ziele.
|
||||
</p>
|
||||
<Button href="/über-uns" variant="secondary">
|
||||
Mehr über uns erfahren
|
||||
</Button>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Services Preview Section */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Unsere Leistungen"
|
||||
subtitle="Entdecken Sie unser vielfältiges Angebot für Ihre persönlichen Fitnessziele."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{SERVICES_PREVIEW.map((service, index) => (
|
||||
<FadeIn key={service.title} delay={index * 0.1}>
|
||||
<Card className="h-full">
|
||||
<h3 className="text-lg font-bold mb-3">{service.title}</h3>
|
||||
<p className="text-sm text-muted mb-4">{service.description}</p>
|
||||
<Button href="/leistungen" variant="ghost" className="text-sm">
|
||||
Mehr erfahren
|
||||
</Button>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* CTA Section */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container className="text-center">
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-4"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Bereit für den ersten Schritt?
|
||||
</h2>
|
||||
<p className="text-secondary/70 mb-8 max-w-lg mx-auto">
|
||||
Vereinbaren Sie jetzt einen unverbindlichen Termin und lernen Sie
|
||||
Sportbox Reutte kennen.
|
||||
</p>
|
||||
<Button
|
||||
href="/leistungen#kontakt"
|
||||
variant="secondary"
|
||||
className="border-secondary text-secondary hover:bg-secondary hover:text-primary"
|
||||
>
|
||||
Jetzt Termin buchen
|
||||
</Button>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* JSON-LD Structured Data */}
|
||||
<script
|
||||
type="application/ld+json"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: JSON.stringify({
|
||||
"@context": "https://schema.org",
|
||||
"@type": "LocalBusiness",
|
||||
name: "Sportbox Reutte",
|
||||
description:
|
||||
"Fitnessstudio für individuelle Trainingspläne und persönliche Betreuung in Reutte, Tirol.",
|
||||
url: "https://sportbox-reutte.at",
|
||||
telephone: "+43123456789",
|
||||
email: "kontakt@sportbox-reutte.at",
|
||||
address: {
|
||||
"@type": "PostalAddress",
|
||||
addressLocality: "Reutte",
|
||||
addressRegion: "Tirol",
|
||||
addressCountry: "AT",
|
||||
},
|
||||
sameAs: [],
|
||||
}),
|
||||
}}
|
||||
/>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,222 @@
|
||||
import { Container } from "@/components/ui/Container";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import { SectionHeading } from "@/components/ui/SectionHeading";
|
||||
import { Card } from "@/components/ui/Card";
|
||||
import { FadeIn } from "@/components/ui/FadeIn";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Studio",
|
||||
description:
|
||||
"Entdecken Sie unsere modernen Räumlichkeiten und hochwertigen Fitnessgeräte bei Sportbox Reutte.",
|
||||
openGraph: {
|
||||
title: "Studio | Sportbox Reutte",
|
||||
description:
|
||||
"Moderne Räumlichkeiten und hochwertige Fitnessgeräte bei Sportbox Reutte in Reutte, Tirol.",
|
||||
url: "https://sportbox-reutte.at/studio",
|
||||
},
|
||||
};
|
||||
|
||||
const AREAS = [
|
||||
{
|
||||
title: "Kraftbereich",
|
||||
description:
|
||||
"Freie Gewichte, Kabelzüge und Kraftgeräte der neuesten Generation für effektives Krafttraining.",
|
||||
},
|
||||
{
|
||||
title: "Cardio-Zone",
|
||||
description:
|
||||
"Laufbänder, Ergometer und Rudergeräte für Ihr Ausdauertraining in angenehmer Atmosphäre.",
|
||||
},
|
||||
{
|
||||
title: "Functional Area",
|
||||
description:
|
||||
"Offener Trainingsbereich mit Rig, Kettlebells, Medizinbällen und TRX für funktionelles Training.",
|
||||
},
|
||||
{
|
||||
title: "Kursraum",
|
||||
description:
|
||||
"Großer, heller Kursraum für Yoga, Pilates, HIIT und weitere Gruppenkurse.",
|
||||
},
|
||||
{
|
||||
title: "Umkleiden & Duschen",
|
||||
description:
|
||||
"Moderne Umkleidebereiche mit Schließfächern, Duschen und allem, was Sie brauchen.",
|
||||
},
|
||||
{
|
||||
title: "Lounge",
|
||||
description:
|
||||
"Gemütlicher Aufenthaltsbereich zum Ankommen, Austauschen und Entspannen nach dem Training.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
const GALLERY_ITEMS = [
|
||||
"Trainingsbereich",
|
||||
"Cardio-Zone",
|
||||
"Kursraum",
|
||||
"Eingangsbereich",
|
||||
"Functional Area",
|
||||
"Lounge",
|
||||
] as const;
|
||||
|
||||
export default function StudioPage() {
|
||||
return (
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<section className="pt-32 pb-[var(--spacing-section)] md:pt-40 md:pb-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-secondary/60 mb-4">
|
||||
Unser Studio
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<h1
|
||||
className="font-bold max-w-2xl"
|
||||
style={{
|
||||
fontSize: "clamp(var(--text-3xl), 4vw, var(--text-5xl))",
|
||||
lineHeight: "1.1",
|
||||
letterSpacing: "var(--text-5xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Ihr Trainingsraum in Reutte.
|
||||
</h1>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.2}>
|
||||
<p className="mt-6 max-w-xl text-secondary/70" style={{ fontSize: "var(--text-lg)" }}>
|
||||
Moderne Geräte, durchdachte Räumlichkeiten und eine Atmosphäre,
|
||||
die zum Training motiviert.
|
||||
</p>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Studio Overview */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||
<FadeIn>
|
||||
<div>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-muted mb-4">
|
||||
Räumlichkeiten
|
||||
</p>
|
||||
<h2
|
||||
className="font-bold mb-6"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
letterSpacing: "var(--text-3xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Trainieren mit Blick auf das Wesentliche.
|
||||
</h2>
|
||||
<p className="text-muted leading-relaxed mb-4">
|
||||
Unser Studio verbindet Funktionalität mit Atmosphäre. Auf
|
||||
großzügiger Fläche finden Sie alles, was Sie für ein
|
||||
effektives Training brauchen – ohne Ablenkung, aber mit Stil.
|
||||
</p>
|
||||
<p className="text-muted leading-relaxed">
|
||||
Hochwertige Geräte namhafter Hersteller, durchdachte
|
||||
Trainingszonen und eine klare Raumaufteilung sorgen dafür,
|
||||
dass Sie sich auf das konzentrieren können, was zählt: Ihr
|
||||
Training.
|
||||
</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.15}>
|
||||
<div
|
||||
className="aspect-[4/3] bg-neutral flex items-center justify-center"
|
||||
style={{ borderRadius: "var(--radius-md)" }}
|
||||
>
|
||||
<p className="text-muted text-sm">PLACEHOLDER: Studio-Übersicht</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Areas */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-neutral">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Unsere Bereiche"
|
||||
subtitle="Jeder Bereich ist darauf ausgelegt, Ihnen das bestmögliche Trainingserlebnis zu bieten."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{AREAS.map((area, index) => (
|
||||
<FadeIn key={area.title} delay={index * 0.08}>
|
||||
<Card className="h-full bg-background">
|
||||
<h3 className="text-base font-bold mb-2">{area.title}</h3>
|
||||
<p className="text-sm text-muted">{area.description}</p>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Gallery */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Einblicke"
|
||||
subtitle="Werfen Sie einen Blick in unsere Räumlichkeiten."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
{GALLERY_ITEMS.map((item, index) => (
|
||||
<FadeIn key={item} delay={index * 0.05}>
|
||||
<div
|
||||
className="aspect-[4/3] bg-neutral flex items-center justify-center"
|
||||
style={{ borderRadius: "var(--radius-md)" }}
|
||||
>
|
||||
<p className="text-muted text-sm">PLACEHOLDER: {item}</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* CTA */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container className="text-center">
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-4"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Überzeugen Sie sich selbst.
|
||||
</h2>
|
||||
<p className="text-secondary/70 mb-8 max-w-lg mx-auto">
|
||||
Vereinbaren Sie einen Termin für ein unverbindliches Probetraining
|
||||
in unserem Studio.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row justify-center gap-4">
|
||||
<Button
|
||||
href="/leistungen#kontakt"
|
||||
variant="secondary"
|
||||
className="border-secondary text-secondary hover:bg-secondary hover:text-primary"
|
||||
>
|
||||
Jetzt Termin buchen
|
||||
</Button>
|
||||
<Button
|
||||
href="/leistungen"
|
||||
variant="ghost"
|
||||
className="text-secondary/80 hover:text-secondary"
|
||||
>
|
||||
Unsere Leistungen
|
||||
</Button>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,231 @@
|
||||
import { Container } from "@/components/ui/Container";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import { SectionHeading } from "@/components/ui/SectionHeading";
|
||||
import { Card } from "@/components/ui/Card";
|
||||
import { FadeIn } from "@/components/ui/FadeIn";
|
||||
import type { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Über Uns",
|
||||
description:
|
||||
"Erfahren Sie mehr über unsere Philosophie, unser Team und unsere Community bei Sportbox Reutte.",
|
||||
openGraph: {
|
||||
title: "Über Uns | Sportbox Reutte",
|
||||
description:
|
||||
"Erfahren Sie mehr über unsere Philosophie, unser Team und unsere Community bei Sportbox Reutte.",
|
||||
url: "https://sportbox-reutte.at/über-uns",
|
||||
},
|
||||
};
|
||||
|
||||
const TEAM_MEMBERS = [
|
||||
{
|
||||
name: "Max Mustermann",
|
||||
role: "Gründer & Head Coach",
|
||||
description:
|
||||
"Zertifizierter Personal Trainer mit über 10 Jahren Erfahrung in der Fitnessbranche.",
|
||||
},
|
||||
{
|
||||
name: "Anna Berger",
|
||||
role: "Yoga & Mobility Coach",
|
||||
description:
|
||||
"Spezialisiert auf Yoga, Stretching und ganzheitliche Bewegungskonzepte.",
|
||||
},
|
||||
{
|
||||
name: "Thomas Huber",
|
||||
role: "Kraft- & Konditionstrainer",
|
||||
description:
|
||||
"Experte für Krafttraining, Athletiktraining und Wettkampfvorbereitung.",
|
||||
},
|
||||
{
|
||||
name: "Lisa Mayer",
|
||||
role: "Ernährungsberaterin",
|
||||
description:
|
||||
"Diplomierte Ernährungsberaterin mit Fokus auf sportgerechte Ernährung.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
const VALUES = [
|
||||
{
|
||||
title: "Individualität",
|
||||
description:
|
||||
"Jeder Mensch ist einzigartig. Unsere Trainingspläne werden individuell auf Sie abgestimmt.",
|
||||
},
|
||||
{
|
||||
title: "Gemeinschaft",
|
||||
description:
|
||||
"Gemeinsam erreichen wir mehr. Unsere Community motiviert und unterstützt sich gegenseitig.",
|
||||
},
|
||||
{
|
||||
title: "Qualität",
|
||||
description:
|
||||
"Von der Ausbildung unserer Trainer bis zur Auswahl der Geräte – wir setzen auf höchste Qualität.",
|
||||
},
|
||||
] as const;
|
||||
|
||||
export default function UeberUnsPage() {
|
||||
return (
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<section className="pt-32 pb-[var(--spacing-section)] md:pt-40 md:pb-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-secondary/60 mb-4">
|
||||
Über uns
|
||||
</p>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.1}>
|
||||
<h1
|
||||
className="font-bold max-w-2xl"
|
||||
style={{
|
||||
fontSize: "clamp(var(--text-3xl), 4vw, var(--text-5xl))",
|
||||
lineHeight: "1.1",
|
||||
letterSpacing: "var(--text-5xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Wir glauben an die Kraft der Bewegung.
|
||||
</h1>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.2}>
|
||||
<p className="mt-6 max-w-xl text-secondary/70" style={{ fontSize: "var(--text-lg)" }}>
|
||||
Seit der Gründung von Sportbox Reutte verfolgen wir eine klare
|
||||
Mission: Fitness für jeden zugänglich und persönlich zu gestalten.
|
||||
</p>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Philosophy */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||
<FadeIn>
|
||||
<div>
|
||||
<p className="text-sm uppercase tracking-[0.2em] text-muted mb-4">
|
||||
Unsere Philosophie
|
||||
</p>
|
||||
<h2
|
||||
className="font-bold mb-6"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
letterSpacing: "var(--text-3xl-letter-spacing)",
|
||||
}}
|
||||
>
|
||||
Fitness ist kein Ziel – es ist ein Weg.
|
||||
</h2>
|
||||
<p className="text-muted leading-relaxed mb-4">
|
||||
Bei Sportbox Reutte geht es nicht um kurzfristige Ergebnisse.
|
||||
Wir begleiten Sie auf einem nachhaltigen Weg zu mehr
|
||||
Wohlbefinden, Kraft und Lebensqualität.
|
||||
</p>
|
||||
<p className="text-muted leading-relaxed">
|
||||
Unser ganzheitlicher Ansatz verbindet körperliches Training,
|
||||
mentale Gesundheit und ausgewogene Ernährung. Denn wahre
|
||||
Fitness entsteht, wenn Körper und Geist im Einklang sind.
|
||||
</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
<FadeIn delay={0.15}>
|
||||
<div
|
||||
className="aspect-[4/3] bg-neutral flex items-center justify-center"
|
||||
style={{ borderRadius: "var(--radius-md)" }}
|
||||
>
|
||||
<p className="text-muted text-sm">PLACEHOLDER: Team-Bild</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Values */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-neutral">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Unsere Werte"
|
||||
subtitle="Was uns antreibt und was Sie von uns erwarten können."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{VALUES.map((value, index) => (
|
||||
<FadeIn key={value.title} delay={index * 0.1}>
|
||||
<Card className="h-full bg-background">
|
||||
<h3 className="text-lg font-bold mb-3">{value.title}</h3>
|
||||
<p className="text-sm text-muted">{value.description}</p>
|
||||
</Card>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* Team */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)]">
|
||||
<Container>
|
||||
<FadeIn>
|
||||
<SectionHeading
|
||||
title="Unser Team"
|
||||
subtitle="Lernen Sie die Menschen kennen, die Sportbox Reutte ausmachen."
|
||||
/>
|
||||
</FadeIn>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
{TEAM_MEMBERS.map((member, index) => (
|
||||
<FadeIn key={member.name} delay={index * 0.1}>
|
||||
<div className="text-center">
|
||||
<div
|
||||
className="w-full aspect-square bg-neutral mb-4 flex items-center justify-center"
|
||||
style={{ borderRadius: "var(--radius-md)" }}
|
||||
>
|
||||
<p className="text-muted text-xs">PLACEHOLDER: Foto</p>
|
||||
</div>
|
||||
<h3 className="text-base font-bold">{member.name}</h3>
|
||||
<p className="text-sm text-muted mt-1">{member.role}</p>
|
||||
<p className="text-sm text-muted mt-2">
|
||||
{member.description}
|
||||
</p>
|
||||
</div>
|
||||
</FadeIn>
|
||||
))}
|
||||
</div>
|
||||
</Container>
|
||||
</section>
|
||||
|
||||
{/* CTA */}
|
||||
<section className="py-[var(--spacing-section)] md:py-[var(--spacing-4xl)] bg-primary text-secondary">
|
||||
<Container className="text-center">
|
||||
<FadeIn>
|
||||
<h2
|
||||
className="font-bold mb-4"
|
||||
style={{
|
||||
fontSize: "var(--text-3xl)",
|
||||
lineHeight: "var(--text-3xl-line-height)",
|
||||
}}
|
||||
>
|
||||
Werden Sie Teil unserer Community.
|
||||
</h2>
|
||||
<p className="text-secondary/70 mb-8 max-w-lg mx-auto">
|
||||
Kommen Sie vorbei und überzeugen Sie sich selbst von der
|
||||
Sportbox-Atmosphäre.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row justify-center gap-4">
|
||||
<Button
|
||||
href="/leistungen#kontakt"
|
||||
variant="secondary"
|
||||
className="border-secondary text-secondary hover:bg-secondary hover:text-primary"
|
||||
>
|
||||
Jetzt Termin buchen
|
||||
</Button>
|
||||
<Button
|
||||
href="/studio"
|
||||
variant="ghost"
|
||||
className="text-secondary/80 hover:text-secondary"
|
||||
>
|
||||
Unser Studio entdecken
|
||||
</Button>
|
||||
</div>
|
||||
</FadeIn>
|
||||
</Container>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user