Overhaul website with Tino's real content and new sections
Replace placeholder content with Tino's actual bio, services, testimonials, and contact info. Add Angebot section (5-step treatment process, coaching, pricing), testimonial carousel (7 clients), Quantenheilung and Selbstheilung explainer sections with accordions, single Praxis location (Scuol), and real phone number. Update hero slogan, nav structure, and footer. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
069e9a1d6b
commit
06b95b5b89
385
index.html
385
index.html
|
|
@ -3,8 +3,8 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Tino Andri | SelbstHeilungsTechnik & QuantenHeilung | Ardez & Scuol</title>
|
||||
<meta name="description" content="Tino Andri bietet SelbstHeilungsTechnik und QuantenHeilung für Erwachsene, Jugendliche und Kinder in Ardez und Scuol, Engadin.">
|
||||
<title>Tino Andri | Quantenheilung & Selbstheilung | Scuol, Engadin</title>
|
||||
<meta name="description" content="Tino Andri bietet Quantenheilung, SelbstHeilungsTechnik und Bewusstseinscoaching in Scuol, Engadin. Sanfte Impulse, die tief bewegen.">
|
||||
<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=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Nunito+Sans:wght@300;400;600&display=swap" rel="stylesheet">
|
||||
|
|
@ -22,8 +22,8 @@
|
|||
</button>
|
||||
<ul class="nav-menu">
|
||||
<li><a href="#about">Über mich</a></li>
|
||||
<li><a href="#services">Angebote</a></li>
|
||||
<li><a href="#locations">Standorte</a></li>
|
||||
<li><a href="#angebot">Angebot</a></li>
|
||||
<li><a href="#erfahrungen">Erfahrungen</a></li>
|
||||
<li><a href="#workshops">Workshops</a></li>
|
||||
<li><a href="#contact">Kontakt</a></li>
|
||||
</ul>
|
||||
|
|
@ -33,9 +33,9 @@
|
|||
<!-- Hero Section -->
|
||||
<header class="hero">
|
||||
<div class="hero-content">
|
||||
<p class="hero-subtitle">SelbstHeilungsTechnik & QuantenHeilung</p>
|
||||
<p class="hero-subtitle">Quantenheilung & Selbstheilung</p>
|
||||
<h1 class="hero-title">Tino Andri</h1>
|
||||
<p class="hero-tagline">Heilung beginnt in dir selbst</p>
|
||||
<p class="hero-tagline">Sanfte Impulse, die tief bewegen</p>
|
||||
<a href="#contact" class="btn btn-primary">Termin vereinbaren</a>
|
||||
</div>
|
||||
<div class="hero-image">
|
||||
|
|
@ -53,56 +53,103 @@
|
|||
<div class="about-content">
|
||||
<h2 class="section-title">Über mich</h2>
|
||||
<div class="about-text">
|
||||
<p>Zwischen meinem 18. und 24. Lebensjahr litt ich unter starken Rückenschmerzen durch Bandscheibenvorfälle, einem gerissenen Kreuzband, Meniskusriss, einer ausgekugelten Schulter, zwei Leistenbrüchen und einem geplatzten Blinddarm.</p>
|
||||
<p>Ich fühlte mich körperlich und energetisch am falschen Ort, begleitet von einer tiefen Unzufriedenheit mit meinem Leben.</p>
|
||||
<p>Vor fünf Jahren öffnete mir eine geführte Selbstheilungsmeditation die Augen. Dies weckte mein Interesse daran, wie Heilung funktioniert. Ich besuchte intensive Kurse und praktiziere nun seit vier Jahren.</p>
|
||||
<p>Heute begleite ich Menschen auf ihrem eigenen Heilungsweg – Erwachsene, Jugendliche und Kinder.</p>
|
||||
<p>Tino Andri, aufgewachsen im Unterengadin. In meiner Kindheit und Jugend erlebte ich verschiedene Verletzungen beziehungsweise Traumata die mir mein Selbstwert und Selbstvertrauen nahmen. Mit der Zeit kamen körperliche Schmerzen dazu wie Rückenschmerzen und weitere Verletzungen die mich mehr und mehr einschränkten.</p>
|
||||
<p>Bis zu meiner Spontanheilung war es mir nicht mal bewusst, dass meine seelischen Schmerzen so gross waren und sich Seele und Körper gegenseitig beeinflussen. Dieses wunderbare Erlebnis der Spontanheilung hat mir die Augen geöffnet und einen Heilungsweg mit Bewusstwerdung ermöglicht. Auch konnte ich so meine Berufung finden.</p>
|
||||
<p>Mit verschiedenen Mentoren lernte ich verschiedene Methoden der Selbstheilung kennen und festigte sie mit der über fünfjährigen Selbstanwendung. Vor drei Jahren eröffnete ich meine Praxis mit dem Ziel, Menschen auf ihrem Heilungsweg zu begleiten.</p>
|
||||
</div>
|
||||
<div class="mentors">
|
||||
<h3>Meine Mentoren</h3>
|
||||
<ul class="mentors-list">
|
||||
<li><strong>Roberto Antela Martinez</strong> — SHT (Selbstheilungs-Techniken)</li>
|
||||
<li><strong>Ines Rüfenacht</strong> — Quantenheilung</li>
|
||||
<li><strong>Joe Dispenza</strong> — Quantenheilung</li>
|
||||
<li><strong>Kurt Tepperwein</strong> — Bewusstwerdung</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Services Section -->
|
||||
<section id="services" class="section services">
|
||||
<!-- Angebot Section -->
|
||||
<section id="angebot" class="section angebot">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Angebote</h2>
|
||||
<p class="section-intro">Ich biete verschiedene Heilungssitzungen an, die auf Ihre individuellen Bedürfnisse abgestimmt sind.</p>
|
||||
<h2 class="section-title section-title-center">Angebot für Bewusstseinsentwicklung und Selbstheilung</h2>
|
||||
|
||||
<div class="services-grid">
|
||||
<div class="service-card">
|
||||
<div class="service-icon">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
|
||||
</svg>
|
||||
<div class="angebot-intro">
|
||||
<div class="rhetorical-questions">
|
||||
<p class="rhetorical-question">Möchtest du deine inneren Blockaden erkennen und transformieren, um mehr Gesundheit, Zufriedenheit und mehr Lebensenergie zu erfahren?</p>
|
||||
<p class="rhetorical-question">Möchtest du auf dem Weg der Selbstheilung begleitet sein und dich stärken?</p>
|
||||
<p class="rhetorical-question">Möchtest du dein Leben auf eine neue Ebene des Bewusstseins heben?</p>
|
||||
</div>
|
||||
<h3>SelbstHeilungsTechnik (SHT)</h3>
|
||||
<p>Eine sanfte Methode, die Ihren Körper dabei unterstützt, seine natürlichen Selbstheilungskräfte zu aktivieren und Blockaden zu lösen.</p>
|
||||
<p class="angebot-answer">Dann bist du bei mir richtig. Mit den ganzheitlichen Methoden öffnen wir gemeinsam Türen zur Selbstheilung. Wir erkennen die tieferen Ursachen von Symptomen und transformieren sie. Dein Körper darf sich schon nach einer Sitzung regenerieren, dein Geist erfrischt und dein Herz füllt sich mit neuer Lebensenergie.</p>
|
||||
<p class="angebot-cta-text">Erlaube dir dein Weg zu einem freieren, gesünderen und erfüllteren Leben – es ist Zeit für deine persönliche Transformation!</p>
|
||||
</div>
|
||||
|
||||
<div class="service-card">
|
||||
<div class="service-icon">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<circle cx="12" cy="12" r="10"/>
|
||||
<path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/>
|
||||
<path d="M2 12h20"/>
|
||||
</svg>
|
||||
<!-- 5-Step Treatment Process -->
|
||||
<h3 class="process-title">Inhalt einer Behandlung</h3>
|
||||
<div class="process-timeline">
|
||||
<div class="process-step">
|
||||
<div class="step-number">1</div>
|
||||
<div class="step-content">
|
||||
<h4>Ankommen und Vorgespräch</h4>
|
||||
<p>Zu Beginn der Sitzung nehmen wir uns Zeit, um deine aktuellen Herausforderungen und Anliegen zu besprechen. Gemeinsam klären wir, welche Blockaden oder Beschwerden du lösen möchtest.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="process-step">
|
||||
<div class="step-number">2</div>
|
||||
<div class="step-content">
|
||||
<h4>Einführung in die Entspannung</h4>
|
||||
<p>Mit einer kurzen, geführten Entspannungsphase schaffen wir die optimale Grundlage, um in das reine Bewusstseinsfeld einzutauchen. Dein Geist kommt zur Ruhe, und dein Energiefeld öffnet sich für die Heilimpulse.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="process-step">
|
||||
<div class="step-number">3</div>
|
||||
<div class="step-content">
|
||||
<h4>Energetische Transformation</h4>
|
||||
<p>In diesem zentralen Teil der Sitzung werden gezielte Impulse auf der Quantenebene gesetzt, um schon lange bestehende Blockaden, Schmerzen oder Traumas und die zugrunde liegenden Ursachen zu lösen. Deine Selbstheilungskräfte werden so aktiviert, und durch harmonisierende Energien wird die Transformation auf allen Ebenen unterstützt.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="process-step">
|
||||
<div class="step-number">4</div>
|
||||
<div class="step-content">
|
||||
<h4>Integration und Reflexion</h4>
|
||||
<p>Nach der energetischen Arbeit hast du Zeit, die erfahrenen Veränderungen zu spüren und zu verinnerlichen. Im Anschluss reflektieren wir gemeinsam, welche Erkenntnisse sich gezeigt haben und wie du diese in deinen Alltag integrieren kannst.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="process-step">
|
||||
<div class="step-number">5</div>
|
||||
<div class="step-content">
|
||||
<h4>Alltagstools für nachhaltige Transformation</h4>
|
||||
<p>Neben der energetischen Arbeit erhältst du einfache, praktische Werkzeuge für den Alltag: Atemtechniken, Achtsamkeitsübungen, einfache Meditationen, Affirmationen und Impulse für Routinen. Diese Tools unterstützen dich dabei, die angestossenen Veränderungen nachhaltig zu integrieren und langfristig ein erfüllteres, gesünderes Leben zu führen.</p>
|
||||
</div>
|
||||
</div>
|
||||
<h3>QuantenHeilung</h3>
|
||||
<p>Arbeiten auf der Quantenebene, um tiefgreifende Veränderungen im Energiefeld zu bewirken und das innere Gleichgewicht wiederherzustellen.</p>
|
||||
</div>
|
||||
|
||||
<div class="service-card">
|
||||
<div class="service-icon">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="9" cy="7" r="4"/>
|
||||
<path d="M23 21v-2a4 4 0 0 0-3-3.87"/>
|
||||
<path d="M16 3.13a4 4 0 0 1 0 7.75"/>
|
||||
</svg>
|
||||
<!-- Coaching -->
|
||||
<div class="coaching-card">
|
||||
<h3>Coaching</h3>
|
||||
<p>In meinem Coaching arbeiten wir zusammen an deiner Bewusstwerdung. Ich bringe dir bei, nach welchen Gesetzen das Menschsein spielt und was dir im Alltag helfen kann, dein Potenzial zu entfalten, das nur darauf wartet, gelebt zu werden. Du erhältst viele einfache, jedoch sehr effiziente Werkzeuge, um den Alltag mit Leichtigkeit zu bewältigen.</p>
|
||||
<p>Auch wirst du auf einschränkende Glaubenssätze und Konditionierungen aufmerksam gemacht und bekommst Techniken, um sie in förderliche umzuwandeln. Kurz gesagt: Ich begleite dich auf deinem Bewusstseinsweg und bringe dir bei, wie du dich selber heilen kannst.</p>
|
||||
</div>
|
||||
<h3>Sitzungen für alle Altersgruppen</h3>
|
||||
<p>Ob Erwachsene, Jugendliche oder Kinder – jeder Mensch kann von der Selbstheilung profitieren. Die Sitzungen werden individuell angepasst.</p>
|
||||
|
||||
<!-- Pricing & Location -->
|
||||
<div class="pricing-card">
|
||||
<div class="pricing-details">
|
||||
<div class="pricing-item">
|
||||
<span class="pricing-label">Investition in dich</span>
|
||||
<span class="pricing-value">CHF 100.– / Stunde</span>
|
||||
</div>
|
||||
<div class="pricing-item">
|
||||
<span class="pricing-label">Dauer</span>
|
||||
<span class="pricing-value">ca. 60–90 Minuten</span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="pricing-note">Wenn du es dir momentan nicht leisten kannst, nimm bitte Kontakt mit mir auf und wir finden gemeinsam eine Lösung.</p>
|
||||
<div class="pricing-locations">
|
||||
<span>Praxis Scuol</span>
|
||||
<span>Fernbehandlung</span>
|
||||
<span>Hausbesuche</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -118,38 +165,182 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Locations Section -->
|
||||
<section id="locations" class="section locations">
|
||||
<!-- Testimonials Section -->
|
||||
<section id="erfahrungen" class="section testimonials">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Standorte</h2>
|
||||
<p class="section-intro">Besuchen Sie mich in einem meiner zwei Praxisräume im wunderschönen Engadin.</p>
|
||||
<h2 class="section-title section-title-center">Erfahrungen</h2>
|
||||
<p class="section-intro">Was Menschen nach ihren Sitzungen berichten.</p>
|
||||
|
||||
<div class="locations-grid">
|
||||
<div class="location-card">
|
||||
<div class="location-image">
|
||||
<img src="images/tino-workshop.jpg" alt="Praxis Ardez - Tino Andri Werkstatt" class="location-img">
|
||||
<div class="carousel">
|
||||
<div class="carousel-track">
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Es sind vier Wochen seit meinem ersten und eine Woche seit meinem zweiten Besuch bei Tino vergangen. Die beiden Sessions im wunderbaren Palace in Scuol haben mein Leben in vielen Bereichen positiv verändert. Themen wie Ängste, Familienkonstellationen und Selbstzweifel, die mich viel zu lange begleitet haben, erscheinen nun in einem neuen Licht. Dank Tinos Arbeit erlebe ich alltägliche Situationen, die früher von Unsicherheit und Überforderung geprägt waren, mit Leichtigkeit und Freude.</p>
|
||||
</blockquote>
|
||||
<cite>— Marc</cite>
|
||||
</div>
|
||||
<div class="location-content">
|
||||
<h3>Praxis Ardez</h3>
|
||||
<address>
|
||||
Chanvers 197<br>
|
||||
7546 Ardez
|
||||
</address>
|
||||
<p>Im Herzen des malerischen Bergdorfes Ardez, umgeben von der atemberaubenden Engadiner Landschaft.</p>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Ist es möglich, dass nach nur einem Treffen mit Tino Ängste und Selbstzweifel einfach nicht mehr da sind? Kann es sein, dass schon in der zweiten Session meine Seele sich so sicher bei Tino fühlte, um auf eine reinigende Reise zu gehen und mit nie für möglich gehaltenen Erkenntnissen zurück in den Alltag zu gehen und gleich anzuwenden? 2× WOW! 2× JA! 2× DANKE!</p>
|
||||
</blockquote>
|
||||
<cite>— Sevi</cite>
|
||||
</div>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Seit meiner ersten Behandlung bei Tino bin ich fest davon überzeugt, dass verschiedenste Krankheiten auf diesem einfachen und doch tiefgreifenden Weg geheilt werden können. Auch ist es erstaunlich zu beobachten, wie psychische Probleme und Ängste transformiert werden und es sich im Alltag schnell bemerkbar macht. Viele Dinge erscheinen mir einfacher und es fühlt sich leichter an.</p>
|
||||
</blockquote>
|
||||
<cite>— Julia</cite>
|
||||
</div>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Bei mir hat sich während einem Monat meine Einstellung geändert. Das, was ich als schwierig empfand, hat sich transformiert mit dem Bewusstsein, dass nur ich selber dachte, es sei schwierig. Diese Aspekte haben sich aufgelöst, und jetzt interpretiere ich Herausforderungen anders, nämlich, dass es eigentlich ganz einfach ist. Die Schwere meiner negativen Gedanken ist nicht mehr da, und somit die Barrieren meiner Ängste.</p>
|
||||
</blockquote>
|
||||
<cite>— Martina</cite>
|
||||
</div>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Tino schafft in seinen Sessions einen sicheren und geborgenen Raum, der einem Heilung ermöglicht. Es fällt leicht, das eigene Potential zu erkennen, das Urvertrauen zu stärken, Licht wie auch Liebe zu empfangen, im gegenwärtigen Moment anzukommen, und einfach zu sein. Eine wundervolle Erfahrung!</p>
|
||||
</blockquote>
|
||||
<cite>— Evi</cite>
|
||||
</div>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>Der Workshop mit dir hat mir mentale Tore geöffnet und neue, wunderliche Gedankenräume gezeigt, die zu verlassen mir jetzt unmöglich erscheint. Ein ganz spezieller Aha-Moment macht die wertvolle Zeit mit dir unvergesslich – dafür danke ich dir von Herzen, lieber Tino.</p>
|
||||
</blockquote>
|
||||
<cite>— Barara</cite>
|
||||
</div>
|
||||
<div class="testimonial-card">
|
||||
<blockquote>
|
||||
<p>In quel temp cur ch'eu suffriva dürant mais d'üna sco ditta «frozen shoulder» n'haja inscuntrà a Tino plütöst per cas pervi d'üna otra lavur. Spontaniamaing am n'haja laschà trattar da Tino güstà là sül lö. Davò 15 minuts veiva fingià bler damain mal aint in la spadla. Grazia Tino, tia art da guarischiun es extraordinaria ed eu m'allegr dad imprender inavant da tai.</p>
|
||||
</blockquote>
|
||||
<cite>— Maria <span class="testimonial-lang">(Rumantsch)</span></cite>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-controls">
|
||||
<button class="carousel-btn carousel-prev" aria-label="Vorherige">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"/></svg>
|
||||
</button>
|
||||
<div class="carousel-dots"></div>
|
||||
<button class="carousel-btn carousel-next" aria-label="Nächste">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Quantenheilung Section -->
|
||||
<section id="quantenheilung" class="section explainer">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Was bedeutet Quantenheilung?</h2>
|
||||
<p class="section-intro">Quantenheilung basiert auf Konzepten der Quantenphysik, insbesondere auf der Idee, dass alles im Universum aus Energie besteht und miteinander verbunden ist.</p>
|
||||
|
||||
<div class="accordion-group">
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Quantenverschränkung und Heilung</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Hierbei spielt das Phänomen der Quantenverschränkung eine zentrale Rolle. Dieses beschreibt, wie zwei oder mehr Teilchen unabhängig von räumlicher Distanz in einem Zustand bleiben, in dem ihre Eigenschaften untrennbar miteinander verbunden sind. Eine Veränderung bei einem Teilchen beeinflusst sofort das andere, unabhängig davon, wie weit sie voneinander entfernt sind.</p>
|
||||
<p>In der Quantenheilung wird die Quantenverschränkung symbolisch genutzt, um die Verbindung zwischen Bewusstsein, Körper und Energie zu erklären. Der Mensch wird als Teil eines universellen Energiefeldes betrachtet, in dem jede Störung oder Blockade das gesamte System beeinflussen kann. Die Heilung basiert darauf, diese Störungen auf der Quantenebene zu harmonisieren, um das natürliche Gleichgewicht wiederherzustellen.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="location-card">
|
||||
<div class="location-image">
|
||||
<img src="images/scuol-palace.jpg" alt="Scuol Palace - Heilungspraxis" class="location-img">
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Der Prozess der Quantenheilung</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p><strong>1. Das reine Bewusstseinsfeld:</strong> Im Zentrum der Quantenheilung steht der Zugang zum «reinen Bewusstseinsfeld», wo das ganze Potenzial vorhanden ist. Dies ist ein Zustand völliger Klarheit, in dem der Geist frei von Gedanken, Ängsten oder Ablenkungen ist.</p>
|
||||
<p><strong>2. Energetische Impulse setzen:</strong> Der Praktizierende dient als Kanal oder Katalysator, der mithilfe seines fokussierten Bewusstseins gezielte Impulse setzt. Diese Impulse «informieren» das Energiefeld des Klienten und harmonisieren disharmonische Frequenzen.</p>
|
||||
<p><strong>3. Selbstheilungskräfte aktivieren:</strong> Durch die energetische Harmonisierung werden blockierte Ressourcen freigesetzt, die Heilungsprozesse auf körperlicher, emotionaler und mentaler Ebene angeregt.</p>
|
||||
<p><strong>4. Transformation durch Bewusstsein:</strong> Oft entstehen körperliche oder emotionale Beschwerden durch unbewusste Muster, Stress oder ungelöste Konflikte. In der Quantenheilung können diese Muster durch das bewusste Wahrnehmen und Loslassen transformiert werden.</p>
|
||||
</div>
|
||||
<div class="location-content">
|
||||
<h3>Scuol Palace</h3>
|
||||
<address>
|
||||
Nairs 500<br>
|
||||
7550 Scuol
|
||||
</address>
|
||||
<p>Im historischen Scuol Palace, einem Ort der Ruhe und Erholung mit langer Wellness-Tradition.</p>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Vorteile und Wirkung</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p><strong>Körperlich:</strong> Quantenheilung kann Schmerzen lindern, die Funktion von Organen verbessern und die Zellregeneration fördern.</p>
|
||||
<p><strong>Emotional:</strong> Sie löst emotionale Blockaden, fördert innere Ruhe und hilft bei der Verarbeitung von belastenden Erlebnissen.</p>
|
||||
<p><strong>Mental:</strong> Die Methode bringt mentale Klarheit, ersetzt begrenzende Denkmuster und stärkt die Fähigkeit, Herausforderungen zu meistern.</p>
|
||||
<p><strong>Energetisch:</strong> Das Energiefeld wird harmonisiert, wodurch der Mensch mehr Vitalität und Lebensfreude erfährt.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Die Verbindung zur Quantenphysik</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Die Quantenphysik hat gezeigt, dass Beobachtung und Bewusstsein eine direkte Wirkung auf Materie und Energie haben. Dieses Konzept wird in der Quantenheilung genutzt: Der Praktizierende richtet sein Bewusstsein gezielt auf die Transformation der Herausforderung des Klienten, wodurch eine Veränderung auf tiefster Ebene ermöglicht wird.</p>
|
||||
<p>Quantenheilung ist eine sanfte, aber kraftvolle Methode, die die Prinzipien der Quantenphysik und das Verständnis von Energie miteinander verbindet. Sie bietet die Möglichkeit, tiefsitzende Blockaden zu transformieren und die innere Balance wiederherzustellen, indem sie den Menschen ganzheitlich auf körperlicher, emotionaler und energetischer Ebene unterstützt.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Selbstheilung Section -->
|
||||
<section id="selbstheilung" class="section explainer explainer-alt">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Was bedeutet Selbstheilung?</h2>
|
||||
<p class="section-intro">Der Körper besitzt erstaunliche Fähigkeiten, sich selbst zu reparieren und das innere Gleichgewicht wiederherzustellen.</p>
|
||||
|
||||
<div class="accordion-group">
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Körperliche Selbstheilung</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Der Körper besitzt erstaunliche Fähigkeiten, sich selbst zu reparieren. Zum Beispiel heilt sich eine kleine Schnittwunde durch die Bildung von neuem Gewebe, und bei einer Infektion arbeitet das Immunsystem daran, die Krankheitserreger zu bekämpfen. Dieser Prozess ist oft unbewusst und läuft automatisch ab.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Psychische und emotionale Selbstheilung</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Neben der körperlichen Heilung spielt auch die mentale Gesundheit eine grosse Rolle. Positive Gedanken, Stressabbau, Meditation und Achtsamkeit können den Heilungsprozess unterstützen. Das Gehirn kann durch bestimmte Techniken helfen, Schmerzen zu lindern oder emotionale Wunden zu heilen.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Einfluss von Lebensstil und Umwelt</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Gesunde Ernährung, ausreichend Schlaf, Bewegung und ein positives Umfeld fördern die Selbstheilungskräfte. Auch das Vermeiden von schädlichen Substanzen wie Alkohol oder Drogen kann die natürlichen Heilungsprozesse unterstützen.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Placebo-Effekt</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Manche Heilungserfahrungen werden durch den Glauben an die eigene Fähigkeit zur Heilung beeinflusst. Der Placebo-Effekt zeigt, dass die Überzeugung, gesund zu werden, tatsächlich körperliche Veränderungen bewirken kann.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion">
|
||||
<button class="accordion-header">
|
||||
<span>Ganzheitlicher Ansatz</span>
|
||||
<svg class="accordion-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="accordion-body">
|
||||
<p>Viele Menschen betrachten Selbstheilung als einen ganzheitlichen Prozess, bei dem Körper, Geist und Seele im Einklang sein sollten. Methoden wie Yoga, Meditation, Akupunktur oder Naturheilverfahren werden oft genutzt, um die Selbstheilungskräfte zu stärken.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -160,62 +351,64 @@
|
|||
<section id="workshops" class="section workshops">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Workshops</h2>
|
||||
<p class="section-intro">Erleben Sie die Kraft der Selbstheilung in der einzigartigen Atmosphäre der Engadiner Berge.</p>
|
||||
<p class="section-intro">Quantenheilung und Selbstheilung aktivieren</p>
|
||||
|
||||
<div class="workshop-card">
|
||||
<div class="workshop-image">
|
||||
<img src="images/engadin-hiking.jpg" alt="Workshop in den Engadiner Bergen" class="workshop-img">
|
||||
</div>
|
||||
<div class="workshop-content">
|
||||
<span class="workshop-tag">Nächster Workshop</span>
|
||||
<h3>Selbstheilung in den Bergen</h3>
|
||||
<div class="workshop-details">
|
||||
<div class="workshop-detail">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"/>
|
||||
<line x1="16" y1="2" x2="16" y2="6"/>
|
||||
<line x1="8" y1="2" x2="8" y2="6"/>
|
||||
<line x1="3" y1="10" x2="21" y2="10"/>
|
||||
</svg>
|
||||
<span>Datum wird bekannt gegeben</span>
|
||||
</div>
|
||||
<div class="workshop-detail">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/>
|
||||
<circle cx="12" cy="10" r="3"/>
|
||||
</svg>
|
||||
<span>Chamonna Cler, Ardez (2475 m ü.M.)</span>
|
||||
</div>
|
||||
</div>
|
||||
<p>Ein besonderes Erlebnis auf 2475 Metern Höhe. Treffpunkt am Bahnhof Ardez um 09:15 Uhr, Aufstieg zur Alp Murtera, gefolgt von einer kurzen 20-minütigen Wanderung zur Chamonna Cler.</p>
|
||||
<p>In der kraftvollen Bergumgebung tauchen wir gemeinsam in die Welt der Selbstheilung ein.</p>
|
||||
<span class="workshop-tag">Workshop-Programm</span>
|
||||
<h3>Quantenheilung und Selbstheilung aktivieren</h3>
|
||||
<p>Erlebe die transformative Kraft der Quantenheilung und lerne, wie du innere Blockaden löst, deine Selbstheilungskräfte aktivierst und nachhaltige Balance in dein Leben bringst. In diesem praxisorientierten Workshop erfährst du die Grundlagen der Quantenheilung und erhältst einfache, alltagstaugliche Tools, um deinen Heilungsprozess selbstständig zu unterstützen.</p>
|
||||
<p>Dieser Workshop richtet sich an Menschen, die ihre Gesundheit, Lebensenergie und innere Klarheit fördern möchten. Vorkenntnisse sind nicht erforderlich – nur die Offenheit, Neues zu entdecken.</p>
|
||||
<a href="#contact" class="btn btn-secondary">Interesse anmelden</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Praxis Section -->
|
||||
<section id="praxis" class="section praxis">
|
||||
<div class="container">
|
||||
<h2 class="section-title section-title-center">Praxis</h2>
|
||||
<div class="praxis-card">
|
||||
<div class="praxis-location">
|
||||
<h3>Praxis Scuol</h3>
|
||||
<address>
|
||||
Pimunt 271<br>
|
||||
7550 Scuol
|
||||
</address>
|
||||
</div>
|
||||
<div class="praxis-options">
|
||||
<p>Behandlungen auch als <strong>Fernbehandlung</strong> oder <strong>Hausbesuche</strong> möglich.</p>
|
||||
<p class="praxis-note">Bei Hausbesuchen passt sich der Tarif an die Entfernung an.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section id="contact" class="section contact">
|
||||
<div class="container">
|
||||
<div class="contact-grid">
|
||||
<div class="contact-info">
|
||||
<h2 class="section-title">Kontakt</h2>
|
||||
<p>Ich freue mich auf Ihre Nachricht. Gemeinsam finden wir den richtigen Weg für Ihre Heilung.</p>
|
||||
<p>Ich freue mich auf deine Nachricht. Gemeinsam finden wir den richtigen Weg für deine Heilung.</p>
|
||||
|
||||
<div class="contact-details">
|
||||
<div class="contact-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
|
||||
</svg>
|
||||
<span>+41 XX XXX XX XX</span>
|
||||
<a href="tel:+41794763372">+41 79 476 33 72</a>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/>
|
||||
<polyline points="22,6 12,13 2,6"/>
|
||||
</svg>
|
||||
<span>info@tino-ardez.ch</span>
|
||||
<a href="mailto:info@tino-ardez.ch">info@tino-ardez.ch</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -249,18 +442,18 @@
|
|||
<div class="footer-content">
|
||||
<div class="footer-brand">
|
||||
<span class="footer-logo">Tino Andri</span>
|
||||
<p>SelbstHeilungsTechnik & QuantenHeilung</p>
|
||||
<p>Quantenheilung & Selbstheilung</p>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<a href="#about">Über mich</a>
|
||||
<a href="#services">Angebote</a>
|
||||
<a href="#locations">Standorte</a>
|
||||
<a href="#angebot">Angebot</a>
|
||||
<a href="#erfahrungen">Erfahrungen</a>
|
||||
<a href="#workshops">Workshops</a>
|
||||
<a href="#contact">Kontakt</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© 2025 Tino Andri. Alle Rechte vorbehalten.</p>
|
||||
<p>© 2026 Tino Andri. Alle Rechte vorbehalten.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
|
|||
145
script.js
145
script.js
|
|
@ -1,5 +1,5 @@
|
|||
/**
|
||||
* Tino Andri - SelbstHeilungsTechnik & QuantenHeilung
|
||||
* Tino Andri - Quantenheilung & Selbstheilung
|
||||
* JavaScript functionality
|
||||
*/
|
||||
|
||||
|
|
@ -86,15 +86,12 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
contactForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// Get form data
|
||||
const formData = new FormData(this);
|
||||
const data = Object.fromEntries(formData);
|
||||
|
||||
// Here you would typically send the data to a server
|
||||
console.log('Form submitted:', data);
|
||||
|
||||
// Show success message (replace with actual implementation)
|
||||
alert('Vielen Dank für Ihre Nachricht! Ich werde mich bald bei Ihnen melden.');
|
||||
alert('Vielen Dank für deine Nachricht! Ich werde mich bald bei dir melden.');
|
||||
this.reset();
|
||||
});
|
||||
}
|
||||
|
|
@ -122,4 +119,142 @@ document.addEventListener('DOMContentLoaded', function() {
|
|||
};
|
||||
|
||||
window.addEventListener('scroll', highlightNav, { passive: true });
|
||||
|
||||
// =========================================================================
|
||||
// Testimonial Carousel
|
||||
// =========================================================================
|
||||
const carousel = document.querySelector('.carousel');
|
||||
|
||||
if (carousel) {
|
||||
const track = carousel.querySelector('.carousel-track');
|
||||
const cards = track.querySelectorAll('.testimonial-card');
|
||||
const prevBtn = carousel.querySelector('.carousel-prev');
|
||||
const nextBtn = carousel.querySelector('.carousel-next');
|
||||
const dotsContainer = carousel.querySelector('.carousel-dots');
|
||||
const totalCards = cards.length;
|
||||
let currentIndex = 0;
|
||||
let autoAdvanceTimer = null;
|
||||
|
||||
// Responsive visible count
|
||||
function getVisibleCount() {
|
||||
if (window.innerWidth <= 640) return 1;
|
||||
if (window.innerWidth <= 1024) return 2;
|
||||
return 3;
|
||||
}
|
||||
|
||||
let visibleCount = getVisibleCount();
|
||||
|
||||
function getMaxIndex() {
|
||||
return Math.max(0, totalCards - visibleCount);
|
||||
}
|
||||
|
||||
// Build dots
|
||||
function buildDots() {
|
||||
dotsContainer.innerHTML = '';
|
||||
const dotCount = getMaxIndex() + 1;
|
||||
for (let i = 0; i < dotCount; i++) {
|
||||
const dot = document.createElement('button');
|
||||
dot.classList.add('carousel-dot');
|
||||
dot.setAttribute('aria-label', `Folie ${i + 1}`);
|
||||
if (i === currentIndex) dot.classList.add('active');
|
||||
dot.addEventListener('click', () => goTo(i));
|
||||
dotsContainer.appendChild(dot);
|
||||
}
|
||||
}
|
||||
|
||||
function updateCarousel() {
|
||||
const gap = 24; // matches CSS gap
|
||||
const cardWidth = (track.clientWidth - gap * (visibleCount - 1)) / visibleCount;
|
||||
const offset = currentIndex * (cardWidth + gap);
|
||||
track.style.transform = `translateX(-${offset}px)`;
|
||||
|
||||
// Update dots
|
||||
dotsContainer.querySelectorAll('.carousel-dot').forEach((dot, i) => {
|
||||
dot.classList.toggle('active', i === currentIndex);
|
||||
});
|
||||
|
||||
// Update button states
|
||||
prevBtn.disabled = currentIndex === 0;
|
||||
nextBtn.disabled = currentIndex >= getMaxIndex();
|
||||
}
|
||||
|
||||
function goTo(index) {
|
||||
currentIndex = Math.max(0, Math.min(index, getMaxIndex()));
|
||||
updateCarousel();
|
||||
resetAutoAdvance();
|
||||
}
|
||||
|
||||
function goNext() {
|
||||
if (currentIndex >= getMaxIndex()) {
|
||||
goTo(0);
|
||||
} else {
|
||||
goTo(currentIndex + 1);
|
||||
}
|
||||
}
|
||||
|
||||
function goPrev() {
|
||||
goTo(currentIndex - 1);
|
||||
}
|
||||
|
||||
// Auto-advance
|
||||
function startAutoAdvance() {
|
||||
autoAdvanceTimer = setInterval(goNext, 6000);
|
||||
}
|
||||
|
||||
function resetAutoAdvance() {
|
||||
clearInterval(autoAdvanceTimer);
|
||||
startAutoAdvance();
|
||||
}
|
||||
|
||||
// Pause on hover
|
||||
carousel.addEventListener('mouseenter', () => clearInterval(autoAdvanceTimer));
|
||||
carousel.addEventListener('mouseleave', startAutoAdvance);
|
||||
|
||||
// Button events
|
||||
prevBtn.addEventListener('click', goPrev);
|
||||
nextBtn.addEventListener('click', goNext);
|
||||
|
||||
// Handle resize
|
||||
let resizeTimeout;
|
||||
window.addEventListener('resize', () => {
|
||||
clearTimeout(resizeTimeout);
|
||||
resizeTimeout = setTimeout(() => {
|
||||
const newCount = getVisibleCount();
|
||||
if (newCount !== visibleCount) {
|
||||
visibleCount = newCount;
|
||||
if (currentIndex > getMaxIndex()) currentIndex = getMaxIndex();
|
||||
buildDots();
|
||||
}
|
||||
updateCarousel();
|
||||
}, 150);
|
||||
});
|
||||
|
||||
// Initialize
|
||||
buildDots();
|
||||
updateCarousel();
|
||||
startAutoAdvance();
|
||||
}
|
||||
|
||||
// =========================================================================
|
||||
// Accordion
|
||||
// =========================================================================
|
||||
document.querySelectorAll('.accordion-group').forEach(group => {
|
||||
const accordions = group.querySelectorAll('.accordion');
|
||||
|
||||
accordions.forEach(accordion => {
|
||||
const header = accordion.querySelector('.accordion-header');
|
||||
|
||||
header.addEventListener('click', () => {
|
||||
const isOpen = accordion.classList.contains('open');
|
||||
|
||||
// Close all in this group
|
||||
accordions.forEach(a => a.classList.remove('open'));
|
||||
|
||||
// Toggle clicked
|
||||
if (!isOpen) {
|
||||
accordion.classList.add('open');
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
589
styles.css
589
styles.css
|
|
@ -1,5 +1,5 @@
|
|||
/* ==========================================================================
|
||||
Tino Andri - SelbstHeilungsTechnik & QuantenHeilung
|
||||
Tino Andri - Quantenheilung & Selbstheilung
|
||||
Modern, calming design for a healing practice
|
||||
========================================================================== */
|
||||
|
||||
|
|
@ -331,50 +331,6 @@ p:last-child {
|
|||
border-radius: var(--radius-md);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Placeholder Images
|
||||
-------------------------------------------------------------------------- */
|
||||
.placeholder-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
background: linear-gradient(135deg, var(--color-bg-alt) 0%, #e8e6e2 100%);
|
||||
border-radius: var(--radius-md);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.placeholder-image::before {
|
||||
content: attr(data-text);
|
||||
color: var(--color-text-muted);
|
||||
font-size: 0.9rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.placeholder-image::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border: 2px dashed var(--color-text-muted);
|
||||
border-radius: var(--radius-md);
|
||||
opacity: 0.3;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.placeholder-portrait {
|
||||
aspect-ratio: 3/4;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.placeholder-wide {
|
||||
aspect-ratio: 16/9;
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
About Section
|
||||
-------------------------------------------------------------------------- */
|
||||
|
|
@ -386,7 +342,7 @@ p:last-child {
|
|||
display: grid;
|
||||
grid-template-columns: 1fr 1.5fr;
|
||||
gap: var(--spacing-lg);
|
||||
align-items: center;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.about-text p {
|
||||
|
|
@ -413,51 +369,220 @@ p:last-child {
|
|||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Services Section
|
||||
-------------------------------------------------------------------------- */
|
||||
.services-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: var(--spacing-md);
|
||||
/* Mentors */
|
||||
.mentors {
|
||||
margin-top: var(--spacing-md);
|
||||
padding-top: var(--spacing-md);
|
||||
border-top: 1px solid var(--color-bg-alt);
|
||||
}
|
||||
|
||||
.service-card {
|
||||
background: var(--color-white);
|
||||
padding: var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
text-align: center;
|
||||
box-shadow: var(--shadow-sm);
|
||||
transition: all var(--transition-base);
|
||||
}
|
||||
|
||||
.service-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
|
||||
.service-icon {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin: 0 auto var(--spacing-sm);
|
||||
.mentors h3 {
|
||||
font-size: 1.1rem;
|
||||
margin-bottom: var(--spacing-sm);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.service-icon svg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.mentors-list {
|
||||
list-style: none;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.service-card h3 {
|
||||
.mentors-list li {
|
||||
font-size: 0.95rem;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.mentors-list li strong {
|
||||
color: var(--color-text);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Angebot Section
|
||||
-------------------------------------------------------------------------- */
|
||||
.angebot {
|
||||
background: var(--color-bg);
|
||||
}
|
||||
|
||||
.angebot-intro {
|
||||
max-width: 800px;
|
||||
margin: 0 auto var(--spacing-lg);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.rhetorical-questions {
|
||||
margin-bottom: var(--spacing-md);
|
||||
}
|
||||
|
||||
.rhetorical-question {
|
||||
font-family: var(--font-heading);
|
||||
font-size: 1.3rem;
|
||||
font-style: italic;
|
||||
color: var(--color-primary);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.service-card p {
|
||||
.angebot-answer {
|
||||
font-size: 1.05rem;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.angebot-cta-text {
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
/* Process Timeline */
|
||||
.process-title {
|
||||
text-align: center;
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: var(--spacing-md);
|
||||
}
|
||||
|
||||
.process-timeline {
|
||||
max-width: 800px;
|
||||
margin: 0 auto var(--spacing-lg);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.process-timeline::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 24px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
background: var(--color-secondary-light);
|
||||
}
|
||||
|
||||
.process-step {
|
||||
display: flex;
|
||||
gap: var(--spacing-md);
|
||||
margin-bottom: var(--spacing-md);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.process-step:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.step-number {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
background: var(--color-primary);
|
||||
color: var(--color-white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: var(--font-heading);
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.step-content {
|
||||
background: var(--color-white);
|
||||
padding: var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
box-shadow: var(--shadow-sm);
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.step-content h4 {
|
||||
font-family: var(--font-heading);
|
||||
font-size: 1.15rem;
|
||||
margin-bottom: 0.5rem;
|
||||
color: var(--color-primary-dark);
|
||||
}
|
||||
|
||||
.step-content p {
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
/* Coaching Card */
|
||||
.coaching-card {
|
||||
max-width: 800px;
|
||||
margin: 0 auto var(--spacing-md);
|
||||
background: var(--color-white);
|
||||
padding: var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
box-shadow: var(--shadow-sm);
|
||||
border-left: 4px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.coaching-card h3 {
|
||||
font-size: 1.35rem;
|
||||
margin-bottom: var(--spacing-sm);
|
||||
color: var(--color-primary-dark);
|
||||
}
|
||||
|
||||
.coaching-card p {
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
/* Pricing Card */
|
||||
.pricing-card {
|
||||
max-width: 600px;
|
||||
margin: var(--spacing-md) auto 0;
|
||||
background: var(--color-primary);
|
||||
color: var(--color-white);
|
||||
padding: var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pricing-details {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: var(--spacing-lg);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.pricing-label {
|
||||
display: block;
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
opacity: 0.8;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.pricing-value {
|
||||
display: block;
|
||||
font-family: var(--font-heading);
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.pricing-note {
|
||||
font-size: 0.9rem;
|
||||
opacity: 0.85;
|
||||
font-style: italic;
|
||||
margin-bottom: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.pricing-locations {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: var(--spacing-sm);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.pricing-locations span {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
padding: 0.25rem 0.75rem;
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Quote Section
|
||||
-------------------------------------------------------------------------- */
|
||||
|
|
@ -488,50 +613,196 @@ p:last-child {
|
|||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Locations Section
|
||||
Testimonials / Carousel
|
||||
-------------------------------------------------------------------------- */
|
||||
.locations {
|
||||
.testimonials {
|
||||
background: var(--color-white);
|
||||
}
|
||||
|
||||
.locations-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: var(--spacing-md);
|
||||
}
|
||||
|
||||
.location-card {
|
||||
background: var(--color-bg);
|
||||
border-radius: var(--radius-md);
|
||||
.carousel {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.location-img {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
object-fit: cover;
|
||||
.carousel-track {
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
|
||||
.location-content {
|
||||
.testimonial-card {
|
||||
flex: 0 0 calc((100% - 48px) / 3);
|
||||
background: var(--color-bg);
|
||||
padding: var(--spacing-md);
|
||||
border-radius: var(--radius-md);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.location-content h3 {
|
||||
margin-bottom: var(--spacing-xs);
|
||||
.testimonial-card blockquote {
|
||||
margin-bottom: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.testimonial-card blockquote p {
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
font-style: italic;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.testimonial-card cite {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
color: var(--color-primary);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.testimonial-lang {
|
||||
font-weight: 400;
|
||||
font-size: 0.85rem;
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.carousel-controls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: var(--spacing-sm);
|
||||
margin-top: var(--spacing-md);
|
||||
}
|
||||
|
||||
.carousel-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--color-primary-light);
|
||||
background: var(--color-white);
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: all var(--transition-fast);
|
||||
}
|
||||
|
||||
.carousel-btn:hover:not(:disabled) {
|
||||
background: var(--color-primary);
|
||||
color: var(--color-white);
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
|
||||
.carousel-btn:disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.carousel-btn svg {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.carousel-dots {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.carousel-dot {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
background: var(--color-secondary-light);
|
||||
cursor: pointer;
|
||||
transition: background var(--transition-fast);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.carousel-dot.active {
|
||||
background: var(--color-primary);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Explainer / Accordion Sections
|
||||
-------------------------------------------------------------------------- */
|
||||
.explainer {
|
||||
background: var(--color-bg);
|
||||
}
|
||||
|
||||
.explainer-alt {
|
||||
background: var(--color-white);
|
||||
}
|
||||
|
||||
.accordion-group {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.accordion {
|
||||
border: 1px solid var(--color-bg-alt);
|
||||
border-radius: var(--radius-md);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
background: var(--color-white);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.explainer-alt .accordion {
|
||||
background: var(--color-bg);
|
||||
}
|
||||
|
||||
.accordion-header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: var(--spacing-sm) var(--spacing-md);
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
font-family: var(--font-heading);
|
||||
font-size: 1.15rem;
|
||||
font-weight: 500;
|
||||
color: var(--color-text);
|
||||
text-align: left;
|
||||
transition: color var(--transition-fast);
|
||||
}
|
||||
|
||||
.accordion-header:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.location-content address {
|
||||
font-style: normal;
|
||||
color: var(--color-text);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
line-height: 1.6;
|
||||
.accordion-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-shrink: 0;
|
||||
transition: transform var(--transition-base);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.location-content p {
|
||||
.accordion.open .accordion-icon {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.accordion-body {
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.35s ease, padding 0.35s ease;
|
||||
padding: 0 var(--spacing-md);
|
||||
}
|
||||
|
||||
.accordion.open .accordion-body {
|
||||
max-height: 800px;
|
||||
padding: 0 var(--spacing-md) var(--spacing-md);
|
||||
}
|
||||
|
||||
.accordion-body p {
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.accordion-body p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
|
|
@ -580,28 +851,6 @@ p:last-child {
|
|||
margin-bottom: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.workshop-details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--spacing-xs);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.workshop-detail {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-xs);
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.workshop-detail svg {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: var(--color-primary);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.workshop-content p {
|
||||
color: var(--color-text-light);
|
||||
margin-bottom: var(--spacing-sm);
|
||||
|
|
@ -612,6 +861,48 @@ p:last-child {
|
|||
margin-top: var(--spacing-sm);
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Praxis Section
|
||||
-------------------------------------------------------------------------- */
|
||||
.praxis {
|
||||
background: var(--color-white);
|
||||
}
|
||||
|
||||
.praxis-card {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background: var(--color-bg);
|
||||
padding: var(--spacing-lg) var(--spacing-md);
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
.praxis-location h3 {
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-primary);
|
||||
margin-bottom: var(--spacing-xs);
|
||||
}
|
||||
|
||||
.praxis-location address {
|
||||
font-style: normal;
|
||||
font-size: 1.1rem;
|
||||
color: var(--color-text);
|
||||
line-height: 1.6;
|
||||
margin-bottom: var(--spacing-md);
|
||||
}
|
||||
|
||||
.praxis-options p {
|
||||
color: var(--color-text-light);
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
.praxis-note {
|
||||
font-size: 0.9rem;
|
||||
color: var(--color-text-muted);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
Contact Section
|
||||
-------------------------------------------------------------------------- */
|
||||
|
|
@ -650,6 +941,15 @@ p:last-child {
|
|||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.contact-item a {
|
||||
color: var(--color-text);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.contact-item a:hover {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.contact-form {
|
||||
background: var(--color-white);
|
||||
padding: var(--spacing-md);
|
||||
|
|
@ -771,8 +1071,8 @@ p:last-child {
|
|||
justify-content: center;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
.mentors-list {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.workshop-card {
|
||||
|
|
@ -786,6 +1086,10 @@ p:last-child {
|
|||
.contact-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.testimonial-card {
|
||||
flex: 0 0 calc((100% - 24px) / 2);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
|
@ -827,12 +1131,9 @@ p:last-child {
|
|||
transform: rotate(-45deg) translate(5px, -5px);
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.locations-grid {
|
||||
grid-template-columns: 1fr;
|
||||
.pricing-details {
|
||||
flex-direction: column;
|
||||
gap: var(--spacing-sm);
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
|
|
@ -847,6 +1148,26 @@ p:last-child {
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.testimonial-card {
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
|
||||
.process-timeline::before {
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.step-number {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.step-content {
|
||||
padding: var(--spacing-sm);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
:root {
|
||||
--spacing-md: 1.5rem;
|
||||
|
|
@ -858,6 +1179,10 @@ p:last-child {
|
|||
padding: 0.75rem 1.5rem;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.rhetorical-question {
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* --------------------------------------------------------------------------
|
||||
|
|
|
|||
Loading…
Reference in New Issue