leseco / index.html
Doobdeedoo's picture
Add 3 files
be01ab7 verified
Raw
History Blame Contribute Delete
24.8 kB
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LeSeCo - Psychologische Beratung & Coaching</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
.hero-gradient {
background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 50%, #9333ea 100%);
}
.nav-link:hover {
color: #7c3aed;
transition: all 0.3s ease;
}
.service-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.service-card {
transition: all 0.3s ease;
}
</style>
</head>
<body class="font-sans bg-gray-50">
<!-- Header/Navigation -->
<header class="bg-white shadow-sm sticky top-0 z-50">
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
<div class="flex items-center">
<a href="index.html" class="text-2xl font-bold text-indigo-600 flex items-center">
<i class="fas fa-brain mr-2"></i> LeSeCo
</a>
</div>
<!-- Mobile menu button -->
<button id="mobile-menu-button" class="md:hidden text-gray-600 focus:outline-none">
<i class="fas fa-bars text-2xl"></i>
</button>
<!-- Desktop Navigation -->
<nav class="hidden md:flex space-x-8">
<a href="index.html" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Home</a>
<a href="psychologische_beratung/index.html" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Beratung</a>
<a href="coaching/index.html" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Coaching</a>
<a href="neurofeedback/index.html" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Neurofeedback</a>
<a href="meine_person/index.html" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Über mich</a>
<a href="kontakt/index.php" class="nav-link text-gray-700 hover:text-indigo-600 font-medium">Kontakt</a>
</nav>
</div>
<!-- Mobile Navigation -->
<div id="mobile-menu" class="hidden md:hidden bg-white py-2 px-4 shadow-lg">
<a href="index.html" class="block py-2 text-gray-700 hover:text-indigo-600">Home</a>
<a href="psychologische_beratung/index.html" class="block py-2 text-gray-700 hover:text-indigo-600">Beratung</a>
<a href="coaching/index.html" class="block py-2 text-gray-700 hover:text-indigo-600">Coaching</a>
<a href="neurofeedback/index.html" class="block py-2 text-gray-700 hover:text-indigo-600">Neurofeedback</a>
<a href="meine_person/index.html" class="block py-2 text-gray-700 hover:text-indigo-600">Über mich</a>
<a href="kontakt/index.php" class="block py-2 text-gray-700 hover:text-indigo-600">Kontakt</a>
</div>
</header>
<!-- Hero Section -->
<section class="hero-gradient text-white py-16 md:py-24">
<div class="container mx-auto px-4">
<div class="max-w-3xl mx-auto text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-6">Psychologische Beratung & Coaching</h1>
<p class="text-xl md:text-2xl mb-8">Herzlich willkommen bei LeSeCo - Ihrem Partner für persönliche Entwicklung und mentale Gesundheit</p>
<div class="flex flex-col sm:flex-row justify-center gap-4">
<a href="kontakt/index.php" class="bg-white text-indigo-600 hover:bg-gray-100 font-bold py-3 px-6 rounded-full transition duration-300">
Termin vereinbaren
</a>
<a href="leistungen/index.html" class="bg-transparent border-2 border-white hover:bg-white hover:text-indigo-600 font-bold py-3 px-6 rounded-full transition duration-300">
Unsere Leistungen
</a>
</div>
</div>
</div>
</section>
<!-- Services Section -->
<section class="py-16 bg-white">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Unsere Angebote</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Service 1 -->
<a href="skype_-_zoom/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-video text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Online-Beratung</h3>
<p class="text-gray-600 mb-4">Professionelle Beratung bequem von zu Hause aus via Skype oder Zoom. Ortsunabhängig und flexibel.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
<!-- Service 2 -->
<a href="psychologische_beratung/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-hands-helping text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Psychologische Beratung</h3>
<p class="text-gray-600 mb-4">Professionelle Unterstützung bei Lebenskrisen, Beziehungsproblemen und persönlichen Herausforderungen.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
<!-- Service 3 -->
<a href="coaching/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-chart-line text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Coaching</h3>
<p class="text-gray-600 mb-4">Ressourcenorientierte Begleitung für berufliche und persönliche Entwicklung. Lösungsfokussiert und zielgerichtet.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
<!-- Service 4 -->
<a href="neurofeedback/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-brain text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Neurofeedback</h3>
<p class="text-gray-600 mb-4">Modernes Gehirntraining zur Verbesserung von Konzentration, Schlaf und Stressbewältigung.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
<!-- Service 5 -->
<a href="praeventivia_net/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-shield-alt text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Prävention</h3>
<p class="text-gray-600 mb-4">Maßnahmen zur Vorbeugung und Stärkung der psychischen Gesundheit in verschiedenen Lebensbereichen.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
<!-- Service 6 -->
<a href="leistungen/index.html" class="service-card bg-gray-50 rounded-lg overflow-hidden shadow-md">
<div class="p-6">
<div class="bg-indigo-100 w-16 h-16 rounded-full flex items-center justify-center mb-4">
<i class="fas fa-list-alt text-indigo-600 text-2xl"></i>
</div>
<h3 class="text-xl font-bold mb-3 text-gray-800">Alle Leistungen</h3>
<p class="text-gray-600 mb-4">Eine Übersicht aller unserer Angebote und Dienstleistungen im Bereich psychologische Beratung.</p>
<div class="text-indigo-600 font-medium flex items-center">
Mehr erfahren
<i class="fas fa-arrow-right ml-2"></i>
</div>
</div>
</a>
</div>
</div>
</section>
<!-- About Section -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-4">
<div class="flex flex-col lg:flex-row items-center">
<div class="lg:w-1/2 mb-8 lg:mb-0 lg:pr-12">
<img src="https://images.unsplash.com/photo-1573497019940-1c28c88b4f3e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1000&q=80"
alt="Psychologische Beratung"
class="rounded-lg shadow-lg w-full h-auto">
</div>
<div class="lg:w-1/2">
<h2 class="text-3xl font-bold mb-6 text-gray-800">Über LeSeCo</h2>
<p class="text-gray-600 mb-4">
Auf diesen Seiten möchte ich Ihnen meine Ziele und Ideen näher bringen und Sie über meine Arbeit informieren.
Mein Name ist [Name] und ich bin psychologische Beraterin mit langjähriger Erfahrung in verschiedenen Bereichen
der mentalen Gesundheit und persönlichen Entwicklung.
</p>
<p class="text-gray-600 mb-6">
Mein Ansatz ist ganzheitlich, respektvoll und individuell auf Ihre Bedürfnisse zugeschnitten.
Ich arbeite mit bewährten Methoden und modernen Techniken wie Neurofeedback, um Ihnen die bestmögliche
Unterstützung bieten zu können.
</p>
<a href="meine_person/index.html" class="inline-flex items-center text-indigo-600 font-medium">
Mehr über mich erfahren
<i class="fas fa-arrow-right ml-2"></i>
</a>
</div>
</div>
</div>
</section>
<!-- Testimonials Section -->
<section class="py-16 bg-indigo-50">
<div class="container mx-auto px-4">
<h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Das sagen unsere Klienten</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Testimonial 1 -->
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="flex items-center mb-4">
<div class="text-yellow-400 mr-2">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
</div>
<p class="text-gray-600 mb-4 italic">
"Die Beratung bei LeSeCo hat mir geholfen, meine Ängste zu überwinden und neue Perspektiven zu entwickeln.
Die Online-Sitzungen waren sehr praktisch und effektiv."
</p>
<div class="flex items-center">
<div class="bg-indigo-100 w-10 h-10 rounded-full flex items-center justify-center mr-3">
<i class="fas fa-user text-indigo-600"></i>
</div>
<div>
<h4 class="font-medium text-gray-800">Sarah M.</h4>
<p class="text-sm text-gray-500">Online-Beratung</p>
</div>
</div>
</div>
<!-- Testimonial 2 -->
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="flex items-center mb-4">
<div class="text-yellow-400 mr-2">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
</div>
<p class="text-gray-600 mb-4 italic">
"Das Neurofeedback-Training hat meine Konzentrationsfähigkeit deutlich verbessert.
Ich kann jetzt länger und fokussierter arbeiten, ohne mich gestresst zu fühlen."
</p>
<div class="flex items-center">
<div class="bg-indigo-100 w-10 h-10 rounded-full flex items-center justify-center mr-3">
<i class="fas fa-user text-indigo-600"></i>
</div>
<div>
<h4 class="font-medium text-gray-800">Thomas K.</h4>
<p class="text-sm text-gray-500">Neurofeedback</p>
</div>
</div>
</div>
<!-- Testimonial 3 -->
<div class="bg-white p-6 rounded-lg shadow-md">
<div class="flex items-center mb-4">
<div class="text-yellow-400 mr-2">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star-half-alt"></i>
</div>
</div>
<p class="text-gray-600 mb-4 italic">
"Durch das Coaching habe ich Klarheit über meine berufliche Zukunft gewonnen.
Die Gespräche waren stets wertschätzend und gleichzeitig herausfordernd im positiven Sinne."
</p>
<div class="flex items-center">
<div class="bg-indigo-100 w-10 h-10 rounded-full flex items-center justify-center mr-3">
<i class="fas fa-user text-indigo-600"></i>
</div>
<div>
<h4 class="font-medium text-gray-800">Julia R.</h4>
<p class="text-sm text-gray-500">Coaching</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-16 bg-indigo-600 text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-3xl font-bold mb-6">Bereit für den ersten Schritt?</h2>
<p class="text-xl mb-8 max-w-2xl mx-auto">
Vereinbaren Sie noch heute einen Termin für ein kostenloses Erstgespräch und erfahren Sie,
wie wir Ihnen helfen können.
</p>
<div class="flex flex-col sm:flex-row justify-center gap-4">
<a href="kontakt/index.php" class="bg-white text-indigo-600 hover:bg-gray-100 font-bold py-3 px-8 rounded-full transition duration-300 inline-flex items-center justify-center">
<i class="fas fa-calendar-alt mr-2"></i> Termin vereinbaren
</a>
<a href="tel:+49123456789" class="bg-transparent border-2 border-white hover:bg-white hover:text-indigo-600 font-bold py-3 px-8 rounded-full transition duration-300 inline-flex items-center justify-center">
<i class="fas fa-phone mr-2"></i> +49 123 456 789
</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-800 text-white pt-12 pb-6">
<div class="container mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 mb-8">
<!-- Column 1 -->
<div>
<h3 class="text-xl font-bold mb-4">LeSeCo</h3>
<p class="text-gray-400 mb-4">
Professionelle psychologische Beratung, Coaching und Neurofeedback für persönliche Entwicklung und mentale Gesundheit.
</p>
<div class="flex space-x-4">
<a href="#" class="text-gray-400 hover:text-white transition duration-300">
<i class="fab fa-facebook-f"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white transition duration-300">
<i class="fab fa-linkedin-in"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white transition duration-300">
<i class="fab fa-instagram"></i>
</a>
</div>
</div>
<!-- Column 2 -->
<div>
<h3 class="text-xl font-bold mb-4">Kontakt</h3>
<ul class="space-y-2">
<li class="flex items-center">
<i class="fas fa-map-marker-alt mr-3 text-gray-400"></i>
<span class="text-gray-400">Musterstraße 123, 12345 Berlin</span>
</li>
<li class="flex items-center">
<i class="fas fa-phone mr-3 text-gray-400"></i>
<a href="tel:+49123456789" class="text-gray-400 hover:text-white">+49 123 456 789</a>
</li>
<li class="flex items-center">
<i class="fas fa-envelope mr-3 text-gray-400"></i>
<a href="mailto:info@leseco.net" class="text-gray-400 hover:text-white">info@leseco.net</a>
</li>
</ul>
</div>
<!-- Column 3 -->
<div>
<h3 class="text-xl font-bold mb-4">Schnelllinks</h3>
<ul class="space-y-2">
<li><a href="index.html" class="text-gray-400 hover:text-white transition duration-300">Home</a></li>
<li><a href="psychologische_beratung/index.html" class="text-gray-400 hover:text-white transition duration-300">Beratung</a></li>
<li><a href="coaching/index.html" class="text-gray-400 hover:text-white transition duration-300">Coaching</a></li>
<li><a href="neurofeedback/index.html" class="text-gray-400 hover:text-white transition duration-300">Neurofeedback</a></li>
<li><a href="meine_person/index.html" class="text-gray-400 hover:text-white transition duration-300">Über mich</a></li>
</ul>
</div>
<!-- Column 4 -->
<div>
<h3 class="text-xl font-bold mb-4">Rechtliches</h3>
<ul class="space-y-2">
<li><a href="dsgvo/index.html" class="text-gray-400 hover:text-white transition duration-300">Datenschutz</a></li>
<li><a href="impressum.html" class="text-gray-400 hover:text-white transition duration-300">Impressum</a></li>
<li><a href="agb.html" class="text-gray-400 hover:text-white transition duration-300">AGB</a></li>
<li><a href="gebuehren/index.html" class="text-gray-400 hover:text-white transition duration-300">Gebühren</a></li>
</ul>
</div>
</div>
<div class="border-t border-gray-700 pt-6 flex flex-col md:flex-row justify-between items-center">
<p class="text-gray-400 text-sm mb-4 md:mb-0">
&copy; 2023 LeSeCo. Alle Rechte vorbehalten.
</p>
<div class="flex space-x-6">
<a href="#" class="text-gray-400 hover:text-white text-sm transition duration-300">Cookie-Einstellungen</a>
<a href="#" class="text-gray-400 hover:text-white text-sm transition duration-300">Nutzungsbedingungen</a>
</div>
</div>
</div>
</footer>
<!-- Back to Top Button -->
<button id="back-to-top" class="fixed bottom-6 right-6 bg-indigo-600 text-white w-12 h-12 rounded-full shadow-lg hidden items-center justify-center">
<i class="fas fa-arrow-up"></i>
</button>
<script>
// Mobile menu toggle
const mobileMenuButton = document.getElementById('mobile-menu-button');
const mobileMenu = document.getElementById('mobile-menu');
mobileMenuButton.addEventListener('click', () => {
mobileMenu.classList.toggle('hidden');
});
// Back to top button
const backToTopButton = document.getElementById('back-to-top');
window.addEventListener('scroll', () => {
if (window.pageYOffset > 300) {
backToTopButton.classList.remove('hidden');
backToTopButton.classList.add('flex');
} else {
backToTopButton.classList.add('hidden');
backToTopButton.classList.remove('flex');
}
});
backToTopButton.addEventListener('click', () => {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Doobdeedoo/leseco" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>