/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It's ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It's fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.3.1750438431
Updated: 2025-06-20 16:53:51
*/

/* ═══════════════════════════════════════════════════════════════════
   ECO BIOMA — Système de design v1.1
   Corrections : contraste foncé/foncé, boutons, conflits serif/sans,
   sélecteurs Elementor trop agressifs, footer texte lisible.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. POLICES ──────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&display=swap');

/* ── 2. VARIABLES ────────────────────────────────────────────────── */
:root {
  --eb-green:        #2d4a35;
  --eb-green-dark:   #1e3324;
  --eb-green-mid:    #3d5e42;
  --eb-green-light:  #e8f0ea;
  --eb-green-xlight: #f0f5f1;

  --eb-gold:         #c4a882;
  --eb-gold-light:   #f0e8d8;

  --eb-cream:        #f5f0e8;
  --eb-cream-dark:   #ede8df;
  --eb-cream-warm:   #faf8f4;

  --eb-dark:         #1a1a14;
  --eb-dark-mid:     #242419;

  /* Texte sur fond CLAIR */
  --eb-text:         #2c2c24;
  --eb-text-mid:     #5a5248;
  --eb-text-soft:    #8a8278;

  /* Texte sur fond FONCÉ — toujours lisible */
  --eb-text-on-dark:        rgba(255, 255, 255, 0.85);
  --eb-text-on-dark-soft:   rgba(255, 255, 255, 0.55);
  --eb-text-on-green:       rgba(255, 255, 255, 0.92);

  --eb-border:       #e0dcd4;
  --eb-border-soft:  #ede8e0;

  --eb-font-display: 'Cormorant Garamond', 'Georgia', serif;
  --eb-font-body:    'DM Sans', system-ui, -apple-system, sans-serif;

  --eb-shadow-sm:    0 1px 4px rgba(44, 44, 36, .06);
  --eb-shadow-md:    0 2px 12px rgba(44, 44, 36, .08);
  --eb-shadow-lg:    0 4px 24px rgba(44, 44, 36, .10);

  --eb-radius:       10px;
  --eb-radius-sm:    6px;
  --eb-radius-pill:  40px;
  --eb-transition:   0.22s ease;
}

/* ── 3. BASE ─────────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }

body,
.ast-separate-container,
#page,
.site {
  font-family: var(--eb-font-body) !important;
  color: var(--eb-text);
  background-color: var(--eb-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: rgba(45, 74, 53, .15);
  color: var(--eb-text);
}

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--eb-cream-dark); }
::-webkit-scrollbar-thumb { background: var(--eb-green); border-radius: 3px; }

*:focus-visible {
  outline: 2px solid var(--eb-green);
  outline-offset: 3px;
}

/* ── 4. TYPOGRAPHIE ──────────────────────────────────────────────── */

/* H1 uniquement → serif display */
h1,
.elementor-heading-title.elementor-size-xxl,
.elementor-heading-title.elementor-size-xl {
  font-family: var(--eb-font-display) !important;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.12;
}

/* H2→H6 → DM Sans (sans conflit avec les widgets Heading) */
h2, h3, h4, h5, h6 {
  font-family: var(--eb-font-body) !important;
  font-weight: 600;
  line-height: 1.3;
}

/* Widget Heading Elementor : la taille dicte la police.
   Grande (xl/xxl) → serif. Petite/moyenne → sans.
   On n'écrase plus toutes les tailles avec la même règle. */
.elementor-widget-heading .elementor-heading-title.elementor-size-xxl,
.elementor-widget-heading .elementor-heading-title.elementor-size-xl {
  font-family: var(--eb-font-display) !important;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.elementor-widget-heading .elementor-heading-title.elementor-size-large,
.elementor-widget-heading .elementor-heading-title.elementor-size-medium,
.elementor-widget-heading .elementor-heading-title.elementor-size-small,
.elementor-widget-heading .elementor-heading-title.elementor-size-default {
  font-family: var(--eb-font-body) !important;
  font-weight: 600;
}

/* Corps de texte */
p, li, td, th {
  font-family: var(--eb-font-body);
  line-height: 1.7;
}

.elementor-widget-text-editor p,
.elementor-text-editor p {
  font-family: var(--eb-font-body);
  color: var(--eb-text-mid);
}

/* Liens texte */
.entry-content a,
.elementor-widget-text-editor a {
  color: var(--eb-green);
  text-decoration: underline;
  text-decoration-color: rgba(45, 74, 53, .25);
  text-underline-offset: 3px;
  transition: text-decoration-color var(--eb-transition);
}
.entry-content a:hover,
.elementor-widget-text-editor a:hover {
  text-decoration-color: var(--eb-green);
}

/* ── 5. HEADER ASTRA ─────────────────────────────────────────────── */
#masthead,
.site-header,
.ast-desktop-header,
.ast-primary-header-bar {
  background-color: var(--eb-cream) !important;
  border-bottom: 1px solid var(--eb-border-soft) !important;
  box-shadow: none !important;
}

/* NE PAS cibler .ast-container globalement — trop large.
   On cible uniquement le header. */
.main-header-bar .ast-container,
.ast-header-bar .ast-container {
  max-width: 1280px;
}

/* Logo */
.ast-site-identity .site-title a,
.ast-site-identity .site-title {
  font-family: var(--eb-font-body) !important;
  font-weight: 600;
  color: var(--eb-green) !important;
  letter-spacing: 0.04em;
}

/* Navigation */
.main-header-menu .menu-item > a,
.ast-builder-menu .menu-link,
#ast-desktop-header .main-header-menu .menu-item > a {
  font-family: var(--eb-font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  color: var(--eb-text) !important;
  letter-spacing: 0.02em;
  text-transform: none !important;
  transition: color var(--eb-transition) !important;
}
.main-header-menu .menu-item > a:hover,
#ast-desktop-header .main-header-menu .menu-item > a:hover {
  color: var(--eb-green) !important;
}

/* Bouton CTA nav (INSCRIPTION) — ciblage précis */
.ast-header-button-1 .ast-custom-button,
#ast-desktop-header .ast-header-custom-item a.ast-custom-button {
  background-color: var(--eb-green) !important;
  color: #fff !important;
  border-radius: var(--eb-radius-pill) !important;
  padding: 9px 22px !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  border: none !important;
  text-transform: uppercase !important;
  transition: background-color var(--eb-transition) !important;
}
.ast-header-button-1 .ast-custom-button:hover,
#ast-desktop-header .ast-header-custom-item a.ast-custom-button:hover {
  background-color: var(--eb-green-dark) !important;
  color: #fff !important;
}

/* Mobile header */
.ast-mobile-header-wrap,
#ast-mobile-header,
.ast-header-break-point .ast-primary-header-bar {
  background-color: var(--eb-cream) !important;
  border-bottom: 1px solid var(--eb-border-soft) !important;
}
.ast-button-wrap .menu-toggle,
.ast-mobile-menu-trigger-1 {
  color: var(--eb-green) !important;
}

/* ── 6. FOND DE PAGE ─────────────────────────────────────────────── */
#content,
.site-content,
.content-area {
  background-color: transparent;
}

/* Pages Elementor full-width : pas de padding parasite */
.ast-page-builder-template .site-content,
.elementor-page .site-content {
  padding: 0 !important;
  margin: 0 !important;
}

/* NE PAS forcer le fond sur toutes les sections Elementor.
   Le fond crème vient du body. Les sections sans fond explicite
   héritent naturellement. On n'écrase plus avec !important. */

/* ── 7. BOUTONS ELEMENTOR ────────────────────────────────────────── */

/* Règles de base SANS !important sur les propriétés visuelles
   pour ne pas écraser les couleurs inline que l'utilisateur a définies
   dans Elementor (ex: boutons clairs sur landing dark). */
.elementor-button {
  font-family: var(--eb-font-body) !important;
  font-weight: 600 !important;
  border-radius: var(--eb-radius-pill) !important;
  transition: transform var(--eb-transition), box-shadow var(--eb-transition),
              background-color var(--eb-transition) !important;
  /* PAS de font-size global — on laisse Elementor gérer les tailles */
  /* PAS de text-transform global — certains CTA ont du texte long */
}

/* Classe utilitaire .eb-btn-primary à ajouter manuellement
   dans Elementor sur les boutons qui doivent être verts.
   Priorité haute sans !important sur color grâce à la spécificité. */
.elementor-widget-button .elementor-button.eb-btn-primary,
a.elementor-button.eb-btn-primary {
  background-color: var(--eb-green) !important;
  color: #fff !important;
  border: none !important;
}
.elementor-widget-button .elementor-button.eb-btn-primary:hover,
a.elementor-button.eb-btn-primary:hover {
  background-color: var(--eb-green-dark) !important;
  transform: translateY(-1px);
  box-shadow: var(--eb-shadow-md);
}

/* Classe utilitaire .eb-btn-ghost pour les boutons outline */
.elementor-widget-button .elementor-button.eb-btn-ghost,
a.elementor-button.eb-btn-ghost {
  background-color: transparent !important;
  border: 1.5px solid currentColor !important;
}
.elementor-widget-button .elementor-button.eb-btn-ghost:hover {
  background-color: rgba(45, 74, 53, .06) !important;
}

/* Boutons sur fond FONCÉ (sections dark) — garantir le contraste */
.elementor-section[style*="background-color: rgb(26"] .elementor-button,
.elementor-section[style*="background-color:#1a"] .elementor-button,
.eb-section-dark .elementor-button {
  color: #fff;
}
.elementor-section[style*="background-color: rgb(26"] .elementor-button:hover,
.eb-section-dark .elementor-button:hover {
  color: #fff;
}

/* ── 8. WIDGET ECO MOVE ESTIMATOR ────────────────────────────────── */
/* FIX : on surcharge les variables internes du widget SANS toucher
   à --ebw-white pour les inputs (qui en ont besoin blanc).
   On cible le fond du wrapper seulement. */

.ebw-move-estimator {
  --ebw-cream:     var(--eb-cream) !important;
  --ebw-border:    var(--eb-border) !important;
  --ebw-shadow-lg: var(--eb-shadow-md) !important;
  background-color: var(--eb-cream-warm) !important;
  border-color: var(--eb-border) !important;
  box-shadow: var(--eb-shadow-md) !important;
  font-family: var(--eb-font-body) !important;
}

/* Titre H2 du widget → serif */
.ebw-move-estimator .ebw-title {
  font-family: var(--eb-font-display) !important;
  font-weight: 500;
}

/* Nav des étapes */
.ebw-steps-nav {
  background-color: var(--eb-cream-dark) !important;
}

/* Inputs : blanc pur pour contraste maximal sur fond crème.
   Double spécificité pour gagner sur le CSS du plugin. */
.ebw-move-estimator .ebw-move-estimator input[type="text"],
.ebw-move-estimator input[type="text"],
.ebw-move-estimator input[type="email"],
.ebw-move-estimator input[type="tel"],
.ebw-move-estimator input[type="date"],
.ebw-move-estimator input[type="number"],
.ebw-move-estimator select {
  background-color: #ffffff !important;
  border-color: #d0ccc4 !important;
  color: var(--eb-text) !important;
  font-family: var(--eb-font-body) !important;
}
.ebw-move-estimator input:focus,
.ebw-move-estimator select:focus {
  border-color: var(--eb-green) !important;
  box-shadow: 0 0 0 3px rgba(45, 74, 53, .08) !important;
  outline: none !important;
}

/* Placeholder lisible */
.ebw-move-estimator input::placeholder {
  color: var(--eb-text-soft) !important;
  opacity: 1 !important;
}

/* ── 9. CATALOGUE MAISONS ────────────────────────────────────────── */

/* On cible les classes réelles du widget catalog (ebw-) */
.ebw-catalog-card {
  background-color: var(--eb-cream-warm);
  border-color: var(--eb-border);
  font-family: var(--eb-font-body);
  transition: transform var(--eb-transition), box-shadow var(--eb-transition);
}
.ebw-catalog-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--eb-shadow-lg);
}

/* Filtres catalogue */
.ebw-catalog-filters,
.ebw-catalog-sidebar {
  background-color: var(--eb-cream-warm);
  border-color: var(--eb-border-soft);
  border-radius: var(--eb-radius);
  font-family: var(--eb-font-body);
}
.ebw-catalog-filters input,
.ebw-catalog-filters select {
  background-color: #fff;
  border-color: var(--eb-border);
  font-family: var(--eb-font-body);
}

/* Badges catalogue */
.ebw-catalog-badge {
  font-family: var(--eb-font-body);
  font-weight: 700;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 20px;
  padding: 3px 10px;
  /* Toujours vérifier le contraste selon la couleur de fond du badge */
}

/* ── 10. FOOTER ──────────────────────────────────────────────────── */
/* FIX CRITIQUE : forcer la couleur de texte sur TOUS les enfants
   pour éviter le texte foncé sur fond foncé */

#colophon,
.site-footer,
.ast-small-footer,
footer.ast-footer-background {
  background-color: var(--eb-dark) !important;
  border-top: none !important;
}

/* Texte clair sur fond sombre — TOUS les éléments enfants */
#colophon,
#colophon *,
.site-footer,
.site-footer *,
.ast-small-footer,
.ast-small-footer * {
  color: var(--eb-text-on-dark) !important;
  font-family: var(--eb-font-body) !important;
}

/* Liens footer en or — bien visible sur #1a1a14 */
.site-footer a,
#colophon a,
.ast-footer-copyright a,
.footer-widget-area a {
  color: var(--eb-gold) !important;
  text-decoration: none;
  transition: color var(--eb-transition);
}
.site-footer a:hover,
#colophon a:hover {
  color: #fff !important;
}

/* Copyright plus discret */
.ast-footer-copyright,
.ast-footer-copyright p {
  color: var(--eb-text-on-dark-soft) !important;
  font-size: 0.82rem !important;
}

/* Titres de widgets footer */
.footer-widget-area .widget-title,
.footer-widget-area h3,
.footer-widget-area h4 {
  color: #fff !important;
  font-family: var(--eb-font-body) !important;
  font-weight: 600;
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

/* ── 11. TEXTE SUR FOND VERT ─────────────────────────────────────── */
/* Quand Elementor met un fond #2d4a35 (vert) sur une section,
   le texte doit être clair — ajout d'une classe utilitaire */

.eb-section-green,
.eb-section-green * {
  color: var(--eb-text-on-green) !important;
}
.eb-section-green h1,
.eb-section-green h2,
.eb-section-green h3,
.eb-section-green .elementor-heading-title {
  color: #fff !important;
}
.eb-section-green p,
.eb-section-green li,
.eb-section-green .elementor-text-editor * {
  color: rgba(255, 255, 255, .82) !important;
}

/* ── 12. SÉPARATEURS / MICRO-DÉTAILS ─────────────────────────────── */
hr,
.elementor-divider-separator {
  border-color: var(--eb-border-soft) !important;
}

/* ── 13. RESPONSIVE MOBILE ───────────────────────────────────────── */
@media (max-width: 768px) {
  h1,
  .elementor-heading-title.elementor-size-xxl {
    font-size: clamp(1.9rem, 7vw, 3rem) !important;
    letter-spacing: -0.015em !important;
  }

  .ebw-move-estimator {
    margin: 10px !important;
    border-radius: 8px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   ECO BIOMA — Design System v2 — Animation + Utilities
   ═══════════════════════════════════════════════════════════════════ */

/* ── A. TOKENS ANIMATION ─────────────────────────────────────────── */
:root {
  --eb-dur-fast:    150ms;
  --eb-dur-base:    220ms;
  --eb-dur-slow:    400ms;
  --eb-dur-reveal:  600ms;
  --eb-ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --eb-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --eb-gradient-hero: linear-gradient(135deg, var(--eb-green-dark) 0%, var(--eb-green) 60%, var(--eb-green-mid) 100%);
  --eb-gradient-gold: linear-gradient(90deg, var(--eb-gold) 0%, #d4b892 100%);

  /* Spacing 4pt */
  --eb-space-1:  4px;  --eb-space-2:  8px;  --eb-space-3:  12px;
  --eb-space-4:  16px; --eb-space-5:  20px; --eb-space-6:  24px;
  --eb-space-8:  32px; --eb-space-10: 40px; --eb-space-12: 48px;
  --eb-space-16: 64px; --eb-space-20: 80px; --eb-space-24: 96px;
}

/* ── B. FLUID TYPOGRAPHY ─────────────────────────────────────────── */
h1,
.elementor-heading-title.elementor-size-xxl,
.elementor-heading-title.elementor-size-xl {
  font-size: clamp(2.4rem, 5.5vw, 4.5rem) !important;
}
h2,
.elementor-heading-title.elementor-size-large {
  font-size: clamp(1.6rem, 3.2vw, 2.6rem) !important;
}
h3 {
  font-size: clamp(1.1rem, 2vw, 1.5rem) !important;
}

/* ── C. SCROLL-REVEAL ────────────────────────────────────────────── */
.eb-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--eb-dur-reveal) var(--eb-ease-out),
              transform var(--eb-dur-reveal) var(--eb-ease-out);
}
.eb-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .eb-reveal { opacity: 1; transform: none; transition: none; }
}

/* ── D. GLASSMORPHISM ────────────────────────────────────────────── */
.eb-glass {
  background: rgba(250, 248, 244, 0.72);
  backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  border: 1px solid rgba(224, 220, 212, 0.5);
  border-radius: var(--eb-radius);
}
.eb-glass--dark {
  background: rgba(26, 26, 20, 0.72);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--eb-radius);
  color: var(--eb-text-on-dark);
}

/* ── E. STICKY CTA MOBILE ────────────────────────────────────────── */
.eb-sticky-cta {
  display: none;
}
@media (max-width: 768px) {
  .eb-sticky-cta {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: var(--eb-space-3) var(--eb-space-4);
    padding-bottom: calc(var(--eb-space-3) + env(safe-area-inset-bottom));
    background: var(--eb-cream);
    border-top: 1px solid var(--eb-border-soft);
    gap: var(--eb-space-2);
  }
  .eb-sticky-cta a,
  .eb-sticky-cta button {
    flex: 1;
    text-align: center;
    padding: var(--eb-space-3) var(--eb-space-4);
    border-radius: var(--eb-radius-pill);
    font-family: var(--eb-font-body);
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: none;
    background-color: var(--eb-green);
    color: #fff;
    border: none;
    transition: background-color var(--eb-dur-base) var(--eb-ease-out);
  }
  .eb-sticky-cta a:hover,
  .eb-sticky-cta button:hover {
    background-color: var(--eb-green-dark);
    color: #fff;
  }
}

/* ── F. CARD HOVER AMÉLIORÉ ──────────────────────────────────────── */
.eb-card,
.ebw-catalog-card {
  transition: transform var(--eb-dur-base) var(--eb-ease-out),
              box-shadow var(--eb-dur-base) var(--eb-ease-out);
  cursor: pointer;
}
.eb-card:hover,
.ebw-catalog-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 32px rgba(44, 44, 36, .13);
}

/* ═══════════════════════════════════════════════════════════════════
   ECO BIOMA — Design System v3 — Brand cohérence + Conversion UX
   ui-ux-pro-max: color-semantic, state-clarity, stagger-sequence,
   motion-meaning, touch-target-size
   ═══════════════════════════════════════════════════════════════════ */

/* ── G. ECO-LANDING — FIX ACCENT OFF-BRAND ──────────────────────── */
/* Override le bleu ciel #38bdf8 (off-brand) → or chaud Eco Bioma   */
.ebw.ebw-eco-landing {
  --accent: #c4a882;
  --ok: #6bca84;
}
/* Focus ring : or brand au lieu de bleu sky */
.ebw.ebw-eco-landing :where(a, button):focus-visible {
  outline-color: rgba(196, 168, 130, .75) !important;
}
/* Badges, proof pills : accent or */
.ebw.ebw-eco-landing .ebw-badge-pill,
.ebw.ebw-eco-landing .ebw-proof-item strong {
  color: #c4a882;
}

/* ── H. SECTION TRANSITION dark → crème ─────────────────────────── */
/* Classe à ajouter dans Elementor sur la 1ère section après le hero */
.eb-section-fade-from-dark {
  position: relative;
}
.eb-section-fade-from-dark::before {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 90px;
  background: linear-gradient(180deg, #050507 0%, transparent 100%);
  z-index: 1;
}

/* ── I. CTA PRIMARY — PRESS FEEDBACK + PULSE ─────────────────────── */
/* scale-feedback (HIG/MD): 0.97 on active pour retour tactile immédiat */
.eb-btn-cta:active,
.elementor-button:active,
.ebw-btn:active,
.ebw-th__submit:active {
  transform: scale(0.97) !important;
  transition-duration: 80ms !important;
}

/* Pulse subtil sur le CTA hero — attire l'œil sans agresser */
@keyframes ebCTAPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(196, 168, 130, 0); }
  50%       { box-shadow: 0 0 0 8px rgba(196, 168, 130, 0.18); }
}
.eb-cta-pulse {
  animation: ebCTAPulse 2.8s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .eb-cta-pulse { animation: none; }
}

/* ── J. STAGGER CATALOGUE CARDS ──────────────────────────────────── */
/* stagger-sequence: 40ms/item pour une entrée fluide perçue comme premium */
.eb-card:nth-child(1)  { --eb-card-delay: 0ms; }
.eb-card:nth-child(2)  { --eb-card-delay: 40ms; }
.eb-card:nth-child(3)  { --eb-card-delay: 80ms; }
.eb-card:nth-child(4)  { --eb-card-delay: 120ms; }
.eb-card:nth-child(5)  { --eb-card-delay: 160ms; }
.eb-card:nth-child(6)  { --eb-card-delay: 200ms; }
.eb-card.is-visible {
  transition-delay: var(--eb-card-delay, 0ms) !important;
}

/* ── K. TOUCH-ACTION — suppression tap delay 300ms mobile ───────── */
a, button,
.eb-card, .eb-btn-cta, .ebw-btn,
.ebw-th__submit, .ebw-th__whatsapp-cta,
.eb-card-btn, .eb-mobile-filter-btn {
  touch-action: manipulation;
}

/* ── L. PROOF BAR / KICKER ───────────────────────────────────────── */
/* Section chiffres-clés et kicker line */
.eb-proof-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--eb-space-6);
  padding: var(--eb-space-6) 0;
  border-top: 1px solid var(--eb-border-soft);
  border-bottom: 1px solid var(--eb-border-soft);
}
.eb-proof-bar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font-family: var(--eb-font-body);
}
.eb-proof-bar__num {
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--eb-green);
  line-height: 1;
  font-family: var(--eb-font-display);
}
.eb-proof-bar__label {
  font-size: 0.78rem;
  color: var(--eb-text-soft);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}

/* ── M. SCROLL-REVEAL — état initial cards catalog ───────────────── */
/* JS (functions.php) ajoute .is-visible via IntersectionObserver     */
.eb-card.eb-reveal {
  opacity: 0;
  transform: translateY(20px);
}
.eb-card.eb-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 400ms var(--eb-ease-out),
              transform 400ms var(--eb-ease-out);
  transition-delay: var(--eb-card-delay, 0ms);
}