.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), hanken grotesk;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), hanken grotesk;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-53588 .elementor-element.elementor-element-7c22e49{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), hanken grotesk;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), hanken grotesk;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}@media(max-width:1024px){.elementor-widget-container .eael-protected-content-message{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-container .protected-content-error-msg{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-html .eael-protected-content-message{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-html .protected-content-error-msg{font-size:var( --e-global-typography-secondary-font-size );}}@media(max-width:767px){.elementor-widget-container .eael-protected-content-message{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-container .protected-content-error-msg{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-html .eael-protected-content-message{font-size:var( --e-global-typography-secondary-font-size );}.elementor-widget-html .protected-content-error-msg{font-size:var( --e-global-typography-secondary-font-size );}}/* Start custom CSS for html, class: .elementor-element-7ca80ba *//* ==========================================================================
   KIPFUL — CORRECTION CONTRASTE (clean, cohérent, sans effets de bord)
   Objectif :
   - Cards dark : texte clair
   - Cards light (hero + CTA) : texte foncé
   - Titres de sections (h2) visibles
   - Badge hero lisible (sans !important)
   ========================================================================== */

/* ---------- 1) TOKENS TEXTE (réutilisables) ---------- */
:root{
  --text-on-dark: rgba(240,240,240,.92);
  --muted-on-dark: rgba(240,240,240,.78);
  --title-on-dark: rgba(240,240,240,.96);

  --text-on-light: #2C3440;
  --muted-on-light: rgba(44,52,64,.82);

  --border-on-dark: rgba(240,240,240,.14);
  --card-on-dark: rgba(240,240,240,.07);
}

/* ---------- 2) CARDS / SECTIONS DARK (par défaut) ---------- */
.section,
.card:not(.light),
.feature,
.band,
.sources{
  color: var(--text-on-dark);
}

/* Texte et listes dans les zones dark */
.feature p,
.feature li,
.band p,
.muted,
.sub{
  color: var(--muted-on-dark);
}

/* Titres dans zones dark */
.feature h3,
.band h3,
.sources h3{
  color: var(--title-on-dark);
}

/* Tag (petit badge sur cards dark) */
.feature .tag{
  color: var(--text-on-dark);
  background: rgba(240,240,240,.08);
  border: 1px solid rgba(240,240,240,.16);
}

/* Mini cards (stats) sur fond dark */
.mini .k{ color: rgba(240,240,240,.70); }
.mini .v{ color: var(--title-on-dark); }
.mini .s{ color: var(--muted-on-dark); }

/* Band / barre "Mini logique ROI" */
.band{
  background: linear-gradient(
    90deg,
    rgba(64,224,208,.18) 0%,
    rgba(240,240,240,.07) 45%,
    rgba(240,240,240,.06) 100%
  );
}
.band h3{ color: var(--title-on-dark); }
.band p{ color: rgba(240,240,240,.82); }

/* Sources : liens visibles */
.sources a{
  color: rgba(64,224,208,1);
  border-bottom-color: rgba(64,224,208,.7);
}
.sources a:hover{ filter: brightness(1.05); }

/* Renforce le contraste des blocks dark */
.feature, .mini, .stat-tile{
  background: var(--card-on-dark);
  border-color: var(--border-on-dark);
}

/* ---------- 3) TITRES DE SECTIONS (H2) SUR FOND DARK ---------- */
.section-head h2{
  color: var(--title-on-dark);
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.section-head .muted{
  color: rgba(240,240,240,.75);
}
/* sécurité si un h2 est direct dans section */
.section > h2{
  color: var(--title-on-dark);
}

/* ---------- 4) HERO = CARD LIGHT (texte foncé) ---------- */
.card.light{
  color: var(--text-on-light);
}

/* Force uniquement le contenu du hero */
.hero-left{
  color: var(--text-on-light);
}
.hero-left h1{
  color: var(--text-on-light);
}
.hero-left p,
.hero-left .sub{
  color: var(--muted-on-light);
}

/* Badge hero (pill) lisible sur fond clair */
.hero-left .kicker{
  background: rgba(64,224,208,.18);
  border: 1px solid rgba(64,224,208,.35);
  color: #1f2a33;
}
.hero-left .kicker *{
  color: inherit;
}
.hero-left .kicker .dot{
  background: #40E0D0;
  box-shadow: 0 0 0 6px rgba(64,224,208,.22);
}

/* ---------- 5) BLOC CTA = CARD LIGHT (texte foncé) ---------- */
#cta .card{
  color: var(--text-on-light);
}

/* texte à l'intérieur du CTA */
#cta h2{
  color: var(--text-on-light);
}
#cta .muted,
#cta p{
  color: var(--muted-on-light);
}

/* Bouton secondaire "Consulter les sources" */
#cta a.btn.secondary{
  color: var(--text-on-light);
  background: rgba(44,52,64,.06);
  border: 1px solid rgba(44,52,64,.18);
}

/* Liens dans CTA (hors boutons) */
#cta a:not(.btn){
  color: var(--text-on-light);
  text-decoration-color: rgba(44,52,64,.35);
}
#cta strong,
#cta span{
  color: inherit;
}

/* ---------- 6) (OPTIONNEL) Sélection texte : plus propre ---------- */
::selection{
  background: rgba(64,224,208,.30);
  color: #2C3440;
}
::-moz-selection{
  background: rgba(64,224,208,.30);
  color: #2C3440;
}
/* ========== FIX "fineprint" HERO (ligne ✓ …) ========== */
.hero-left .fineprint{
  color: rgba(44,52,64,.72);     /* visible sur fond clair */
  opacity: 1;                    /* au cas où une règle met opacity */
}

/* Si tu as des <span> / <a> dans la ligne */
.hero-left .fineprint *{
  color: inherit;
}
/* ========== FIX STAT -88% (texte blanc lisible) ========== */

.stat-tile{
  color: rgba(240,240,240,.92);
}

/* Titre principal -88% */
.stat-tile .stat-big{
  color: #40E0D0; /* on garde le cyan */
}

/* Texte descriptif sous le -88% */
.stat-tile .stat-mid,
.stat-tile p,
.stat-tile div{
  color: rgba(240,240,240,.88);
}

/* ==========================================================================
   RECOVERY PATCH — Hero + CTA now appear on DARK cards (based on screenshots)
   Fix: text was forced to "light-mode" colors => unreadable on dark background
   Put this block LAST to override Elementor/interfering CSS.
   ========================================================================== */

/* ---------- HERO: force readable text on dark card ---------- */
.card.hero-left,
.hero-left{
  color: var(--text-on-dark) !important;
}

.hero-left h1{
  color: var(--title-on-dark) !important;
}

.hero-left .sub,
.hero-left p{
  color: var(--muted-on-dark) !important;
}

.hero-left .fineprint{
  color: rgba(240,240,240,.72) !important;
  opacity: 1 !important;
}

/* Keep hero badge readable (cyan pill + WHITE text) */
.hero-left .kicker{
  background: rgba(64,224,208,.18) !important;
  border: 1px solid rgba(64,224,208,.35) !important;
  color: rgba(240,240,240,.95) !important;  /* <-- WHITE */
}
.hero-left .kicker *{ color: inherit !important; }

/* ---------- CTA: force readable text on dark card ---------- */
#cta .card{
  color: var(--text-on-dark) !important;
}

#cta h2{
  color: var(--title-on-dark) !important;
}

#cta p,
#cta .muted{
  color: var(--muted-on-dark) !important;
}

/* CTA links (non button) visible */
#cta a:not(.btn){
  color: rgba(64,224,208,1) !important;
  text-decoration-color: rgba(64,224,208,.55) !important;
}

/* Secondary button: readable on dark background */
#cta a.btn.secondary{
  color: var(--text-on-dark) !important;
  background: rgba(240,240,240,.08) !important;
  border: 1px solid rgba(240,240,240,.16) !important;
}

/* ---------- Primary buttons: ensure label stays readable ---------- */
a.btn.primary{
  color: #0e2327 !important; /* dark text on cyan button */
}

/* ---------- Stat tile: ensure the mid text is white (already mostly done) ---------- */
.stat-tile .stat-mid{
  color: rgba(240,240,240,.88) !important;
}/* End custom CSS */