.elementor-kit-7{--e-global-color-primary:#6C4DFF;--e-global-color-secondary:#3B26E8;--e-global-color-text:#FFFFFF;--e-global-color-accent:#9B79FF;--e-global-color-1753a92:#9B79FF;--e-global-color-9cd368b:#0A0A1A;--e-global-color-dd27e8a:#121228;--e-global-color-50dd502:#1E1E36;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:56px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:24px;--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:500;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:600;background-color:transparent;background-image:linear-gradient(130deg, #0B0B14 0%, #1E1E2A 100%);}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Cartes tarifs : même hauteur + bouton collé en bas */
.pricing-card{
  display: flex;
  flex-direction: column;
  min-height: 560px;           /* ajuste si besoin 520–600 */
}

/* Espace vertical normal entre les widgets */
.pricing-card > .elementor-widget:not(:last-child){
  margin-bottom: 12px;
}

/* Le bouton (dernier widget) descend en bas */
.pricing-card > .elementor-widget-button{
  margin-top: auto;
}
/* Styles de base (FAQ) */
.faq .elementor-tab-title{
  background:#121228;
  border-bottom:1px solid #1E1E36;
  padding:18px 24px;
  transition: background-color .25s ease, box-shadow .25s ease, color .25s ease;
  color:#FFFFFF;
}
.faq .elementor-tab-content{
  background:#0E0E18;
  padding:16px 24px;
  color:#B0A8E6;
}

/* HOVER — Accordéon */
.faq .elementor-accordion .elementor-accordion-item:hover .elementor-tab-title{
  background:#151527;
  box-shadow:0 0 24px rgba(108,77,255,.15);
}

/* HOVER — Toggle (Bascules) */
.faq .elementor-toggle .elementor-toggle-item:hover .elementor-tab-title{
  background:#151527;
  box-shadow:0 0 24px rgba(108,77,255,.15);
}

/* État ouvert (optionnel, pour renforcer l'effet) */
.faq .elementor-tab-title.elementor-active{
  background:#151527;
  box-shadow:0 0 24px rgba(108,77,255,.18);
  border-color:#6C4DFF;
}
/* === STYLES WEELEVATE - FAQ ACCORDÉON === */
.faq .elementor-accordion-item {
  transition: all 0.25s ease;
  border: 1px solid #1E1E36;
  border-radius: 10px;
  margin-bottom: 10px;
  overflow: hidden;
}

.faq .elementor-tab-title {
  background: #121228;
  padding: 18px 24px;
  color: #FFFFFF;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.4;
  cursor: pointer;
  transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.faq .elementor-tab-title:hover {
  background-color: #151527;
  box-shadow: 0 0 24px rgba(108,77,255,0.15);
}

.faq .elementor-tab-title.elementor-active {
  background-color: #151527;
  border-color: #6C4DFF;
  box-shadow: 0 0 24px rgba(108,77,255,0.18);
}

.faq .elementor-tab-content {
  background: #0E0E18;
  padding: 16px 24px;
  color: #B0A8E6;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  border-top: 1px solid #1E1E36;
}
/* === WEELEVATE - STYLE HAMBURGER === */
.wee-hamburger .ep-navbar-toggler,
.wee-hamburger .ep-nav-toggle-button,
.wee-hamburger .ep-hamburger-icon {
  color: #ffffff !important;             /* Blanc par défaut */
  transition: all 0.25s ease;
  cursor: pointer;
}

/* Effet au survol (hover) ou ouverture du menu */
.wee-hamburger .ep-navbar-toggler:hover,
.wee-hamburger .ep-nav-toggle-button:hover,
.wee-hamburger .ep-hamburger-icon:hover,
.wee-hamburger .ep-nav-menu-container.active .ep-hamburger-icon {
  color: #6C4DFF !important;             /* Violet clair hover */
  transform: scale(1.1);
}

/* Facultatif : améliore la lisibilité sur fonds plus clairs */
.wee-hamburger .ep-hamburger-icon svg path {
  stroke-width: 2px;
}

/* Si tu utilises un sticky header */
.elementor-sticky--effects .wee-hamburger .ep-hamburger-icon {
  color: #ffffff !important;
}
/* === WEELEVATE - STYLE HAMBURGER MOBILE === */
.wee-hamburger .ep-navbar-toggler,
.wee-hamburger .ep-nav-toggle-button,
.wee-hamburger .ep-hamburger-icon {
  color: #ffffff !important;             /* Blanc par défaut */
  transition: all 0.25s ease;
  cursor: pointer;
}

/* Hover ou focus (desktop et mobile) */
.wee-hamburger .ep-navbar-toggler:hover,
.wee-hamburger .ep-nav-toggle-button:hover,
.wee-hamburger .ep-hamburger-icon:hover {
  color: #6C4DFF !important;             /* Violet clair au survol */
  transform: scale(1.1);
}

/* Quand le menu est ouvert (état actif sur mobile) */
.wee-hamburger .ep-nav-container.active .ep-hamburger-icon,
.wee-hamburger .ep-navbar-toggler[aria-expanded="true"],
.wee-hamburger .ep-nav-toggle-button[aria-expanded="true"] {
  color: #9B79FF !important;             /* Violet lavande */
  transform: rotate(90deg) scale(1.15);  /* Légère rotation fluide */
}

/* Transitions plus douces */
.wee-hamburger .ep-hamburger-icon svg {
  transition: transform 0.25s ease, color 0.25s ease;
}

/* Correction visuelle sticky header */
.elementor-sticky--effects .wee-hamburger .ep-hamburger-icon {
  color: #FFFFFF !important;
}

/* Optionnel : focus tactile (améliore UX mobile) */
.wee-hamburger .ep-hamburger-icon:active {
  opacity: 0.8;
}
/* Cartes témoignages égales */
.tcard{
  display:flex;
  flex-direction:column;
  min-height: 360px;           /* base commune */
  height: 100%;
}

/* La citation prend la place restante */
.tcard .tquote{
  flex:1 1 auto;
  margin-bottom: 12px;
}

/* Le bas de carte reste collé en bas */
.tcard .tfooter{
  margin-top:auto;
}

/* Option : aligner visuellement l’icône d’en-tête */
.tcard .ticon{ min-height: 36px; display:flex; align-items:center; }

/* Ligne-clamp : évite les pavés (3–4 lignes) */
.tquote{
  display:-webkit-box;
  -webkit-line-clamp: 4;       /* mets 3 si tu veux encore plus compact */
  -webkit-box-orient: vertical;
  overflow:hidden;
}

/* Breakpoint tablette portrait : 2 cartes par ligne, mêmes hauteurs */
@media (max-width: 1024px){
  .tcard{ min-height: 380px; } /* ajuste si besoin */
}

/* Mobile : une carte par ligne, un peu moins haute */
@media (max-width: 767px){
  .tcard{ min-height: 0; }     /* laisse respirer sur mobile */
}
/* === WEELEVATE - TOPBAR LUEUR BALAYANTE === */
.topbar-glow {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* Lueur animée */
.topbar-glow::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(108, 77, 255, 0) 0%,
    rgba(108, 77, 255, 0.25) 25%,
    rgba(155, 121, 255, 0.4) 50%,
    rgba(108, 77, 255, 0.25) 75%,
    rgba(108, 77, 255, 0) 100%
  );
  background-size: 200% 100%;
  filter: blur(12px);
  opacity: 0.75;
  animation: topbar-sweep 26s linear infinite;
  z-index: 0;
  pointer-events: none;
}

/* Animation fluide aller-retour */
@keyframes topbar-sweep {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Contenu de la barre au-dessus */
.topbar-glow > * {
  position: relative;
  z-index: 1;
}

/* Version mobile : plus douce et plus lente */
@media (max-width: 767px) {
  .topbar-glow::after {
    filter: blur(10px);
    opacity: 0.6;
    animation-duration: 8s;
  }
}

/* Respect des préférences d’accessibilité */
@media (prefers-reduced-motion: reduce) {
  .topbar-glow::after {
    animation: none;
  }
}
/* ================================
  /* ================================
   WEELEVATE — Tech Skin (Element Pack Image Compare)
   Ciblage précis du widget : .elementor-element-e030267
   ================================ */

.elementor-element-e030267 {
  --wee-violet: #7a2cff;
  --wee-cyan: #00c2cb;
  --wee-glow: 0 0 14px rgba(122,44,255,.8), 0 0 36px rgba(122,44,255,.35);
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 14px 42px rgba(0,0,0,.35);
}

/* grille techno optionnelle par-dessus l'image */
.elementor-element-e030267::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(circle at 100% 0, transparent 32%, rgba(122,44,255,.16) 33% 34%, transparent 35%) 0 0/120px 120px,
    linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px) 60px 0/120px 120px,
    linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px) 0 60px/120px 120px;
  mix-blend-mode: screen; opacity:.4;
}

/* ----- DIVIDER LINE (quelque soit le nom de classe) ----- */
.elementor-element-e030267 *[class*="divider"],
.elementor-element-e030267 *[class*="line"],
.elementor-element-e030267 *[class*="separator"]{
  width:2px !important;
  background: linear-gradient(to bottom, transparent 0 10%, rgba(255,255,255,.18) 10% 90%, transparent 90% 100%) !important;
}

/* ----- HANDLE / POIGNÉE (quelque soit la classe) ----- */
.elementor-element-e030267 *[class*="handle"]{
  width:64px !important; height:64px !important;
  border-radius:16px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.35), rgba(0,0,0,.6)),
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,0)) !important;
  border:1px solid rgba(255,255,255,.2) !important;
  box-shadow: var(--wee-glow), 0 6px 20px rgba(0,0,0,.45) inset !important;
  backdrop-filter: blur(6px) saturate(120%);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position: relative;
}

/* anneau néon */
.elementor-element-e030267 *[class*="handle"]::after{
  content:""; position:absolute; inset:10px; border-radius:12px;
  border:2px solid var(--wee-violet); box-shadow: var(--wee-glow);
}

/* pictogramme flèches stylisé (SVG en masque) */
.elementor-element-e030267 *[class*="handle"]::before{
  content:""; position:absolute; inset:0; border-radius:16px; opacity:.9;
  background: linear-gradient(180deg, var(--wee-violet), var(--wee-cyan));
  -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'>\
  <path fill='%23000' d='M8 32h20v-8l12 12-12 12v-8H8zM40 10a4 4 0 1 1 0 8 4 4 0 0 1 0-8zm0 36a4 4 0 1 1 0 8 4 4 0 0 1 0-8z'/>\
  </svg>") center/26px 26px no-repeat;
          mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'>\
  <path fill='%23000' d='M8 32h20v-8l12 12-12 12v-8H8zM40 10a4 4 0 1 1 0 8 4 4 0 0 1 0-8zm0 36a4 4 0 1 1 0 8 4 4 0 0 1 0-8z'/>\
  </svg>") center/26px 26px no-repeat;
}

/* feedback hover/drag */
.elementor-element-e030267 *[class*="handle"]:hover,
.elementor-element-e030267 *[class*="handle"]:active{
  transform: scale(1.06);
  box-shadow: 0 0 18px rgba(0,194,203,.55), var(--wee-glow);
  border-color: rgba(0,194,203,.6);
}

/* overlay discret avec ticks (si overlay présent) */
.elementor-element-e030267 *[class*="overlay"]{
  background: repeating-linear-gradient(to bottom, transparent 0 14px, rgba(255,255,255,.06) 14px 15px) !important;
  mix-blend-mode: overlay; opacity:.3 !important;
}

/* Mobile : réduire la poignée */
@media (max-width: 480px){
  .elementor-element-e030267 *[class*="handle"]{ width:54px !important; height:54px !important; }
}
/* ================================
   WEELEVATE — STYLES GLOBAUX "À PROPOS"
   Cohérence typo, espacements, cartes, CTA, responsive
   ================================ */

/* 1) Typographies de base */
:root{
  --wee-bg-1:#0B0B16;
  --wee-bg-2:#121228;
  --wee-txt:#FFFFFF;
  --wee-txt-muted:#B0A8E6;
  --wee-accent:#6C4DFF;
  --wee-accent-2:#9B79FF;
  --wee-hairline:rgba(255,255,255,.08);
}

body{
  color:var(--wee-txt);
  background: var(--wee-bg-1);
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Titres (appliquer aussi via styles Elementor si tu as des Global Fonts) */
h1,h2,h3,h4,h5{
  font-family: "Poppins", Inter, sans-serif;
  color: var(--wee-txt);
  line-height: 1.2;
  letter-spacing: .2px;
  margin: 0 0 .4em 0;
}

/* Paragraphes */
p, .elementor-widget-text-editor{
  color: var(--wee-txt-muted);
  line-height: 1.6;
}

/* 2) Conteneurs de section (espacements verticaux cohérents) */
.section-tight   { padding: 60px 0; }
.section-normal  { padding: 90px 0; }
.section-roomy   { padding: 120px 0; }

/* 3) Hero "À propos" (fond doux et halo léger) */
.about-hero{
  background: linear-gradient(130deg,#0B0B16 0%, #151529 100%);
  position: relative;
  overflow: hidden;
}
.about-hero::after{
  content:"";
  position:absolute; inset:-20% -10%;
  background:
    radial-gradient(360px 360px at 78% 40%, rgba(108,77,255,.35), transparent 60%),
    radial-gradient(260px 260px at 20% 72%, rgba(155,121,255,.18), transparent 60%);
  filter: blur(18px);
  pointer-events:none;
  z-index:0;
}
.about-hero > *{ position:relative; z-index:1; }

/* 4) Cartes (valeurs, témoignages, etc.) */
.wee-card{
  background: rgba(255,255,255,.03);
  border: 1px solid var(--wee-hairline);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(0,0,0,.25);
  padding: 32px;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.wee-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 14px 40px rgba(108,77,255,.18);
  border-color: var(--wee-accent);
}

/* Icônes des cartes (valeurs) */
.wee-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:12px;
  background: rgba(108,77,255,.12);
  color: var(--wee-accent-2);
  margin-bottom: 12px;
}

/* 5) Images "À propos" (portrait/visuel) */
.wee-img-rounded{
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}

/* 6) Boutons (CTA) */
.btn-cta{
  background: linear-gradient(130deg, var(--wee-accent) 0%, #8C66FF 100%);
  color:#fff !important;
  border-radius: 12px;
  padding: 12px 22px;
  font: 600 16px/1 "Poppins",sans-serif;
  box-shadow: 0 10px 26px rgba(108,77,255,.25);
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.btn-cta:hover{
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 12px 30px rgba(155,121,255,.35);
}

/* 7) Blocs texte "philosophie" (meilleure lisibilité) */
.about-philo h2{ margin-bottom: 10px; }
.about-philo .elementor-widget-text-editor{ max-width: 560px; }

/* 8) Ligne du temps / Histoire (si tu fais une timeline simple) */
.timeline{
  border-left: 2px solid var(--wee-hairline);
  padding-left: 18px;
}
.timeline .item{
  margin: 14px 0;
  position: relative;
}
.timeline .item::before{
  content:""; position:absolute; left:-10px; top:6px;
  width:10px; height:10px; border-radius:50%;
  background: var(--wee-accent);
  box-shadow: 0 0 0 4px rgba(108,77,255,.18);
}

/* 9) FAQ locale (si tu réutilises un accordéon sur À propos) */
.about-faq .elementor-accordion-item{
  border:1px solid var(--wee-hairline); border-radius:10px; overflow:hidden; margin-bottom:10px;
}
.about-faq .elementor-tab-title{
  background:#121228; padding:18px 24px; color:#fff; font:600 18px/1.4 "Poppins",sans-serif;
}
.about-faq .elementor-tab-content{
  background:#0E0E18; padding:16px 24px; color:var(--wee-txt-muted);
}

/* 10) Responsive fin (tablette/mobile) */
@media (max-width: 1024px){
  .section-normal{ padding: 80px 0; }
  .about-hero{ padding-top: 100px; padding-bottom: 80px; }
}
@media (max-width: 767px){
  .section-normal{ padding: 70px 0; }
  h1{ font-size: 34px; }
  h2{ font-size: 28px; }
  .wee-card{ padding: 24px; }
}

/* 11) Accessibilité — respect “reduce motion” */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
/* Coupe les effets du Hero pendant que le menu est ouvert */
body.menu-open .hero *,
body.menu-open .about-hero *{
  transform: none !important;
  animation: none !important;
}
body.menu-open .hero::before,
body.menu-open .hero::after,
body.menu-open .about-hero::before,
body.menu-open .about-hero::after{
  display: none !important;
  pointer-events: none !important;
}

/* Menu au-dessus et cliquable */
.elementor-location-header { position: relative; z-index: 9999; }
.elementor-nav-menu--dropdown{
  position: fixed !important; inset: 0 !important; z-index: 100000 !important;
  background:#121228; border-top:1px solid rgba(255,255,255,.08);
}
/* Quand le hamburger est OUVERT, on coupe les effets du Hero */
body:has(.elementor-menu-toggle.elementor-active) .hero *,
body:has(.elementor-menu-toggle.elementor-active) .about-hero *{
  transform: none !important;
  animation: none !important;
}

/* Si ton Hero utilise des halos en pseudo-éléments */
body:has(.elementor-menu-toggle.elementor-active) .hero::before,
body:has(.elementor-menu-toggle.elementor-active) .hero::after,
body:has(.elementor-menu-toggle.elementor-active) .about-hero::before,
body:has(.elementor-menu-toggle.elementor-active) .about-hero::after{
  display: none !important;
  pointer-events: none !important;
}

/* Par sécurité, on s'assure que le dropdown passe AU-DESSUS */
.elementor-location-header { position: relative; z-index: 9999; }
.elementor-nav-menu--dropdown{
  position: fixed !important; inset: 0 !important; z-index: 100000 !important;
  background: #121228; border-top: 1px solid rgba(255,255,255,.08);
}
/* ——— Disposition responsive uniforme ——— */
.tcard{
  display:flex; flex-direction:column;
  min-height: 100%;
}

/* Largeurs par breakpoint (au cas où Elementor force autre chose) */
@media (min-width:1025px){  /* Desktop */
  .tcard{ flex: 0 0 calc(33.333% - 16px); }
}
@media (max-width:1024px){  /* Tablette portrait */
  .tcard{ flex: 0 0 calc(50% - 12px); }
}
@media (max-width:767px){   /* Mobile */
  .tcard{ flex: 0 0 100%; }
}

/* Image uniforme (même ratio, pas d'étirement) */
.tcard img{
  width:100%;
  aspect-ratio: 4 / 5;     /* 4:5 conseillé pour portraits */
  object-fit: cover;
  border-radius: 16px;
}

/* Corps de la carte : pousse le bas vers le bas pour aligner les CTA */
.tcard .tcard-body{
  display:flex; flex-direction:column; gap: 10px;
  flex: 1;              /* prend toute la hauteur dispo */
}

/* Footer/CTA toujours aligné en bas */
.tcard .tcard-footer{ margin-top:auto; }

/* Si un bloc de citation/titre déséquilibre, fixe une hauteur mini */
.tcard .tcard-quote{ min-height: 56px; }  /* ajuste 48–72px selon la longueur */
/* Bannière */
.contact-hero{ text-align:center; border-bottom:1px solid rgba(255,255,255,.06); }

/* Cartes coordonnées */
.contact-info{ max-width:1100px; width:100%; margin:0 auto; }
.contact-card{
  flex:1 1 320px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  padding:24px;
  text-align:center;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.contact-card:hover{
  transform: translateY(-3px);
  border-color:#6C4DFF;
  box-shadow:0 12px 32px rgba(108,77,255,.20);
}
.contact-card h3{ font:600 16px/1.2 "Poppins",sans-serif; color:#fff; margin:8px 0; }
.contact-card p{ color:#EDECF8; font:500 15px/1.6 "Inter",sans-serif; margin:0; }

/* Form */
form input, form textarea{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  color:#fff; border-radius:10px; padding:12px 16px;
}
form input:focus, form textarea:focus{ border-color:#6C4DFF; outline:none; }

/* Bouton réutilisable */
.btn-cta{
  background: linear-gradient(130deg,#6C4DFF 0%, #8C66FF 100%);
  color:#fff !important; border-radius:12px; padding:12px 22px;
  font:600 16px/1 "Poppins",sans-serif;
  box-shadow:0 10px 26px rgba(108,77,255,.25);
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.btn-cta:hover{ transform:translateY(-2px); filter:brightness(1.06); }

/* Responsive */
@media (max-width:1024px){ .contact-card{ flex:1 1 calc(50% - 12px); } }
@media (max-width:767px){ .contact-card{ flex:1 1 100%; } }/* End custom CSS */