/* =========================================================================
 * LBYLCL Grille — Cellule : styles du shadow root.
 *
 * Aucun token n'est DÉCLARÉ ici. Tous viennent du :host de la grille et sont
 * hérités à travers l'arbre aplati ; chaque var() porte un repli pour que la
 * cellule reste lisible hors d'une grille, et dans le harnais Vite (§ 5).
 *
 * Aucune couleur en dur : l'encre et l'accent sont ceux du thème Webflow,
 * relayés par la grille. Un hex écrit ici serait invisible sur l'un des thèmes
 * sans que rien ne le signale.
 *
 * Rien n'est animé, donc pas de bloc `prefers-reduced-motion`.
 * ========================================================================= */

/*
 * Aucune largeur ici : c'est la ligne qui place la cellule dans sa colonne, et
 * l'arbre externe bat `:host` (§ 6.5). `display: flex` ne sert qu'à laisser
 * `.root` occuper toute la hauteur de la ligne quand la grille des cellules
 * étire ses items — le centrage vertical en dépend.
 */
:host {
  display: flex;
  min-width: 0;
}

.TSznx1WArNWlck1GdFMx {
  position: relative;
  box-sizing: border-box;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  min-width: 0;
  padding: 0.75rem var(--lcl-pg-pad-x, 0.75rem);
  font-family: var(--lcl-font-body, Inter, sans-serif);
  color: var(--lcl-pg-ink, #2a2240);
  text-align: center;
}

.TSznx1WArNWlck1GdFMx * {
  box-sizing: border-box;
}

/* — Texte — */

/* `overflow-wrap: anywhere` : en mobile, jusqu'à quatre colonnes se partagent
   la largeur, et un mot long ne doit pas déborder sur la cellule voisine. */
.t4Fdn1RVajXRQc_EB28l {
  max-width: 100%;
  font-family: var(--lcl-font-body, Inter, sans-serif);
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--lcl-pg-ink, #2a2240);
  overflow-wrap: anywhere;
}

.hTJMkPyqgOdD_Xk9OQQh {
  max-width: 100%;
  font-family: var(--lcl-font-body, Inter, sans-serif);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--lcl-pg-ink-soft, rgba(42, 34, 64, 0.72));
  overflow-wrap: anywhere;
}

/*
 * Les deux textes sont des `props.RichText` : leur contenu arrive SLOTTÉ, donc
 * `.value p` ne matche rien (§ 6.3). La typographie passe par l'héritage depuis
 * les deux blocs ci-dessus ; l'écart entre paragraphes, par une grille sur le
 * nœud slotté. `1lh` et non quelques pixels : le « Line Height Trim » du site
 * retire un demi-interlignage en haut et en bas de chaque `<p>` (§ 6.6), donc un
 * petit écart se lit comme une simple ligne de plus, collée à la précédente.
 */
.t4Fdn1RVajXRQc_EB28l > slot::slotted(*),
.hTJMkPyqgOdD_Xk9OQQh > slot::slotted(*) {
  display: grid !important;
  row-gap: 1.35em !important;
  row-gap: 1lh !important;
  margin: 0 !important;
}

/* — Icône — */

.cr3M_TF0Lct3CBPo7JNP {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
}

.cr3M_TF0Lct3CBPo7JNP svg {
  display: block;
}

/* Coche : pastille pleine à l'accent du thème, trait à son encre. */
.cr3M_TF0Lct3CBPo7JNP[data-included="true"] {
  background: var(--lcl-pg-accent, #e0fa00);
  color: var(--lcl-pg-accent-ink, #2a2240);
}

/* Croix : même pastille, en contour. Le contour est compris dans les 22px
   (`box-sizing: border-box`), les deux pictogrammes ont donc la même taille. */
.cr3M_TF0Lct3CBPo7JNP[data-included="false"] {
  background: transparent;
  border: 1.5px solid var(--lcl-pg-rule, rgba(42, 34, 64, 0.16));
  color: var(--lcl-pg-ink-soft, rgba(42, 34, 64, 0.72));
}

/* — Réservé aux lecteurs d'écran — */

.yT9mMQuDjaUb3Gk3Pp9n {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}