/* ============================================================
   CEWeb Widgets — Équipe (portraits)

   La colonne de droite de la section « Qui sont les fondateurs ? » : des
   portraits en quinconce — une photo, puis un cartouche portant le nom et le
   rôle. La colonne de texte voisine se monte avec les widgets natifs
   d'Elementor. Aucun JavaScript : le survol et l'apparition sont deux états
   CSS.

   Tous les réglages de l'onglet Style arrivent par des variables
   --ceweb-equipe-* posées sur .ceweb-equipe par Elementor. Les valeurs
   ci-dessous ne sont qu'un repli, et les couleurs pointent d'abord sur la
   palette du thème — -1 bleu CEWeb, -6 bleu nuit et titres, -7 texte courant,
   -9 bordures, -10 fond clair, -11 fond de carte.

   Les couleurs suivent la règle de « Coordonnées » : chaque ambiance pose des
   `--ceweb-equipe-*-auto`, la feuille lit `var(--x, var(--x-auto))`, et les
   contrôles de couleur écrivent `--x`, sans suffixe. **Aucune variable de
   couleur sans suffixe n'est déclarée dans cette feuille** : un var() ne prend
   son repli que si la variable est absente, et la déclarer, même vide,
   couperait le lien avec l'ambiance.
   ============================================================ */

/* Le bloc doit réclamer toute la largeur de sa colonne.

   Dans un conteneur *flexbox* Elementor — le défaut depuis la 3.6 — un widget
   est un élément flex en `flex: 0 1 auto` : sa largeur suit son contenu, et
   une grille en `1fr` se mesurerait sur une boîte déjà rétrécie. Même piège
   que l'« Accordéon d'images », et même remède. Une largeur réglée à la main
   dans l'onglet Avancé la bat sans peine, son sélecteur portant l'identifiant
   de l'élément. */
.elementor-widget-ceweb_equipe{ width: 100%; }

.ceweb-equipe{
  width: 100%;
  max-width: var(--ceweb-equipe-max);
  margin: var(--ceweb-equipe-position);

  /* --- Disposition -------------------------------------------- */
  --ceweb-equipe-max: 100%;
  --ceweb-equipe-position: 0 auto 0 0;
  --ceweb-equipe-columns: 2;
  --ceweb-equipe-member-gap: 18px;

  /* Le décalage est multiplié par un interrupteur que le contrôle « Portraits
     par ligne » écrit à 0 pour une seule colonne : décaler un portrait sur
     deux dans une pile ne ferait qu'ouvrir un trou entre deux portraits. */
  --ceweb-equipe-stagger: 42px;
  --ceweb-equipe-stagger-on: 1;

  /* --- Bloc ----------------------------------------------------- */
  --ceweb-equipe-radius: 0px;
  --ceweb-equipe-padding: 0px;

  /* --- Photos --------------------------------------------------- */
  --ceweb-equipe-ratio: 5 / 6;
  --ceweb-equipe-photo-radius: 24px;
  --ceweb-equipe-focus: center;

  /* Fraunces nommée en toutes lettres, comme dans le mega menu :
     `--e-global-typography-primary-font-family` n'est pas Fraunces sur le
     site, et l'initiale sortait en Inter. */
  --ceweb-equipe-heading-font: Fraunces, Georgia, serif;

  /* --- Cartouche ------------------------------------------------ */
  --ceweb-equipe-caption-radius: 16px;
  --ceweb-equipe-caption-padding: 16px 18px;
  --ceweb-equipe-caption-border-width: 1px;
  --ceweb-equipe-caption-offset: 13px;
  --ceweb-equipe-caption-align: left;
  --ceweb-equipe-name-gap: 4px;

  /* --- Icône LinkedIn ------------------------------------------- */
  /* Ses quatre couleurs (`-social-color`, `-social-bg`, `-social-color-hover`,
     `-social-bg-hover`) ne sont jamais déclarées ici, comme les autres. */
  --ceweb-equipe-social-size: 40px;
  --ceweb-equipe-social-icon-size: 18px;
  --ceweb-equipe-social-radius: 12px;
  --ceweb-equipe-social-gap: 16px;

  /* --- Survol et apparition ------------------------------------- */
  --ceweb-equipe-hover-duration: 360ms;
  --ceweb-equipe-hover-lift: 6px;
  --ceweb-equipe-hover-zoom: 1.04;
  --ceweb-equipe-reveal-shift: 28px;
  --ceweb-equipe-reveal-duration: 700ms;
  --ceweb-equipe-reveal-step: 120ms;

  --ceweb-equipe-ease: cubic-bezier(.2, .7, .3, 1);

  box-sizing: border-box;
  padding: var(--ceweb-equipe-padding);
  border-radius: var(--ceweb-equipe-radius);
}
.ceweb-equipe *{ box-sizing: border-box; }

/* ============================================================
   Les trois ambiances

   L'ambiance décrit le fond sur lequel le bloc est posé — par défaut celui de
   la section Elementor — et accorde à ce fond les cadres sans photo et les
   cartouches. Sur les fonds colorés, les voiles des cadres sont des blancs
   translucides : un blanc à 14 % éclaircit n'importe quel bleu, là où une
   couleur fixe suppose connue celle du fond.
   ============================================================ */
.ceweb-equipe--scheme-brand{
  --ceweb-equipe-bg-auto: var(--theme-palette-color-1, #3F63E0);
  --ceweb-equipe-photo-bg-auto: rgba(255, 255, 255, .14);
  --ceweb-equipe-photo-border-color-auto: rgba(255, 255, 255, .55);
  --ceweb-equipe-photo-text-color-auto: rgba(255, 255, 255, .88);
  --ceweb-equipe-caption-bg-auto: var(--theme-palette-color-11, #FFFFFF);
  --ceweb-equipe-caption-border-color-auto: transparent;
  --ceweb-equipe-name-color-auto: var(--theme-palette-color-6, #0C1A3C);
  --ceweb-equipe-name-color-hover-auto: var(--theme-palette-color-1, #3F63E0);
  --ceweb-equipe-role-color-auto: var(--theme-palette-color-7, #475569);
  --ceweb-equipe-focus-ring-auto: var(--theme-palette-color-11, #FFFFFF);
}

.ceweb-equipe--scheme-dark{
  --ceweb-equipe-bg-auto: var(--theme-palette-color-6, #0C1A3C);
  --ceweb-equipe-photo-bg-auto: rgba(255, 255, 255, .08);
  --ceweb-equipe-photo-border-color-auto: rgba(255, 255, 255, .40);
  --ceweb-equipe-photo-text-color-auto: rgba(255, 255, 255, .80);
  --ceweb-equipe-caption-bg-auto: var(--theme-palette-color-11, #FFFFFF);
  --ceweb-equipe-caption-border-color-auto: transparent;
  --ceweb-equipe-name-color-auto: var(--theme-palette-color-6, #0C1A3C);
  --ceweb-equipe-name-color-hover-auto: var(--theme-palette-color-1, #3F63E0);
  --ceweb-equipe-role-color-auto: var(--theme-palette-color-7, #475569);
  --ceweb-equipe-focus-ring-auto: var(--theme-palette-color-11, #FFFFFF);
}

.ceweb-equipe--scheme-light{
  --ceweb-equipe-bg-auto: var(--theme-palette-color-10, #F4F8FF);
  --ceweb-equipe-photo-bg-auto: var(--theme-palette-color-11, #FFFFFF);
  --ceweb-equipe-photo-border-color-auto: var(--theme-palette-color-9, #CBD5E1);
  --ceweb-equipe-photo-text-color-auto: var(--theme-palette-color-7, #475569);
  --ceweb-equipe-caption-bg-auto: var(--theme-palette-color-11, #FFFFFF);
  --ceweb-equipe-caption-border-color-auto: var(--theme-palette-color-9, #E2E8F0);
  --ceweb-equipe-name-color-auto: var(--theme-palette-color-6, #0C1A3C);
  --ceweb-equipe-name-color-hover-auto: var(--theme-palette-color-1, #3F63E0);
  --ceweb-equipe-role-color-auto: var(--theme-palette-color-7, #475569);
  --ceweb-equipe-focus-ring-auto: var(--theme-palette-color-6, #0C1A3C);
}

/* Sur fond clair, le filet de la palette (-9) est trop pâle pour des
   pointillés sur un cadre blanc : ils disparaissent. Le texte courant (-7)
   éclairci tient sur n'importe quel fond clair. */
@supports (color: color-mix(in srgb, red 50%, white)){
  .ceweb-equipe--scheme-light{
    --ceweb-equipe-photo-border-color-auto: color-mix(in srgb, var(--theme-palette-color-7, #475569) 40%, transparent);
  }
}

/* Un seul remplissage peint, une classe posée par PHP : les modes « aucun » —
   le défaut — et « dégradé ou image » n'émettent rien, donc aucune règle
   d'ici ne peint. */
.ceweb-equipe--fill-solid{ background: var(--ceweb-equipe-bg, var(--ceweb-equipe-bg-auto)); }

.ceweb-equipe__empty{
  padding: 16px 20px; border: 1px dashed #d63638; border-radius: 8px;
  color: #1d2327; font: 14px/1.5 system-ui, sans-serif;
}

/* ============================================================
   Liste des portraits

   La liste est un <ul> imbriqué dans un <div>, jamais la racine elle-même :
   ses remises à zéro portent ainsi deux classes (0,2,0) et passent devant le
   `.elementor ul` (0,1,1) du thème, qui reprendrait sinon la marge, le retrait
   et les puces.

   `align-items: start` : un portrait décalé ne doit pas étirer ses voisins de
   ligne, sans quoi leur cartouche descendrait avec lui.
   ============================================================ */
.ceweb-equipe .ceweb-equipe__list{
  display: grid;
  grid-template-columns: repeat(var(--ceweb-equipe-columns), minmax(0, 1fr));
  gap: var(--ceweb-equipe-member-gap);
  align-items: start;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ceweb-equipe .ceweb-equipe__list .ceweb-equipe__member{
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Le quinconce est une marge, jamais un `transform`. Le portrait décalé doit
   pousser le bas de la grille — un `translate` le ferait déborder sur la
   section suivante —, et `transform` est déjà pris deux fois : l'apparition
   sur `__member`, le survol sur `__inner`. Sélecteur à trois classes pour
   battre la remise à zéro de la marge juste au-dessus. */
.ceweb-equipe--stagger-even .ceweb-equipe__list .ceweb-equipe__member:nth-child(even),
.ceweb-equipe--stagger-odd .ceweb-equipe__list .ceweb-equipe__member:nth-child(odd){
  margin-top: calc(var(--ceweb-equipe-stagger) * var(--ceweb-equipe-stagger-on));
}

/* ============================================================
   Portrait

   Deux boîtes emboîtées, et c'est structurel : `__member` porte l'animation
   d'apparition (et la marge du quinconce), `__inner` le survol. Une animation
   en `fill-mode: both` garde la main sur sa propriété jusque dans l'état
   final — un `transform: none` d'apparition posé sur le même élément mangerait
   le soulèvement au survol, sans que rien ne le signale.
   ============================================================ */
.ceweb-equipe__inner{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--ceweb-equipe-caption-offset);
  transition: transform var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease);
}

/* Le rayon vit sur le cadre, qui rogne (`overflow: hidden`), et pas seulement
   sur l'image : `<img>` est la balise que les thèmes stylent le plus
   volontiers, et une règle `.entry-content img` battrait une classe isolée.
   Un rognage, lui, ne se surcharge pas à distance. `isolation` force Safari à
   rogner aussi l'image pendant qu'elle zoome, ce qu'il oublie sinon aux
   angles arrondis. */
.ceweb-equipe .ceweb-equipe__photo{
  position: relative;
  aspect-ratio: var(--ceweb-equipe-ratio);
  width: 100%;
  margin: 0;
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--ceweb-equipe-photo-radius);
}

/* Sélecteur long (0,3,0) pour tenir sans `!important` face aux règles d'image
   du thème. */
.ceweb-equipe .ceweb-equipe__photo .ceweb-equipe__image{
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: inherit;
  object-fit: cover;
  object-position: var(--ceweb-equipe-focus);
  transition: transform var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease);
}

/* Cadre sans photo : les pointillés de la maquette, et l'initiale du nom pour
   dire à qui il appartient. La bordure est en `border-box` (voir
   `.ceweb-equipe *`) : elle ne change pas le format du cadre. */
.ceweb-equipe .ceweb-equipe__photo.is-placeholder{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1.5px dashed var(--ceweb-equipe-photo-border-color, var(--ceweb-equipe-photo-border-color-auto));
  background: var(--ceweb-equipe-photo-bg, var(--ceweb-equipe-photo-bg-auto));
  color: var(--ceweb-equipe-photo-text-color, var(--ceweb-equipe-photo-text-color-auto));
}

/* L'initiale est un <span> : il n'hérite pas de la police que le thème réserve
   aux titres. Sélecteur à trois classes pour que le groupe Typographie de
   l'onglet Style (même sélecteur, écrit plus tard par Elementor) reprenne la
   main sans `!important`. */
.ceweb-equipe .ceweb-equipe__photo .ceweb-equipe__initial{
  font-family: var(--ceweb-equipe-heading-font);
  font-size: clamp(40px, 6vw, 72px);
  font-weight: 600;
  line-height: 1;
  user-select: none;
}
.ceweb-equipe__hint{
  font-size: 13px;
  font-weight: 600;
  opacity: .8;
}

/* ============================================================
   Cartouche
   ============================================================ */
.ceweb-equipe .ceweb-equipe__caption{
  display: flex;
  flex-direction: column;
  gap: var(--ceweb-equipe-name-gap);
  padding: var(--ceweb-equipe-caption-padding);
  border: var(--ceweb-equipe-caption-border-width) solid var(--ceweb-equipe-caption-border-color, var(--ceweb-equipe-caption-border-color-auto));
  border-radius: var(--ceweb-equipe-caption-radius);
  background: var(--ceweb-equipe-caption-bg, var(--ceweb-equipe-caption-bg-auto));
  transition: box-shadow var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease);
}

/* L'alignement du cartouche est déclaré sur chaque élément de texte, jamais
   hérité : posé dans une section centrée, le bloc lui transmettrait son
   `text-align: center`, et c'est le nom, un `<h3>`, qui trahirait le premier.
   Une déclaration sur l'élément lui-même bat toujours la même propriété
   héritée d'un ancêtre — même leçon que l'alignement du widget « Avis ».

   Le nom prend la police de sa balise, pas sa taille : un `h3` du thème
   serait trop gros pour un cartouche. */
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__name{
  margin: 0;
  text-align: var(--ceweb-equipe-caption-align);
  color: var(--ceweb-equipe-name-color, var(--ceweb-equipe-name-color-auto));
  font-size: 22px;
  line-height: 1.2;
  transition: color var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease);
}
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__role{
  margin: 0;
  text-align: var(--ceweb-equipe-caption-align);
  color: var(--ceweb-equipe-role-color, var(--ceweb-equipe-role-color-auto));
  font-size: 13px;
  line-height: 1.4;
}

/* Portrait entièrement cliquable : un seul lien, celui du nom, dont le ::after
   recouvre la photo et le cartouche (`__inner` porte `position: relative`).
   Emboîter le portrait dans un <a> engloutirait le rôle dans le nom
   accessible du lien. L'anneau de focus est dessiné sur ce ::after, pour
   entourer tout le portrait et non le seul nom. */
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__stretch{
  color: inherit;
  text-decoration: none;
}
.ceweb-equipe .ceweb-equipe__stretch::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: var(--ceweb-equipe-photo-radius);
}
.ceweb-equipe .ceweb-equipe__stretch:focus{ outline: none; }
.ceweb-equipe .ceweb-equipe__stretch:focus-visible::after{
  outline: 2px solid var(--ceweb-equipe-focus-ring-auto);
  outline-offset: 4px;
}

/* ============================================================
   Icône LinkedIn

   Le cartouche passe en grille de deux colonnes quand il en porte une : le
   texte à gauche, l'icône à droite, centrée sur la hauteur du nom et du rôle
   (`--span` lui fait couvrir les deux lignes). Le gabarit en colonne n'est
   touché que sous `.has-social`, les cartouches sans icône restent tels quels.

   L'icône est son propre lien, posé au-dessus du ::after étiré du portrait
   (z-index 2 contre 1) : les deux liens coexistent, chacun reste cliquable.
   ============================================================ */
.ceweb-equipe .ceweb-equipe__caption.has-social{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: var(--ceweb-equipe-social-gap);
  row-gap: var(--ceweb-equipe-name-gap);
  align-items: center;
}
.ceweb-equipe .ceweb-equipe__caption.has-social > :not(.ceweb-equipe__social){ grid-column: 1; }

.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social{
  position: relative;
  z-index: 2;
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ceweb-equipe-social-size);
  height: var(--ceweb-equipe-social-size);
  border-radius: var(--ceweb-equipe-social-radius);
  color: var(--ceweb-equipe-social-color, var(--theme-palette-color-1, #3F63E0));
  background: var(--ceweb-equipe-social-bg, var(--ceweb-equipe-social-tint));
  text-decoration: none;
  transition:
    transform var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease),
    background-color var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease),
    color var(--ceweb-equipe-hover-duration) var(--ceweb-equipe-ease);

  /* Teinte du fond, déclarée sur l'icône elle-même : c'est ici que sa couleur
     est connue. Le repli neutre vit dans la variable, jamais dans une
     déclaration précédente — une déclaration contenant un var() invalide
     retombe sur `unset`. */
  --ceweb-equipe-social-tint: rgba(63, 99, 224, .10);
}
@supports (color: color-mix(in srgb, red 50%, white)){
  .ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social{
    --ceweb-equipe-social-tint: color-mix(
      in srgb,
      var(--ceweb-equipe-social-color, var(--theme-palette-color-1, #3F63E0)) 10%,
      transparent
    );
  }
}
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social--span{ grid-row: 1 / span 2; }

.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social-icon{
  display: block;
  width: var(--ceweb-equipe-social-icon-size);
  height: var(--ceweb-equipe-social-icon-size);
  fill: currentColor;
}

/* Le remplissage au survol n'est pas gardé par `--hover` : c'est l'indice
   qu'il s'agit d'un lien, pas un effet. Seul le soulèvement l'est. */
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social:hover,
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social:focus-visible{
  background: var(--ceweb-equipe-social-bg-hover, var(--ceweb-equipe-social-color, var(--theme-palette-color-1, #3F63E0)));
  color: var(--ceweb-equipe-social-color-hover, var(--ceweb-equipe-caption-bg, var(--ceweb-equipe-caption-bg-auto)));
}
.ceweb-equipe--hover .ceweb-equipe__caption .ceweb-equipe__social:hover,
.ceweb-equipe--hover .ceweb-equipe__caption .ceweb-equipe__social:focus-visible{
  transform: translateY(-2px);
}
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social:focus{ outline: none; }
.ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social:focus-visible{
  outline: 2px solid var(--ceweb-equipe-social-color, var(--theme-palette-color-1, #3F63E0));
  outline-offset: 2px;
}

/* ============================================================
   Survol

   Tout le survol vit sous `.ceweb-equipe--hover`, une classe que PHP n'émet
   que si le réglage est actif : le couper retire les règles de la feuille au
   lieu de neutraliser chaque valeur une à une. `:focus-within` allume l'état
   au clavier. Rien ici ne touche aux marges : le survol ne doit jamais
   rejouer la mise en page.
   ============================================================ */
.ceweb-equipe--hover .ceweb-equipe__member:hover .ceweb-equipe__inner,
.ceweb-equipe--hover .ceweb-equipe__member:focus-within .ceweb-equipe__inner{
  transform: translateY(calc(-1 * var(--ceweb-equipe-hover-lift)));
}
.ceweb-equipe--hover .ceweb-equipe__member:hover .ceweb-equipe__image,
.ceweb-equipe--hover .ceweb-equipe__member:focus-within .ceweb-equipe__image{
  transform: scale(var(--ceweb-equipe-hover-zoom));
}
.ceweb-equipe--hover .ceweb-equipe__member.is-linked:hover .ceweb-equipe__caption .ceweb-equipe__name,
.ceweb-equipe--hover .ceweb-equipe__member.is-linked:focus-within .ceweb-equipe__caption .ceweb-equipe__name{
  color: var(--ceweb-equipe-name-color-hover, var(--ceweb-equipe-name-color-hover-auto));
}

/* ============================================================
   Apparition

   Deux mécanismes pour un seul jeu d'images clés, comme dans « Engagements ».

   1. Par défaut, une animation au chargement, décalée d'un portrait au
      suivant grâce à `--ceweb-equipe-i`, que PHP écrit sur chaque portrait.
   2. Là où les animations pilotées par le défilement existent, la même
      animation est liée à la `view()` du portrait : elle se joue quand il
      entre dans l'écran, et la cascade vient du quinconce lui-même. Le délai
      de rang est donc remis à zéro dans cette branche.

   `both` en mode de remplissage dans les deux cas : sans lui, chaque portrait
   clignoterait une image à sa position d'arrivée avant de reculer.
   ============================================================ */
@keyframes ceweb-equipe-rise{
  from{ opacity: 0; transform: translate3d(0, var(--ceweb-equipe-reveal-shift), 0); }
  to{ opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: no-preference){
  .ceweb-equipe--reveal .ceweb-equipe__member{
    animation: ceweb-equipe-rise var(--ceweb-equipe-reveal-duration) var(--ceweb-equipe-ease) both;
    animation-delay: calc(var(--ceweb-equipe-i, 0) * var(--ceweb-equipe-reveal-step));
  }

  @supports (animation-timeline: view()){
    .ceweb-equipe--reveal .ceweb-equipe__member{
      animation-timeline: view();
      /* `auto` : c'est la plage de défilement qui fait la durée, plus le temps. */
      animation-duration: auto;
      animation-range: entry 0% entry 55%;
      animation-delay: 0s;
    }
  }

  /* Dans l'éditeur, le widget est re-rendu en AJAX à chaque réglage : laisser
     l'apparition active ferait clignoter le bloc à chaque caractère tapé. */
  .elementor-editor-active .ceweb-equipe--reveal .ceweb-equipe__member{
    animation: none;
  }
}

/* ============================================================
   Mouvement réduit

   Les couleurs restent : ce sont elles qui signalent l'état. Seuls le
   déplacement et le zoom disparaissent.
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  .ceweb-equipe__inner,
  .ceweb-equipe .ceweb-equipe__photo .ceweb-equipe__image,
  .ceweb-equipe .ceweb-equipe__caption .ceweb-equipe__social{
    transition: none !important;
  }
  .ceweb-equipe--hover .ceweb-equipe__caption .ceweb-equipe__social:hover,
  .ceweb-equipe--hover .ceweb-equipe__caption .ceweb-equipe__social:focus-visible{
    transform: none;
  }
  .ceweb-equipe--hover .ceweb-equipe__member:hover .ceweb-equipe__inner,
  .ceweb-equipe--hover .ceweb-equipe__member:focus-within .ceweb-equipe__inner,
  .ceweb-equipe--hover .ceweb-equipe__member:hover .ceweb-equipe__image,
  .ceweb-equipe--hover .ceweb-equipe__member:focus-within .ceweb-equipe__image{
    transform: none;
  }
}