/* ===== CSS COMMUN OPTIMISÉ POUR PAGES PRINCIPALES ===== */

/* === POLICES === */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&family=Space+Grotesk:wght@400;500;700&display=swap');

/* === VARIABLES CSS === */
:root {
  --primary-color: #2e0a52;
  --secondary-color: #4e0bbd;
  --accent-color: #6b46c1;
  --background-color: #f0f9f9;
  --section-bg: #e6f4f5;
  --white: #ffffff;
  --gray-light: #f8f9fa;
  --gray-medium: #6c757d;
  --gray-dark: #495057;
}

/* === STYLES DE BASE === */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Poppins', sans-serif;
  background-color: var(--background-color);
  color: var(--primary-color);
  line-height: 1.6;
  overflow-x: hidden; /* Empêche le scroll horizontal */
}

h1, h2, h3, .font-grotesk {
  font-family: 'Space Grotesk', sans-serif;
}

/* === POLICES PERSONNALISÉES === */
.font-poppins {
  font-family: 'Poppins', sans-serif;
}

.font-grotesk {
  font-family: 'Space Grotesk', sans-serif;
}

/* === ANIMATIONS COMMUNES === */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

.fade-up-only {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease-out;
}

.fade-up-only.visible {
  opacity: 1;
  transform: translateY(0);
}

.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease-out;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes float {
  0%, 100% { 
    transform: translateY(0); 
  }
  50% { 
    transform: translateY(-15px); 
  }
}

.floating {
  animation: float 3s ease-in-out infinite;
}

/* === ANIMATIONS SPÉCIFIQUES === */
.slide-in-left {
  opacity: 0;
  transform: translateX(-100px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.slide-in-right {
  opacity: 0;
  transform: translateX(100px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.slide-in-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.slide-in-right.visible {
  opacity: 1;
  transform: translateX(0);
}

/* === ANIMATIONS SLIDE OPTIMISÉES === */
.slide-in-left {
  opacity: 0;
  transform: translateX(-80px);
  transition: all 1.5s ease-out;
}

.slide-in-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.slide-in-right {
  opacity: 0;
  transform: translateX(80px);
  transition: all 1.5s ease-out;
}

.slide-in-right.visible {
  opacity: 1;
  transform: translateX(0);
}

/* === ANIMATIONS FADE OPTIMISÉES === */
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.2s ease-out, transform 1.2s ease-out;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* === STYLES DES CARTES AVEC ANIMATIONS === */
.fade-in {
  min-height: 200px;
  transition: all 0.3s ease;
}

.fade-in:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(78, 11, 189, 0.1);
}

/* === CARROUSEL RESPONSIVE === */
#carouselContainer {
  scroll-behavior: smooth;
}

/* Masquer les contrôles sur mobile si nécessaire */
@media (max-width: 640px) {
  #carouselPrev, #carouselNext {
    display: none;
  }
}

/* Améliorer l'accessibilité des indicateurs */
.carousel-indicator {
  cursor: pointer;
  border: none;
  outline: none;
}

.carousel-indicator:hover {
  transform: scale(1.2);
}

/* Assurer que le contenu ne déborde pas */
.overflow-hidden {
  overflow: hidden !important;
}

/* Animation douce pour les transitions */
.transition-transform {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* === STYLES SPÉCIFIQUES POUR LE BLOG === */
/* Réduire la hauteur des sections du blog */
.blog-section {
  padding-top: 3rem !important;    /* 48px au lieu de 80px */
  padding-bottom: 3rem !important; /* 48px au lieu de 80px */
}

.blog-section-large {
  padding-top: 4rem !important;    /* 64px au lieu de 128px */
  padding-bottom: 4rem !important; /* 64px au lieu de 80px */
}

.blog-section-xl {
  padding-top: 5rem !important;    /* 80px au lieu de 160px */
  padding-bottom: 5rem !important; /* 80px au lieu de 160px */
}

/* Réduire la hauteur des sections sur mobile */
@media (max-width: 640px) {
  .blog-section {
    padding-top: 2rem !important;    /* 32px */
    padding-bottom: 2rem !important; /* 32px */
  }
  
  .blog-section-large {
    padding-top: 2.5rem !important;  /* 40px */
    padding-bottom: 2.5rem !important; /* 40px */
  }
  
  .blog-section-xl {
    padding-top: 3rem !important;    /* 48px */
    padding-bottom: 3rem !important; /* 48px */
  }
}

/* Réduire la hauteur des sections sur tablette */
@media (min-width: 641px) and (max-width: 1024px) {
  .blog-section {
    padding-top: 2.5rem !important;  /* 40px */
    padding-bottom: 2.5rem !important; /* 40px */
  }
  
  .blog-section-large {
    padding-top: 3rem !important;    /* 48px */
    padding-bottom: 3rem !important; /* 48px */
  }
  
  .blog-section-xl {
    padding-top: 4rem !important;    /* 64px */
    padding-bottom: 4rem !important; /* 64px */
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeUpOnly {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-up-only {
  animation: fadeUpOnly 0.8s ease-out both;
}

/* === SECTIONS === */
section {
  padding: 2rem 0;
}

/* === BOUTONS === */
.btn-primary {
  background-color: var(--secondary-color);
  color: var(--white);
  padding: 0.75rem 1.5rem;
  border-radius: 9999px;
  font-weight: 600;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.btn-primary:hover {
  background-color: #350a89;
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(78, 11, 189, 0.3);
}

/* === FORMULAIRES === */
input, textarea {
  border: 1px solid #d1d5db;
  border-radius: 9999px;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  transition: all 0.3s ease;
  font-family: inherit;
}

input:focus, textarea:focus {
  outline: none;
  border-color: var(--secondary-color);
  box-shadow: 0 0 0 3px rgba(78, 11, 189, 0.1);
}

textarea {
  border-radius: 1rem;
  resize: vertical;
}

/* === CARTES === */
.card {
  background: var(--white);
  border-radius: 1rem;
  padding: 1.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15);
}

/* === POPUP OVERLAY === */
.popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  z-index: 1000;
  overflow-y: auto;
}

.popup-overlay.active {
  display: flex;
  align-items: center;
  justify-content: center;
}

.popup-content {
  background: white;
  border-radius: 16px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
  max-width: 90vw;
  max-height: 90vh;
  overflow-y: auto;
  transform: translateY(30px);
  opacity: 0;
  transition: all 0.4s ease;
}

.popup-overlay.active .popup-content {
  transform: translateY(0);
  opacity: 1;
}

.popup-content img {
  width: 7rem;
  height: 7rem;
  border-radius: 9999px;
  object-fit: cover;
  margin: 0 auto 1.5rem auto;
  border: 4px solid #4e0bbd;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.popup-content h2 {
  color: var(--primary-color);
  margin-bottom: 1rem;
}

/* === POPUP DES LIVRES === */
#popupBooks img {
  border: 1px solid #e5e7eb;
  background-color: #f9fafb;
  padding: 8px;
  border-radius: 0; /* coins carrés */
  width: 100%;
  height: 256px; /* ou auto si tu veux la hauteur naturelle */
  object-fit: cover;
  margin: 0 auto;
}

/* Responsive pour les popups */
@media (max-width: 768px) {
  .popup-content {
    margin: 20px;
    padding: 20px;
  }
}

/* === SNAP SCROLLING DÉSACTIVÉ === */
.snap-x, .snap-start {
  scroll-snap-type: none;
  scroll-snap-align: none;
}

.popup-content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
  color: #2d006e;
  margin-bottom: 1rem;
}

.popup-content h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #4e0bbd;
  margin-bottom: 0.5rem;
  text-align: center;
}

.popup-content p {
  font-size: 1rem;
  color: #333;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 1.5rem;
}

.popup-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: none;
  border: none;
  font-size: 1.5rem;
  color: #2e0a52;
  cursor: pointer;
}

/* === CARROUSEL === */
#carouselContainer {
  scroll-behavior: smooth;
}

.carousel-indicator {
  cursor: pointer;
  border: none;
  outline: none;
}

.carousel-indicator:hover {
  transform: scale(1.2);
}

.overflow-hidden {
  overflow: hidden !important;
}

.transition-transform {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  
  section {
    padding: 1rem 0;
  }
  
  #carouselPrev, #carouselNext {
    display: none;
  }
}

@media (max-width: 640px) {
  .sm\:flex-1 { flex: 1 1 0%; }
  .sm\:flex-row { flex-direction: row; }
  .sm\:gap-0 { gap: 0px; }
}

@media (min-width: 768px) {
  .md\:w-1\/2 { width: 50%; }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:flex-row { flex-direction: row; }
  .md\:justify-end { justify-content: flex-end; }
  .md\:px-16 { padding-left: 4rem; padding-right: 4rem; }
  .md\:px-20 { padding-left: 5rem; padding-right: 5rem; }
  .md\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
  .md\:text-5xl { font-size: 3rem; line-height: 1; }
  .md\:text-lg { font-size: 1.125rem; line-height: 1.75rem; }
}

/* === UTILITAIRES === */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-10 { margin-bottom: 2.5rem; }

.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-20 { margin-top: 5rem; }

.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-20 { padding-left: 5rem; padding-right: 5rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }

/* === SUPPORT RTL === */
[dir="rtl"] {
  text-align: right;
}

[dir="rtl"] .text-left {
  text-align: right;
}

[dir="rtl"] .text-right {
  text-align: left;
}

/* === STYLES SPÉCIFIQUES POUR BLOG.HTML === */
.bg-\[\#e6f4f5\] {
  background-color: #e6f4f5;
}

#luxradioCard {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.6s ease-out;
}

#luxradioCard.visible {
  opacity: 1;
  transform: translateY(0);
}

#articleSlider {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#articleSlider::-webkit-scrollbar {
  display: none;
}

#slider_left, #slider_right {
  transition: all 0.3s ease;
}

#slider_left:hover, #slider_right:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#articleSlider .fade-in {
  transition: all 0.3s ease;
}

/* === HOVER EFFECTS === */
.hover\:bg-\[\#350a89\]:hover {
  background-color: rgb(53 10 137);
}

.hover\:text-\[\#cfc3ff\]:hover {
  color: rgb(207 195 255);
}

/* === FOCUS STATES === */
.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-\[\#4e0bbd\]:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(78 11 189);
}

/* === Z-INDEX UTILITIES === */
.z-0 { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-50 { z-index: 50; }
.z-1000 { z-index: 1000; }
.z-9999 { z-index: 9999; }

/* === ACADEMY HERO CARDS (unifié) === */
.academy-cards {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .academy-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .academy-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.academy-card {
  position: relative;
  height: 260px;
  border-radius: 1.5rem; /* ~rounded-3xl */
  overflow: hidden;
  background: #fff;
  box-shadow: 0 10px 25px rgba(12, 18, 38, 0.08);
  transition: transform .3s ease, box-shadow .3s ease;
}

@media (min-width: 768px) {
  .academy-card { height: 300px; }
}

.academy-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(12, 18, 38, 0.15);
}

.academy-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.academy-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,.2), rgba(0,0,0,0));
}

.academy-card__content {
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  color: #fff;
}

.academy-card__badge {
  display: inline-flex;
  align-items: center;
  padding: .25rem .75rem;
  font-size: .75rem;
  border-radius: 9999px;
  background: rgba(255,255,255,.2);
  backdrop-filter: blur(6px);
  margin-bottom: .5rem;
}

.academy-card__title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
}

.academy-card__subtitle {
  margin-top: .25rem;
  color: rgba(255,255,255,.85);
  font-size: .9rem;
}

/* === Hero input and Go button align (style léger) === */
.hero-search {
  display: flex;
  align-items: stretch;
  background: #fff;
  border-radius: 0.75rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  overflow: hidden;
}
.hero-search__text { color: #6b7280; padding: 1rem 1.25rem; }
.hero-search__go {
  background: #16a34a;
  color: #fff;
  padding: 0 1.25rem;
  font-weight: 600;
}
.hero-search__go:hover { background: #15803d; }

/* === Variantes pour cartes Academy === */
.col-span-2-md { grid-column: auto; }
@media (min-width: 768px) { .col-span-2-md { grid-column: span 2 / span 2; } }

.academy-card--tall { height: 360px; }
@media (min-width: 768px) { .academy-card--tall { height: 440px; } }

.academy-card--slim { height: 420px; }
@media (min-width: 768px) { .academy-card--slim { height: 460px; } }

/* Option: étiquette verticale (pour look "mince") */
.academy-card__label-vertical {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: left center;
  color: #111827;
  background: rgba(255,255,255,.85);
  padding: .35rem .6rem;
  border-radius: .5rem;
  font-weight: 600;
  font-size: .9rem;
}

/* === ACCORDÉON D’IMAGES (cartes minces -> large au clic) === */
.acc-cards {
  display: flex;
  width: 100%;
  gap: 15px;
}

.acc-card {
  flex: 1;
  height: 750px; /* ⬅️ augmenté (au lieu de 400px) */
  border-radius: 15px;
  background-size: cover;
  background-position: center;
  cursor: pointer;
  transition: flex 0.6s ease, filter 0.4s ease, box-shadow 0.3s ease;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(12,18,38,0.08);
}

.acc-card:hover { box-shadow: 0 16px 40px rgba(12,18,38,0.15); }

.acc-card.active {
  flex: 5;
  filter: brightness(1.05);
}

.acc-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.2), rgba(0,0,0,0));
}

.acc-card .acc-content {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  color: #fff;
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;
}

.acc-card.active .acc-content { opacity: 1; }

.acc-content .acc-title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 22px;
  font-weight: 700;
}

.acc-content .acc-sub {
  margin-top: 4px;
  opacity: .9;
}

.acc-content .acc-actions { margin-top: 10px; display: flex; gap: 8px; }

/* Bouton discret pour découvrir */
.btn-ghost {
  background: rgba(255,255,255,.2);
  color: #fff;
  border: 1px solid rgba(255,255,255,.35);
  padding: 0.45rem 0.9rem;
  border-radius: 9999px;
  font-weight: 600;
}

.btn-ghost:hover { background: rgba(255,255,255,.3); }

/* Responsive spacing */
@media (max-width: 768px) {
  .acc-card { 
    height: 400px; /* ⬅️ augmenté aussi pour mobile (au lieu de 320px) */
  }
}

/* S'assure que la 1ʳᵉ carte accepte l'absolu */
.acc-card { position: relative; }

/* Ajuste la largeur/ombre du bloc */
.hero-search {
  display: flex;
  align-items: stretch;
  background: #fff;
  border-radius: 0.75rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.14);
  overflow: hidden;
  min-width: 200px;       /* largeur mini */
  max-width: 240px;       /* optionnel */
}

.hero-search__text { color: #6b7280; padding: 1rem 1.25rem; white-space: nowrap; }
.hero-search__go   { background: #16a34a; color: #fff; padding: 0 1.25rem; font-weight: 600; }
.hero-search__go:hover { background: #15803d; }

@media (min-width: 1024px) {
  .acc-card:first-child .hero-search {
    position: absolute;
    left: -2rem;      /* tire un peu vers la gauche pour “mordre” le bord de la carte */
    bottom: 1.5rem;   /* hauteur depuis le bas de la carte */
    z-index: 2;
  }
}

/* === SECTION VIDEO ACADEMY (affinée) === */
.video-academy {
  background: linear-gradient(180deg, #f5f1fb 0%, #f0f9f9 100%);
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}
.video-academy .va-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width: 1024px){ .video-academy .va-grid{ grid-template-columns: 4.5fr 7.5fr; align-items:center; } }

/* Titre proche de la maquette */
.va-title { font-family:'Space Grotesk',sans-serif; font-size: 2.4rem; line-height:1.15; font-weight:800; color:#111827; letter-spacing:.2px; }
@media (min-width:768px){ .va-title{ font-size:2.9rem; } }

/* Colonne de puces avec ligne pointillée à gauche */
.va-bullets { position:relative; margin-top:1.25rem; display:grid; gap:1.1rem; padding-left: 1.25rem; }
.va-bullets::before{ content:""; position:absolute; left:.25rem; top:.4rem; bottom:.4rem; width:2px; background: repeating-linear-gradient( to bottom, rgba(0,0,0,.08) 0 6px, transparent 6px 12px ); border-radius:2px; }
.va-bullet{ display:grid; grid-template-columns:44px 1fr; gap:.8rem; align-items:start; }
.va-bullet .va-ico{ width:44px; height:44px; border-radius:9999px; background:#fff; box-shadow:0 6px 16px rgba(0,0,0,.08); display:flex; align-items:center; justify-content:center; color:#6b7280; font-size:18px; }
.va-bullet h4{ margin:0; font-weight:800; color:#111827; }
.va-bullet p{ margin:.3rem 0 0; color:#6b7280; font-size:.95rem; }

/* Carte vidéo */
.va-video-card{ position:relative; border-radius:24px; overflow:hidden; box-shadow:0 24px 50px rgba(12,18,38,.14); }
.va-video{ width:100%; height:auto; display:block; background:#000; }

/* Bandeau vert stats centré et large */
.va-stats{ position:absolute; top:0; left:50%; transform:translate(-50%, -50%); width:min(86%,920px); background:#79b66c; color:#0f172a; border-radius:12px; padding:16px 26px; display:flex; align-items:center; justify-content:center; gap:42px; box-shadow:0 14px 28px rgba(0,0,0,.14); }
.va-stat{ display:flex; align-items:baseline; gap:12px; font-weight:800; }
.va-stat .num{ font-size:30px; letter-spacing:.5px; }
.va-stat .label{ font-size:11px; font-weight:900; text-transform:uppercase; opacity:.95; line-height:1.1; }
.va-stats .sep{ width:1px; height:28px; background:rgba(15,23,42,.35); }

@media (max-width:768px){
  .va-stats{ top:0; transform:translate(-50%, -50%); width:92%; gap:18px; padding:10px 14px; }
  .va-stat .num{ font-size:22px; }
  .va-stats .sep{ height:20px; }
}

/* Nouveau wrapper : référence de positionnement */
.va-video-wrap { position: relative; }

/* (optionnel) comportement mobile : garder le bandeau à l’intérieur */
@media (max-width: 768px){
  .va-stats{
    top: 12px;
    transform: translate(-50%, 0);
    width: calc(100% - 24px);
    padding: 12px 16px;
    gap: 20px;
  }
}

/* Carte de recherche formation – responsive et propre */
.hero-search {
  display: flex;
  align-items: left;
  height: 80px;           /* augmenté */
  padding: 0;
  background: #fff;
  border-radius: 0px;
  box-shadow: 0 6px 18px rgba(0,0,0,.14);
  overflow: hidden;
  width: 100%;
  min-width: 260px;
  max-width: 400px;
}

.hero-search__text {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  color: #6b7280;
  padding: 0 1rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* THEME UPDATE: remplace le vert par le violet du site */

/* Bouton Go en violet thème */
.hero-search__go {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 1.1rem;
  background: #4e0bbd;              /* violet principal */
  color: #fff;
  font-weight: 600;
  border-left: 1px solid rgba(0,0,0,.06);
}
.hero-search__go:hover { background: #350a89; }

@media (max-width: 640px) {
  .hero-search { height: 52px; max-width: 100%; } /* augmenté pour mobile */
  .hero-search__text { padding: 0 .85rem; font-size: .95rem; }
  .hero-search__go { padding: 0 .9rem; }
}

/* Bandeau stats – dégradé violet et texte clair */
.va-stats{
  background: linear-gradient(90deg, #4e0bbd 0%, #6b46c1 100%) !important;
  color: #ffffff !important;
}
.va-stats .sep{ background: rgba(255,255,255,.35); }
.va-stat .label{ color: #f0eaff; }

/* === TESTIMONIALS (dans la section vidéo) === */
.va-testimonials { margin-top: 3rem; }
.va-testimonials h3 { font-family:'Space Grotesk',sans-serif; font-size: 2rem; font-weight: 800; color:#111827; text-align:center; }
.va-testimonials .va-cards { margin-top: 1.5rem; display:grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px){ .va-testimonials .va-cards{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1.25rem; } }
@media (min-width: 1024px){ .va-testimonials .va-cards{ grid-template-columns: repeat(4, minmax(0,1fr)); } }

.va-tcard { background:#fff; border-radius: 16px; padding: 18px; box-shadow: 0 18px 35px rgba(0,0,0,.08); border:1px solid #eef0f4; }
.va-ttext { color:#374151; font-size:.98rem; line-height:1.45; min-height: 96px; }
.va-tmeta { display:flex; align-items:center; gap:12px; margin-top: 18px; }
.va-tmeta img { width: 40px; height:40px; border-radius:9999px; object-fit:cover; }
.va-tmeta .name { font-weight:700; color:#111827; font-size:.95rem; }
.va-tmeta .role { font-size:.85rem; color:#57b36b; font-weight:700; }

.va-tnav { display:flex; justify-content:center; align-items:center; gap:28px; margin-top: 16px; }
.va-tnav button{ width:36px; height:36px; border-radius:9999px; background:#fff; border:1px solid #e5e7eb; box-shadow:0 8px 18px rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; color:#6b7280; }
.va-tnav button:hover{ color:#2e0a52; border-color:#d1d5db; }

/* === CARROUSEL HORIZONTAL POUR LES PROFILS === */
.va-cards.slider { display:flex; gap:16px; overflow-x:auto; scroll-snap-type: x mandatory; padding: 6px 4px 10px; }
.va-cards.slider::-webkit-scrollbar { height: 0; }
.va-tcard { scroll-snap-align: start; min-width: 260px; }
@media (min-width: 640px){ .va-tcard{ min-width: 300px; } }
@media (min-width: 1024px){ .va-tcard{ min-width: 320px; } }

/* Positionner les flèches sous le slider */
.va-tnav { display:flex; justify-content:center; align-items:center; gap:28px; margin-top: 14px; }
.va-tnav button{ width:36px; height:36px; border-radius:9999px; background:#fff; border:1px solid #e5e7eb; box-shadow:0 8px 18px rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; color:#6b7280; cursor:pointer; }
.va-tnav button:hover{ color:#2e0a52; border-color:#d1d5db; }

/* === THEMES PAR CARTE FORMATION === */
/* Workshop dirigeants: violet profond */
.academy-card--workshop .academy-card__overlay{ background: linear-gradient(to top, rgba(78,11,189,.55), rgba(78,11,189,.15), rgba(0,0,0,0)); }
.academy-card--workshop .academy-card__badge{ background: rgba(78,11,189,.25); }
.academy-card--workshop:hover{ box-shadow: 0 18px 40px rgba(78,11,189,.25); }

/* Développeurs: gradient violet → rose (comme page dev) */
.academy-card--dev .academy-card__overlay{ background: linear-gradient(to top, rgba(109,40,217,.55), rgba(236,72,153,.2), rgba(0,0,0,0)); }
.academy-card--dev .academy-card__badge{ background: linear-gradient(90deg, rgba(109,40,217,.35), rgba(236,72,153,.35)); }
.academy-card--dev:hover{ box-shadow: 0 18px 40px rgba(142,63,212,.28); }

/* Managers: bleu/cyan (au lieu de vert) */
.academy-card--managers .academy-card__overlay{ background: linear-gradient(to top, rgba(37,99,235,.55), rgba(6,182,212,.18), rgba(0,0,0,0)); }
.academy-card--managers .academy-card__badge{ background: linear-gradient(90deg, rgba(37,99,235,.28), rgba(6,182,212,.28)); }
.academy-card--managers:hover{ box-shadow: 0 18px 40px rgba(37,99,235,.25); }

/* === THEMES CARTES CATALOGUE FORMATIONS === */
.catalog-card__overlay{ position:absolute; inset:0; background: linear-gradient(to top, rgba(0,0,0,.5), rgba(0,0,0,0)); }
.catalog-btn{ display:inline-flex; align-items:center; padding: .5rem 1rem; border-radius: 9999px; font-weight:600; color:#fff; }

/* Workshop dirigeants (violet profond) */
.catalog-card--workshop .catalog-card__overlay{ background: linear-gradient(to top, rgba(78,11,189,.55), rgba(78,11,189,.15), rgba(0,0,0,0)); }
.catalog-card--workshop .catalog-btn{ background:#2e0a52; }
.catalog-card--workshop .catalog-btn:hover{ background:#4e0bbd; }

/* Développeurs (violet → rose) */
.catalog-card--dev .catalog-card__overlay{ background: linear-gradient(to top, rgba(109,40,217,.55), rgba(236,72,153,.2), rgba(0,0,0,0)); }
.catalog-card--dev .catalog-btn{ background:#6d28d9; }
.catalog-card--dev .catalog-btn:hover{ background:#7e3af2; }

/* Managers (vert) */
.catalog-card--managers .catalog-card__overlay{ background: linear-gradient(to top, rgba(37,99,235,.55), rgba(6,182,212,.18), rgba(0,0,0,0)); }
.catalog-card--managers .catalog-btn{ background:#2563eb; }
.catalog-card--managers .catalog-btn:hover{ background:#1d4ed8; }

/* === HERO SECTION GRADIENT (section 1) === */
.hero-gradient{
  background:
    linear-gradient(180deg, #f0f9f9 0%, #eff6ff 100%),
    radial-gradient(600px 300px at 15% 10%, rgba(78,11,189,0.05) 0%, rgba(78,11,189,0) 60%),
    radial-gradient(700px 320px at 85% 0%, rgba(99,102,241,0.06) 0%, rgba(99,102,241,0) 60%);
}

/* Ajustements images des cartes formation */
.academy-card img { width:100%; height:100%; object-fit: cover; object-position: center; }
.academy-card--slim img { object-position: center top; }

/* Cartes du catalogue */
.catalog-card--workshop img,
.catalog-card--dev img,
.catalog-card--managers img { width:100%; height:100%; object-fit: cover; object-position: center; }

/* Laisse dépasser le bloc hors de la 1ʳᵉ carte */
.acc-card:first-child { overflow: visible; }

/* S'assure que l'overlay sombre reste sous le champ */
.acc-card::after { z-index: 1; }
.acc-card .acc-content { z-index: 2; }

/* Position/tailles du champ superposé (desktop) */
@media (min-width: 1024px) {
  .acc-card:first-child .hero-search{
    position: absolute;
    left: -2rem;      /* valeur précédente */
    bottom: 1.5rem;   /* valeur précédente */
    z-index: 2;
    min-width: 200px; /* valeurs précédentes */
    max-width: 240px;
    height: 48px;
  }
}