/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jul 21 2026 | 09:37:45 */
.mw-sticky {
  /* --- Réglages --- */
  --mw-stick-top: 0px;
  --mw-stick-gap: 5rem;
  --mw-stick-rest-scale: 0.8;
  --mw-stick-fade: 300ms;

  /* --- État interne : ne pas écrire à la main --- */
  --mw-stick-on: 0; /* passe à 1 dans la media query = mode épinglé */

  max-width: 28rem;
  margin-inline: auto;
}

.mw-sticky__viewport {
  display: flow-root;
}

.mw-sticky__panel {
  --mw-stick-visibility: 0;
}
.mw-sticky__panel:first-child {
  --mw-stick-visibility: 1; /* repli sans JS */
}
.mw-sticky__panel + .mw-sticky__panel {
  margin-top: 4rem;
}

.mw-sticky__row {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mw-sticky__text,
.mw-sticky__media {
  flex: 1 1 0%;
  display: flex;
  align-items: center;
}

/* En colonne, le visuel passe au-dessus du texte */
.mw-sticky__media { order: 0; }
.mw-sticky__text  { order: 1; }

.mw-sticky__media img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ---------------------------------------------------------------------------
   Bureau — mise en page, indépendante de toute animation
   --------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  .mw-sticky {
    max-width: none;
  }
  .mw-sticky__row {
    flex-direction: row;
    gap: var(--mw-stick-gap);
  }
  .mw-sticky__text,
  .mw-sticky__media {
    order: 0;
  }
  /* Variante : visuel à gauche, texte à droite */
  .mw-sticky--reverse .mw-sticky__row {
    flex-direction: row-reverse;
  }
}

/* ---------------------------------------------------------------------------
   Bureau + mouvement accepté — épinglage et révélation
   --------------------------------------------------------------------------- */
@media (min-width: 1024px) and (prefers-reduced-motion: no-preference) {
  .mw-sticky {
    --mw-stick-on: 1;
    min-height: var(--mw-stick-items, 100vh); /* piste de défilement, posée par le JS */
  }

  .mw-sticky__viewport {
    position: sticky;
    top: var(--mw-stick-top);
    height: calc(100vh - var(--mw-stick-top));
  }

  .mw-sticky__panel {
    position: absolute;
    inset: 0;
    z-index: var(--mw-stick-visibility); /* le panneau actif passe devant */
  }
  .mw-sticky__panel + .mw-sticky__panel {
    margin-top: 0;
  }

  .mw-sticky__row {
    height: 100%;
  }

  .mw-sticky__text {
    opacity: var(--mw-stick-visibility);
    transition: opacity var(--mw-stick-fade) ease;
  }

  /* échelle = repos + (1 − repos) × visibilité  →  0.8 au repos, 1 à l'actif */
  .mw-sticky__media {
    opacity: var(--mw-stick-visibility);
    transform: scale(
      calc(
        var(--mw-stick-rest-scale) + (1 - var(--mw-stick-rest-scale)) *
          var(--mw-stick-visibility)
      )
    );
    transform-origin: center;
    transition: opacity var(--mw-stick-fade) ease,
                transform var(--mw-stick-fade) ease;
  }
}