Témoignages - Mongolf'air
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.testimonials-wrapper {
max-width: 900px;
margin: 0 auto;
padding: 40px 20px;
background: transparent;
position: relative;
}
.section-title {
font-family: 'Bebas Neue', sans-serif;
font-size: 25px;
font-weight: 600;
color: #FFBD59;
text-align: center;
margin-bottom: 40px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.carousel-container {
position: relative;
overflow: hidden;
border-radius: 20px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.carousel-track {
display: flex;
transition: transform 0.5s ease-in-out;
width: 600%; /* 6 témoignages */
}
.testimonial-slide {
flex: 0 0 16.666%; /* 100% / 6 slides */
background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.9));
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 189, 89, 0.2);
padding: 30px;
min-height: 300px;
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative;
}
.testimonial-slide::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(135deg, #87CEEB 0%, #FFE4B5 100%);
opacity: 0.1;
z-index: -1;
}
.slide-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 20px;
}
.client-name {
font-family: 'Bebas Neue', sans-serif;
font-size: 25px;
font-weight: 600;
color: #333;
}
.offer-badge {
font-family: 'Beba Neue', cursive;
font-size: 14px;
font-weight: 600;
padding: 6px 12px;
border-radius: 20px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.badge-decouverte {
background: linear-gradient(135deg, #FF6B6B, #FF8E8E);
color: white;
}
.badge-evasion {
background: linear-gradient(135deg, #4ECDC4, #6ED7D0);
color: white;
}
.badge-septieme-ciel {
background: linear-gradient(135deg, #FFBD59, #FFD08A);
color: #333;
}
.stars {
display: flex;
gap: 2px;
margin-bottom: 15px;
}
.star {
color: #FFD700;
font-size: 18px;
filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.1));
}
.testimonial-text {
font-family: 'Afacad', sans-serif;
font-size: 17px;
font-weight: 400;
color: #333;
line-height: 1.6;
flex-grow: 1;
position: relative;
padding-left: 20px;
}
.testimonial-text::before {
content: '"';
font-size: 40px;
color: #FFBD59;
position: absolute;
top: -10px;
left: 0;
opacity: 0.4;
font-family: serif;
}
.client-location {
font-family: 'Afacad', sans-serif;
font-size: 14px;
color: #666;
margin-top: 15px;
font-style: italic;
}
.carousel-controls {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
margin-top: 30px;
}
.carousel-btn {
background: linear-gradient(135deg, #FFBD59, #FFD08A);
border: none;
border-radius: 50%;
width: 50px;
height: 50px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: #333;
box-shadow: 0 5px 15px rgba(255, 189, 89, 0.3);
transition: all 0.3s ease;
}
.carousel-btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(255, 189, 89, 0.4);
}
.carousel-btn:disabled {
opacity: 0.5;
cursor: not-allowed;
transform: none;
box-shadow: 0 5px 15px rgba(255, 189, 89, 0.3);
}
.carousel-indicators {
display: flex;
gap: 8px;
}
.indicator {
width: 10px;
height: 10px;
border-radius: 50%;
background: rgba(255, 189, 89, 0.3);
cursor: pointer;
transition: all 0.3s ease;
}
.indicator.active {
background: #FFBD59;
transform: scale(1.2);
}
.cta-section {
text-align: center;
margin-top: 40px;
}
.cta-text {
font-family: 'Beba Neue', cursive;
font-size: 25px;
font-weight: 600;
color: #FFBD59;
margin-bottom: 20px;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.cta-button {
display: inline-block;
font-family: 'Bebas Neue', sans-serif;
font-size: 25px;
font-weight: 600;
padding: 12px 30px;
background: linear-gradient(135deg, #FFBD59, #FFD08A);
color: #333;
text-decoration: none;
border-radius: 30px;
box-shadow: 0 8px 20px rgba(255, 189, 89, 0.3);
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 1px;
}
.cta-button:hover {
transform: translateY(-2px);
box-shadow: 0 12px 25px rgba(255, 189, 89, 0.4);
text-decoration: none;
color: #333;
}
/* Styles pour l'intégration Elementor */
.elementor-widget-container .testimonials-wrapper {
padding: 20px 0;
}
@media (max-width: 768px) {
.testimonials-wrapper {
padding: 20px 10px;
}
.section-title {
font-size: 22px;
margin-bottom: 30px;
}
.testimonial-slide {
padding: 25px 20px;
min-height: 280px;
}
.slide-header {
flex-direction: column;
gap: 10px;
align-items: flex-start;
}
.client-name {
font-size: 25px;
}
.offer-badge {
font-size: 12px;
align-self: flex-end;
}
.cta-text {
font-size: 20px;
}
.carousel-btn {
width: 45px;
height: 45px;
font-size: 18px;
}
}
@media (max-width: 480px) {
.testimonial-slide {
padding: 20px 15px;
min-height: 260px;
}
.testimonial-text {
font-size: 16px;
padding-left: 15px;
}
.testimonial-text::before {
font-size: 35px;
}
}
Ils ont vécu l'expérience Mongolf'air
★
★
★
★
★
Une expérience magique ! Survoler le Pays Basque en montgolfière était un rêve d'enfant. L'équipe est professionnelle et les paysages à couper le souffle. Je recommande vivement cette aventure unique !
Biarritz • Septembre 2024
★
★
★
★
★
Vol privé exceptionnel pour notre anniversaire de mariage ! Le silence là-haut, la beauté des montagnes et de l'océan... Un moment d'intimité parfait. Merci Mongolf'air pour ce cadeau inoubliable.
Saint-Jean-de-Luz • Août 2024
★
★
★
★
★
Le summum du luxe ! Vol privé avec champagne et mets raffinés, service 5 étoiles. Nous avons eu droit à un coucher de soleil magnifique sur les Pyrénées. Une demande en mariage parfaitement orchestrée !
Bayonne • Octobre 2024
★
★
★
★
★
Première fois en montgolfière et quelle réussite ! L'ambiance conviviale avec les autres passagers, les explications du pilote... J'ai découvert ma région sous un angle totalement nouveau. À refaire absolument !
Anglet • Juin 2024
★
★
★
★
★
Vol en famille inoubliable ! Nos enfants étaient émerveillés et nous aussi. Le pilote a adapté le parcours pour nous faire voir notre maison d'en haut. Sécurité parfaite et moments de pur bonheur partagé.
Hendaye • Juillet 2024
★
★
★
★
★
Un anniversaire de rêve ! Le vol prolongé nous a permis d'admirer toute la côte basque jusqu'en Espagne. Les petits fours et le champagne ont rendu ce moment encore plus précieux. Service impeccable de bout en bout.
Espelette • Mai 2024
document.addEventListener('DOMContentLoaded', function() {
const track = document.getElementById('carouselTrack');
const prevBtn = document.getElementById('prevBtn');
const nextBtn = document.getElementById('nextBtn');
const indicatorsContainer = document.getElementById('indicators');
let currentSlide = 0;
const totalSlides = 6;
// Créer les indicateurs
for (let i = 0; i goToSlide(i));
indicatorsContainer.appendChild(indicator);
}
function updateCarousel() {
const translateX = -currentSlide * (100 / totalSlides);
track.style.transform = `translateX(${translateX}%)`;
// Mettre à jour les indicateurs
document.querySelectorAll('.indicator').forEach((indicator, index) => {
indicator.classList.toggle('active', index === currentSlide);
});
// Mettre à jour les boutons
prevBtn.disabled = currentSlide === 0;
nextBtn.disabled = currentSlide === totalSlides - 1;
}
function goToSlide(slideIndex) {
currentSlide = slideIndex;
updateCarousel();
}
function nextSlide() {
if (currentSlide 0) {
currentSlide--;
updateCarousel();
}
}
nextBtn.addEventListener('click', nextSlide);
prevBtn.addEventListener('click', prevSlide);
// Auto-play (optionnel)
let autoPlayInterval = setInterval(function() {
if (currentSlide clearInterval(autoPlayInterval));
wrapper.addEventListener('mouseleave', () => {
autoPlayInterval = setInterval(function() {
if (currentSlide < totalSlides - 1) {
nextSlide();
} else {
currentSlide = 0;
updateCarousel();
}
}, 5000);
});
// Initialiser
updateCarousel();
});
