389 lines
29 KiB
HTML
389 lines
29 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de" data-lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>Floating Flows — Premium AcroYoga in Freiburg</title>
|
||
<meta name="description" content="Floating Flows — Premium AcroYoga in Freiburg mit Luciana. Partnerakrobatik, Beginner Flows, Washing Machines und therapeutisches Fliegen. Ohne feste Partner:in. Jetzt Kurs buchen." />
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Lato:wght@400;700;900&family=Poiret+One&display=swap" rel="stylesheet" />
|
||
<link rel="stylesheet" href="css/styles.css" />
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ============ NAV ============ -->
|
||
<header class="nav" id="nav">
|
||
<div class="wrap nav__inner">
|
||
<a class="brand" href="index.html" aria-label="Floating Flows home">
|
||
<img class="brand__icon" src="assets/brand/floating-flows-icon.png" alt="" onerror="this.style.display='none'" />
|
||
<span class="brand__name">Floating <b>Flows</b></span>
|
||
</a>
|
||
<nav class="nav__links" aria-label="Primary">
|
||
<a href="courses.html" data-i18n="nav.courses">Kurse</a>
|
||
<a href="#experience" data-i18n="nav.practice">Die Praxis</a>
|
||
<a href="about.html" data-i18n="nav.about">Über uns</a>
|
||
<a href="#contact" data-i18n="nav.contact">Kontakt</a>
|
||
</nav>
|
||
<div class="nav__right">
|
||
<div class="lang-switch nav-lang" role="group" aria-label="Sprache / Language">
|
||
<button type="button" class="lang-btn" data-setlang="de" aria-pressed="true">DE</button>
|
||
<span class="lang-switch__sep" aria-hidden="true">/</span>
|
||
<button type="button" class="lang-btn" data-setlang="en" aria-pressed="false">EN</button>
|
||
</div>
|
||
<a class="btn nav__cta" href="https://floatingflows.com/v2/" target="_blank" rel="noopener" data-i18n="nav.book">Kurs buchen</a>
|
||
<button class="nav__toggle" id="navToggle" aria-label="Menü" aria-expanded="false" aria-controls="drawer">
|
||
<span></span><span></span><span></span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- Mobile drawer -->
|
||
<div class="drawer" id="drawer" aria-hidden="true">
|
||
<a class="drawer__link" href="courses.html" data-i18n="nav.courses">Kurse</a>
|
||
<a class="drawer__link" href="#experience" data-i18n="nav.practice">Die Praxis</a>
|
||
<a class="drawer__link" href="#location" data-i18n="nav.location">Standort</a>
|
||
<a class="drawer__link" href="about.html" data-i18n="nav.about">Über uns</a>
|
||
<a class="drawer__link" href="#contact" data-i18n="nav.contact">Kontakt</a>
|
||
<div class="drawer__meta">
|
||
<a href="https://floatingflows.com/v2/" target="_blank" rel="noopener" data-i18n="drawer.book">Kurs buchen →</a>
|
||
<span data-i18n="drawer.where">Seepark Glashaus · Freiburg</span>
|
||
<div class="drawer__foot">
|
||
<div class="drawer__icons icons">
|
||
<a class="icon-btn" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-label="Instagram"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.3" cy="6.7" r="1.1" fill="currentColor" stroke="none"/></svg></a>
|
||
<a class="icon-btn" href="tel:+4917635708720" aria-label="Anrufen"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><path d="M5 3h3l2 5-2.5 1.5a11 11 0 0 0 5 5L19 12l3 2v3a2 2 0 0 1-2 2A16 16 0 0 1 3 5a2 2 0 0 1 2-2z"/></svg></a>
|
||
<a class="icon-btn" href="mailto:floatingflows@web.de" aria-label="E-Mail"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2.5"/><path d="M3.5 7.5l8.5 5.5 8.5-5.5"/></svg></a>
|
||
</div>
|
||
<div class="lang-switch" role="group" aria-label="Sprache / Language">
|
||
<button type="button" class="lang-btn" data-setlang="de" aria-pressed="true">DE</button>
|
||
<span class="lang-switch__sep" aria-hidden="true">/</span>
|
||
<button type="button" class="lang-btn" data-setlang="en" aria-pressed="false">EN</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============ HERO (video) ============ -->
|
||
<section class="hero">
|
||
<div class="wrap hero__grid">
|
||
<div class="hero__text">
|
||
<p class="eyebrow hero__eyebrow" data-i18n="hero.eyebrow">AcroYoga · Freiburg</p>
|
||
<h1 data-i18n="hero.h1">Lerne zu <em>schweben</em>, gemeinsam.</h1>
|
||
<p class="hero__sub" data-i18n="hero.sub">Die freudvolle Kunst, gemeinsam zu fliegen — AcroYoga, achtsam unterrichtet von Luciana. Für jeden Körper, jedes Level. Ganz ohne feste Partner:in.</p>
|
||
<div class="hero__actions">
|
||
<a class="btn" href="https://floatingflows.com/v2/" target="_blank" rel="noopener" data-i18n="hero.book">Kurs buchen</a>
|
||
<a class="btn btn--ghost hero__ghost" href="#offerings" data-i18n="hero.explore">Kurse entdecken</a>
|
||
</div>
|
||
<blockquote class="hero__quote">
|
||
<p data-i18n="hero.quote">„Ich kam nervös an und ging schwebend wieder. Der einladendste Raum, in dem ich je geübt habe.“</p>
|
||
<cite data-i18n="hero.quoteCite">Mara K. · ★★★★★</cite>
|
||
</blockquote>
|
||
<div class="hero__scroll"><span></span> <span data-i18n="hero.scroll">Mehr</span></div>
|
||
</div>
|
||
<figure class="hero__media">
|
||
<video class="hero__video" autoplay muted loop playsinline preload="auto" poster="assets/img/hero-1.jpg">
|
||
<source src="assets/video/hero-1.mp4" type="video/mp4" />
|
||
<img src="assets/img/sunset-doublebird.jpg" alt="Zwei Übende in einer fliegenden AcroYoga-Pose im goldenen Abendlicht" />
|
||
</video>
|
||
</figure>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ ETHOS ============ -->
|
||
<section class="section ethos" id="ethos">
|
||
<div class="wrap ethos__grid">
|
||
<div class="reveal">
|
||
<p class="eyebrow" data-i18n="ethos.eyebrow">Willkommen bei Floating Flows</p>
|
||
<h2 data-i18n="ethos.h2">Eine Praxis aus <span class="accent">Vertrauen, Atem und Spiel.</span></h2>
|
||
</div>
|
||
<div class="ethos__cols">
|
||
<p class="reveal" data-d="1" data-i18n="ethos.p1">AcroYoga verbindet die Weisheit des Yoga, die Dynamik der Akrobatik und die Achtsamkeit therapeutischer Berührung. Du lernst, Gewicht zu geben, es anzunehmen und als Eins zu fließen — getragen von einer Gemeinschaft, die dir den Rücken stärkt.</p>
|
||
<p class="reveal" data-d="2" data-i18n="ethos.p2">Keine Vorkenntnisse und keine feste Partner:in nötig. Wir arbeiten in wechselnden Teams, sodass jede:r Base, Flyer und Spotter findet. Anfänger:innen und erfahrene Flyer teilen dieselbe Matte, denselben Atem und denselben leisen Nervenkitzel des Loslassens.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ OFFERINGS ============ -->
|
||
<section class="section offer" id="offerings">
|
||
<div class="wrap">
|
||
<div class="offer__head">
|
||
<div class="reveal">
|
||
<p class="eyebrow" data-i18n="offer.eyebrow">Kurse & Workshops</p>
|
||
<h2 data-i18n="offer.h2">Finde deinen Platz im Flow.</h2>
|
||
</div>
|
||
<p class="lede reveal" data-d="1" data-i18n="offer.lede">Semesterkurse, Anfänger-Workshops und Privatstunden — alle in kleinen, aufmerksamen Gruppen im Seepark Glashaus in Freiburg.</p>
|
||
</div>
|
||
<div class="offer__list">
|
||
|
||
<article class="offer-card reveal">
|
||
<div class="offer-card__top"><span class="course-badge" data-i18n="offer.c1.badge">Start 12. Juni 2026</span><span class="course-price">€126</span></div>
|
||
<span class="offer-card__num" data-i18n="offer.c1.kicker">01 / Semesterkurs</span>
|
||
<h3 data-i18n="offer.c1.title">Beginner Flows</h3>
|
||
<p data-i18n="offer.c1.desc">Sieben Einheiten, in denen wir Schritt für Schritt vier kurze Anfänger-Flows aufbauen — Positionen, Übergänge und das Zusammenspiel von Base, Flyer und Spotter, dazu Falltraining und Atem.</p>
|
||
<div class="offer-card__meta"><span data-i18n="offer.c1.m1">Alle Level</span><span data-i18n="offer.c1.m2">7 × 90 Min.</span><span data-i18n="offer.c1.m3">Ohne Partner:in</span></div>
|
||
<div class="offer-card__foot"><a class="link-arrow" href="courses.html#beginner-flows"><span data-i18n="offer.c1.link">Kursdetails</span> <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div>
|
||
</article>
|
||
|
||
<article class="offer-card reveal" data-d="1">
|
||
<div class="offer-card__top"><span class="course-badge" data-i18n="offer.c2.badge">Start 18. Juni 2026</span><span class="course-price">€126</span></div>
|
||
<span class="offer-card__num" data-i18n="offer.c2.kicker">02 / Semesterkurs</span>
|
||
<h3 data-i18n="offer.c2.title">Classic Washing Machines 1</h3>
|
||
<p data-i18n="offer.c2.desc">Der nächste Schritt nach den Beginner Flows. Wir verbinden Figuren zu fließenden „Washing Machines“ und vertiefen über sieben Wochen Vertrauen und Timing zwischen Base und Flyer.</p>
|
||
<div class="offer-card__meta"><span data-i18n="offer.c2.m1">Fortgeschritten</span><span data-i18n="offer.c2.m2">7 × 90 Min.</span><span data-i18n="offer.c2.m3">Wechselnde Teams</span></div>
|
||
<div class="offer-card__foot"><a class="link-arrow" href="courses.html#washing-machines"><span data-i18n="offer.c2.link">Kursdetails</span> <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div>
|
||
</article>
|
||
|
||
<article class="offer-card reveal" data-d="2">
|
||
<div class="offer-card__top"><span class="course-badge" data-i18n="offer.c3.badge">28. Juni 2026 · Outdoor</span><span class="course-price" data-i18n="offer.c3.price">Workshop</span></div>
|
||
<span class="offer-card__num" data-i18n="offer.c3.kicker">03 / Anfänger-Workshop</span>
|
||
<h3 data-i18n="offer.c3.title">Absolute Beginner 1</h3>
|
||
<p data-i18n="offer.c3.desc">Eine sanfte Ganztags-Einführung für absolute Anfänger:innen — zwei achtsame Einheiten, ein gemeinsames vegetarisches Potluck und zum Abschluss eine geführte Thai-Massage. Bring gern eine:n Freund:in mit.</p>
|
||
<div class="offer-card__meta"><span data-i18n="offer.c3.m1">Absolute Anfänger:innen</span><span data-i18n="offer.c3.m2">10:00–16:00</span><span data-i18n="offer.c3.m3">Freiburg, Outdoor</span></div>
|
||
<div class="offer-card__foot"><a class="link-arrow" href="courses.html#absolute-beginner"><span data-i18n="offer.c3.link">Workshop-Details</span> <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div>
|
||
</article>
|
||
|
||
<article class="offer-card reveal">
|
||
<div class="offer-card__top"><span class="course-badge" data-i18n="offer.c4.badge">Nach Vereinbarung</span><span class="course-price" data-i18n="offer.c4.price">Hansefit +€16</span></div>
|
||
<span class="offer-card__num" data-i18n="offer.c4.kicker">04 / Privat</span>
|
||
<h3 data-i18n="offer.c4.title">Personal Training · 90 Min.</h3>
|
||
<p data-i18n="offer.c4.desc">Einzelstunde (für zwei Personen) bequem bei dir zu Hause, überall in Freiburg. Ich bringe 4 cm dicke Sicherheitsmatten mit, und wir arbeiten direkt an deinen AcroYoga-Zielen.</p>
|
||
<div class="offer-card__meta"><span data-i18n="offer.c4.m1">Für 2 Personen</span><span data-i18n="offer.c4.m2">90 Min.</span><span data-i18n="offer.c4.m3">Bei dir zu Hause</span></div>
|
||
<div class="offer-card__foot"><a class="link-arrow" href="courses.html#personal-training"><span data-i18n="offer.c4.link">So funktioniert's</span> <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M13 6l6 6-6 6"/></svg></a></div>
|
||
</article>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ EXPERIENCE ============ -->
|
||
<section class="section experience" id="experience">
|
||
<div class="wrap experience__grid">
|
||
<div class="experience__media reveal">
|
||
<img src="assets/img/spotting-class.jpg" alt="Eine Flyerin wird in einer AcroYoga-Stunde im Seepark Glashaus gespottet" />
|
||
</div>
|
||
<div class="reveal" data-d="1">
|
||
<p class="eyebrow" data-i18n="exp.eyebrow">Dein erster Flug</p>
|
||
<h2 data-i18n="exp.h2">So fühlt sich ein Abend bei uns an.</h2>
|
||
<div class="steps">
|
||
<div class="step">
|
||
<div class="step__no">01</div>
|
||
<div><h3 data-i18n="exp.s1.t">Ankommen & landen</h3><p data-i18n="exp.s1.p">Wir beginnen jede Einheit mit Atem und einem sanften Warm-up. Barfuß, herzlich willkommen — und der Alltag bleibt vor der Tür.</p></div>
|
||
</div>
|
||
<div class="step">
|
||
<div class="step__no">02</div>
|
||
<div><h3 data-i18n="exp.s2.t">Vertrauen aufbauen</h3><p data-i18n="exp.s2.p">Angeleitet, gesichert und nie überstürzt. Du lernst zu basen, zu fliegen und zu fangen — mit Partner:innen jedes Levels — und wie man sicher fällt.</p></div>
|
||
</div>
|
||
<div class="step">
|
||
<div class="step__no">03</div>
|
||
<div><h3 data-i18n="exp.s3.t">Abheben</h3><p data-i18n="exp.s3.p">Der Moment, in dem es klickt. Schweben, invertieren, fließen — und zum Ausklang ein partnerschaftliches Thai-Massage-Cool-down, bevor du gehst.</p></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ LOCATION (Glashaus) ============ -->
|
||
<section class="section location" id="location">
|
||
<div class="wrap location__grid">
|
||
<div class="location__media reveal">
|
||
<div class="location__main"><img src="assets/img/glashaus-2.webp" alt="Blick über den Seepark-See vom Glashaus in Freiburg" loading="lazy" /></div>
|
||
</div>
|
||
<div class="reveal" data-d="1">
|
||
<p class="eyebrow" data-i18n="loc.eyebrow">Unser Zuhause</p>
|
||
<h2 data-i18n="loc.h2">Das Glashaus, im Seepark.</h2>
|
||
<p class="location__lede" data-i18n="loc.lede">Wir üben an einem der schönsten Orte Freiburgs — einem luftigen Holz-und-Glas-Pavillon im Seepark, mit Blick über den See bis zum grünen Hügel dahinter.</p>
|
||
<div class="location__notes">
|
||
<div class="location__note">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11z"/><circle cx="12" cy="10" r="2.5"/></svg>
|
||
<p data-i18n="loc.n1">Einfach atemberaubend anzusehen und unendlich fotogen — besonders unter einem Sternenhimmel.</p>
|
||
</div>
|
||
<div class="location__note">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><path d="M3 12a9 9 0 0 1 18 0"/><path d="M3 12a9 9 0 0 0 18 0"/><path d="M12 3v18"/></svg>
|
||
<p data-i18n="loc.n2">Ein traumhafter Blick aufs Wasser, frische Luft und Raum, um einfach zu entspannen. Der perfekte Ort zum Fliegen.</p>
|
||
</div>
|
||
</div>
|
||
<div class="location__addr">
|
||
<a class="btn btn--ghost" href="https://maps.google.com/?q=Seepark+Glashaus+Brandensteinstra%C3%9Fe+24+79110+Freiburg" target="_blank" rel="noopener" data-i18n="loc.dir">Route anzeigen</a>
|
||
<span style="color:var(--color-ink-soft);font-size:var(--text-sm);" data-i18n="loc.addr">Brandensteinstraße 24, 79110 Freiburg</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ AMBIENT (calm video) ============ -->
|
||
<section class="ambient" id="ambient">
|
||
<div class="ambient__media">
|
||
<video autoplay muted loop playsinline preload="auto" poster="assets/img/calm-poster.jpg">
|
||
<source src="assets/video/calm.mp4" type="video/mp4" />
|
||
</video>
|
||
</div>
|
||
<div class="ambient__inner">
|
||
<p class="eyebrow" data-i18n="amb.eyebrow">Draußen, an der frischen Luft</p>
|
||
<h2 data-i18n="amb.h2">Komm schwer an. Geh leicht.</h2>
|
||
<p data-i18n="amb.p">Unter einem Glasdach und offenem Himmel, im grünen Herzen des Seeparks — ein Ort zum Atmen, Vertrauen und Fliegen.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ REVIEWS ============ -->
|
||
<section class="section reviews" id="reviews">
|
||
<div class="wrap">
|
||
<div class="reveal">
|
||
<p class="eyebrow" data-i18n="rev.eyebrow">Stimmen aus dem Studio</p>
|
||
<h2 data-i18n="rev.h2">Worte aus unserer Community.</h2>
|
||
</div>
|
||
<div class="reviews__grid">
|
||
<figure class="review reveal"><div class="review__stars">★★★★★</div><p data-i18n="rev.r1">„Jedes Mal, wenn ich den Kurs betrete, spüre ich eine Leichtigkeit, die mir hilft, den Stress der Woche abzulegen. Wirklich besonders.“</p><cite data-i18n="rev.r1c">— Amelie R.</cite></figure>
|
||
<figure class="review reveal" data-d="1"><div class="review__stars">★★★★★</div><p data-i18n="rev.r2">„Inspirierender, fundierter Unterricht und ein wirklich herzlicher Raum. Ich kam allein und ging mit einer Gemeinschaft.“</p><cite data-i18n="rev.r2c">— Simon T.</cite></figure>
|
||
<figure class="review reveal" data-d="2"><div class="review__stars">★★★★★</div><p data-i18n="rev.r3">„Ich hätte nie gedacht, dass ich kopfüber auf den Füßen eines anderen lande und dabei lache. Luciana ließ das Unmögliche sicher anfühlen.“</p><cite data-i18n="rev.r3c">— Priya N.</cite></figure>
|
||
<figure class="review reveal"><div class="review__stars">★★★★★</div><p data-i18n="rev.r4">„Mein Partner und ich kommen jedes Semester. Es ist der schönste Abend unserer Woche geworden.“</p><cite data-i18n="rev.r4c">— Jonas & Lena</cite></figure>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ BOOKING ============ -->
|
||
<section class="section booking" id="booking">
|
||
<div class="wrap">
|
||
<div class="booking__panel">
|
||
<div class="booking__head reveal">
|
||
<p class="eyebrow" data-i18n="book.eyebrow">Sichere dir deinen Platz</p>
|
||
<h2 data-i18n="book.h2">Bereit zu fliegen?</h2>
|
||
<p class="booking__lede" data-i18n="book.lede">Reserviere über unser Buchungssystem und schreib mir anschließend, damit ich dich in die Signal-Kursgruppe aufnehmen kann. Neu hier? Der Absolute-Beginner-Workshop ist die sanfteste Landung.</p>
|
||
</div>
|
||
<div class="passes reveal" data-d="1">
|
||
<div class="pass"><div class="pass__name"><span data-i18n="book.p1.name">Semesterkurs</span><small data-i18n="book.p1.sub">7 Einheiten</small></div><div class="pass__price">€126</div></div>
|
||
<div class="pass"><div class="pass__name"><span data-i18n="book.p2.name">Drop-in</span><small data-i18n="book.p2.sub">über Hansefit</small></div><div class="pass__price" data-i18n="book.p2.price">Hansefit</div></div>
|
||
<div class="pass"><div class="pass__name"><span data-i18n="book.p3.name">Personal Training</span><small data-i18n="book.p3.sub">90 Min. · 2 Personen</small></div><div class="pass__price">+€16</div></div>
|
||
<div class="pass"><div class="pass__name"><span data-i18n="book.p4.name">Absolute Beginner</span><small data-i18n="book.p4.sub">Ganztags-Workshop</small></div><div class="pass__price" data-i18n="book.p4.price">Anfragen</div></div>
|
||
</div>
|
||
<div class="booking__cta reveal" data-d="2" style="grid-column:1/-1;">
|
||
<a class="btn" href="https://floatingflows.com/v2/" target="_blank" rel="noopener" data-i18n="book.cta1">Buchung & Kursplan öffnen</a>
|
||
<a class="link-arrow" href="mailto:floatingflows@web.de"><span data-i18n="book.cta2">Anmelden oder Frage stellen</span>
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
|
||
</a>
|
||
</div>
|
||
<p class="booking__note" style="grid-column:1/-1;" data-i18n="book.note">Aktuelle Verfügbarkeit und Anmeldung laufen über das bestehende Buchungssystem. Drop-in ist über Hansefit möglich — melde dich gern.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ PHOTO CAROUSEL ============ -->
|
||
<section class="marquee-band" aria-label="Fotos von Floating Flows">
|
||
<div class="marquee">
|
||
<div class="marquee__track">
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener"><img src="assets/img/sunset-doublebird.jpg" alt="AcroYoga Double Bird bei Sonnenuntergang" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener"><img src="assets/img/spotting-class.jpg" alt="Eine Flyerin wird im Kurs gespottet" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener"><img src="assets/img/bridge-tower.jpg" alt="Stehende AcroYoga-Pose an der überdachten Brücke" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener"><img src="assets/img/kids-pyramid.jpg" alt="Familien-AcroYoga-Pyramide" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener"><img src="assets/img/park-batwing.jpg" alt="AcroYoga Bat-Hang im Park" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-hidden="true" tabindex="-1"><img src="assets/img/sunset-doublebird.jpg" alt="" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-hidden="true" tabindex="-1"><img src="assets/img/spotting-class.jpg" alt="" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-hidden="true" tabindex="-1"><img src="assets/img/bridge-tower.jpg" alt="" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-hidden="true" tabindex="-1"><img src="assets/img/kids-pyramid.jpg" alt="" loading="lazy"></a>
|
||
<a class="marquee__item" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-hidden="true" tabindex="-1"><img src="assets/img/park-batwing.jpg" alt="" loading="lazy"></a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ CONTACT / INSTAGRAM ============ -->
|
||
<section class="section contact" id="contact">
|
||
<div class="wrap contact__grid">
|
||
<div class="reveal">
|
||
<p class="eyebrow" data-i18n="contact.eyebrow">Sag Hallo</p>
|
||
<h2 data-i18n="contact.h2">Komm vorbei.</h2>
|
||
<p class="contact__intro" data-i18n="contact.intro">Ein kleiner Einblick in das Leben bei Floating Flows — komm und flieg mit uns im Seepark.</p>
|
||
</div>
|
||
<div class="contact__links reveal" data-d="1">
|
||
<div class="contact__row"><span data-i18n="contact.lblEmail">E-Mail</span><a href="mailto:floatingflows@web.de">floatingflows@web.de</a></div>
|
||
<div class="contact__row"><span data-i18n="contact.lblPhone">Telefon</span><a href="tel:+4917635708720">0176 35708720</a></div>
|
||
<div class="contact__row"><span data-i18n="contact.lblInsta">Instagram</span><a href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener">@floatingflows</a></div>
|
||
<div class="contact__row"><span data-i18n="contact.lblStudio">Studio</span><a href="https://maps.google.com/?q=Seepark+Glashaus+Brandensteinstra%C3%9Fe+24+79110+Freiburg" target="_blank" rel="noopener">Seepark Glashaus · Brandensteinstraße 24, 79110 Freiburg</a></div>
|
||
<div class="icons" style="margin-top:var(--space-md);">
|
||
<a class="icon-btn icon-btn--lg" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-label="Instagram"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.3" cy="6.7" r="1.1" fill="currentColor" stroke="none"/></svg></a>
|
||
<a class="icon-btn icon-btn--lg" href="tel:+4917635708720" aria-label="Anrufen"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><path d="M5 3h3l2 5-2.5 1.5a11 11 0 0 0 5 5L19 12l3 2v3a2 2 0 0 1-2 2A16 16 0 0 1 3 5a2 2 0 0 1 2-2z"/></svg></a>
|
||
<a class="icon-btn icon-btn--lg" href="mailto:floatingflows@web.de" aria-label="E-Mail"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2.5"/><path d="M3.5 7.5l8.5 5.5 8.5-5.5"/></svg></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ FOOTER ============ -->
|
||
<footer class="footer">
|
||
<div class="wrap">
|
||
<div class="footer__top">
|
||
<div>
|
||
<div class="brand" style="margin-bottom:var(--space-sm);">
|
||
<img class="brand__icon" src="assets/brand/floating-flows-icon.png" alt="" onerror="this.style.display='none'" />
|
||
<span class="brand__name">Floating <b>Flows</b></span>
|
||
</div>
|
||
<p data-i18n="footer.tagline">Premium AcroYoga in Freiburg — Vertrauen, Atem und die stille Freude des Fliegens. Für jeden Körper, jedes Level.</p>
|
||
<div class="icons" style="margin-top:var(--space-md);">
|
||
<a class="icon-btn icon-btn--on-night" href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener" aria-label="Instagram"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.3" cy="6.7" r="1.1" fill="currentColor" stroke="none"/></svg></a>
|
||
<a class="icon-btn icon-btn--on-night" href="tel:+4917635708720" aria-label="Anrufen"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><path d="M5 3h3l2 5-2.5 1.5a11 11 0 0 0 5 5L19 12l3 2v3a2 2 0 0 1-2 2A16 16 0 0 1 3 5a2 2 0 0 1 2-2z"/></svg></a>
|
||
<a class="icon-btn icon-btn--on-night" href="mailto:floatingflows@web.de" aria-label="E-Mail"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2.5"/><path d="M3.5 7.5l8.5 5.5 8.5-5.5"/></svg></a>
|
||
</div>
|
||
</div>
|
||
<div class="footer__cols">
|
||
<div><h4 data-i18n="footer.exploreH">Entdecken</h4><a href="courses.html" data-i18n="nav.courses">Kurse</a><a href="about.html" data-i18n="nav.about">Über uns</a></div>
|
||
<div><h4 data-i18n="footer.visitH">Besuchen</h4><a href="#location" data-i18n="nav.location">Standort</a><a href="#booking" data-i18n="footer.book">Buchen</a><a href="#contact" data-i18n="nav.contact">Kontakt</a></div>
|
||
<div><h4 data-i18n="footer.connectH">Kontakt</h4><a href="https://www.instagram.com/floatingflows/" target="_blank" rel="noopener">@floatingflows</a><a href="mailto:floatingflows@web.de">floatingflows@web.de</a><a href="tel:+4917635708720">0176 35708720</a></div>
|
||
</div>
|
||
</div>
|
||
<div class="footer__bottom"><span data-i18n="footer.copy">© 2026 Floating Flows · Luciana · Freiburg</span><span data-i18n="footer.made">Gemacht für Bewegung.</span></div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="js/i18n.js"></script>
|
||
<script>
|
||
(function(){
|
||
var heroVids = [
|
||
['assets/video/hero-1.mp4', 'assets/img/hero-1.jpg'],
|
||
['assets/video/hero-2.mp4', 'assets/img/hero-2.jpg'],
|
||
['assets/video/hero-3.mp4', 'assets/img/hero-3.jpg']
|
||
];
|
||
var hv = document.querySelector('.hero__video');
|
||
if (hv) {
|
||
var pick = heroVids[Math.floor(Math.random() * heroVids.length)];
|
||
var src = hv.querySelector('source');
|
||
if (src && pick[0] !== src.getAttribute('src')) {
|
||
src.setAttribute('src', pick[0]);
|
||
hv.setAttribute('poster', pick[1]);
|
||
hv.load();
|
||
}
|
||
var fig = hv.parentNode;
|
||
var showPoster = function(){
|
||
if (hv.dataset.fellback) return;
|
||
hv.dataset.fellback = '1';
|
||
var poster = hv.getAttribute('poster');
|
||
if (fig && poster) { fig.style.backgroundImage = "url('" + poster + "')"; fig.style.backgroundSize = 'cover'; fig.style.backgroundPosition = 'center'; }
|
||
hv.style.display = 'none';
|
||
};
|
||
var play = function(){ var p = hv.play(); if (p && p.catch) p.catch(showPoster); };
|
||
play(); hv.addEventListener('canplay', play, { once: true });
|
||
setTimeout(function(){ if (hv.paused && hv.currentTime === 0) showPoster(); }, 4000);
|
||
}
|
||
|
||
var nav = document.getElementById('nav');
|
||
var onScroll = function(){ nav.classList.toggle('nav--solid', window.scrollY > 40); };
|
||
onScroll(); window.addEventListener('scroll', onScroll, {passive:true});
|
||
var toggle = document.getElementById('navToggle');
|
||
var drawer = document.getElementById('drawer');
|
||
var close = function(){ document.body.classList.remove('menu-open'); toggle.setAttribute('aria-expanded','false'); drawer.setAttribute('aria-hidden','true'); };
|
||
toggle.addEventListener('click', function(){
|
||
var open = document.body.classList.toggle('menu-open');
|
||
toggle.setAttribute('aria-expanded', open); drawer.setAttribute('aria-hidden', !open);
|
||
});
|
||
drawer.querySelectorAll('a').forEach(function(a){ a.addEventListener('click', close); });
|
||
document.addEventListener('keydown', function(e){ if(e.key==='Escape') close(); });
|
||
var io = new IntersectionObserver(function(entries){
|
||
entries.forEach(function(en){ if(en.isIntersecting){ en.target.classList.add('in'); io.unobserve(en.target); } });
|
||
}, {threshold: 0.12, rootMargin: '0px 0px -40px 0px'});
|
||
document.querySelectorAll('.reveal').forEach(function(el){ io.observe(el); });
|
||
|
||
var vio = new IntersectionObserver(function(es){ es.forEach(function(e){ if(e.isIntersecting){ var p=e.target.play(); if(p&&p.catch)p.catch(function(){}); } }); }, {threshold: 0.2});
|
||
document.querySelectorAll('.ambient video').forEach(function(v){ vio.observe(v); });
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|