/** Shopify CDN: Minification failed

Line 5203:9 Cannot use type selector "--static" directly after nesting selector "&"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:mm-cards (INDEX:0) */
.mm-catslider { padding: 80px 0; background: var(--mm-cards-bg, var(--mm-color-white, #ffffff)); }

  .mm-catslider__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mm-space-6);
    padding: 0 max(var(--mm-space-12), var(--mm-content-gutter));
    padding-bottom: var(--mm-space-9);
  }
  .mm-catslider .mm-slider-arrow svg {
    height: 16px !important;
    width: 16px !important;
  }

  @media (max-width: 989px) { .mm-catslider__header { padding: 0 var(--mm-space-4) var(--mm-space-7); } }
  /* Mobile : pas de flèches, la navigation se fait au drag (le drag reste
     actif via MmMotion.dragScroll). Même parti-pris que le blog-slider. */
  @media (max-width: 749px) { .mm-catslider__header .mm-slider-arrow { display: none; } }
  /* Desktop : flèches masquées quand toutes les cartes tiennent à l'écran
     (classe is-overflow posée nativement par Splide, absente avant mount). */
  .mm-catslider:has(.mm-catslider__slider:not(.is-overflow)) .mm-catslider__header .mm-slider-arrows { display: none; }
  /* Variant grid (2-3 cartes, cf. Figma) : pas de flèches, titre seul et centré */
  .mm-catslider--grid .mm-catslider__header { justify-content: center; }

  /* Fond violet foncé : titre en blanc pour le contraste */
  .mm-catslider--dark .mm-catslider__title { color: var(--mm-color-white, #ffffff); }
  @media (max-width: 749px) { .mm-catslider__title { font-size: 34px; }

  .mm-catslider__title {
    padding-bottom: 28px;
	text-align: start;
  }
  .mm-catslider__header {
    padding: 0 var(--mm-space-4);
    text-align: center;
    gap: 0;
  }
}
  /* Variant grid : titre centré (maquette), texte non contraint par le header flex */
  .mm-catslider--grid .mm-catslider__title { text-align: center; }

  /* ----- Piste -----
     Gouttières en !important : sans option "padding", Splide pose un
     padding-left/right: 0px inline sur .splide__track (cssPadding) — il relit
     ensuite le padding calculé (getPadding), donc le CSS reste la source. */
  .mm-catslider__track {
    padding-inline: max(var(--mm-space-12), var(--mm-content-gutter)) !important;
  }
  .mm-catslider__slider.splide .mm-catslider__track { cursor: grab; }
  .mm-catslider__track img { -webkit-user-drag: none; user-select: none; }
  @media (width > 1720px) {
    .mm-catslider__track {
      margin-inline: max(var(--mm-space-12), var(--mm-content-gutter));
      padding-inline: 0 !important;
    }
  }
  @media (max-width: 989px) {
    .mm-catslider__track { padding-inline: var(--mm-space-4) !important; }
  }

  /* Variant grid (2-3 cartes) : grille figée pleine largeur, pas de Splide.
     Nombre de colonnes = nombre de blocks. */
  .mm-catslider--grid .mm-catslider__list {
    display: grid;
    gap: var(--mm-space-5);
  }
  .mm-catslider--grid-2 .mm-catslider__list { grid-template-columns: repeat(2, 1fr); }
  .mm-catslider--grid-3 .mm-catslider__list { grid-template-columns: repeat(3, 1fr); }
  @media (max-width: 749px) {
    .mm-catslider--grid .mm-catslider__list { grid-template-columns: 1fr; gap: 16px; }
  }

  /* ----- Slide (largeur) ----- */
  .mm-catslide {
    flex: 0 0 372px;
    transition: flex-basis var(--mm-duration-medium) var(--mm-curve-out);
  }
  /* Variante large : desktop uniquement (neutralisée sous 749px plus bas) */
  .mm-catslide--large { flex-basis: 744px; }

  /* ----- Carte ----- */
  .mm-catcard {
    position: relative;
    display: block;
    height: 400px;
    border-radius: 30px;
    overflow: hidden;
    color: var(--mm-color-white, #ffffff);
    text-decoration: none;
    isolation: isolate;
    transition: transform var(--mm-duration-medium) var(--mm-curve-out);
  }
  /* Hover carrousel (cf. Figma node 10424-28542) : la slide survolée
     s'élargit (372px → 546px, même ratio que la maquette 350px → 514px),
     les voisines sont repoussées dans le flex — pas de recouvrement.
     Carrousel standard uniquement : en variant grid les cartes sont figées
     en 1fr (cf. règles --grid plus bas qui passent après et l'emportent).
     Exclu de la variante "large" (744px), déjà plus large que le hover. */
  .mm-catslider:not(.mm-catslider--grid) .mm-catslide:not(.mm-catslide--large):hover,
  .mm-catslider:not(.mm-catslider--grid) .mm-catslide:not(.mm-catslide--large):has(:focus-visible) {
    flex-basis: 546px;
  }
  /* Slide active Splide (.is-active) élargie sans avoir à la survoler (cf.
     Figma : un état actif doit toujours être visible). La 1ère au mount,
     puis celle sur laquelle flèches / drag se calent. Dès qu'une autre slide
     est survolée/focus, elle prend le relais via la règle :hover ci-dessus
     et la slide active revient à sa largeur normale. */
  .mm-catslider:not(.mm-catslider--grid) .mm-catslide.is-active:not(.mm-catslide--large) {
    flex-basis: 546px;
  }
  .mm-catslider:not(.mm-catslider--grid):has(.mm-catslide:not(.is-active):hover),
  .mm-catslider:not(.mm-catslider--grid):has(.mm-catslide:not(.is-active) :focus-visible) {
    & .mm-catslide.is-active:not(.mm-catslide--large) {
      flex-basis: 372px;
    }
  }
  /* Mesure de la destination Splide (MM-Cards.js) : transitions coupées le
     temps d'une lecture de layout, jamais visible à l'écran */
  .mm-catslider__list.is-measuring .mm-catslide { transition: none; }
  @media (width > 1800px) {
    .mm-catslider:not(.mm-catslider--grid) .mm-catslider__list:not(:has(> .mm-catslide:nth-child(5))) .mm-catslide {
      flex-shrink: 1;
      min-width: 0;
    }
  }
  @media (max-width: 749px) {
    .mm-catslide,
    .mm-catslide--large { flex-basis: 300px; }
    .mm-catcard { height: 320px; }
    /* Pas d'élargissement hover / actif en mobile : largeur fixe, drag-only
       (la slide active y révèle sa description, cf. plus bas) */
    .mm-catslider:not(.mm-catslider--grid) .mm-catslide:not(.mm-catslide--large):hover,
    .mm-catslider:not(.mm-catslider--grid) .mm-catslide:not(.mm-catslide--large):has(:focus-visible),
    .mm-catslider:not(.mm-catslider--grid) .mm-catslide.is-active:not(.mm-catslide--large) {
      flex-basis: 300px;
    }
  }

  /* Variant grid : la grille pilote la largeur (1fr chacune, "Largeur de la
     carte" du block n'a pas de sens ici), hauteur/rayon/bordure de la
     maquette Figma. */
  .mm-catslider--grid .mm-catcard {
    height: 587px;
    border: 1px solid var(--mm-color-ui-border, #e9e8e8);
  }
  .mm-catslider--grid .mm-catcard--dark { border-color: var(--mm-color-black-700, #595655); }

  @media (max-width: 749px) {
    .mm-catslider--grid .mm-catcard {
      height: 335px;
      border-radius: 20px;
    }

  }

  .mm-catcard img {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform .8s var(--mm-curve-medium);
  }
  .mm-catcard:hover img { transform: scale(1.07); }

  /* overlay sombre, renforcé au hover pour la lisibilité
     intensité pilotée par --mm-catcard-overlay (setting "Intensité de
     l'overlay", 0-100%) : multiplie l'opacité de repos ET celle du hover
     pour garder le même écart relatif entre les deux états. */
  .mm-catcard::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(32,28,27,.55) 0%, rgba(32,28,27,.12) 45%, rgba(32,28,27,.35) 100%);
    opacity: var(--mm-catcard-overlay, 100%);
    transition: opacity var(--mm-duration-medium) var(--mm-curve-out);
  }
  .mm-catcard:hover::after { opacity: calc(var(--mm-catcard-overlay, 100%) * .85); }

  /* Overlay optionnel (par carte) : pas de ::after du tout si désactivé */
  .mm-catcard--no-overlay::after { content: none; }

  /* ----- Option texte noir (visuel clair) : overlay blanc pour la lisibilité ----- */
  .mm-catcard--dark { color: var(--mm-color-black-900, #201c1b); }
  .mm-catcard--dark::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .12) 45%, rgba(255, 255, 255, .35) 100%);
  }
  /* pastille à fond blanc : bordure de séparation quand le visuel est clair */
  .mm-catcard--dark .mm-catcard__arrow--white { border: 1px solid var(--mm-color-ui-border, #e9e8e8); }

  .mm-catcard__head {
    display: flex;
    align-items: center;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--mm-space-3);
    padding: 32px 40px 8px;
  }
  .mm-catcard__title {
    margin: 0;
    font: 800 25px / 1.1 var(--mm-font);
    letter-spacing: -0.5px;
    /* la règle typographique globale pose black-900 sur h3/p : la carte impose
       sa couleur (blanc par défaut, noir en variante --dark) */
    color: inherit;
  }
  .mm-catslider .mm-slider-arrows {
    gap: var(--mm-space-3);
}

  /* Pastille = CTA spécifique : géométrie, couleur, transitions et spring du
     survol viennent du COMPOSANT bouton (mm-btn-white mm-btn-icon-round +
     data-btn-hover-scope sur la card). Ne restent ici que le placement et le
     hover propre de la section. */
  .mm-catcard__arrow { flex: none; /* placement : la pastille ne se comprime pas dans le head flex */ }
  /* Deux combos de repos, choisis par carte (block). On repose les jetons
     --btn-bg / --btn-color du COMPOSANT bouton — spécificité alignée sur
     `.mm-btn.mm-btn-white` de mm-cta.css. Le survol ci-dessous garde la main
     via un `background:` direct → fond accent inchangé dans les deux cas. */
  .mm-btn.mm-catcard__arrow--white {
    --btn-bg: var(--mm-color-white, #ffffff);
    --btn-color: var(--mm-color-primary, #3b0117);
  }
  .mm-btn.mm-catcard__arrow--violet {
    --btn-bg: var(--mm-color-primary, #3b0117);
    --btn-color: var(--mm-color-white, #ffffff);
  }
  /* hover propre : rotation -45° + fond accent (signature de la section),
     par-dessus le spring du hover-scope — spécificité relevée pour passer
     devant [data-btn-hover-scope]:hover .mm-btn:not([disabled]) de mm-cta.css */
  .mm-catcard[data-btn-hover-scope]:hover .mm-btn.mm-catcard__arrow {
    transform: rotate(-45deg) scale(1.1);
    background: var(--mm-color-accent, #e3f77e);
    /* fond accent (clair) dans les deux combos → flèche toujours dark-violet
       au survol, quel que soit le combo de repos */
    --btn-color: var(--mm-color-primary, #3b0117);
  }

  /* Description révélée au hover */
  .mm-catcard__desc {
    padding: 0 40px;
    margin: 0;
    color: inherit;
    font: 400 var(--mm-font-size-text-sm) / 1.5 var(--mm-font);
    max-height: 0;
    opacity: 0;
    transform: translateY(14px);
    transition:
      max-height var(--mm-duration-slow) var(--mm-curve-out),
      opacity var(--mm-duration-medium) var(--mm-curve-out),
      transform var(--mm-duration-slow) var(--mm-curve-medium);
  }
  .mm-catcard:hover .mm-catcard__desc,
  .mm-catcard:focus-visible .mm-catcard__desc {
    max-height: 220px;
    opacity: 1;
    transform: translateY(0);
  }
  /* Variant grid : pas d'effet hover/active à attendre (cartes toujours
     visibles ensemble, pas de Splide) — description visible d'emblée,
     comme sur la maquette. */
  .mm-catslider--grid .mm-catcard__desc {
    max-height: 220px;
    opacity: 1;
    transform: translateY(0);
  }

  @media (max-width: 749px) {
    .mm-catcard__title {
      font-size: 16px;
    }
    .mm-catcard__head {
      padding: 16px;
      gap: var(--mm-space-4);
      align-items: center;
    }
    .mm-catslider__track { padding-inline: var(--mm-space-5) !important; }
    .mm-catcard .mm-catcard__arrow  svg {
      height: 16px !important;
      width: 16px !important;
    }

  }


  /* mobile / tactile : la slide active Splide (calée à gauche) révèle sa
     description, comme le hover en desktop */
  @media (hover: none), (max-width: 749px) {
    .mm-catslide.is-active .mm-catcard__desc {
      max-height: 220px;
      opacity: 1;
      transform: translateY(0);
      padding: 0 16px;
    }
    /* scale actif sans transition : bascule instantanée d'une carte à l'autre
       au scroll, pas d'effet d'animation perçu au toucher */
    .mm-catslide,
    .mm-catcard,
    .mm-catcard img { transition: none; }
    /* pas de scale de la carte en mobile : la piste (overflow-x: auto)
       rogne le haut/bas de la carte agrandie */
    @media (min-width: 750px) {
      .mm-catslide.is-active .mm-catcard { transform: scale(1.05); }
    }
    .mm-catslide.is-active .mm-catcard img { transform: scale(1.07); }
    .mm-catslide.is-active .mm-catcard::after { opacity: calc(var(--mm-catcard-overlay, 100%) * .85); }
    /* même hover propre que le desktop, déclenché par .is-active (pas de
       :hover tactile → le hover-scope ne joue pas, la rotation suffit) */
    .mm-catslide.is-active .mm-catcard__arrow {
      transform: rotate(-45deg) scale(1.1);
      background: var(--mm-color-accent, #e3f77e);
      --btn-color: var(--mm-color-primary, #3b0117);
    }
    .mm-catslider {
    padding: var(--mm-space-12) 0;
    }
  }
/* END_SECTION:mm-cards */

/* START_SECTION:mm-grid-collection (INDEX:8) */
.mm-grid-collection {
        padding: var(--margin-8, 32px) max(var(--margin-13, 120px), var(--mm-content-gutter));
    }

    .mm-grid-collection__wrapper {
        container: mm-grid-collection / inline-size;
    }

    .mm-grid-collection__grid {
        --mm-grid-cols: 3;
        display: grid;
        grid-template-columns: repeat(var(--mm-grid-cols), 1fr);
        gap: 40px 16px;
    }

    @container mm-grid-collection (width > 1232px) {
        .mm-grid-collection__grid {
            --mm-grid-cols: 4;
        }
    }

    .mm-grid-collection-slot {
        grid-column: 1 / -1;
        order: var(--mm-grid-break-after, var(--mm-grid-cols));
        border-radius: 30px;
    }

    @media (width <= 1280px) {
        .mm-grid-collection {
            padding: var(--mm-space-8, 32px) var(--mm-space-10, 48px);
        }
    }

    @media (width <= 990px) {
        .mm-grid-collection {
            padding: var(--mm-space-8, 32px) var(--mm-space-5, 20px);
        }
        .mm-grid-collection__wrapper {
            gap: 16px;
        }
        .mm-grid-collection__grid {
            --mm-grid-cols: 2;
            --mm-grid-break-after: 6;
            gap: 16px 8px;
        }
        
        .mm-grid-collection-slot {
            border-radius: 0px;
            width: calc(100% + 40px);
            margin: 0 -20px;
        }
    }
    @media (width <= 768px) {
        .mm-grid-collection__grid[data-mobile-columns="1"] {
            --mm-grid-cols: 1;
            --mm-grid-break-after: 3;
        }
        .mm-grid-collection {
            gap: 16px;
        }
        .mm-grid-collection-title  {
            align-items: center;
            text-align: center;
            font-size: var(--mm-font-size-text, 16px);
        }
    }
/* END_SECTION:mm-grid-collection */

/* START_SECTION:mm-grille-blog (INDEX:9) */
.mm-grille-blog {
        overflow-x: clip;
    }

    .mm-grille-blog-layout {
        padding: var(--mm-space-12, 80px) max(var(--mm-space-12, 80px), var(--mm-content-gutter));
        gap: var(--mm-space-7, 24px);
    }

    .mm-grille-blog-aside {
        position: sticky;
        top: calc(var(--header-height, 66px) + var(--mm-space-4, 16px));
    }

    .mm-grille-blog-articles {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mm-space-9, 32px) var(--mm-space-7, 24px);
    }

    @media (width <= 1280px) {
        .mm-grille-blog-layout {
            padding: var(--mm-space-8, 32px) var(--mm-space-8, 32px) var(--mm-space-10, 48px) var(--mm-space-8, 32px);
        }
    }

    @media (width <= 768px) {
        .mm-grille-blog-layout {
            padding: var(--mm-space-6, 24px) var(--mm-space-6, 24px) var(--mm-space-10, 48px) var(--mm-space-6, 24px);
            background: var(--mm-color-black-50);
        }
        .mm-grille-blog-articles {
            grid-template-columns: repeat(1, 1fr);
            gap: var(--mm-space-4, 16px);
        }
        .mm-grille-blog-aside {
            position: static;
        }
    }
/* END_SECTION:mm-grille-blog */

/* START_SECTION:mm-hero-article (INDEX:11) */
.mm-hero-article {
        padding: var(--mm-space-12, 80px) var(--mm-space-12, 80px) var(--mm-space-10, 48px) var(--mm-space-12, 80px);
    }

    .mm-hero-article .mm-hero-article__breadcrumb {
        top: 20px;
        left: 80px;
    }
    .mm-hero-article__image {
        max-width: 1000px;
        margin: 0 auto;
        border-radius: 20px;
        aspect-ratio: 2;
        width: 100%;
    }
    .mm-article-article__title {
        max-width: 800px;
        margin: 0 auto;
        text-wrap: pretty;
    }
    .mm-article-article__excerpt {
        max-width: 500px;
        margin: 0 auto;
    }
    .mm-hero-article__info,
    .mm-section-article {
        .mm-auteur-image {
            width: 40px;
            height: 40px;
        }
        .mm-auteur-name,
        .mm-auteur-date {
            font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
        }
    }
    @media (max-width: 768px) {
        .mm-hero-article {
            padding: 0px;
        }
        .mm-hero-article__wrapper {
            gap: 0px;
            flex-direction: column-reverse;
        }
        .mm-hero-article__image {
            border-radius: 0px;
            aspect-ratio: 1.23;
        }
        .mm-hero-article__info {
            padding: var(--mm-space-4, 16px) var(--mm-space-5, 20px) var(--mm-space-8, 32px) var(--mm-space-5, 20px);
            align-items: start;
            text-align: start;
            gap: var(--mm-space-3, 12px);
            background: var(--mm-color-pink-light, #FEF7FF);
            max-width: 100%;
            width: 100%;

            .mm-auteur-image {
                width: 30px;
                height: 30px;
            }
            .mm-auteur-name,
            .mm-auteur-date {
                font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
            }
        }
        .mm-section-article {
            .mm-auteur-image {
                width: 30px;
                height: 30px;
            }
            .mm-auteur-name,
            .mm-auteur-date {
                font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
            }

        }
        .mm-hero-article .mm-hero-article__breadcrumb {
            position: static;
        }
        .mm-hero-article__content {
            align-items: start;
        }
        .mm-article-article__title {
            font-size: var(--mm-font-size-title-sm-mobile, 25px); letter-spacing: -0.8px;
        }
        .mm-article-article__excerpt {
            max-width: 100%;
            width: 100%;
            font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
        }
    }
/* END_SECTION:mm-hero-article */

/* START_SECTION:mm-hero-blog (INDEX:12) */
.mm-hero-blog {
        padding: var(--mm-space-10, 48px) max(var(--mm-space-12, 80px), var(--mm-wide-gutter));
    }
    .mm-hero-blog::before {
        content: '';
        position: absolute;
        z-index: -1;
        top: calc(var(--mm-space-10, 48px) * -1);
        right: calc(var(--mm-space-12, 80px) * -1);
        height: calc(100% + var(--mm-space-10, 48px) * 2);
        aspect-ratio: 965 / 525;
        background: var(--mm-color-green, #cbe4c6);
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='965' height='525' viewBox='0 0 965 525' fill='none'%3E%3Cpath d='M63.3778 952.622C278.085 1081.38 443.605 1247.81 310.92 820.429C178.234 393.047 329.584 422.101 448.668 583.87C621.998 819.329 620.202 566.688 576.689 424.378C551.129 339.813 415.93 -142.451 726.722 280.776C1037.51 704.001 946.7 437.488 894.422 249.394C842.144 61.2994 662.843 -502.599 1004.56 14.8465C1273.66 422.327 1336.86 140.929 1278.88 -47.0006' stroke='%23000' stroke-width='246.466'/%3E%3C/svg%3E") no-repeat center / contain;
        pointer-events: none;
    }
    .mm-hero-blog .mm-hero-blog__breadcrumb {
        top: -20px;
        left: 0;
    }

    .mm-hero-blog__content {
        flex: 1 1 45%;
        min-width: 0;
    }
    .mm-hero-blog__description {
        max-width: 30ch;
    }
    .mm-hero-blog > .mm-article-card {
        flex: 1 1 55%;
        min-width: 0;
        justify-content: end;
    }

    @media (width <= 990px) {
        .mm-hero-blog {
            padding: var(--mm-space-4, 16px) var(--mm-space-5, 20px) var(--mm-space-8, 32px);
            flex-direction: column;
        }
        .mm-hero-blog::before {
            top: auto;
            bottom: calc(var(--mm-space-8, 32px) * -1);
            left: calc(var(--mm-space-5, 20px) * -1);
            right: calc(var(--mm-space-5, 20px) * -1);
            width: auto;
            height: auto;
            aspect-ratio: 375 / 509;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='375' height='509' viewBox='0 0 375 509' fill='none'%3E%3Cpath d='M-190.08 648.188C-81.2069 744.427 -4.39759 856.955 -34.802 598.997C-65.2064 341.039 18.0825 373.666 68.8869 478.607C142.834 631.352 168.596 486.989 158.854 401.165C153.234 350.197 127.214 60.6534 259.697 335.124C392.18 609.594 368.614 447.877 358.724 334.996C348.834 222.116 306.302 -118.689 446.444 212.827C556.803 473.891 622.707 320.01 609.544 206.619' stroke='%23000' stroke-width='143.05'/%3E%3C/svg%3E") no-repeat center / contain;
        }
        .mm-hero-blog__content,
        .mm-hero-blog > .mm-article-card {
            flex: none;
        }
        .mm-hero-blog__content {
            gap: var(--mm-space-3, 12px);
        }
        .mm-hero-blog .mm-hero-blog__breadcrumb {
            position: static;
            top: initial;
        }
        .mm-hero-blog__description {
            max-width: none;
            font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
        }
    }
/* END_SECTION:mm-hero-blog */

/* START_SECTION:mm-hero-collection (INDEX:13) */
.mm-hero-collection {
        padding: 30px max(0px, var(--mm-wide-gutter)) 48px max(80px, var(--mm-wide-gutter));
    }
    .mm-hero-collection__breadcrumb {
        padding-top: 12px;
    }
    .mm-hero-collection__content {
        min-width: 0;
        max-width: 50%;
    }
    .mm-hero-collection__info {
        max-width: 768px;
    }

    @media (width <= 1280px)  {
        .mm-hero-collection {
            padding: 30px 0px 48px 40px;
            gap: 32px;
        }
    }
    @media (width <= 1024px) {
        .mm-hero-collection {
            padding: 0px;
        }
        .mm-hero-collection__content {
            gap: 0px;
            flex: initial;
            width: 100%;
            max-width: 100%;
        }
        .mm-hero-collection__info {
            padding: var(--mm-space-5, 20px);
            gap: var(--mm-space-6, 24px);
        }
    }
/* END_SECTION:mm-hero-collection */

/* START_SECTION:mm-hero (INDEX:15) */
.mm-hero {
    padding: var(--mm-space-6, 24px) max(var(--mm-space-12, 80px), var(--mm-wide-gutter)) 0;
  }
  @media (max-width: 989px) { .mm-hero { padding: var(--mm-space-4, 16px) var(--mm-space-4, 16px) 0; } }

  .mm-hero__frame {
    min-height: 640px;
    display: flex;
    align-items: center;
  }
  @media (width <= 768px) { .mm-hero__frame { min-height: 520px; } }

  /* ----- Slides / fond ----- */
  .mm-hero__slide-bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity var(--mm-duration-slow, .65s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1));
  }
  .mm-hero__slide-bg.is-active { opacity: 1; }
  /* Overlay de lisibilité — opacité réglable par slide via --slide-overlay
     (setting overlay_opacity). Uni sombre, sur les slides avec image. */
  .mm-hero__slide-bg:has(img)::after {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--mm-color-ui-title, #201c1b);
    opacity: var(--slide-overlay, 0.4);
  }
  .mm-hero__slide-bg picture {
    position: absolute;
    inset: 0;
    display: block;
  }
  .mm-hero:not(.is-slides-loaded) .mm-hero__slide-bg:not(.is-active) picture { display: none; }
  /* Vidéo de fond : couvre l'image (qui sert de fallback si la vidéo ne charge pas) */
  .mm-hero__slide-video {
    position: absolute;
    inset: 0;
  }
  .mm-hero__slide-video video,
  .mm-hero__slide-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .mm-hero__slide-video--mobile { display: none; }
  @media (width <= 768px) {
    .mm-hero__slide-video--desktop { display: none; }
    .mm-hero__slide-video--mobile { display: block; }
  }
  .splide__arrow--prev {
    left: 0;
  }
  .mm-hero__slide-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Ken Burns discret pendant toute la slide */
    transform: scale(1.06);
  }
  .mm-hero__slide-bg.is-active img {
    animation: mm-hero-kenburns 9s var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) forwards;
  }
  @keyframes mm-hero-kenburns {
    from { transform: scale(1.06); }
    to   { transform: scale(1); }
  }

  /* ----- Contenu ----- */
  .mm-hero__content {
    z-index: 2;
    max-width: 640px;
    padding: var(--mm-space-11, 64px);
  }
  @media (width <= 768px) { .mm-hero__content { padding: var(--mm-space-6, 24px); } }

  /* état "sortie" pendant le changement de slide — les flèches restent visibles */
  .mm-hero.is-switching .mm-hero__content > *:not(.mm-hero__nav) {
    opacity: 0 !important;
    transform: translateY(12px) !important;
    transition: opacity 200ms var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)), transform 200ms var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) !important;
  }

  /* Pill de notation : atome mm-rating (mm-rating.css) — ici seulement
     l'entrée orchestrée, via la classe de placement mm-hero__rating.
     .is-rating-hidden : masquée sur les slides où le block la désactive
     (classe posée par le JS au swap, ou en Liquid pour le 1er slide). */
  .mm-hero__rating.is-rating-hidden {
    display: none;
  }

  .mm-rating.mm-hero__rating {
    box-shadow: var(--mm-shadow-md);
  }
  /* note (4.6/5) en gras marqué, le compte (+50 000) garde le poids de l'atome */
  .mm-hero__rating strong:first-of-type {
    font-weight: 800;
  }

  /* CTA masqué sur les slides sans bouton (classe posée par le JS / Liquid) */
  .mm-hero__cta-row.is-cta-hidden {
    display: none;
  }

  /* ----- Couleur du contenu (setting content_color par slide) -----
     Le JS reporte .mm-hero--content-dark / --content-light sur .mm-hero
     selon le slide actif. Figma : foncé #3b0117 / blanc #fef7ff. */
  .mm-hero--content-dark  { --mm-hero-content-color: var(--mm-color-primary, #3b0117); }
  .mm-hero--content-light { --mm-hero-content-color: var(--mm-color-secondary-light, #fef7ff); }

  .mm-hero__title {
    margin: var(--mm-space-5, 20px) 0 var(--mm-space-3, 12px);
    font: 800 var(--mm-font-size-title, 57px) / 1.06 var(--mm-font);
    letter-spacing: -1.2px;
    color: var(--mm-hero-content-color, var(--mm-color-primary, #3b0117));
    transition: color var(--mm-duration-slow, .65s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1));
  }
  @media (width <= 768px) { .mm-hero__title { font-size: 34px; } }

  /* CTA : variante selon la couleur du contenu (blanc → fond blanc, foncé → bordeaux) */
  .mm-hero--content-light .mm-hero__cta-row .mm-btn {
    --btn-bg: var(--mm-color-white, #ffffff);
    --btn-color: var(--mm-color-ui-title, #201c1b);
    --btn-shadow: 0 10px 30px rgba(32, 28, 27, 0.14);
  }
  .mm-hero--content-dark .mm-hero__cta-row .mm-btn {
    --btn-bg: var(--mm-color-primary, #3b0117);
    --btn-color: var(--mm-color-white, #ffffff);
  }

  /* apparition mot à mot */
  .mm-hero__word {
    display: inline-block;
    overflow: hidden;
    vertical-align: bottom;
  }
  .mm-hero__word > span {
    display: inline-block;
    transform: translateY(110%);
    transition: transform .65s var(--mm-curve-medium, cubic-bezier(.34, 1.56, .64, 1));
    transition-delay: calc(var(--w, 0) * 70ms + 150ms);
  }
  .mm-hero.is-in .mm-hero__word > span { transform: translateY(0); }

  .mm-hero__subtitle {
    margin: 0 0 var(--mm-space-9, 40px);
    color: var(--mm-hero-content-color, var(--mm-color-primary, #3b0117));
    transition: color var(--mm-duration-slow, .65s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1));
  }

  /* entrées orchestrées */
  .mm-hero__rating,
  .mm-hero__subtitle,
  .mm-hero__cta-row,
  .mm-hero__nav {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity var(--mm-duration-slow, .65s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)), transform var(--mm-duration-slow, .65s) var(--mm-curve-medium, cubic-bezier(.34, 1.56, .64, 1));
  }
  .mm-hero__rating   { transform: scale(.6); transition-delay: 0s; }
  .mm-hero__subtitle { transition-delay: .32s; }
  .mm-hero__cta-row  { transition-delay: .42s; }
  .mm-hero__nav      { transition-delay: .55s; }
  .mm-hero.is-in .mm-hero__rating,
  .mm-hero.is-in .mm-hero__subtitle,
  .mm-hero.is-in .mm-hero__cta-row,
  .mm-hero.is-in .mm-hero__nav {
    opacity: 1;
    transform: none;
  }
  /* une fois la première entrée jouée, les flèches restent en place */
  .mm-hero.is-ready .mm-hero__nav {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .mm-hero__nav { margin-top: var(--mm-space-12, 80px); }
  /* @media (max-width: 749px) { .mm-hero__nav { margin-top: var(--mm-space-8, 32px); } } */

  /* ----- Anneau de progression autoplay autour de la flèche « suivant »
     La feuille mm-slider-controls.css applique .mm-slider-arrow svg { width:20px }
     qui écrase la taille du SVG anneau (spécificité supérieure). On réaffirme
     ici, scopé au hero, avec l'aspect voulu : arc épais et écarté du bouton. */
  .mm-hero .mm-slider-arrow-progress { overflow: visible; }
  .mm-hero .mm-slider-arrow .mm-slider-arrow-ring,
  .mm-hero .mm-slider-arrow-ring {
    position: absolute;
    inset: -9px;
    width: calc(100% + 18px);
    height: calc(100% + 18px);
    pointer-events: none;
    transform: rotate(-90deg);
    opacity: 1;
  }
  .mm-hero .mm-slider-arrow-ring circle {
    fill: none;
    stroke: var(--mm-slider-ring-color, var(--mm-color-white, #ffffff));
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 201; /* 2π × r32 */
    stroke-dashoffset: 201;
  }
  /* remplissage linéaire sur --ring-dur pendant is-cycling (relancé par le JS) */
  .mm-hero.is-cycling .mm-slider-arrow-ring circle {
    animation: mm-ring-fill var(--ring-dur, 7s) linear forwards;
  }
  @keyframes mm-ring-fill {
    from { stroke-dashoffset: 201; }
    to   { stroke-dashoffset: 0; }
  }
  /* couleur de l'anneau selon la couleur de contenu du slide actif */
  .mm-hero--content-dark  .mm-hero__nav { --mm-slider-ring-color: var(--mm-color-primary, #3b0117); }
  .mm-hero--content-light .mm-hero__nav { --mm-slider-ring-color: var(--mm-color-secondary-light, #fef7ff); }

  /* ----- Barre de réassurance (icônes via mm-reassurance-icon) ----- */
  .mm-hero__reassurance {
    grid-template-columns: repeat(4, 1fr);
    padding: var(--mm-space-6, 24px) 0;
  }
  @media (max-width: 989px) {
    .mm-hero__reassurance { grid-template-columns: repeat(2, 1fr); row-gap: var(--mm-space-5, 20px); }
  }
  .mm-hero__item {
    padding: 0 var(--mm-space-6, 24px);
  }
  .mm-hero__item + .mm-hero__item { border-left: 1px solid var(--mm-color-ui-border, #e9e8e8); }
  @media (max-width: 989px) {
    .mm-hero__item:nth-child(odd) { border-left: 0; }
  }
  .mm-hero__item .mm-reassurance-icon { flex: none; }
  .mm-hero__item-title {
    margin: 0;
    font: 500 var(--mm-font-size-text, 16px) / 1.3 var(--mm-font);
    color: var(--mm-color-black-900, #201c1b);
  }
  .mm-hero__item-sub {
    margin: 2px 0 0;
    font: 400 var(--mm-font-size-text-sm, 14px) / 1.35 var(--mm-font);
    color: var(--mm-color-ui-text-light, #8f8e8d);
  }

  /* ----- Bullets à anneau (mobile) : le contour du point actif se remplit
     sur --hero-autoplay, relancé par is-cycling à chaque slide ----- */
  .mm-hero__dots { display: none; align-items: center; justify-content: center; gap: 0; }
  .mm-hero__dot {
    position: relative;
    width: 24px;
    height: 24px;
    padding: 8px;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--mm-hero-content-color, #3b0117) 40%, transparent);
    background-clip: content-box;
    cursor: pointer;
    transition: background-color var(--mm-duration-fast, .2s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)), transform var(--mm-duration-medium, .38s) var(--mm-curve-medium, cubic-bezier(0.34, 1.56, 0.64, 1));
  }
  .mm-hero__dot:hover { transform: scale(1.25); }
  .mm-hero__dot.is-active { background-color: var(--mm-hero-content-color, #3b0117); }
  .mm-hero__dot-ring {
    position: absolute;
    inset: 3px;
    width: 18px;
    height: 18px;
    transform: rotate(-90deg);
    pointer-events: none;
    opacity: 0;
  }
  .mm-hero__dot.is-active .mm-hero__dot-ring { opacity: 1; }
  .mm-hero__dot-ring circle {
    fill: none;
    stroke: var(--mm-hero-content-color, #3b0117);
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-dasharray: 37.7; /* 2π × r6 */
    stroke-dashoffset: 37.7;
  }
  .mm-hero.is-cycling .mm-hero__dot.is-active .mm-hero__dot-ring circle {
    animation: mm-hero-dot-ring var(--hero-autoplay, 7s) linear forwards;
  }
  @keyframes mm-hero-dot-ring { to { stroke-dashoffset: 0; } }

  /* ----- Mobile (Figma 10785-258246, variante Style=Image) :
     hero FULL-BLEED, contenu centré aligné en bas, overlay uni réglable,
     flèches remplacées par les puces ----- */
  @media (width <= 768px) {
    .mm-hero {
      padding: 0;
      min-height: 540px;
    }
    /* spécificité > .mm-radius-xl (utilitaire posé sur le frame).
       Les slides sont en position:absolute → le contenu est le seul enfant
       en flux : colonne + justify-end pour l'aligner en bas. */
    .mm-hero .mm-hero__frame {
      border-radius: 0;
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-end;
      min-height: 100svh;
    }
    /* fond rose derrière l'image (PNG transparent) + Ken Burns conservé.
       L'overlay reste identique au desktop : opacité = réglage overlay_opacity
       du slide (--slide-overlay), défini plus haut sur .mm-hero__slide-bg::after. */
    .mm-hero__slide-bg { background: var(--mm-color-secondary, #fad7fe); }

    .mm-hero__content {
      position: relative;
      width: 100%;
      max-width: none;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      padding: var(--mm-space-8, 32px) var(--mm-space-4, 16px) var(--mm-space-7, 28px);
    }
    .mm-hero__title,
    .mm-hero__subtitle {
      max-width: 100%;
      text-wrap: balance;
    }

    /* rating pill compacte (12px, avatars 24px) — variante mm-rating-sm */
    .mm-hero__rating {
      margin: 0;
      transform: none !important;
      font-size: var(--mm-font-size-text-xs, 12px);
    }
    .mm-hero__rating .mm-rating__avatars img { width: 24px; height: 24px; }

    .mm-hero__title { margin: 0; }
    .mm-hero__subtitle { margin: 0; }

    .mm-hero__cta-row { margin-top: 12px; }
    .mm-hero.mm-hero .mm-hero__cta-row .mm-btn {
      border: 1px solid var(--mm-color-primary, #3b0117);
      padding: var(--mm-space-4, 16px) var(--mm-space-8, 32px);
      border-radius: var(--mm-radius-lg, 16px);
      font-size: var(--mm-font-size-text-sm, 14px);
    }

    /* nav : puces seules, sous le CTA */
    .mm-hero__nav {
      margin-top: 0;
      opacity: 1 !important;
      transform: none !important;
    }
    .mm-hero__nav .mm-slider-arrows { display: none; }
    /* Puces à anneau de progression conservées en mobile : puce ronde 8px,
       l'anneau .mm-hero__dot-ring se remplit sur --hero-autoplay pendant
       is-cycling (règle desktop réutilisée). Couleur : héritée de
       --mm-hero-content-color (blanc/#3b0117 selon .mm-hero--content-dark/
       -light posée par le JS sur le slide actif), même logique qu'en desktop. */
    .mm-hero__dots {
      display: inline-flex;
      gap: 0;
      margin: -10px 0;
    }
    /* Figma 10797-157248 : puce 4px (contre 8px desktop), anneau à 2px de la
       puce. Le SVG de l'anneau est partagé avec le desktop (viewBox 14x14,
       cercle r6) : redimensionner la boîte le remet à l'échelle sans
       transform — rayon rendu = 6 × (boîte/14), on vise rayon 4 (puce 2 +
       gap 2) d'où une boîte de 9.333px. */
    .mm-hero__dot {
      width: 24px;
      height: 24px;
      padding: 10px;
      border-radius: 50%;
      overflow: visible;
    }
    .mm-hero__dot-ring {
      inset: 7.333px;
      width: 9.333px;
      height: 9.333px;
    }
    .mm-hero__rating .mm-rating__light {
      font-size: 12px;
    }
    .mm-hero__rating strong {
      font-size: 12px;
    }
    .mm-hero__rating {
      gap: 4px !important;
    }
  }
/* END_SECTION:mm-hero */

/* START_SECTION:mm-main-search (INDEX:23) */
/* Header */
    .mm-main-search-header {
        padding: var(--mm-space-8) var(--mm-space-9);
        min-height: 15vh;
    }

    /* Toolbar (tri) : herite du style select via .mm-grid-first-container, on surcharge juste le padding/alignement */
    .mm-main-search-toolbar.mm-grid-first-container {
        padding: 0px max(var(--mm-space-5), var(--mm-content-gutter)) var(--mm-space-2) max(var(--mm-space-5), var(--mm-content-gutter));
    }
    /* Reserve la place du chevron (positionne a right:16px) pour eviter le chevauchement du texte */
    .mm-main-search-toolbar .select__select {
        padding-right: var(--mm-space-6);
    }

    /* Grid */
    .mm-main-search-results {
        grid-template-columns: repeat(5, 1fr);
        padding: 0 max(var(--mm-space-5), var(--mm-content-gutter)) var(--mm-space-3) max(var(--mm-space-5), var(--mm-content-gutter));
        grid-gap: calc(var(--mm-space-9) * 2) var(--mm-space-4);
    }

    @media (width <= 1350px) {
        .mm-main-search-results {
            grid-template-columns: repeat(4, 1fr);
        }
    }

    @media (width <= 768px) {
        .mm-main-search-header {
            padding: var(--mm-space-4);
        }
        .mm-main-search-header-container {
            grid-gap: var(--mm-space-2);
        }
        .mm-main-search-toolbar.mm-grid-first-container {
            padding: var(--mm-space-4) var(--mm-space-4) 0;
        }
        .mm-main-search-results {
            grid-template-columns: repeat(3, 1fr);
            grid-gap: var(--mm-space-6) var(--mm-space-2);
            padding: var(--mm-space-4);
        }
    }

    @media (width <= 550px) {
        .mm-main-search-results {
            grid-template-columns: repeat(2, 1fr);
        }
    }
/* END_SECTION:mm-main-search */

/* START_SECTION:mm-page-faq (INDEX:25) */
.mm-page-faq-layout {
        max-width: 1440px;
        margin-inline: auto;
        padding: var(--mm-space-12, 80px) var(--mm-space-13, 120px) var(--mm-space-13, 120px) var(--mm-space-13, 120px);
    }
    @media (width > 1720px) {
        .mm-page-faq-layout { max-width: calc(var(--mm-content-max) + var(--mm-space-13, 120px) * 2); }
    }

    .mm-page-faq-category {
        scroll-margin-top: calc(var(--header-height, 66px) + var(--mm-space-4, 16px));
    }
    .mm-page-faq-category:not(:last-child) {
        border-bottom: 1px solid var(--mm-color-black-50, #F4F4F4);
        padding-bottom: var(--mm-space-9, 40px);
    }

    .mm-page-faq-accordion {
        .mm-dropdown-answer,
        .mm-dropdown-answer * {
            font-weight: var(--mm-font-weight-heavy, 800);
        }
    }

    @media (max-width: 1280px) {
        .mm-page-faq-layout {
            padding: var(--mm-space-11, 64px);
        }
    }
    @media (max-width: 990px) {
        .mm-page-faq-layout {
            padding: var(--mm-space-7, 28px) var(--mm-space-5, 20px);
        }
        .mm-page-faq-main {
            gap: var(--mm-space-7, 28px);
        }
        .mm-page-faq-category {
            padding-bottom: var(--mm-space-7, 28px);
        }
    }
/* END_SECTION:mm-page-faq */

/* START_SECTION:mm-section-article-contenu (INDEX:32) */
.mm-section-article-contenu-wrapper {
        padding: var(--mm-space-12, 80px) max(var(--mm-space-12, 80px), var(--mm-content-gutter));
    }
    .mm-section-article-contenu-wrapper:has(.mm-section-article-contenu-splide.is-initialized:not(.is-overflow)) .mm-slider-arrows {
        display: none;
    }
    .mm-section-article-contenu-arrows svg {
        width: 16px !important;
        height: 16px !important;

        path {
            stroke: #201C1B;
        }
    }
    .mm-slider-arrow.mm-section-article-contenu-arrows:disabled {
        opacity: 0.6;
        pointer-events: none;
    }
    .mm-section-article-contenu-splide {
        margin: -20px 0px !important;
    }
    .mm-section-article-contenu-splide .splide__list {
        padding: 20px 0px !important;
    }
    .mm-section-article-contenu-splide:after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        width: 100px;
        height: 100%;
        opacity: 1;
        pointer-events: none;
        background: linear-gradient(270deg, #EFF7EE 0%, rgba(239, 247, 238, 0.00) 92.91%);
        transition: opacity 0.3s ease-in-out;
    }   
    .mm-section-article-contenu-wrapper:has(.splide__arrow--next:disabled) .mm-section-article-contenu-splide:after {
        opacity: 0;
    }
    @media (max-width: 990px) {
        .mm-section-article-contenu-wrapper {
            padding: var(--mm-space-10, 48px) var(--mm-space-5, 20px);
            gap: var(--mm-space-8, 32px);

            .splide__track {
                overflow: visible;
            }   
            .mm-article-card {
                aspect-ratio: 0.73;
                .mm-blog-auteur {
                    gap: 30px;
                }
            }
        }
        .mm-slider-arrow.mm-section-article-contenu-arrows {
            display: none;
        }
        .mm-section-article-contenu-splide:after {
            display: none;
        }
    }
/* END_SECTION:mm-section-article-contenu */

/* START_SECTION:mm-section-article (INDEX:33) */
.mm-section-article {
        max-width: 1440px;
        margin-inline: auto;
        padding: 50px var(--mm-space-12, 80px);
    }
    @media (width > 1720px) {
        .mm-section-article { max-width: calc(var(--mm-content-max) + var(--mm-space-12, 80px) * 2); }
    }
    .mm-section-article__wrapper {
        max-width: 575px;
        margin: 0 auto;
    }
    .mm-section-article__sticky {
        right: 50px;
        top: 0;
        padding-bottom: 50px;
    }

    @media (max-width: 1350px) {
        .mm-section-article__sticky {
            position: fixed;
            top: initial;
            z-index: 50;
            height: fit-content;
            padding: 12px;
            bottom: 0;
            right: inherit;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
        }
    }
    
    @media (max-width: 990px) {
        .mm-section-article {
            padding: var(--mm-space-8, 32px) var(--mm-space-5, 20px);
        }
        .mm-section-article-wrapper {
            gap: var(--mm-space-9, 32px);
        }
    }
/* END_SECTION:mm-section-article */

/* START_SECTION:mm-section-contact (INDEX:34) */
.mm-section-contact {
        padding: var(--mm-space-12, 80px) var(--mm-space-12, 80px) var(--mm-space-10, 48px) var(--mm-space-12, 80px);
    }
    .mm-section-contact-wrapper {
        max-width: 1440px;
        margin-inline: auto;
    }
    @media (width > 1720px) {
        .mm-section-contact-wrapper { max-width: var(--mm-content-max); }
    }
    .mm-section-contact-media {
        pointer-events: none;
    }
    .mm-section-contact-media-frame::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(100deg, rgba(32, 28, 27, 0.74) 0%, rgba(32, 28, 27, 0.46) 46%, rgba(32, 28, 27, 0.14) 100%);
    }
    .mm-section-contact-media-info {
        position: relative;
        z-index: 1;
    }
    .mm-section-contact-aside {
        max-width: 520px;
        gap: 100px;
        padding-top: 50px;
    }
    .mm-section-contact-crumbs-desktop {
        position: absolute;
        top: -40px;
        left: 0;
    }
    .mm-section-contact-crumbs-desktop:not(.mm-in) {
        opacity: 0;
        transform: translateX(14px);
    }
    .mm-section-contact-crumbs-desktop.mm-in {
        opacity: 1;
        transform: translateX(0);
        transition: opacity var(--mm-duration-medium, .38s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) var(--mm-delay, 0s), transform var(--mm-duration-medium, .38s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) var(--mm-delay, 0s);
    }
    .mm-section-contact-title.mm-desktop-990:not(.mm-in) {
        opacity: 0;
        transform: translateY(16px);
    }
    .mm-section-contact-title.mm-desktop-990.mm-in {
        opacity: 1;
        transform: translateY(0);
        transition: opacity var(--mm-duration-medium, .38s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) var(--mm-delay, 0s), transform var(--mm-duration-medium, .38s) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1)) var(--mm-delay, 0s);
    }

    @media (width <= 1280px) {
        .mm-section-contact {
            padding: var(--mm-space-9, 40px);
        }
        .mm-section-contact-crumbs-desktop {
            top: 0px;
        }
    }
    @media (width <= 990px) {
        .mm-section-contact {
            padding: 0;
        }
        .mm-section-contact-title.mm-desktop-990 {
            display: block !important;
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }
        .mm-section-contact-media {
            position: relative;
            display: flex;
            flex-direction: column;
            aspect-ratio: 1.4;
            width: 100%;
            padding: var(--mm-space-5, 20px);
        }
        .mm-section-contact-media-info {
            flex: 1;
        }
        .mm-section-contact-wrapper {
            flex-direction: column;
            gap: 0px;
        }
        .mm-section-contact-aside {
            padding: 0px;
            max-width: 100%;
            padding: var(--mm-space-5, 20px);
            gap: var(--mm-space-6, 24px); 
            background: var(--mm-space-black-50, #F4F4F4);
        }
        .mm-section-contact-infos {
            gap: var(--mm-space-6, 24px); 
            flex-direction: column;
        }
        .mm-contact-info {
            gap: var(--mm-space-3, 12px); 
            padding-bottom: var(--mm-space-6, 24px);
            border-bottom: 1px solid var(--mm-color-black-100, #e9e8e8);
        }
        .mm-section-contact-infos > .mm-contact-info:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }
        .mm-contact-info-title {
            color: var(--mm-color-black-900, #201c1b);
        }
        .mm-contact-info-description {
            color: var(--mm-color-black-500, #8f8e8d);
            font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;

            br {
                display: none;
            }
        }
        .mm-section-contact-press-mobile {
            padding: var(--mm-space-5, 20px);
            background: var(--mm-color-black-50, #f4f4f4);
        }
        .mm-section-contact-press-title {
            color: var(--mm-color-black-900, #201c1b);
        }
        .mm-section-contact-press-text {
            color: var(--mm-color-black-500, #8f8e8d);
        }
    }
/* END_SECTION:mm-section-contact */

/* START_SECTION:mm-section-contenu (INDEX:35) */
.mm-section-contenu {
        padding: var(--mm-space-12, 80px) max(var(--mm-space-12, 80px), var(--mm-content-gutter));
    }
    .mm-section-contenu-splide.splide:not(.is-overflow) .splide__list {
        justify-content: center;
    }
    .mm-section-contenu-splide .splide__list {
        display: flex;
    }
    @media (width > 1720px) {
        .mm-section-contenu-splide .splide__track { overflow-x: clip !important; }
    }
    @media (max-width: 990px) {
        .mm-section-contenu {
            padding: var(--mm-space-9, 40px) var(--mm-space-5, 20px);
        }
        .mm-section-contenu-wrapper {
            gap: var(--mm-space-5, 20px);
        }
    }
/* END_SECTION:mm-section-contenu */

/* START_SECTION:mm-section-faq (INDEX:36) */
.mm-section-faq-wrapper {
        max-width: calc(1440px + var(--mm-space-13, 120px) * 2);
        margin-inline: auto;
        padding: var(--mm-space-13, 120px);
    }
    @media (width > 1720px) {
        .mm-section-faq-wrapper { max-width: calc(var(--mm-content-max) + var(--mm-space-13, 120px) * 2); }
    }
    .mm-section-faq-content {
        width: 700px;
    }
    .mm-section-faq-block-cta {
        width: fit-content;
    }

    .mm-section-faq-accordion {
        padding-right: 18px;
    }

    @media (max-width: 1280px) {
        .mm-section-faq-wrapper {
            padding: var(--mm-space-13, 120px) var(--mm-space-11, 64px);
        }
    }
    @media (max-width: 990px) {
        .mm-section-faq-wrapper {
            padding: var(--mm-space-11, 64px) var(--mm-space-5, 20px);
            gap: var(--mm-space-10, 48px);
            flex-direction: column;
        }
        .mm-section-faq-content {
            width: 100%;
        }
        .mm-section-faq-info {
            gap: var(--mm-space-4, 16px);
        }
        .mm-section-faq-block-cta {
            width: 100%;
        }
        .mm-section-faq-accordion {
            padding-right: 0px;
        }
        .mm-section-faq-sm {
            font-size: 34px;
        }
        .mm-section-faq-description,
        .mm-section-faq-description > * {
            font-size: 16px;
        }
    }
/* END_SECTION:mm-section-faq */

/* START_SECTION:mm-section-legal (INDEX:37) */
.mm-section-legal {
        padding: var(--mm-space-12, 80px) var(--margin-5, 20px);

        .mm-section-legal__container {
            max-width: 660px;
            margin: 0 auto;
        }

        h2 {
            color: var(--mm-color-black-900, #201c1b);
            font-size: var(--mm-font-size-text-lg, 20px); font-weight: var(--mm-font-weight-heavy, 800); line-height: 130%; letter-spacing: normal;
        }
        h2:has(+ p),
        h2:has(+ h3) {
            padding-bottom: 4px;
        }
        h3 {
            color: var(--mm-color-black-900, #201c1b);
            font-size: var(--mm-font-size-text-lg, 20px); font-weight: var(--mm-font-weight-medium, 500); line-height: 135%;
        }
        strong {
            color: var(--mm-color-black-900, #201c1b);
        }
        p, a, li {
            display: flex;
            color: var(--mm-color-black-700, #595655);
            font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
        }
        p:not(:has(> strong:only-child)):has(+ ul),
        p:has(+ h3) {
            padding-bottom: 4px;
        }
        p:has(+ h2) {
            padding-bottom: 20px;
        }
        h2 + p:has(+ p),
        h2 + p + p:has(+ p),
        h2 + p + p + p:has(+ p),
        h2 + p + p + p + p:has(+ p),
        h2 + p + p + p + p + p:has(+ p),
        h2 + p + p + p + p + p + p:has(+ p) {
            padding-bottom: 4px;
        }
        ul {
            padding: 0;
            margin: 0;
            list-style: none;
            display: flex;
            flex-direction: column;
            gap: 4px;

            li::before {
                content: "•";
                margin-right: 8px;
            }
        }
        a {
            text-decoration: underline;
        }
    }

    @media (width <= 768px) {
        .mm-section-legal {
            padding: var(--margin-8, 32px) var(--margin-5, 20px);

            p, a, li {
                font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
            }
            h3 {
                font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-medium, 500); line-height: 1.4; letter-spacing: -0.1px;
            }
        }
    }
/* END_SECTION:mm-section-legal */

/* START_SECTION:mm-section-product-slider (INDEX:39) */
/* ==== MM / Slider produits =================================================
     Grille à DEUX colonnes en desktop : l'accroche tient la colonne de gauche
     sur toute la hauteur, la piste occupe la droite, et le CTA vient se poser
     dans la MÊME cellule que l'accroche, collé en bas. C'est ce qui permet de
     n'avoir qu'un seul bouton dans le DOM tout en le montrant tantôt dans la
     carte (desktop), tantôt sous la piste (mobile). */
  .mm-pslider {
    display: grid;
    grid-template-columns: 386px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    /* Pas de gouttière ICI : la respiration entre l'accroche et la première
       carte est portée par le padding de la PISTE (--mm-pslider-fade). La
       différence n'est pas cosmétique — ce padding est aussi la distance sur
       laquelle les cartes se dissolvent en défilant. L'espace au repos et la
       zone de fondu sont donc le même espace, au lieu d'un couloir mort qui
       s'ajouterait au fondu. Les cartes entre elles gardent le 24 de la
       maquette. */
    column-gap: 0;
    padding: 100px 0 100px max(var(--mm-space-12), var(--mm-content-gutter));
    background: var(--mm-color-white, #ffffff);
  }

  /* ----- Accroche ---------------------------------------------------------- */
  .mm-pslider__intro {
    grid-column: 1;
    grid-row: 1 / -1;
    position: relative;
    display: flex;
    /* le titre se cale EN HAUT (maquette : la carte est en justify-between,
       titre en haut, CTA en bas) — le CTA occupe l'autre bout par la grille */
    align-items: flex-start;
    justify-content: center;
    overflow: hidden;
    padding: var(--mm-space-8);
    border: 1px solid var(--mm-color-black-100, #e9e8e8);
    border-radius: var(--mm-radius-lg);
    /* repli quand aucune couleur n'est réglée dans le thème */
    background: var(--mm-pslider-bg, var(--mm-color-secondary-light, #fef7ff));
  }
  /* le média couvre la carte, le titre reste au-dessus */
  .mm-pslider__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* pas de pointer-events : la carte n'est pas cliquable, le CTA l'est */
    pointer-events: none;
  }
  .mm-pslider__veil {
    position: absolute;
    inset: 0;
    background: var(--mm-color-ui-title, #201c1b);
    opacity: var(--mm-pslider-scrim, 0);
    pointer-events: none;
  }
  .mm-pslider__title {
    position: relative; /* au-dessus du média et du voile */
    max-width: 290px;   /* 290 de la maquette : c'est lui qui décide des retours */
    margin: 0;
    text-align: center;
    color: var(--mm-color-primary, #3b0117);
  }
  .mm-mark {
    padding: var(--mm-space-4) !important;
    color: var(--mm-color-primary, #3b0117);
  }

  /* ----- Piste ------------------------------------------------------------- */
  .mm-pslider__slider {
    grid-column: 2;
    grid-row: 1 / -1;
    min-width: 0;
  }
  .mm-pslider__track {
    /* respiration verticale : la piste clippe aussi le lift des cartes au
       survol — padding annulé par des marges négatives, mise en page intacte */
    /* --mm-pslider-fade : UNE valeur pour trois usages — le retrait de la
       première carte, le point de calage de Splide (son padding gauche), et
       la longueur du dégradé. Les trois doivent coïncider, sinon la carte au
       repos mord sur le fondu ou s'en décolle. */
    --mm-pslider-fade: var(--mm-space-4);
    padding-block: var(--mm-space-6);
    /* !important : sans option "padding", Splide pose padding-left/right: 0px
       inline sur .splide__track — il relit ensuite le padding calculé
       (getPadding), le CSS reste donc la source */
    padding-left: var(--mm-space-6) !important;
    padding-right: var(--mm-space-12) !important;
    margin-block: calc(var(--mm-space-6) * -1);
    user-select: none;
  }
  .mm-pslider__slider.is-overflow .mm-pslider__track { cursor: grab; }
  /* Fondu de sortie, posé par le script DÈS QUE la piste a défilé — et
     seulement à ce moment : au repos, un masque rendrait le bord gauche de la
     première carte translucide, ce qui se lirait comme un bug plutôt que
     comme une intention. */
  .mm-pslider__track.is-scrolled {
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--mm-pslider-fade));
    mask-image: linear-gradient(to right, transparent 0, #000 var(--mm-pslider-fade));
  }
  .mm-pslider__track img { -webkit-user-drag: none; user-select: none; }
  @media (width > 1720px) {
    .mm-pslider { padding-right: max(var(--mm-space-12), var(--mm-content-gutter)); }
    .mm-pslider__track { padding-right: 0 !important; }
  }

  .mm-pslider__cell {
    /* 386 = la largeur MAXIMALE de la Carte produit. La maquette dit 410,
       mais l'atome plafonne à 386 : une cellule de 410 laissait 24 de vide
       mort à droite de chaque carte, qui s'ajoutaient à la gouttière et
       faisaient respirer le slider deux fois trop. L'accroche suit la même
       largeur, comme dans la maquette où les deux sont égales. */
    flex: 0 0 386px;
    min-width: 0;
    /* la piste étire déjà les cellules à la hauteur de la plus grande
       (align-items: stretch, défaut flex) — il reste à faire descendre
       cette hauteur jusqu'à la carte elle-même, qui sinon garde sa
       hauteur intrinsèque */
    display: flex;
  }
  .mm-pslider__cell .mm-pcard {
    height: 100%;
  }
  /* la piste étire déjà les cellules à la hauteur de la plus grande (flex
     align-items: stretch par défaut) — il reste à faire suivre la carte,
     qui sinon garde sa hauteur de contenu au lieu de remplir la cellule */
  .mm-pslider__cell .mm-pcard { height: 100%; }

  /* ----- Barre de progression --------------------------------------------- */
  /* Absente de la maquette desktop : là, on fait glisser les cartes. */
  .mm-pslider__progress { display: none; }

  /* ----- CTA --------------------------------------------------------------- */
  .mm-pslider__cta {
    grid-column: 1;
    grid-row: 2;
    align-self: end;
    margin: var(--mm-space-8);
    z-index: 1; /* devant le fond de l'accroche, qui occupe la même cellule */
  }
  /* .mm-btn.mm-btn-full pose width:100%, mesuré sur la CELLULE et donc
     insensible aux marges : le bouton dépassait de 32 à droite. On le laisse
     s'étirer, la largeur se déduit alors des marges — le padding de 32 de la
     maquette. Deux classes, sinon la règle de l'atome l'emporte. */
  .mm-pslider__cta.mm-btn-full { width: auto; }

  /* ==== Mobile (Figma 11925-86208) ==========================================
     Une seule colonne : l'accroche s'étale bord à bord, la piste laisse
     dépasser la carte suivante, la barre paraît, et le CTA quitte la carte
     pour passer sous la piste — sans changer d'élément dans le DOM. */
  @media (max-width: 749px) {
    .mm-pslider {
      grid-template-columns: minmax(0, 1fr);
      grid-template-rows: auto;
      row-gap: var(--mm-space-7);
      padding: 0 0 var(--mm-space-12);
    }
    .mm-pslider__intro {
      grid-column: 1;
      grid-row: auto;
      padding: var(--mm-space-9) var(--mm-space-8);
      border-inline: 0;
      border-radius: 0;
    }
    .mm-pslider__title { max-width: 290px; }

    .mm-pslider__slider {
      grid-column: 1;
      grid-row: auto;
    }
    .mm-pslider__track {
      /* la marge de 20 de la maquette devient ici la zone de fondu */
      --mm-pslider-fade: var(--mm-space-5);
      padding-block: var(--mm-space-8) var(--mm-space-6);
      padding-left: var(--mm-pslider-fade) !important;
      padding-right: var(--mm-space-5) !important;
    }
    .mm-pslider__cell { flex-basis: 222px; }

    /* dans le .splide (cf. markup) : l'ancien row-gap de la grille devient
       sa marge haute */
    .mm-pslider__progress {
      display: block;
      margin: var(--mm-space-7) auto 0;
      width: 177px; /* 177 de la maquette */
      height: 4px;
      border-radius: 2px;
      background: var(--mm-color-black-100, #e9e8e8);
    }
    .mm-pslider__progress span {
      display: block;
      height: 100%;
      width: calc(var(--thumb-w, 0.34) * 100%);
      border-radius: 2px;
      background: var(--mm-color-primary, #3b0117);
      transform: translateX(var(--thumb-x, 0%));
      transition: transform .35s var(--mm-curve-medium, cubic-bezier(0.34, 1.56, 0.64, 1));
    }

    .mm-pslider__cta {
      grid-column: 1;
      grid-row: auto;
      margin: 0 var(--mm-space-5);
      /* Le style du bouton (réglage "cta_style") ne s'applique qu'en
         desktop, où il vit dans la carte d'accroche sur son fond au choix.
         En mobile, sous la piste sur fond blanc, on revient toujours au
         style primary — on écrase les deux custom properties de l'atome
         plutôt que de jouer sur les classes, pour ne pas dupliquer le
         bouton dans le DOM. */
      --btn-bg: var(--mm-color-primary, #3b0117);
      --btn-color: var(--mm-color-white, #ffffff);
    }
  }
/* END_SECTION:mm-section-product-slider */

/* START_SECTION:mm-section-promo (INDEX:40) */
.mm-section-promo [data-mm-reveal]:not(.mm-in) {
        opacity: 0;
        transform: translateY(26px);
    }
    .mm-section-promo [data-mm-reveal="pop"]:not(.mm-in) {
        transform: scale(0.55);
    }
    .mm-section-promo [data-mm-reveal].mm-in {
        opacity: 1;
        transform: none;
        transition:
            opacity var(--mm-duration-slow, 650ms) var(--mm-curve-out) calc(var(--mm-delay, 0s) + var(--mm-promo-reveal-offset, 0s)),
            transform var(--mm-duration-slow, 650ms) var(--mm-curve-medium) calc(var(--mm-delay, 0s) + var(--mm-promo-reveal-offset, 0s));
    }

    .mm-section-promo__inner [data-mm-reveal] {
        --mm-promo-reveal-offset: 500ms;
    }

    .mm-section-promo__card {
        --mm-delay: .18s;
    }

    .mm-section-promo {
        border-radius: inherit;
    }

    .mm-section-promo__media {
        position: absolute;
        inset: 0;
        border-radius: inherit;
        overflow: hidden;
		border-radius: 30px;
    }
    .mm-section-promo__media img {
        transform: scale(1.06);
        animation: mm-promo-kenburns 9s var(--mm-curve-out) forwards;
    }
    @keyframes mm-promo-kenburns {
        100% { transform: scale(1); }
    }

    @media (prefers-reduced-motion: reduce) {
        .mm-section-promo [data-mm-reveal] {
            transition-duration: 1ms;
        }
        .mm-section-promo__media img {
            animation: none;
            transform: scale(1);
        }
    }
    .mm-section-promo__media::after {
        content: '';
        position: absolute;
        inset: 0;
        background: #000;
        opacity: var(--mm-promo-overlay-opacity, 40%);
    }

    .mm-section-promo__inner {
        padding: var(--mm-space-12, 80px) var(--mm-space-10, 48px);
    }
    .mm-section-promo:not([data-mm-link-source]) {
        margin-inline: max(var(--mm-space-5, 20px), var(--mm-content-gutter));
    }

    @media (width <= 990px) {
        .mm-section-promo:not([data-mm-link-source]) {
            margin: 0;
        }
        .mm-section-promo__inner {
            flex-direction: column;
            padding: var(--mm-space-9, 40px) var(--mm-space-4, 16px);
            gap: var(--mm-space-9, 40px);
        }
		.mm-section-promo__media {
			border-radius: unset;
		}
    }
/* END_SECTION:mm-section-promo */

/* START_SECTION:mm-section-rating (INDEX:41) */
/* ==== MM / Avis produit (widget Avis Vérifiés) ============================
       Le widget vit en shadow DOM : on le habille par ses variables --skp-* et
       ses ::part() (sidebar, review-card, pagination…), jamais par classes. */
    .mm-section-rating {
        /* vert de la maquette Avis, sans équivalent dans mm-colors */
        --mm-rating-green: #219653;
    }

    /* Marges de la maquette : 120/80 desktop, 20/40 mobile (mm-section : 40/84) */
    .mm-section-rating.mm-section {
        padding-block: var(--mm-space-12);
        padding-inline: max(var(--mm-space-13), var(--mm-content-gutter));
    }

    .mm-section-rating skp-widget-product-reviews {
        --skp-font-family: var(--mm-font);
        --skp-color-text-primary: var(--mm-color-ui-title);
        --skp-color-text-secondary: var(--mm-color-ui-text);
        --skp-color-primary: var(--mm-rating-green);
        --skp-color-border: var(--mm-color-ui-border);
        --skp-color-gray-300: var(--mm-color-black-100);
        --skp-color-bg: var(--mm-color-black-50);
        --skp-radius-md: var(--mm-radius-md);
        --skp-reviews-column-gap: var(--mm-space-12);
        /* la maquette n'a pas de grosse note : étoiles de synthèse masquées ici,
           la note, le logo et « Basé sur… » le sont plus bas (parts) */
        --skp-star-size-summary: 0px;
    }

    /* Colonne gauche : seul le lien d'attestation reste de l'en-tête */
    .mm-section-rating skp-widget-product-reviews::part(rating-value),
    .mm-section-rating skp-widget-product-reviews::part(certificate-link),
    .mm-section-rating skp-widget-product-reviews::part(rating-count) {
        display: none;
    }
    .mm-section-rating skp-widget-product-reviews::part(attestation-link) {
        color: var(--mm-color-primary);
        font-size: var(--mm-font-size-text);
        line-height: 22px;
        letter-spacing: -0.1px;
        text-decoration: underline;
    }
    .mm-section-rating skp-widget-product-reviews::part(filter-list) {
        gap: 0;
    }
    .mm-section-rating skp-widget-product-reviews::part(filter-mark) {
        color: var(--mm-color-ui-text);
        font-size: var(--mm-font-size-text-sm);
    }
    .mm-section-rating skp-widget-product-reviews::part(sort-controls) {
        gap: var(--mm-space-3);
        color: var(--mm-color-primary);
        font-size: var(--mm-font-size-text);
        line-height: 22px;
        letter-spacing: -0.1px;
        text-align: center;
    }
    .mm-section-rating skp-widget-product-reviews::part(sort-select),
    .mm-section-rating skp-widget-product-reviews::part(search-input) {
        box-sizing: border-box;
        height: 40px;
        padding-inline: var(--mm-space-4);
        border: 1px solid var(--mm-color-black-100);
        border-radius: var(--mm-radius-md);
        background: var(--mm-color-white);
        color: var(--mm-color-black-900);
        font: 400 var(--mm-font-size-text-xs) / 1.1 var(--mm-font);
        letter-spacing: -0.12px;
    }

    /* Avis */
    .mm-section-rating skp-widget-product-reviews::part(review-card) {
        gap: var(--mm-space-4);
        padding-block-end: var(--mm-space-6);
        border-bottom: 1px solid var(--mm-color-ui-border);
    }
    .mm-section-rating skp-widget-product-reviews::part(review-rating) {
        color: var(--mm-color-ui-title);
        font-size: var(--mm-font-size-text-xxs);
        font-weight: 500;
        line-height: 1.1;
        letter-spacing: -0.108px;
    }
    .mm-section-rating skp-widget-product-reviews::part(review-badge) {
        color: var(--mm-color-black);
        font-size: var(--mm-font-size-text-xs);
    }
    .mm-section-rating skp-widget-product-reviews::part(review-body) {
        color: var(--mm-color-ui-text);
        font-size: var(--mm-font-size-text);
        line-height: 22px;
        letter-spacing: -0.1px;
    }
    .mm-section-rating skp-widget-product-reviews::part(review-meta) {
        color: var(--mm-color-ui-text);
        font-size: var(--mm-font-size-text);
        line-height: 21px;
        letter-spacing: -0.1px;
    }
    .mm-section-rating skp-widget-product-reviews::part(vote-button),
    .mm-section-rating skp-widget-product-reviews::part(report-link) {
        color: var(--mm-color-ui-title);
        font-size: var(--mm-font-size-text-xs);
        font-weight: 500;
        line-height: 1.1;
        letter-spacing: -0.12px;
    }

    /* Pagination */
    .mm-section-rating skp-widget-product-reviews::part(pagination) {
        justify-content: center;
        gap: var(--mm-space-2);
    }
    .mm-section-rating skp-widget-product-reviews::part(page-button),
    .mm-section-rating skp-widget-product-reviews::part(page-prev),
    .mm-section-rating skp-widget-product-reviews::part(page-next) {
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        width: 33px;
        height: 40px;
        padding: 0;
        border: 1px solid var(--mm-color-black-100);
        border-radius: var(--mm-radius-md);
        background: var(--mm-color-white);
        color: var(--mm-color-black-500);
        font-size: var(--mm-font-size-text-xs);
    }
    .mm-section-rating skp-widget-product-reviews::part(page-button-current) {
        border-color: var(--mm-rating-green);
        background: var(--mm-rating-green);
        color: var(--mm-color-white);
    }

    @media (width <= 768px) {
        .mm-section-rating.mm-section {
            padding-block: var(--mm-space-9);
            padding-inline: var(--mm-space-5);
        }
        .mm-section-rating .mm-section-rating__title {
            font-size: var(--mm-font-size-title-sm);
            line-height: 1.08;
            letter-spacing: -1.02px;
        }
        .mm-section-rating skp-widget-product-reviews::part(review-body) {
            font-size: var(--mm-font-size-text-sm);
            line-height: 1.35;
            letter-spacing: -0.28px;
        }
        .mm-section-rating skp-widget-product-reviews::part(review-meta) {
            font-size: var(--mm-font-size-text-xs);
            line-height: 1.35;
            letter-spacing: -0.12px;
        }
        .mm-section-rating skp-widget-product-reviews::part(pagination) {
            gap: var(--mm-space-1);
        }
        .mm-section-rating skp-widget-product-reviews::part(page-button),
        .mm-section-rating skp-widget-product-reviews::part(page-prev),
        .mm-section-rating skp-widget-product-reviews::part(page-next) {
            height: 35px;
        }
    }
/* END_SECTION:mm-section-rating */

/* START_SECTION:mm-section-reassurance (INDEX:42) */
.mm-reassure {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mm-space-6);
    padding: var(--mm-space-11) max(var(--mm-space-12), var(--mm-content-gutter));
    font-family: var(--mm-font);
    contain: inline-size;
    min-width: 0;
  }
  @media (max-width: 749px) {
    .mm-reassure { padding: var(--mm-space-9) var(--mm-space-4); gap: var(--mm-space-5); }
  }

  .mm-reassure__title {
    margin: 0;
    font: 800 var(--mm-font-size-title) / 1.06 var(--mm-font);
    letter-spacing: -1.2px;
    text-align: center;
    color: var(--mm-color-ui-title, #201c1b);

  }
  .mm-reassure__subtitle {
    margin: 0;
    font: 500 var(--mm-font-size-text-lg) / 1.35 var(--mm-font);
    text-align: center;
    color: var(--mm-color-ui-title, #201c1b);
  }
  @media (max-width: 749px) {
    .mm-reassure__title { font-size: var(--mm-font-size-title-sm-mobile); letter-spacing: -0.8px;  width: 100%;   text-align: start; }
    .mm-reassure__subtitle { font-size: var(--mm-font-size-text);     text-align: start; }
  }

  /* ----- Grille d'arguments ----- */
  .mm-reassure__grid {
    display: grid;
    grid-template-columns: repeat(var(--rea-cols, 3), minmax(0, 1fr));
    gap: var(--mm-space-5) var(--mm-space-8);
    align-items: stretch;
    width: 100%;
  }
  /* respiration sous l'en-tête — seulement s'il y en a un (titre et
     sous-titre sont tous deux masquables) */
  .mm-reassure__title ~ .mm-reassure__grid,
  .mm-reassure__subtitle ~ .mm-reassure__grid { padding-top: var(--mm-space-6); }
  .mm-reassure--cols-4 .mm-reassure__grid { --rea-cols: 4; }

  .mm-reassure__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--mm-space-6);
    padding: var(--mm-space-2) 0;
  }
  .mm-reassure__icon {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
  }
  .mm-reassure__icon img,
  .mm-reassure__icon svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  /* cards centrées desktop : icône 48px au-dessus */
  .mm-reassure--cards-center .mm-reassure__icon { width: 48px; height: 48px; }
  .mm-reassure__body { min-width: 0; }
  .mm-reassure__item-title {
    margin: 0 0 var(--mm-space-1);
    font: 800 var(--mm-font-size-text) / 22px var(--mm-font);
    letter-spacing: -0.1px;
    color: var(--mm-color-ui-title, #201c1b);
  }
  .mm-reassure__item-text {
    margin: 0;
    font: 400 var(--mm-font-size-text-sm) / 1.35 var(--mm-font);
    letter-spacing: -0.28px;
    color: var(--mm-color-ui-text, #595655);
  }

  /* ----- list / band : séparateurs verticaux entre colonnes -----
     Écrits en base + neutralisés en ≤749px (pattern du kit : pas de
     min-width, sinon les largeurs fractionnaires entre 749 et 750px ne
     matchent aucun des deux blocs) */
  .mm-reassure--list .mm-reassure__item::before,
  .mm-reassure--band .mm-reassure__item::before {
    content: '';
    position: absolute;
    left: calc(var(--mm-space-8) / -2);
    top: 50%;
    translate: 0 -50%;
    width: 1px;
    height: 34px;
    background: var(--mm-color-ui-border, #e9e8e8);
  }
  .mm-reassure--list.mm-reassure--cols-3 .mm-reassure__item:nth-child(3n + 1)::before,
  .mm-reassure--list.mm-reassure--cols-4 .mm-reassure__item:nth-child(4n + 1)::before,
  .mm-reassure--band .mm-reassure__item:first-child::before { display: none; }

  /* ----- cards : fond blanc, bordure rose, radius 16 ----- */
  .mm-reassure--cards .mm-reassure__item,
  .mm-reassure--cards-center .mm-reassure__item {
    background: var(--mm-color-white, #ffffff);
    border: 1px solid var(--mm-color-secondary, #fad7fe);
    border-radius: var(--mm-radius-lg);
    padding: var(--mm-space-3) var(--mm-space-4);
  }
  .mm-reassure--cards-center .mm-reassure__item {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: var(--mm-space-5);
    padding: var(--mm-space-4) var(--mm-space-5);
  }
  .mm-reassure--cards-center .mm-reassure__grid { gap: var(--mm-space-6); }

  /* ----- band : une seule rangée compacte, sans en-tête ----- */
  .mm-reassure--band { padding: var(--mm-space-6) max(var(--mm-space-12), var(--mm-content-gutter)); }
  .mm-reassure--band .mm-reassure__grid {
    display: flex;
    margin-top: 0;
    gap: var(--mm-space-8);
  }
  .mm-reassure--band .mm-reassure__item { flex: 1 1 0; min-width: 0; }

  /* ----- Mobile : tout s'empile ----- */
  @media (max-width: 749px) {
    .mm-reassure__grid { grid-template-columns: 1fr; gap: 0; }

    /* list : les séparateurs deviennent horizontaux entre items empilés */
    .mm-reassure--list .mm-reassure__item::before { display: none; }
    .mm-reassure--list .mm-reassure__item { padding: var(--mm-space-4) 0; }
    .mm-reassure--list .mm-reassure__item:not(:first-child) {
      border-top: 1px solid var(--mm-color-ui-border, #e9e8e8);
    }
    .mm-reassure__item {
      gap: var(--mm-space-4);
    }
    /* cards : empilées, les centrées repassent icône à gauche (Figma Mobile) */
    .mm-reassure--cards .mm-reassure__grid,
    .mm-reassure--cards-center .mm-reassure__grid { gap: var(--mm-space-3); }
    .mm-reassure--cards-center .mm-reassure__item {
      flex-direction: row;
      justify-content: flex-start;
      text-align: left;
      gap: var(--mm-space-6);
      padding: var(--mm-space-4) var(--mm-space-5);
    }
    .mm-reassure--cards-center .mm-reassure__icon { width: 38px; height: 38px; } /* retour taille icône-à-gauche */

    /* band : piste scroll-snap balayable, séparateurs conservés */
    .mm-reassure--band { padding: var(--mm-space-5) 0; }
    .mm-reassure--band .mm-reassure__grid {
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      /* le snapport ignore le padding : sans ce pendant, les items snappés
         se collent au bord de l'écran (cf. blog-slider, category-slider) */
      scroll-padding-left: var(--mm-space-4);
      scrollbar-width: none;
      padding: 0 var(--mm-space-4);
      gap: var(--mm-space-6);
    }
    .mm-reassure--band .mm-reassure__grid::-webkit-scrollbar { display: none; }
    .mm-reassure--band .mm-reassure__item {
      flex: none;
      width: min(280px, 78vw);
      scroll-snap-align: start;
      padding: var(--mm-space-2) 0;
    }
    .mm-reassure--band .mm-reassure__item:not(:first-child)::before {
      content: '';
      position: absolute;
      left: calc(var(--mm-space-6) / -2);
      top: 50%;
      translate: 0 -50%;
      width: 1px;
      height: 34px;
      background: var(--mm-color-ui-border, #e9e8e8);
    }
  }
/* END_SECTION:mm-section-reassurance */

/* START_SECTION:mm-section-reviews (INDEX:43) */
/* ==== MM / Avis ==========================================================
     En-tête centré, puis une piste qui déborde des marges. */
  .mm-reviews {
    display: flex;
    flex-direction: column;
    gap: var(--mm-space-9, 40px);
    padding: var(--mm-space-12, 80px) max(var(--mm-space-13, 120px), var(--mm-content-gutter));
    background: var(--mm-color-cream-light, #fcfbf3);
    /* Le clipping vit ICI, au bord de l'écran, et non sur la fenêtre du
       slider : une carte qui sort doit avoir la place de s'EFFACER, pas être
       tranchée au ras de sa voisine (retour Killian — dans son prototype rien
       ne coupe les cartes). 'clip' et non 'hidden' : hidden crée un conteneur
       de défilement qui rognerait aussi en vertical, donc l'inclinaison et
       l'ombre des cartes. */
    overflow-x: clip;
  }

  .mm-reviews__head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mm-space-6, 24px);
    text-align: center;
  }
  .mm-reviews__title { margin: 0; }
  .mm-reviews__sub {
    margin: 0;
    font: 500 var(--mm-font-size-text, 16px) / 22px var(--mm-font);
    letter-spacing: -0.1px;
    color: var(--mm-color-black-900, #201c1b);
  }

  /* ----- Scène : la piste et ses flèches ---------------------------------- */
  /* Les flèches vivent AU BORD de la scène, hors de la piste : dedans, elles
     défileraient avec les cartes. */
  .mm-reviews__stage { position: relative; }
  .mm-reviews__arrows {
    position: absolute;
    top: 50%;
    left: calc(var(--mm-space-13, 120px) * -1);
    right: calc(var(--mm-space-13, 120px) * -1);
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 2;
  }
  /* le COMPOSANT contrôles rend un inline-flex serré : ici on l'étire pour
     poser une flèche à chaque bord de la scène */
  .mm-reviews__arrows .mm-slider-arrows {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .mm-reviews__arrows .mm-slider-arrow {
    pointer-events: auto;
    width: 60px;
    height: 60px;
  }
  .mm-reviews__arrows .mm-slider-arrows .splide__arrow--next {
   right: 1em !important;
  }
  .mm-reviews__arrows .mm-slider-arrows .splide__arrow--prev {
   left: 1em !important;
  }
  /* En butée (début ou fin de la piste), la flèche s'efface complètement.
     SplideManager pose 'disabled' (flèches externes) ; ici on masque plutôt
     qu'on atténue. visibility et non display : l'autre flèche
     reste calée à son bord (le conteneur est en space-between). */
  .mm-reviews__arrows .mm-slider-arrow:disabled {
    visibility: hidden;
  }

  /* La piste (.splide__track) est la fenêtre ; le rail (.splide__list) est
     ce que Splide translate dedans. */
  .mm-reviews__track {
    /* respiration verticale : la fenêtre clippe aussi l'inclinaison des cartes
       et leur ombre — padding annulé par des marges négatives */
    padding-block: var(--mm-space-5, 20px);
    margin-block: calc(var(--mm-space-5, 20px) * -1);
    user-select: none;
  }
  .mm-reviews__slider.is-overflow .mm-reviews__track { cursor: grab; }

  /* ----- Desktop ------------------------------------------------------------
     Toutes les cartes tiennent (cf. plus bas) : Splide n'a rien à faire
     défiler. La fenêtre ne clippe RIEN — le clipping est remonté sur la
     section, au bord de l'écran. Sélecteur renforcé : splide.min.css pose
     overflow:hidden sur .splide__track. */
  @media (width >= 1280px) {
    .mm-reviews .mm-reviews__track { overflow: visible; }
  }

  /* Sélecteur renforcé : splide.min.css pose flex-shrink:0 sur .splide__slide */
  .mm-reviews .mm-reviews__cell {
    flex: 0 0 295px; /* la largeur de carte de la maquette */
    min-width: 0;
  }
  /* Desktop : les 5 cartes (max_blocks) tiennent TOUTES dans la scène, sans
     pagination — elles se partagent la largeur, plafonnées à la largeur
     maquette. Le rail prend toute la fenêtre et centre ce qui reste. */
  @media (width >= 1280px) {
    .mm-reviews__rail { justify-content: center; }
    .mm-reviews .mm-reviews__cell { flex: 1 1 0; max-width: 295px; }
  }
  /* Petit desktop : plus de flèches à loger (tout tient), la marge latérale
     se resserre pour laisser une largeur lisible aux cartes */
  @media (1280px <= width < 1440px) {
    .mm-reviews { padding-inline: var(--mm-space-9, 40px); }
  }

  /* L'INCLINAISON des cartes d'avis (2.47° dans la maquette) vit ici, sur une
     enveloppe, et jamais sur la carte : un élément qui porte déjà un transform
     de repos ne peut pas recevoir data-mm-reveal sans que les deux se
     composent — c'est un piège déjà payé dans le kit. La cellule révèle,
     l'enveloppe incline, la carte ne sait rien de tout ça.
     Une carte sur deux penche dans l'autre sens : alignées, elles auraient
     l'air d'un défaut de gabarit plutôt que d'une intention. */
  .mm-reviews__tilt {
    transform: rotate(2.47deg);
  }
  .mm-reviews__cell:nth-child(4n + 3) .mm-reviews__tilt { transform: rotate(-1.8deg); }
  /* AUCUN effet de survol ici : au survol, la carte ne joue plus que l'impact
     (l'inertie du curseur, portée par le script). Le redressement + zoom de
     l'enveloppe se jouait EN MÊME TEMPS, sur un autre étage et avec un autre
     timing — deux mouvements pour un seul geste, ce qui se lisait comme un
     accroc (retour Killian). Un seul effet, donc, et l'inclinaison de repos
     reste ce qu'elle est. */

  /* le bouton sous la piste n'existe qu'en mobile */
  .mm-reviews__cta-mobile { display: none; }

  /* ==== Mobile (Figma 11950-493458) ======================================== */
  @media (width <= 749px) {
    .mm-reviews {
      gap: var(--mm-space-7, 28px);
      padding: var(--mm-space-10, 48px) var(--mm-space-6, 24px);
    }
    .mm-reviews__title {
      font-size: 34Px;
    }
    .mm-reviews__head { gap: var(--mm-space-5, 20px); }

    /* pas de flèches en mobile : navigation au swipe uniquement */
    .mm-reviews__arrows { display: none; }
    /* la piste déborde des marges de la section pour laisser voir la carte
       suivante, sans que la section ait à devenir pleine largeur. Gouttières
       = option "padding" Splide (breakpoint 749) : il cale la 1re carte et
       la dernière dessus, sans spacer de fin. */
    .mm-reviews__track {
      margin-inline: calc(var(--mm-space-6, 24px) * -1);
    }
    .mm-reviews .mm-reviews__cell { flex-basis: 297px; }

    /* Le bouton quitte la carte rose pour passer sous la piste. Les deux
       emplacements ne sont pas dans le même parent — l'un est une cellule qui
       défile — donc la grille ne peut pas le déplacer comme sur le Slider
       produits. Il est rendu deux fois, et c'est display:none qui tranche :
       il sort de l'arbre d'accessibilité en même temps que de l'affichage,
       donc aucun lecteur d'écran n'annonce deux fois le même bouton. */
    .mm-reviews__cta-mobile { display: block; }
    .mm-reviews__cta-mobile .mm-btn { width: 100%; }
    .mm-rcard--stat .mm-rcard__cta { display: none; }
  }
/* END_SECTION:mm-section-reviews */

/* START_SECTION:mm-section-video-slider (INDEX:45) */
.mm-vslider {
    position: relative;
    padding: 0 0 0;
    background: var(--mm-color-secondary-light, #fef7ff);
    border-radius: 0 0 var(--mm-radius-xl) var(--mm-radius-xl);
    overflow: hidden;
  }

  /* ----- Nuage (maquette Figma) ---------------------------------------
     Un cercle festonné (union de lobes arrondis) sert de forme au nuage.
     UNE SEULE forme, UN SEUL calage sur .mm-vslider__stage :
     - `::before` = fond blanc, épouse la forme (mask) ;
     - `mask` sur le stage lui-même = rogne le contenu (cartes des bords) ;
     mêmes --mm-vsl-* → fond et crop parfaitement raccord.
     Masque statique : la piste défile sous la fenêtre festonnée fixe.
     Mobile (Figma 10313-24473) : PAS de masque sur le contenu — la même
     forme nuage sert d'IMAGE DE FOND décorative (remplissage #fef7ff,
     706.864px carré ≈ 1.885x la largeur du frame Figma 375px, centrée
     horizontalement, quasi pleine hauteur) DERRIÈRE un contenu 100% visible
     (note, titre, cartes jamais rognés). --mm-vsl-mask désactive le mask du
     stage en dessous de 749px : sans ça la note se faisait rogner par la
     fenêtre du nuage (le mask assumait un contenu qui remplit tout le
     stage, faux sur mobile où la note dépasse en haut). */
  .mm-vslider {
    --mm-vsl-cloud:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1300.81 1300.81'%3E%3Cpath d='M650.37 0C712.994 0 768.734 29.4659 804.487 75.2881C858.363 53.4792 921.371 55.8307 975.606 87.1435C1029.83 118.452 1063.37 171.833 1071.43 229.387C1128.97 237.45 1182.34 270.987 1213.64 325.206C1244.94 379.427 1247.3 442.414 1225.51 496.28C1271.34 532.033 1300.81 587.775 1300.81 650.401C1300.81 713.044 1271.32 768.798 1225.48 804.55C1247.29 858.426 1244.94 921.435 1213.62 975.671C1182.31 1029.9 1128.93 1063.44 1071.37 1071.49C1063.32 1129.05 1029.78 1182.43 975.553 1213.74C921.316 1245.05 858.307 1247.4 804.431 1225.59C768.675 1271.37 712.961 1300.81 650.37 1300.81C587.759 1300.81 532.029 1271.35 496.275 1225.55C442.41 1247.34 379.423 1244.98 325.203 1213.67C270.976 1182.37 237.438 1128.99 229.381 1071.43C171.817 1063.39 118.423 1029.85 87.1094 975.608C55.797 921.373 53.4456 858.366 75.2539 804.491C29.4513 768.737 -7.09028e-07 713.009 0 650.401C2.11426e-05 587.81 29.4355 532.094 75.2178 496.339C53.4293 442.474 55.788 379.487 87.0918 325.268C118.399 271.041 171.777 237.503 229.327 229.445C237.384 171.893 270.922 118.514 325.149 87.206C379.369 55.9025 442.355 53.5441 496.22 75.332C531.972 29.485 587.727 0 650.37 0Z' fill='%23fff'/%3E%3C/svg%3E");
    /* échelle / position UNIQUES de la forme (fond + crop) — carré (SVG 1:1)
       inset de 64px de chaque bord latéral, centré verticalement (Figma
       10283-20506) : largeur = 100% - 128px, hauteur = même valeur en px
       (calc(100vw - 128px) ≈ largeur du stage, plein bleed) */
    --mm-vsl-size: calc(100% - 128px) calc(100vw - 128px);
    --mm-vsl-pos: 50% 50%;
    --mm-vsl-mask: var(--mm-vsl-cloud);
  }
  @media (max-width: 749px) {
    .mm-vslider {
      background: var(--mm-color-white, #ffffff);
      --mm-vsl-mask: none;
    }
  }

  /* le contenu (intro + piste) vit dans la forme (desktop) — plus de mask
     du tout sur mobile (--mm-vsl-mask: none), le contenu reste visible */
  .mm-vslider__stage {
    position: relative;
    z-index: 1;
    padding-top: var(--mm-space-12);
    padding-bottom: var(--mm-space-12);
    -webkit-mask-image: var(--mm-vsl-mask);
    mask-image: var(--mm-vsl-mask);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: var(--mm-vsl-size);
    mask-size: var(--mm-vsl-size);
    -webkit-mask-position: var(--mm-vsl-pos);
    mask-position: var(--mm-vsl-pos);
  }
  /* fond blanc : MÊME forme, MÊME calage → raccord avec le crop (desktop) */
  .mm-vslider__stage::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--mm-color-white, #ffffff);
    -webkit-mask-image: var(--mm-vsl-cloud);
    mask-image: var(--mm-vsl-cloud);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: var(--mm-vsl-size);
    mask-size: var(--mm-vsl-size);
    -webkit-mask-position: var(--mm-vsl-pos);
    mask-position: var(--mm-vsl-pos);
    pointer-events: none;
  }
  /* mobile : la même forme nuage devient une image de fond décorative
     (remplissage rose pâle, PAS un mask) — calée sur .mm-vslider entier
     (pas le stage), jamais recalée sur le contenu → rien n'est plus rogné.
     Ratio Figma : 706.864px / frame 375px ≈ 1.885 → largeur responsive. */
  @media (max-width: 749px) {
    .mm-vslider__stage::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 4px;
      z-index: -1;
      width: calc(100vw * 1.885);
      height: calc(100vw * 1.885);
      max-width: none;
      transform: translateX(-50%);
      background: var(--mm-color-secondary-light, #fef7ff);
      -webkit-mask-image: var(--mm-vsl-cloud);
      mask-image: var(--mm-vsl-cloud);
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;
      -webkit-mask-size: 100% 100%;
      mask-size: 100% 100%;
      -webkit-mask-position: center;
      mask-position: center;
    }
  }

  .mm-vslider__intro {
    position: relative;
    z-index: 1;
    text-align: center;
    margin-bottom: 40px;
  }

  /* pill de notation : atome mm-rating, variante bordure (mm-rating.css) —
     ici seulement le placement */
  .mm-vslider__rating { margin-bottom: var(--mm-space-6); }

  .mm-vslider__title {
    margin: 0;
    font: 800 var(--mm-font-size-title) / 1.25 var(--mm-font);
    letter-spacing: -1.2px;
    color: var(--mm-color-black-900, #201c1b);
  }
  @media (max-width: 749px) {
    .mm-vslider__title { font-size: 34px; }
  .mm-vslider__intro {
    margin-bottom: var(--mm-space-8);
  }}

  /* Surlignage rose qui pope : règles .mm-mark dans mm-title-selector.css
     (atome Titre) */

  /* ----- Piste : cartes de tailles différentes -----
     Splide : gap et gouttières (padding) passés en options (data-splide),
     ici seulement le calage vertical. min-height sur la liste (et non le
     track) : c'est elle qui aligne les cartes en bas. */
  .mm-vslider__track {
    position: relative;
    user-select: none;
  }
  .mm-vslider__slider.is-overflow .mm-vslider__track { cursor: grab; }
  .mm-vslider__list {
    align-items: flex-end;
    min-height: 470px;
  }
  /* Tout tient à l'écran : piste centrée (ex-justify-content: safe center).
     mm-splide.css neutralise alors la translation de Splide. */
  .mm-vslider__slider:not(.is-overflow) .mm-vslider__list { justify-content: center; }
  .mm-vslider__track img { -webkit-user-drag: none; user-select: none; }
  @media (max-width: 749px) {
    .mm-vslider__list { min-height: 350px; }
  }

  /* ----- Piste : variante avis (Figma 10481-77676) -----
     Les cartes d'avis ne sont pas des vignettes 9:16 : gabarit fixe, calées
     en bas comme dans la maquette (items-end), sans alternance de taille. Le
     châssis et le style de la carte viennent du COMPOSANT mm-review-card
     (variante review-slider) — ici seulement la largeur. */
  .mm-vslider__slider--reviews .mm-vslider__list { min-height: 0; }
  .mm-vslider__slider--reviews .mm-vslider__cell {
    flex: none;
    width: 290px;
  }
  /* la transition d'entrée est retirée par mm-motion après le reveal — même
     garde que .mm-vcard, sinon le lift composerait avec la glisse « left » */
  .mm-vslider__cell { display: flex; }
  @media (max-width: 749px) {
    .mm-vslider__slider--reviews .mm-vslider__cell { width: 250px; }
  }

  /* Enveloppe Splide (splide__slide) : porte le rythme des tailles, la
     carte <button> reste un bouton (cf. markup) */
  .mm-vslider__slide { flex: none; }

  .mm-vcard {
    position: relative;
    display: block;
    width: 255px;
    height: 380px;
    border: 0;
    padding: 0;
    border-radius: var(--mm-radius-lg);
    overflow: hidden;
    background: var(--mm-color-black-900, #201c1b);
    cursor: pointer;
  }
  /* la transition du hover ne s'installe qu'après le reveal (mm-motion
     retire data-mm-reveal) : posée sans garde, elle écrasait la glisse
     d'entrée « left » — les cards apparaissaient d'un coup au scroll */
  .mm-vcard:not([data-mm-reveal]) {
    transition: transform var(--mm-duration-medium) var(--mm-curve-medium), box-shadow var(--mm-duration-medium) var(--mm-curve-out);
  }
  /* rythme visuel : une carte sur deux est plus grande (base alignée) */
  .mm-vslider__slide:nth-child(odd) .mm-vcard { width: 285px; height: 424px; }
  @media (max-width: 749px) {
    /* mobile : hauteur uniforme pour toutes les cards (pas d'alternance) */
    .mm-vcard,
    .mm-vslider__slide:nth-child(odd) .mm-vcard { width: 210px; height: 335px; }
  }

  .mm-vcard:hover { transform: translateY(-6px) scale(1.015); box-shadow: var(--mm-shadow-md); }
  .mm-vcard:active { transform: scale(.98); }

  .mm-vcard img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Vidéo preview (créée par le JS si data-video) : muette, en boucle,
     se lance au survol (desktop) ou sur la carte active (mobile). Elle
     recouvre le poster en fondu, ce dernier reste dessous en fallback. */
  .mm-vcard__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    transition: opacity .45s var(--mm-curve-out);
  }
  .mm-vcard.is-previewing .mm-vcard__video { opacity: 1; }
  /* le bouton play s'efface tant que la preview joue */
  .mm-vcard.is-previewing .mm-vcard__play {
    opacity: 0;
    transform: scale(.7);
    transition: opacity .3s var(--mm-curve-out), transform .3s var(--mm-curve-out);
  }
  .mm-vcard.is-previewing .mm-vcard__play::after { animation: none; }

  /* gradient bas pour l'auteur */
  .mm-vcard::after {
    content: '';
    position: absolute;
    inset: 55% 0 0;
    background: linear-gradient(180deg, transparent, rgba(32, 28, 27, .6));
  }

  /* Play */
  .mm-vcard__play {
    position: absolute;
    top: 50%; left: 50%;
    translate: -50% -50%;
    z-index: 2;
    width: 54px; height: 54px;
    border-radius: 50%;
    background: var(--mm-color-white, #ffffff);
    display: grid;
    place-items: center;
    color: var(--mm-color-black-900, #201c1b);
    transition: transform var(--mm-duration-medium) var(--mm-curve-big);
  }
  .mm-vcard:hover .mm-vcard__play { transform: scale(1.15); }
  .mm-vcard:hover .mm-vcard__play::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--mm-color-white, #ffffff);
    animation: mm-play-pulse 1.8s var(--mm-curve-out) infinite;
  }
  @keyframes mm-play-pulse {
    0%   { transform: scale(1); opacity: .9; }
    70%  { transform: scale(1.7); opacity: 0; }
    100% { transform: scale(1.7); opacity: 0; }
  }

  /* Auteur */
  .mm-vcard__author {
    position: absolute;
    left: var(--mm-space-4);
    bottom: var(--mm-space-4);
    z-index: 2;
    display: flex;
    align-items: center;
    gap: var(--mm-space-2);
    color: var(--mm-color-white, #ffffff);
    text-align: left;
  }
  .mm-vcard__author img {
    position: static;
    width: 34px; height: 34px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--mm-color-white, #ffffff);
  }
  .mm-vcard__author strong { display: block; font: 500 var(--mm-font-size-text-sm)/1.2 var(--mm-font); }
  .mm-vcard__author span   { font: 400 var(--mm-font-size-text-xs)/1.2 var(--mm-font); opacity: .85; }

  /* ====================================================================== */
  /* ----- Visionneuse Stories (créée en JS au clic sur une carte) -------- */
  /* ====================================================================== */
  .mm-story {
    position: fixed;
    inset: 0;
    z-index: 140;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--mm-space-6);
    visibility: hidden;
    font-family: var(--mm-font);
    /* la visibilité attend la fin de l'animation de fermeture */
    transition: visibility 0s linear .35s;
  }
  .mm-story.is-open { visibility: visible; transition-delay: 0s; }

  .mm-story__overlay {
    position: absolute;
    inset: 0;
    background: rgba(32, 28, 27, 0.94);
    opacity: 0;
    transition: opacity .35s var(--mm-curve-out);
  }
  .mm-story.is-open .mm-story__overlay { opacity: 1; }

  .mm-story__card {
    position: relative;
    height: min(86vh, 780px);
    aspect-ratio: 9 / 16;
    border-radius: var(--mm-radius-lg);
    overflow: hidden;
    background: var(--mm-color-black-900, #201c1b);
    opacity: 0;
    transform: scale(0.93) translateY(20px);
    transition: opacity .25s var(--mm-curve-out), transform .5s var(--mm-curve-soft);
  }
  .mm-story.is-open .mm-story__card {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
  @media (max-width: 749px) {
    .mm-story__card {
      height: calc(100% - var(--mm-space-3) * 2);
      width: calc(100% - var(--mm-space-3) * 2);
      aspect-ratio: auto;
      border-radius: var(--mm-radius-lg);
    }
  }

  .mm-story__media,
  .mm-story__media img,
  .mm-story__media video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /* lisibilité haut/bas */
  .mm-story__card::before,
  .mm-story__card::after {
    content: '';
    position: absolute;
    left: 0; right: 0;
    height: 110px;
    z-index: 1;
    pointer-events: none;
  }
  .mm-story__card::before { top: 0; background: linear-gradient(180deg, rgba(32,28,27,.55), transparent); }
  .mm-story__card::after  { bottom: 0; background: linear-gradient(0deg, rgba(32,28,27,.55), transparent); }

  /* Segments de progression */
  .mm-story__progress {
    position: absolute;
    top: 10px; left: 10px; right: 10px;
    z-index: 3;
    display: flex;
    gap: 4px;
  }
  .mm-story__seg {
    flex: 1;
    height: 3px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.35);
    overflow: hidden;
  }
  /* remplissage piloté en JS (transform inline, suit la lecture réelle) */
  .mm-story__seg span {
    display: block;
    height: 100%;
    background: var(--mm-color-white, #ffffff);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .12s linear;
  }

  /* Auteur */
  .mm-story__author {
    position: absolute;
    top: 26px; left: var(--mm-space-4);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: var(--mm-space-3);
    color: var(--mm-color-white, #ffffff);
  }
  .mm-story__author img {
    width: 40px; height: 40px;
    border-radius: 50%;
    object-fit: cover;
  }
  .mm-story__author strong { display: block; font: 500 var(--mm-font-size-text)/1.2 var(--mm-font); }
  .mm-story__author span   { font: 400 var(--mm-font-size-text-sm)/1.3 var(--mm-font); opacity: .8; }

  /* Contrôles bas */
  .mm-story__controls {
    position: absolute;
    left: var(--mm-space-4); right: var(--mm-space-4); bottom: var(--mm-space-4);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: var(--mm-space-3);
    color: var(--mm-color-white, #ffffff);
  }
  .mm-story__playpause {
    flex: none;
    width: 42px; height: 42px;
    border: 0;
    border-radius: 50%;
    background: var(--mm-color-white, #ffffff);
    color: var(--mm-color-black-900, #201c1b);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform var(--mm-duration-medium) var(--mm-curve-big);
  }
  .mm-story__playpause:hover { transform: scale(1.12); }
  .mm-story__playpause:active { transform: scale(.9); }
  .mm-story__playpause .icon-pause { display: block; }
  .mm-story__playpause .icon-play  { display: none; }
  .mm-story.is-paused .mm-story__playpause .icon-pause { display: none; }
  .mm-story.is-paused .mm-story__playpause .icon-play  { display: block; }

  .mm-story__seek {
    flex: 1;
    height: 2.5px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.35);
    overflow: hidden;
  }
  .mm-story__seek span {
    display: block;
    height: 100%;
    background: var(--mm-color-white, #ffffff);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .12s linear;
  }
  .mm-story__time { flex: none; font: 400 var(--mm-font-size-text-sm)/1 var(--mm-font); opacity: .9; }

  /* tap sur la vidéo = play/pause, comme sur les stories */
  .mm-story__media { cursor: pointer; }

  /* Navigation prev/next */
  .mm-story__nav {
    position: relative;
    z-index: 2;
    flex: none;
    width: 52px; height: 52px;
    border: 0;
    border-radius: 50%;
    background: var(--mm-color-white, #ffffff);
    color: var(--mm-color-black-900, #201c1b);
    cursor: pointer;
    display: grid;
    place-items: center;
    opacity: 0;
    transform: scale(.6);
    transition: opacity .25s var(--mm-curve-out) .15s, transform .45s var(--mm-curve-big) .15s, background-color var(--mm-duration-fast) var(--mm-curve-out);
  }
  .mm-story.is-open .mm-story__nav { opacity: 1; transform: scale(1); }
  .mm-story__nav:hover { transform: scale(1.1) !important; }
  .mm-story__nav:active { transform: scale(.92) !important; }
  @media (max-width: 749px) {
    .mm-story__nav { position: absolute; top: 50%; margin-top: -26px; }
    .mm-story__nav--prev { left: var(--mm-space-3); }
    .mm-story__nav--next { right: var(--mm-space-3); }
    .mm-vslider .mm-rating {
      padding: 4px 12px 4px 4px;
    }
    .mm-vslider .mm-rating strong,
    .mm-vslider .mm-rating__light {
      font-size: 12px;
    }
  }

  /* Fermer */
  .mm-story__close {
    position: absolute;
    top: var(--mm-space-5); right: var(--mm-space-5);
    z-index: 4;
    width: 44px; height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: var(--mm-color-white, #ffffff);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform var(--mm-duration-medium) var(--mm-curve-big), background-color var(--mm-duration-fast) var(--mm-curve-out);
  }
  .mm-story__close:hover { transform: rotate(90deg) scale(1.08); background: rgba(255, 255, 255, 0.25); }
/* END_SECTION:mm-section-video-slider */

/* START_SECTION:mm-ui-kit (INDEX:51) */
.mm-ui-kit {
        background-color: var(--mm-color-black-50);
        gap: 20px;
        padding: 40px;
    }
    .mm-best-practices {
        background-color: var(--mm-color-black-50);
        gap: 20px;
        padding: 40px;
    }
    .mm-icon-group {
        gap: 20px;
    }
    .mm-ui-kit-wrapper {
        background: var(--mm-color-black-100);
        border-radius: 5px;
    }
    .mm-drop-wrapper {
		border-radius: 5px 5px 0 0;
        background: var(--mm-color-black-100);
        color: var(--mm-color-black-500);
        padding: 10px;
        border-radius: 5px;
        width: 100%;
    }
    .mm-ui-kit .splide__slide {
        height: 200px;
        background: var(--mm-color-black-50);
        border-radius: 5px;
    }
    .mm-ui-kit-group {
        line-height: 16px;
        gap: 10px;
    }
    .mm-component {
        padding: 20px;
        gap: 10px;
    }
    .mm-component .mm-media {
        grid-gap: 10px;
    }
    .mm-component .mm-media .mm-media-wrapper {
        width: 200px;
        height: 200px;
    }
    .mm-component-btn {
        padding: 20px;
        gap: 10px;
    }
    .mm-text {
        gap: 10px;
    }
    .mm-component-color {
        border-radius: 8px;
        overflow: clip;
        box-shadow: 0 12px 16px -4px rgba(16, 24, 40, .08)
        , 0 4px 6px -2px rgba(16, 24, 40, .03);
    }

    .mm-color-title {
        padding: 12px;
    }

    .mm-color {
        width: 140px;
        height: 140px;
    }
    .mm-ui-kit-logo,
    .mm-ui-kit-video {
        width: 300px;
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }
/* END_SECTION:mm-ui-kit */

/* START_SECTION:mm-video-details (INDEX:52) */
.mm-vdetails {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 120px;
    padding: var(--mm-space-12) 0;
    background: var(--mm-color-primary, #3b0117);
    overflow: hidden;
    font-family: var(--mm-font);
    /* previews en grid : sans containment, la piste du marquee (max-content)
       gonflerait la largeur intrinsèque de la page */
    contain: inline-size;
    min-width: 0;
  }

  /* décor : vague rose 10% + éclat, échelle fixe (les tracés gardent leur
     ampleur de maquette quel que soit le viewport) */
  .mm-vdetails__deco {
    position: absolute;
    top: -390px;
    left: 50%;
    transform: translateX(-50%);
    width: 3766px;
    height: auto;
    pointer-events: none;
  }

  .mm-vdetails__inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mm-space-11);
    padding: 0 var(--mm-space-12);
    max-width: 1440px;
    margin: 0 auto;
    width: 100%;
  }
  @media (width > 1720px) {
    .mm-vdetails__inner { max-width: calc(var(--mm-content-max) + 2 * var(--mm-space-12)); }
  }
  @media (max-width: 989px) {
    .mm-vdetails__inner { flex-direction: column; align-items: flex-start; padding: 0 var(--mm-space-6); }
    /* en colonne, la piste nowrap du slider presse gonflerait la largeur
       intrinsèque de la colonne (donc de la card) : on la fixe au conteneur */
    .mm-vdetails__col { width: 100%; }
    /* maquette mobile : la vidéo passe EN HAUT, le texte dessous */
    .mm-vdetails__media { order: -1; }
  }
  @media (max-width: 749px) {
    .mm-vdetails { padding: var(--mm-space-11) 0; gap: 68px; }
    .mm-vdetails__inner { padding: 0 var(--mm-space-5); }
  }

  .mm-vdetails__col {
    max-width: 680px;
    min-width: 0;
  }

  .mm-vdetails__eyebrow {
    margin: 0 0 var(--mm-space-9);
    font: 800 var(--mm-font-size-title-sm) / 1.05 var(--mm-font);
    letter-spacing: -0.5px;
    color: var(--mm-color-secondary, #fad7fe);
  }

  .mm-vdetails__title {
    margin: 0;
    font: 800 var(--mm-font-size-title) / 1.06 var(--mm-font);
    letter-spacing: -1.2px;
    color: var(--mm-color-white, #ffffff);
    overflow-wrap: break-word;
  }
  /* partie rose du titre : <em> (convention du logo eco<em>matelas</em>) */
  .mm-vdetails__title em {
    font-style: normal;
    color: var(--mm-color-secondary, #fad7fe);
  }
  @media (max-width: 749px) {
    .mm-vdetails__eyebrow { font-size: var(--mm-font-size-title-sm-mobile); letter-spacing: -0.3px; }
    .mm-vdetails__title { font-size: 34px; letter-spacing: -0.8px; }
  }

  .mm-vdetails__desc {
    display: flex;
    flex-direction: column;
    gap: var(--mm-space-4);
    margin-top: var(--mm-space-10);
    max-width: 40em;
  }
  .mm-vdetails__desc p {
    margin: 0;
    font: 500 var(--mm-font-size-text-lg) / 1.35 var(--mm-font);
    color: var(--mm-color-white, #ffffff);
  }
  .mm-vdetails__desc .mm-vdetails__desc-strong {
    font-weight: 800;
    line-height: 1.3;
  }
  @media (max-width: 749px) {
    .mm-vdetails__desc { margin-top: var(--mm-space-8); }
    .mm-vdetails__desc p { font-size: var(--mm-font-size-text); }
  }

  .mm-vdetails .mm-insert {
    max-width: 515px;
    gap: var(--mm-space-4);
  }
  .mm-vdetails__insert-list {
    display: flex;
    flex-direction: column;
    gap: var(--mm-space-1);
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .mm-vdetails__insert-item {
    display: flex;
    align-items: flex-start;
    gap: var(--mm-space-2);
  }
  .mm-vdetails__insert-check {
    flex: none;
    margin-top: 3px;
  }

  .mm-vdetails__cta { margin-top: var(--mm-space-8); }

  /* ----- Bloc presse : pill inclinée qui chevauche la card de logos -----
     width:100% (pas inline-flex) : le slider a besoin d'un cadre de largeur
     stable pour que sa fenêtre (overflow: hidden) ait un sens à toutes tailles. */
  .mm-vdetails__press {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-top: var(--mm-space-11);
  }
  @media (max-width: 749px) { .mm-vdetails__press { margin-top: var(--mm-space-9); } }

  .mm-label.mm-vdetails__press-pill {
    position: relative;
    z-index: 1;
    margin: 0 0 -11px var(--mm-space-2);
    transform: rotate(-2.25deg);
  }

  /* ----- Card de logos : rangée statique qui wrap, à toutes les tailles
     (Figma 10430-28192) — la copie clone (mm-vdetails__press-set--clone)
     ne sert plus qu'à un ancien mode boucle, elle reste dans le DOM
     (édition des blocs) mais masquée partout. */
  .mm-vdetails__press-logos {
    position: relative;
    padding: var(--mm-space-5);

    background: var(--mm-color-white, #ffffff);
    border-radius: var(--mm-radius-xl);
    overflow: hidden;
  }
  .mm-vdetails__press-strip { display: flex; }
  .mm-vdetails__press-set,
  .mm-vdetails__press-set--clone {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    flex-wrap: wrap;
    gap: var(--mm-space-8);
  }
  .mm-vdetails__press-set--clone { display: none; }
  .mm-vdetails__press-logo { display: flex; }
  .mm-vdetails__press-logos img {
    display: block;
    height: 25px;
    width: auto;
  }

  /* ----- ≤749px : la card de logos redevient un slider auto en boucle -----
     Deux copies du set dans la piste, glissement continu de -50% (= une
     copie exactement, padding-right du set compris → boucle sans couture).
     La vitesse est un temps par set : ~16s pour 4-6 logos. */
  @media (max-width: 749px) {
    .mm-vdetails__press-logos {
      width: 100%;
      /* padding: var(--mm-space-4) 0; */
    }
    .mm-vdetails__press-strip {
      width: max-content;
      animation: mm-vdetails-press-loop var(--vd-press-speed, 16s) linear infinite;
    }
    .mm-vdetails__press-set,
    .mm-vdetails__press-set--clone {
      display: flex;
      flex: none;
      flex-wrap: nowrap;
      gap: var(--mm-space-5);
      padding-right: var(--mm-space-5); /* même respiration entre les deux copies */
    }
    .mm-vdetails__press-logos img { height: 20px; }
    /* fondus blancs des bords (pas un mask : il voyagerait avec la piste) */
    .mm-vdetails__press-logos::before,
    .mm-vdetails__press-logos::after {
      content: '';
      position: absolute;
      top: 0; bottom: 0;
      width: var(--mm-space-6);
      z-index: 1;
      pointer-events: none;
    }
    .mm-vdetails__press-logos::before {
      left: 0;
      background: linear-gradient(90deg, var(--mm-color-white, #ffffff), transparent);
    }
    .mm-vdetails__press-logos::after {
      right: 0;
      background: linear-gradient(270deg, var(--mm-color-white, #ffffff), transparent);
    }
  }
  @keyframes mm-vdetails-press-loop {
    to { transform: translateX(-50%); }
  }
  /* reduced-motion : pas de défilement — retour à la rangée qui replie */
  @media (max-width: 749px) and (prefers-reduced-motion: reduce) {
    .mm-vdetails__press-strip { animation: none; width: auto; }
    .mm-vdetails__press-set { flex-wrap: wrap; }
    .mm-vdetails__press-set--clone { display: none; }
  }

  /* ----- Carte vidéo (droite) ----- */
  .mm-vdetails__media { flex: none; }
  @media (max-width: 989px) { .mm-vdetails__media { align-self: center; } }
  /* mobile : la vidéo en haut, pleine largeur de la colonne (sinon la card
     en width:100% se résout contre un parent de largeur 0 → card collapsée) */
  @media (max-width: 749px) {
    .mm-vdetails__media { width: 100%; align-self: stretch; }
  }

  .mm-vdetails__card {
    position: relative;
    display: block;
    width: 384px;
    max-width: 76vw;
    aspect-ratio: 9 / 16;
    border: 0;
    padding: 0;
    border-radius: var(--mm-radius-xl);
    overflow: hidden;
    background: var(--mm-color-black-900, #201c1b);
    cursor: pointer;
    transform: rotate(1.5deg);
    transition: transform var(--mm-duration-medium) var(--mm-curve-medium), box-shadow var(--mm-duration-medium) var(--mm-curve-out);
  }
  .mm-vdetails__card:hover {
    transform: rotate(1.5deg) translateY(-6px) scale(1.015);
    box-shadow: var(--mm-shadow-md);
  }
  .mm-vdetails__card:active { transform: rotate(1.5deg) scale(0.98); }
  /* vignette seule (pas de vidéo) : pas de bouton, pas d'affordance clic,
     ratio dédié 8:11 (la 9:16 est pensée pour l'écran vidéo mobile) */
  .mm-vdetails__card--static {
    aspect-ratio: 8 / 11;
    cursor: default;
  }
  .mm-vdetails__card--static:hover { transform: rotate(1.5deg); box-shadow: none; }
  /* maquette mobile : card quasi pleine largeur (la colonne fait 100%) */
  @media (max-width: 749px) {
    .mm-vdetails__card { width: 100%; max-width: none; }
  }

  .mm-vdetails__card > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /* voile 20% de la maquette : garde le play lisible sur tout poster (conditionnel via setting) */
  .mm-vdetails__card--with-filter::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(32, 28, 27, 0.2);
  }

  /* play « fleur » : contre-rotation pour rester droit dans la card inclinée */
  .mm-vdetails__play {
    position: absolute;
    top: 50%; left: 50%;
    translate: -50% -50%;
    z-index: 2;
    width: 84px; height: 84px;
    display: grid;
    place-items: center;
    color: var(--mm-color-white, #ffffff);
    transform: rotate(-1.5deg);
    transition: transform var(--mm-duration-medium) var(--mm-curve-big);
  }
  .mm-vdetails__card:hover .mm-vdetails__play { transform: rotate(-1.5deg) scale(1.12); }
  .mm-vdetails__play-flower {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .mm-vdetails__play-tri {
    position: relative;
    color: var(--mm-color-primary, #3b0117);
    margin-left: 2px; /* centrage optique du triangle */
  }

  .mm-label.mm-vdetails__duration {
    position: absolute;
    bottom: var(--mm-space-5);
    left: 50%;
    z-index: 2;
    translate: -50% 0;
    transform: rotate(-2.25deg);
  }

  /* ----- Marquee scroll-driven (lerp dans MM-Video-Details.js), à toutes
     les tailles — pas de défilement automatique. */
  .mm-vdetails__marquee {
    position: relative;
    overflow: hidden;
    color: var(--mm-color-white, #ffffff);
  }
  .mm-vdetails__marquee-track {
    display: flex;
    width: max-content;
    will-change: transform;
  }
  .mm-vdetails__marquee-set {
    flex: none;
    display: flex;
    align-items: center;
    gap: var(--mm-space-11);
    padding-right: var(--mm-space-11); /* même respiration entre deux sets */
  }
  .mm-vdetails__marquee-word {
    font: 800 91px / 1.05 var(--mm-font); /* Desktop/Display de la maquette */
    letter-spacing: -1.82px;
    white-space: nowrap;
  }
  .mm-vdetails__marquee-icon {
    display: inline-flex;
    flex: none;
    transform: rotate(var(--vd-tilt, 0deg));
  }
  .mm-vdetails__marquee-sep {
    flex: none;
    width: 2px;
    height: 64px;
    border-radius: 2px;
    background: var(--mm-color-white, #ffffff);
    opacity: 0.3;
  }
  @media (max-width: 749px) {
    .mm-vdetails__marquee-set { gap: var(--mm-space-8); padding-right: var(--mm-space-8); }
    .mm-vdetails__marquee-word { font-size: 34px; letter-spacing: -0.9px; }
    .mm-vdetails__marquee-icon svg { width: 44px !important; height: 44px !important; }
    .mm-vdetails__marquee-sep { height: 32px; }
  }

  /* ====================================================================== */
  /* ----- Visionneuse (créée en JS au clic sur la card) ------------------ */
  /* Adaptée de la visionneuse Stories du Slider Vidéo : overlay + carte     */
  /* 9:16 spring — mais mono-vidéo, progression pilotée par timeupdate.     */
  /* ====================================================================== */
  .mm-vdstory {
    position: fixed;
    inset: 0;
    z-index: 140;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    font-family: var(--mm-font);
    /* la visibilité attend la fin de l'animation de fermeture */
    transition: visibility 0s linear .35s;
  }
  .mm-vdstory.is-open { visibility: visible; transition-delay: 0s; }

  .mm-vdstory__overlay {
    position: absolute;
    inset: 0;
    background: rgba(32, 28, 27, 0.94);
    opacity: 0;
    transition: opacity .35s var(--mm-curve-out);
  }
  .mm-vdstory.is-open .mm-vdstory__overlay { opacity: 1; }

  .mm-vdstory__card {
    position: relative;
    height: min(86vh, 780px);
    aspect-ratio: 9 / 16;
    border-radius: var(--mm-radius-lg);
    overflow: hidden;
    background: var(--mm-color-black-900, #201c1b);
    opacity: 0;
    transform: scale(0.93) translateY(20px);
    transition: opacity .25s var(--mm-curve-out), transform .5s var(--mm-curve-soft);
  }
  .mm-vdstory.is-open .mm-vdstory__card {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
  @media (max-width: 749px) {
    .mm-vdstory__card {
      height: calc(100% - var(--mm-space-3) * 2);
      width: calc(100% - var(--mm-space-3) * 2);
      aspect-ratio: auto;
    }
  }

  .mm-vdstory__media,
  .mm-vdstory__media video,
  .mm-vdstory__media iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  /* tap sur la vidéo = play/pause, comme sur les stories */
  .mm-vdstory__media { cursor: pointer; }
  .mm-vdstory__media iframe { border: 0; }

  /* YouTube : le lecteur embarqué a ses propres contrôles → on masque les
     nôtres (et le dégradé qui les rend lisibles) */
  .mm-vdstory--youtube .mm-vdstory__controls,
  .mm-vdstory--youtube .mm-vdstory__card::after { display: none; }
  .mm-vdstory--youtube .mm-vdstory__media { cursor: auto; }
  /* vidéo YouTube horizontale : carte 16:9 calée sur la largeur */
  .mm-vdstory--landscape .mm-vdstory__card {
    width: min(90vw, 1280px);
    height: auto;
    aspect-ratio: 16 / 9;
  }
  @media (max-width: 749px) {
    .mm-vdstory--landscape .mm-vdstory__card {
      width: calc(100% - var(--mm-space-3) * 2);
      height: auto;
      aspect-ratio: 16 / 9;
    }
  }
  /* lisibilité de la barre de contrôles */
  .mm-vdstory__card::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 110px;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(0deg, rgba(32, 28, 27, .55), transparent);
  }

  .mm-vdstory__controls {
    position: absolute;
    left: var(--mm-space-4); right: var(--mm-space-4); bottom: var(--mm-space-4);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: var(--mm-space-3);
    color: var(--mm-color-white, #ffffff);
  }
  .mm-vdstory__playpause {
    flex: none;
    width: 42px; height: 42px;
    border: 0;
    border-radius: 50%;
    background: var(--mm-color-white, #ffffff);
    color: var(--mm-color-black-900, #201c1b);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform var(--mm-duration-medium) var(--mm-curve-big);
  }
  .mm-vdstory__playpause:hover { transform: scale(1.12); }
  .mm-vdstory__playpause:active { transform: scale(.9); }
  .mm-vdstory__playpause .icon-pause { display: block; }
  .mm-vdstory__playpause .icon-play  { display: none; }
  .mm-vdstory.is-paused .mm-vdstory__playpause .icon-pause { display: none; }
  .mm-vdstory.is-paused .mm-vdstory__playpause .icon-play  { display: block; }

  /* barre de progression : cliquable pour se déplacer (mono-vidéo longue) */
  .mm-vdstory__seek {
    flex: 1;
    height: 14px;               /* zone de clic confortable */
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  .mm-vdstory__seek-bar {
    width: 100%;
    height: 2.5px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.35);
    overflow: hidden;
  }
  .mm-vdstory__seek-bar span {
    display: block;
    height: 100%;
    background: var(--mm-color-white, #ffffff);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .25s linear;
  }
  .mm-vdstory__time { flex: none; font: 400 var(--mm-font-size-text-sm) / 1 var(--mm-font); opacity: .9; font-variant-numeric: tabular-nums; }

  .mm-vdstory__close {
    position: absolute;
    top: var(--mm-space-5); right: var(--mm-space-5);
    z-index: 4;
    width: 44px; height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: var(--mm-color-white, #ffffff);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform var(--mm-duration-medium) var(--mm-curve-big), background-color var(--mm-duration-fast) var(--mm-curve-out);
  }
  .mm-vdstory__close:hover { transform: rotate(90deg) scale(1.08); background: rgba(255, 255, 255, 0.25); }
/* END_SECTION:mm-video-details */

/* CSS from snippet stylesheet tags */
/* START_SNIPPET:mm-article-card (INDEX:73) */
.mm-article-card {
        --mm-press: 0.98;
        transition: transform var(--mm-duration-medium) var(--mm-curve-medium);

        &:hover {
            transform: translateY(-4px);
        }
        &:hover .mm-article-card-media,
        &:hover .mm-blog-auteur {
            box-shadow: var(--mm-shadow-md);
        }
        .mm-article-card-image {
            z-index: -1;
        }
        .mm-label {
            padding: 4px 6px;
            align-self: flex-start;
        }
        .mm-article-card-icon {
            margin-left: auto;
            background: var(--mm-color-white, #ffffff);
            border: 1px solid var(--mm-color-black-100, #E9E8E8);
            width: 40px;
            height: 40px;
            border-radius: 100px;
        }
    }

    @media (scripting: none) {
        .mm-article-card:active {
            transform: scale(0.98);
            transition-duration: 90ms;
        }
    }

    .mm-article-card-media,
    .mm-blog-auteur {
        transition: box-shadow var(--mm-duration-medium) var(--mm-curve-out);
    }

    .mm-article-card-media {
        isolation: isolate;
        flex: 1 1 0;
        min-width: 0;
        aspect-ratio: 0.9;
    }

    .mm-design-1 {
        gap: var(--mm-space-2, 8px);

        > * {
            flex: 1 1 0;
            min-width: 0;
            max-width: 360px;
        }
        .mm-article-card-media {
            aspect-ratio: 0.8;
        }
        .mm-article-card-title {
            font-size: var(--mm-font-size-text-lg, 20px); font-weight: var(--mm-font-weight-heavy, 800); line-height: 1.35;
        }
    }

    .mm-design-2 {
        .mm-blog-auteur {
            position: absolute;
            left: 4px;
            right: 4px;
            bottom: 4px;
            gap: 20px;
        }
        .mm-article-card-title {
            font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-medium, 500); line-height: 1.4; letter-spacing: -0.1px;
        }
        .mm-article-card-excerpt {
            display: none;
        }
    }

    @media (width <= 990px) {
        .mm-design-1 {
            flex-direction: column;
            gap: 0;

            > * {
                max-width: none;
            }
            .mm-article-card-media {
                flex: none;
                aspect-ratio: 0.72;
                max-height: 560px;
            }
            .mm-article-card-title {
                font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-medium, 500); line-height: 1.35; letter-spacing: -0.02em;
            }
            .mm-blog-auteur {
                flex: none;
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                margin: 4px;
                min-height: 130px;
            }
            .mm-article-card-excerpt {
                display: none;
            }
        }
        .mm-design-2 {
            .mm-article-card-title {
                font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-medium, 500); line-height: 1.35; letter-spacing: -0.02em;
            }
        }
    }
/* END_SNIPPET:mm-article-card */

/* START_SNIPPET:mm-article-citation (INDEX:74) */
.mm-article-citation {
        border-radius: 20px;
        margin: 16px 0px 36px 0px;
        padding: var(--mm-space-8, 32px);
        background: var(--mm-color-dark-violet, #3B0117);
        gap: 70px;
        container-type: inline-size;
    }
    .mm-article-citation__wave {
        position: absolute;
        bottom: -285px;
        right: -209px;
        width: 539px;
        height: auto;
        color: var(--mm-color-white, #ffffff);
        opacity: .2;
        pointer-events: none;
    }
    .mm-article-citation-wrapper {
        gap: 10px;
    }
    .mm-article-citation__value {
        font-size: 91px; font-weight: var(--mm-font-weight-heavy, 800); line-height: 105%; letter-spacing: -1.82px;
    }

    @media (width <= 768px) {
        .mm-article-citation {
            margin: 16px 0px;
            padding: var(--mm-space-5, 20px);
            gap: 90px;
        }
        .mm-article-citation__value {
            font-size: 57px; letter-spacing: -1.2px;
        }
        .mm-article-citation__title {
            font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
        }
        .mm-article-citation__source {
            font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
        }
    }
/* END_SNIPPET:mm-article-citation */

/* START_SNIPPET:mm-article-content (INDEX:75) */
.mm-article-content {
        counter-reset: mm-article-h3;
        padding: 10px;

        strong {
            font-weight: var(--mm-font-weight-heavy, 800);
            color: var(--mm-color-black-900, #201C1B);
        }
        p, a {
            font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
            color: var(--mm-color-black-900, #201C1B);
        }
        p:has(+ h3) {
            padding-bottom: 20px;
        }
        ul {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            gap: 8px;

            li {
                color: var(--mm-color-black-700, #595655);
                position: relative;
                padding-left: 28px;
            }
            li strong {
                color: var(--mm-color-black-700, #595655);
            }
            li::before {
                content: '';
                position: absolute;
                top: 0.15em;
                left: 0;
                width: 20px;
                height: 20px;
                background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='9.5' cy='9.75' r='8' fill='%23F4F4F4'/%3E%3Cpath d='M12.1493 7.75992C12.1819 7.75567 12.2147 7.75261 12.2475 7.7507C12.6892 7.72931 12.876 8.20317 12.6038 8.52224C12.4726 8.67589 12.3183 8.81988 12.1753 8.96313C11.9062 9.23141 11.6388 9.5013 11.373 9.77278C10.5785 10.5796 9.78568 11.3875 8.99366 12.1973C8.82076 12.3741 8.57128 12.4844 8.34185 12.3176C8.16193 12.1868 7.97781 11.9679 7.8214 11.8024L7.03535 10.9698C6.84941 10.7802 6.51749 10.5053 6.5004 10.2283C6.49445 10.1315 6.55571 9.95603 6.63177 9.89101C7.06528 9.52037 7.3986 10.0075 7.67479 10.298L8.60178 11.2779C9.3094 10.5363 10.0572 9.79522 10.7787 9.06487L11.527 8.30583C11.6905 8.13989 11.9439 7.84699 12.1493 7.75992Z' fill='%233B0117'/%3E%3C/svg%3E") no-repeat center / contain;
            }
        }
        a {
            text-decoration: underline;
        }
        h2 {
            font-size: var(--mm-font-size-title-sm, 34px); font-weight: var(--mm-font-weight-heavy, 800); line-height: 1.05; letter-spacing: -1.5px;
            color: var(--mm-color-black-900, #201C1B);
            padding-bottom: 4px;
            counter-set: mm-article-h3;
        }
        h2:not(:first-child) {
            padding-top: 35px;
        }
        h2:has(+ h3) {
            padding-bottom: 20px;
        }
        h3 {
            padding-top: 6px;
            font-size: var(--mm-font-size-text-lg, 20px); font-weight: var(--mm-font-weight-heavy, 800); line-height: 1.35;
            color: var(--mm-color-black-900, #201C1B);
            counter-increment: mm-article-h3;
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding-bottom: 4px;
        }
        h3::before {
            content: counter(mm-article-h3);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            top: -6px;
            position: relative;
            width: 32px;
            height: 32px;
            aspect-ratio: 1;
            border-radius: 50%;
            background: var(--mm-color-primary, #3B0117);
            color: var(--mm-color-white, #FFFFFF);
            font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
        }
        img {
            aspect-ratio: 1.5;
            width: 100%;
            height: fit-content;
            border-radius: 16px;
            overflow: hidden;
            margin: 20px 0px;
        }
    }
    @media (max-width: 768px) {
        .mm-article-content {
            padding: 0px;

            h2 {
                font-size: var(--mm-font-size-text-lg, 20px); font-weight: var(--mm-font-weight-heavy, 800); line-height: 1.35;
            }
            h3 {
                font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
            }
            p, a {
                font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
            }
        }
    }
/* END_SNIPPET:mm-article-content */

/* START_SNIPPET:mm-article-info-card (INDEX:76) */
.mm-article-info-card {
		position: sticky;
		top: calc(var(--header-height, 66px) + var(--mm-space-5, 20px));
		width: 310px;
        padding: var(--mm-space-6, 24px);
		border-radius: 20px;
		background: var(--mm-color-white, #ffffff);
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        box-shadow: -29px -156px 45px 0 rgba(0, 0, 0, 0.00), -19px -100px 41px 0 rgba(0, 0, 0, 0.01), -10px -56px 34px 0 rgba(0, 0, 0, 0.02), -5px -25px 25px 0 rgba(0, 0, 0, 0.03), -1px -6px 14px 0 rgba(0, 0, 0, 0.04);
		transition: transform var(--mm-duration-medium) var(--mm-curve-medium);

		&:hover {
			transform: translateY(-4px);
		}
	}
	.mm-article-info-card.is-closed {
		display: none;
	}
	.mm-article-info-card__media {
		height: 75px;
	}
	.mm-article-info-card__wave {
		top: 0;
		left: 0;
		color: var(--mm-color-secondary, #fad7fe);
	}
	.mm-article-info-card__wave--mobile {
		top: auto;
        height: auto;
        position: absolute;
        bottom: -20px;
        left: 0;
        width: 446px;
	}
	.mm-article-info-card__image {
        width: 65px;
        height: 75px;
		object-fit: cover;
		border-radius: 10px;
		border: 1px solid var(--mm-color-black-50, #F4F4F4);
	}
    .mm-article-info-card__images {
        height: 95px;
        align-items: start;
    }
	.mm-article-info-card__image--1 {
        top: 10px;
        left: 15px;
        position: relative;
		transform: rotate(-10deg);
	}
	.mm-article-info-card__image--3 {
        top: 10px;
        right: 15px;
        position: relative;
		transform: rotate(10deg);
	}
	.mm-article-info-card__image--2 {
		z-index: 1;
	}
	.mm-article-info-card__close {
		top: 12px;
		right: 12px;
		z-index: 2;
		width: 34px;
		height: 34px;
		border-radius: 100px;
		background: var(--mm-color-black-100, #E9E8E8);
	}
    .mm-article-info-card__btn {
        min-width: 190px;
    }
	.mm-link.mm-article-info-card__link {
		padding-bottom: 0;
		color: var(--mm-color-primary, #3b0117);
		text-decoration: underline;
		text-underline-offset: 3px;
	}
	.mm-link.mm-article-info-card__link::after {
		content: none;
	}
	.mm-article-info-card__wave--desktop,
    .mm-article-info-card__btn--desktop {
		display: flex;
	}
	.mm-article-info-card__wave--mobile,
    .mm-article-info-card__btn--mobile {
		display: none;
	}

	@media (max-width: 1350px) {
		.mm-article-info-card {
			max-width: 420px;
            width: initial;
			margin-inline: auto;
			padding: var(--mm-space-5, 20px) var(--mm-space-5, 20px) 0;
			flex-direction: column-reverse;
			gap: var(--mm-space-4, 16px);
			transition: transform var(--mm-duration-medium) var(--mm-curve-out), opacity var(--mm-duration-medium) var(--mm-curve-out);
		}
		.mm-article-info-card.is-hidden {
			opacity: 0;
			transform: translateY(calc(100% + var(--mm-space-5, 20px)));
			pointer-events: none;
		}
		.mm-article-info-card__images {
			height: 85px;
			align-items: end;
			margin-bottom: -12px;
		}
        .mm-article-info-card__image {
            width: 75px;
            height: 85px;
        }
        .mm-article-info-card__title {
            padding: 0 30px;
        }
        .mm-article-info-card__wave--desktop,
        .mm-article-info-card__btn--desktop {
            display: none;
        }
        .mm-article-info-card__wave--mobile,
        .mm-article-info-card__btn--mobile {
            display: flex;
        }
	}
/* END_SNIPPET:mm-article-info-card */

/* START_SNIPPET:mm-article-info (INDEX:77) */
.mm-auteur-image {
        width: 30px;
        height: 30px;
        object-fit: cover;
    }
    .mm-article-info-2 {
        border-radius: 20px;
        padding: var(--mm-space-6, 24px);
        background: var(--mm-color-black-50, #F4F4F4);
    }
    .mm-article-info-separator {
        height: 1px;
        width: 100%;
        background: var(--mm-color-black-100, #E5E5E5);
        margin-bottom: 8px;
    }

    @media (width <= 768px) {
        .mm-article-info-2 {
        }
    }
/* END_SNIPPET:mm-article-info */

/* START_SNIPPET:mm-cart-count-bubble (INDEX:93) */
.mm-cart-count-bubble {
		position: absolute;
		top: -4px;
		right: -4px;
		min-width: 16px;
		height: 16px;
		padding: 0 4px;
		border-radius: 999px;
		background: var(--mm-color-secondary, #fad7fe);
		color: var(--mm-color-primary, #3b0117);
		font-size: 10px;
		font-weight: 700;
		line-height: 16px;
		text-align: center;
		pointer-events: none;
	}
/* END_SNIPPET:mm-cart-count-bubble */

/* START_SNIPPET:mm-chat-limova (INDEX:110) */
html:not(.mm-chat-open) iframe[src^="https://limova-web-sltj.onrender.com/"]:not([data-chat-panel-frame]) {
        z-index: 45 !important;
    }
    html:not(.mm-chat-open):has(.mm-sticky.is-visible:not(.is-footer-visible)) iframe[src^="https://limova-web-sltj.onrender.com/"]:not([data-chat-panel-frame]) {
        bottom: 160px !important;
    }
    @media (width <= 768px) {
        html:not(.mm-chat-open):has(.mm-pack-funnel-mobile-bar:not(.is-footer-visible)) iframe[src^="https://limova-web-sltj.onrender.com/"]:not([data-chat-panel-frame]) {
            bottom: 135px !important;
        }
    }
    #mm-chat-panel .mm-panel__body {
        padding: 0;
        overflow: hidden;
    }
    .mm-chat-panel__frame {
        display: block;
        width: 100%;
        height: 100%;
        border: 0;
    }
/* END_SNIPPET:mm-chat-limova */

/* START_SNIPPET:mm-colection-tabs-item (INDEX:111) */
.mm-hero-collection__tabs_slide {
        width: fit-content !important;
    }
    .mm-hero-collection__tabs_item {
        width: fit-content !important;
        padding: 10px 20px;
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100);
        background: var(--mm-color-white);
        color: var(--mm-color-primary);
        text-decoration: none;
        transition: all 0.3s ease-in-out;
    }
    .mm-hero-collection__tabs_item:hover,
    .mm-hero-collection__tabs_item.is-url {
        color: var(--mm-color-white);
        border: 1px solid var(--mm-color-primary);
        background: var(--mm-color-primary);
    }
    .mm-hero-collection__tabs_item-label {
        border-radius: 4px;
    }
    .mm-hero-collection__tabs_item-label {
        position: absolute;
        left: 20px;
        top: -10px;
    }
/* END_SNIPPET:mm-colection-tabs-item */

/* START_SNIPPET:mm-collection-card (INDEX:112) */
.collection-card img {
		object-fit: cover;
	}
	.collection-card[data-ratio="adapt"] img { aspect-ratio: 4 / 3; }
	.collection-card[data-ratio="portrait"] img { aspect-ratio: 3 / 4; }
	.collection-card[data-ratio="square"] img { aspect-ratio: 1 / 1; }
/* END_SNIPPET:mm-collection-card */

/* START_SNIPPET:mm-collection-description (INDEX:113) */
.mm-collection-description__text {
        display: -webkit-box;
        -webkit-line-clamp: var(--mm-co-desc-lines, 4);
        line-clamp: var(--mm-co-desc-lines, 4);
        -webkit-box-orient: vertical;
        line-height: 1.5em;
        overflow: hidden;
        margin: 0;
    }
    .mm-collection-description__text.mm-expanded {
        display: block;
        -webkit-line-clamp: unset;
        line-clamp: unset;
        overflow: visible;
    }
    .mm-collection-description__toggle {
        position: absolute;
        right: 0;
        bottom: 0;
        padding: 0 0 0 var(--mm-space-5, 20px);
        background: linear-gradient(to right, transparent, var(--mm-color-white, #fff) 20%);
    }
    /* .mm-flex pose display:flex !important (utilitaire global) : sans ce override plus
       specifique, l'attribut [hidden] pose par le JS (ReadMoreManager) reste sans effet
       visuel — le bouton reste affiche en flex meme une fois "hidden" attribue. */
    .mm-collection-description__toggle[hidden] {
        display: none !important;
    }
    .mm-collection-description__text.mm-expanded ~ .mm-collection-description__toggle {
        position: static;
        display: inline-block;
        padding-left: 0;
        background: none;
    }

    @media (width <= 768px) {
        .mm-collection-description__text {
            -webkit-line-clamp: var(--mm-co-desc-lines-mobile, 2);
            line-clamp: var(--mm-co-desc-lines-mobile, 2);
        }
    }
/* END_SNIPPET:mm-collection-description */

/* START_SNIPPET:mm-collection-hero-product (INDEX:114) */
.mm-hero-collection-hero-product {
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        height: 370px;
        width: 650px;
        flex-shrink: 0;
    }
    .mm-hero-collection-hero-product-wrapper {
        padding: var(--mm-space-8, 32px);
        max-width: 320px;
        width: 100%;
    }
    .mm-hero-collection__product-price-compare {
        padding-top: 7px;
    }
    .mm-hero-collection__product-btn {
        width: fit-content;
        padding: var(--mm-space-4, 16px) var(--mm-space-8, 32px);
        font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.35; letter-spacing: -0.02em;
    }
    .mm-hero-collection__product-media {
        height: 100%;
        width: 50%;
    }
    
    @media (width <= 1280px)  {
        .mm-hero-collection-hero-product {
            height: 320px;
            width: 620px;
        }
    }
/* END_SNIPPET:mm-collection-hero-product */

/* START_SNIPPET:mm-collection-tabs (INDEX:115) */
.mm-hero-collection__filters-wrapper {
        .splide__track {
            padding: 10px 0;
            margin: -10px 0;
        }
    }
    
    .mm-hero-collection__filters-scroller {
        --mm-filters-fade: var(--mm-color-white, #fff);


    }

    .mm-hero-collection__filters-scroller::after {
        content: '';
        position: absolute;
        inset-block: -10px 0;
        right: 0;
        width: 140px;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(to left, var(--mm-filters-fade) 40%, transparent);
        transition: opacity var(--mm-duration-fast, .18s) var(--mm-curve-out, cubic-bezier(.22, 1, .36, 1));
    }

    .mm-hero-collection__filters-arrow.mm-slider-arrow.mm-slider-arrow {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;
        width: 32px;
        height: 32px;
        box-shadow: var(--mm-shadow-sm);
    }

    .mm-hero-collection__filters-arrow.mm-slider-arrow svg {
        width: 16px;
        height: 16px;
    }

    .mm-hero-collection__filters-scroller:has(.mm-hero-collection__filters-arrow:disabled)::after,
    .mm-hero-collection__filters-arrow.mm-slider-arrow:disabled {
        opacity: 0;
        pointer-events: none;
    }

    @media (width <= 1024px)  {
        .mm-hero-collection__filters-wrapper {
            padding: var(--mm-space-3, 12px) var(--mm-space-5, 20px);
            background: var(--mm-color-black-50);

            .splide__track {
                overflow: visible;
            }
        }

        .mm-hero-collection__filters-scroller {
            --mm-filters-fade: var(--mm-color-black-50);
        }

        .mm-hero-collection__filters-scroller::after {
            right: calc(-1 * var(--mm-space-5, 20px));
        }
    }
/* END_SNIPPET:mm-collection-tabs */

/* START_SNIPPET:mm-contact-form-wrapper (INDEX:117) */
.mm-section-contact-card {
        width: 520px;
        padding: var(--mm-space-8, 32px);
        border-radius: 16px;
    }
    .mm-section-contact-card:has(.mm-contact-form-success) {
        height: fit-content;
    }

    @media (width <= 990px) {
        .mm-section-contact-card {
            width: 100%;
            border-radius: 0;
            padding: var(--mm-space-5, 20px);
            gap: var(--mm-space-4, 16px);

            .mm-contact-form {
                gap: var(--mm-space-3, 12px);
            }
            .mm-contact-form-submit {
                gap: var(--mm-space-3, 12px);
            }
            .mm-form-field {
                gap: var(--mm-space-1, 4px);
            }
            .mm-form-field-label {
                color: var(--mm-color-black-900, #201c1b);
            }
            .mm-form-field-input {
                height: 40px;
                border-radius: 12px;
            }
        }
    }
/* END_SNIPPET:mm-contact-form-wrapper */

/* START_SNIPPET:mm-contact-form (INDEX:118) */
.mm-contact-form {
        max-width: 600px;
    }
    .mm-contact-form:has(.mm-contact-form-success) {
    }
    .mm-contact-form-fields {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mm-space-4, 16px)  var(--mm-space-5, 20px);
    }
    .mm-contact-form-fields-full {
        grid-column: 1 / -1;
    }
    .mm-contact-form-attachment-trigger {
        padding: var(--mm-space-5, 16px);
        border: 1px dashed var(--mm-color-black-300, #d4d1ce);
        border-radius: 18px;
        transition: border-color var(--mm-duration-fast, 0.2s) var(--mm-curve-out, ease);
    }
    .mm-contact-form-attachment-trigger:hover {
        border-color: var(--mm-color-black-500, #99918a);
    }
    .mm-contact-form-submit-cta {
        justify-content: center;

        svg path {
            stroke: var(--mm-color-white, #ffffff);
        }
    }
    .mm-form-control[data-contact-terms] {
        align-items: flex-start;
        gap: var(--mm-space-2, 8px);
    }
    [data-contact-terms] .mm-form-control__label {
        font-size: var(--mm-font-size-text-xs, 12px);
        color: var(--mm-color-black-600, #747170);
    }
    [data-contact-terms] .mm-form-control__label strong {
        color: var(--mm-color-black-900, #201c1b);
    }
    [data-contact-terms] .mm-form-control__box {
        margin-top: 1px;
    }

    @media (max-width: 990px) {
        .mm-contact-form {
            max-width: 100%;
        }
    }
    @media (max-width: 768px) {
        .mm-contact-form-fields {
            grid-template-columns: repeat(1, 1fr);
            gap: var(--mm-space-3, 12px);
        }
    }
/* END_SNIPPET:mm-contact-form */

/* START_SNIPPET:mm-contact-info (INDEX:119) */
.mm-contact-info-actions .mm-btn {
        gap: var(--mm-space-2, 8px);
        padding: var(--mm-space-3, 12px) 10px;
        border-radius: 12px;
    }
    .mm-contact-info-actions .mm-btn__icon {
        width: 16px;
        height: 16px;
    }
    .mm-contact-info-actions .mm-btn__text {
        font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
    }
    @media (max-width: 990px) {
        .mm-contact-info-actions {
            justify-content: space-between;

            a {
                flex: 1; 
                max-width: calc(50% - 4px);
            }
        }
    }
/* END_SNIPPET:mm-contact-info */

/* START_SNIPPET:mm-contenu-card (INDEX:120) */
.mm-contenu-card {
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100);
        transition: transform var(--mm-duration-medium) var(--mm-curve-medium), box-shadow var(--mm-duration-medium) var(--mm-curve-out);

        &:hover {
            transform: translateY(-4px);
            box-shadow: var(--mm-shadow-md);
        }
        &:hover .mm-contenu-card-image {
            transform: scale(1.06);
        }
    }

    .mm-contenu-card-image {
        aspect-ratio: 1;
        width: 100%;
        height: fit-content;
        transition: transform var(--mm-duration-medium) var(--mm-curve-out);
    }
    .mm-contenu-card__content {
        padding: var(--mm-space-6, 24px) var(--mm-space-6, 24px) var(--mm-space-8, 32px) var(--mm-space-6, 24px);
    }
    .mm-contenu-card-icon-wrapper {
        padding: var(--mm-space-2, 8px);
        border-radius: 4px;
        background: var(--mm-color-secondary-light, #FEF7FF);
    }
    .mm-contenu-card-icon {
        width: 28px;
        height: 28px;
    }
    .mm-contenu-card-rte {
        :is(p, ul, ol, li, a) {
            font: inherit;
            letter-spacing: inherit;
        }
        a {
            display: inline;
        }
        ul,
        ol {
            padding-inline-start: 1.2em;
        }
        ul {
            list-style-type: disc;
        }
        ol {
            list-style-type: decimal;
        }
        strong {
            color: var(--mm-color-black-900);
        }
    }
    @media (max-width: 990px) {
        .mm-contenu-card__content {
            padding: var(--mm-space-4, 16px) 12px var(--mm-space-6, 24px) 12px;
        }
        .mm-contenu-card-title {
            font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
        }
        .mm-contenu-card-description {
            font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
        }
    }
/* END_SNIPPET:mm-contenu-card */

/* START_SNIPPET:mm-dropdown (INDEX:127) */
.mm-dropdown-badge {
        top: -8px;
        left: 15px;
        z-index: 1;
        rotate: -3deg;
        transition: transform var(--mm-duration-medium, .38s) var(--mm-curve-medium, cubic-bezier(.34, 1.56, .64, 1));

        .mm-label-text {
            font-weight: var(--mm-font-weight-heavy, 800);
        }
    }
    .mm-dropdown-badge-wrap:hover .mm-dropdown-badge {
        transform: translateY(-2px);
    }
    
    @media (max-width: 990px) {
    }
/* END_SNIPPET:mm-dropdown */

/* START_SNIPPET:mm-form (INDEX:132) */
.mm-form-field-label {
        color: var(--mm-color-black-600, #747170);
    }
    .mm-form-field-input {
        width: 100%;
        height: 48px;
        padding: var(--mm-space-1, 4px) var(--mm-space-1, 4px) var(--mm-space-1, 4px) var(--mm-space-4, 16px);
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        border-radius: 18px;
        background: var(--mm-color-black-50, #f4f4f4);
        color: var(--mm-color-black, #000000);
        font-family: var(--mm-font); font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
        transition: border-color var(--mm-duration-fast, 180ms) var(--mm-curve-out, cubic-bezier(0.22, 1, 0.36, 1));
    }
    .mm-form-field-input::placeholder {
        color: var(--mm-color-black-500, #8f8e8d);
    }
    .mm-form-field-input:hover {
        border-color: var(--mm-color-black-300, #c5c4c3);
    }
    .mm-form-field-input:focus-visible {
        outline: none;
        border-color: var(--mm-color-primary, #3b0117);
    }
    .mm-form-field-input-textarea {
        height: auto;
        min-height: 120px;
        max-height: none;
        padding: var(--mm-space-4, 16px);
        resize: vertical;
    }
    .mm-form-field-input-select {
        appearance: none;
        padding-right: var(--mm-space-9, 40px);
        cursor: pointer;
    }
    .mm-form-field-input-select:has(option[value=""]:checked) {
        color: var(--mm-color-black-500, #8f8e8d);
    }
    .mm-form-field-input-select option {
        color: var(--mm-color-black, #000000);
    }
    .mm-form-field-select-icon {
        top: 50%;
        right: var(--mm-space-4, 16px);
        transform: translateY(-50%);
        pointer-events: none;
        color: var(--mm-color-black-500, #8f8e8d);
    }
    .mm-form-field-select.is-custom > select {
        position: absolute;
        inset: 0;
        opacity: 0;
        pointer-events: none;
        margin: 0;
    }
    .mm-form-field-select.is-custom > svg {
        display: none;
    }
    .mm-form-select .mm-selector__field {
        height: 48px;
        padding: var(--mm-space-1, 4px) var(--mm-space-4, 16px);
        border: 1px solid var(--mm-color-black-100, #e9e8e8);
        border-radius: 12px;
        background: var(--mm-color-black-50, #f4f4f4);
        color: var(--mm-color-black, #000000);
        font: var(--mm-font-weight-regular, 400) var(--mm-font-size-text-xs, 12px) / 1.1 var(--mm-font);
        letter-spacing: -0.01em;
    }
    .mm-form-field-select:has(option[value=""]:checked) .mm-selector__value {
        color: var(--mm-color-black-500, #8f8e8d);
    }
    .mm-form-select .mm-selector__chevron {
        width: 14px;
        height: 14px;
        color: var(--mm-color-black-500, #8f8e8d);
    }
    .mm-form-select .mm-selector__panel {
        padding: 6px;
        border-radius: 18px;
    }
    .mm-form-select .mm-selector__item {
        padding: 10px 12px;
        border-radius: 12px;
        font-size: var(--mm-font-size-text-xs, 12px);
    }
    .mm-form-select .mm-selector__value.is-popping {
        animation: mm-form-select-swap 0.3s var(--mm-curve-out, ease);
    }
    @keyframes mm-form-select-swap {
        0% { opacity: 0; transform: translateY(3px); }
        100% { opacity: 1; transform: translateY(0); }
    }
    .mm-contact-form {
        .mm-form-control {
            align-items: center;
        }
        .mm-form-control__label {
            color: var(--mm-color-black-500, #8f8e8d);
        }
    }
/* END_SNIPPET:mm-form */

/* START_SNIPPET:mm-insert (INDEX:137) */
.mm-insert {
  position: relative;
  width: 100%;
  border: 1px solid var(--mm-color-secondary, #fad7fe);
  padding: var(--mm-space-4);
}

.mm-insert__icon {
  position: absolute;
  top: -14.5px;
  left: -13px;
  width: 38px;
  height: 38px;
}

.mm-insert__title {
  margin: 0;
}

/* Variante coches : la puce native est remplacée par une pastille grise (::before)
   et une coche primary dessinée en mask (::after), centrées sur la 1re ligne (1lh) */
.mm-insert--check .mm-insert__description ul {
  list-style: none;
  padding-left: 0;
}

.mm-insert--check .mm-insert__description li {
  position: relative;
  padding-left: calc(var(--mm-icon-lg, 20px) + var(--mm-space-2));
}

.mm-insert--check .mm-insert__description li::before,
.mm-insert--check .mm-insert__description li::after {
  content: "";
  position: absolute;
  top: calc((1lh - var(--mm-icon-lg, 20px)) / 2);
  left: 0;
  width: var(--mm-icon-lg, 20px);
  height: var(--mm-icon-lg, 20px);
}

.mm-insert--check .mm-insert__description li::before {
  background: var(--mm-color-black-50);
  border-radius: var(--mm-radius-full);
}

.mm-insert--check .mm-insert__description li::after {
  background: var(--mm-color-primary);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4.74 7.48 7.26 10l4-4' stroke='%23000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / var(--mm-icon-md, 16px) no-repeat;
}
/* END_SNIPPET:mm-insert */

/* START_SNIPPET:mm-keypoint-card (INDEX:139) */
/* Cartes : colonnes égales, même hauteur (align-items:stretch par défaut du flex) */
  .mm-keypoints__card {
    flex: 1 1 0;
    min-width: 0;
    padding: var(--mm-space-8);
  }

  .mm-keypoints__value,
  .mm-keypoints__desc {
    width: 100%;
  }

  /* Responsive */
  @media (width <= 1280px) {
    .mm-keypoints__card {
      padding: var(--mm-space-4);
    }
}

  @media (width <= 768px ) {
    .mm-keypoints__card {
      padding: var(--mm-space-5);

    }
  }
/* END_SNIPPET:mm-keypoint-card */

/* START_SNIPPET:mm-newsletter-form-page (INDEX:164) */
.mm-newsletter-form-page {
        padding: var(--mm-space-4, 16px);
        border-radius: 20px;
        gap: var(--mm-space-4, 16px);
        overflow: hidden;
        width: 380px;
        height: fit-content;
        position: sticky;
        top: calc(var(--header-height, 66px) + var(--mm-space-4, 16px));
    }

    .mm-newsletter-form-page--media {
        padding-top: 200px;
    }

    .mm-newsletter-form-page--media::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 1;
        background: linear-gradient(185deg, rgba(244, 244, 244, 0) 55px, var(--mm-color-black-50, #f4f4f4) 185px);
        pointer-events: none;
    }

    .mm-newsletter-form-page-image {
        width: 100%;
        aspect-ratio: 1.6;
        padding-bottom: 40px;
    }

    .mm-newsletter-form-page > :not(.mm-newsletter-form-page-image, .mm-newsletter-form-page-close) {
        position: relative;
        z-index: 2;
    }

    .mm-newsletter-form-page-close {
        display: none;
        width: 34px;
        height: 34px;
        border-radius: var(--mm-radius-full, 1000px);
        background: var(--mm-color-black-100, #E9E8E8);
    }

    .mm-newsletter-form-page.mm-newsletter-form-page--closed {
        display: none;
    }

    .mm-newsletter-form-page-formulaire-input {
        height: 48px;
        padding: 4px 4px 4px 16px;
        gap: 8px;
        border-radius: 18px;
        border: 1px solid var(--mm-color-black-100, #e9e8e8);
        background: var(--mm-color-white, #FFF);
        transition: border-color var(--mm-duration-fast) var(--mm-curve-out);
    }
    .mm-newsletter-form-page-formulaire-input:hover,
    .mm-newsletter-form-page-formulaire:has(.mm-newsletter-form-page-formulaire-input-email:focus-visible) .mm-newsletter-form-page-formulaire-input {
        border-color: var(--mm-color-black-500, #8f8e8d);
    }

    .mm-newsletter-form-page-formulaire-input-submit {
        height: 40px;
        min-width: 115px;
        border-radius: 14px;
        background: var(--mm-color-primary, #3b0117);
        padding: 0 13.5px;
    }

    .mm-newsletter-form-page-formulaire-input-email:focus-visible {
        outline: none !important;
    }

    .mm-newsletter-form-page-formulaire-input-error {
        border-color: var(--error, #e72626);
    }

    .mm-newsletter-form-page-formulaire-input-error input[type="email"]::placeholder {
        color: var(--error, #e72626);
    }

    .mm-newsletter-form-page-formulaire-input-email::placeholder {
        color: var(--mm-color-black-500, #8f8e8d);
    }

    .mm-newsletter-form-page-formulaire .mm-form-control__label {
        color: var(--mm-color-black-500, #8f8e8d);
        padding-top: 0.1em;
        font-size: var(--mm-font-size-text-xs, 12px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.1; letter-spacing: -0.01em;
    }

    .mm-newsletter-form-page-formulaire-input-email {
        flex: 1 !important;
        min-width: 0 !important;
        width: auto !important;
        border: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 0 !important;
        height: 100% !important;
    }

    .mm-newsletter-form-page-formulaire-message-error {
        color: var(--error, #e72626);
    }

    .h-captcha {
        display: none !important;
    }

    @media (width <= 990px) {
        .mm-newsletter-form-page {
            position: fixed;
            z-index: 10;
            top: auto;
            right: var(--mm-space-4, 16px);
            bottom: var(--mm-space-4, 16px);
            left: var(--mm-space-4, 16px);
            width: auto;
            box-shadow: var(--mm-shadow-md);
        }

        .mm-newsletter-form-page--media {
            padding-top: var(--mm-space-4, 16px);
        }

        .mm-newsletter-form-page--media::before,
        .mm-newsletter-form-page-image,
        .mm-newsletter-form-page-description {
            display: none;
        }

        .mm-newsletter-form-page-close {
            display: flex;
        }

        .mm-newsletter-form-page-title {
            padding-right: calc(32px + var(--mm-space-2, 8px));
            font-size: var(--mm-font-size-text-sm, 14px); font-weight: var(--mm-font-weight-medium, 500); line-height: 1.35; letter-spacing: -0.02em;
        }

        .mm-newsletter-form-page.mm-newsletter-form-page--hidden {
            transform: translateY(calc(100% + var(--mm-space-4, 16px)));
            opacity: 0;
            pointer-events: none;
        }
    }
/* END_SNIPPET:mm-newsletter-form-page */

/* START_SNIPPET:mm-page-nav (INDEX:172) */
.mm-page-nav {
        padding: var(--mm-space-4, 16px) max(var(--mm-space-12, 80px), var(--mm-content-gutter));

        .splide__list {
            gap: var(--mm-space-2, 8px);
        }
    }
    .mm-page-nav__link.mm-btn[aria-current="page"] {
        --btn-bg: var(--mm-color-black-900, #201c1b);
        --btn-color: var(--mm-color-white, #ffffff);
        border-color: transparent;
    }
    .mm-page-nav__link:not([aria-current="page"]):hover {
        --btn-bg: var(--mm-color-black-900, #201c1b);

        .mm-btn__text {
            color: var(--mm-color-white, #ffffff);
        }
    }
    @media (width > 1720px) {
        .mm-page-nav .splide__track { overflow-x: clip !important; }
    }
    @media (max-width: 990px) {
        .mm-page-nav {
            padding: var(--mm-space-4, 16px) var(--mm-space-5, 20px);
        }
    }
/* END_SNIPPET:mm-page-nav */

/* START_SNIPPET:mm-pagination (INDEX:174) */
.mm-pagination {
    }

    /* Chiffres de pagination */
    .mm-paginate {
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        background: var(--mm-color-white, #FFF);
        color: var(--mm-color-black-500, #8F8E8D);
        text-decoration: none;
        transition:
            background var(--mm-duration-fast, .18s) var(--mm-curve-out, ease),
            border-color var(--mm-duration-fast, .18s) var(--mm-curve-out, ease),
            color var(--mm-duration-fast, .18s) var(--mm-curve-out, ease),
            scale var(--mm-duration-fast, .18s) ease;
    }
    .mm-paginate,
    .mm-paginate:visited {
        color: var(--mm-color-black-500, #8F8E8D);
    }
    .mm-paginate-current,
    .mm-paginate-link:hover {
        border-color: var(--mm-color-black-900, #201C1B);
        background: var(--mm-color-black-900, #201C1B);
        color: var(--mm-color-white, #fff);
    }
    .mm-paginate-link:hover {
        scale: 1.03;
    }
    .mm-paginate-link:active {
        scale: 0.92;
    }

    /* "..." */
    .mm-paginate-ellipse {
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        background: var(--mm-color-white, #FFF);
        color: var(--mm-color-black-500, #8F8E8D);
        cursor: default;
    }

    /* Fleches precedent/suivant */
    .mm-paginate-nav {
        width: 40px;
        height: 40px;
        border-radius: 16px;
        border: 1px solid var(--mm-color-black-100, #E9E8E8);
        background: var(--mm-color-white, #FFF);
        transition: scale var(--mm-duration-fast, .18s) ease;
    }
    .mm-paginate-nav:hover {
        scale: 1.1;
    }
    .mm-paginate-nav:active {
        scale: 0.92;
    }
    .mm-paginate-nav-disabled {
        cursor: default;
        pointer-events: none;
    }
/* END_SNIPPET:mm-pagination */

/* START_SNIPPET:mm-product-card (INDEX:176) */
.mm-pcard {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    border: 1px solid var(--mm-color-ui-border, #e9e8e8);
    border-radius: var(--mm-radius-lg);
    background: var(--mm-color-white, #ffffff);
    overflow: hidden;
}
.mm-pcard:not([data-mm-reveal]) {
    transform: translateY(0);
    transition:
        transform var(--mm-duration-medium) var(--mm-curve-medium),
        box-shadow var(--mm-duration-medium) var(--mm-curve-out);
}
.mm-pcard:hover {
    transform: translateY(-6px);
    box-shadow: var(--mm-shadow-md);
}
.mm-crossell .mm-pcard:hover {
    transform: translateY(-6px);
    box-shadow: unset;
}

/* ----- Média ----- */
.mm-pcard__media {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--mm-color-ui-bg-light, #f4f4f4);
    overflow: hidden;
}
.mm-pcard__media a {
    display: block;
    width: 100%;
    height: 100%;
}
.mm-pcard__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform var(--mm-duration-slow) var(--mm-curve-medium);
}
.mm-pcard:hover .mm-pcard__media img { transform: scale(1.06); }
.mm-pcard-sold-out .mm-pcard__media img {
    filter: grayscale(1);
    opacity: 0.5;
}

/* ----- Badges ----- */
.mm-pcard__badges {
    position: absolute;
    top: var(--mm-space-4);
    left: var(--mm-space-4);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--mm-space-2);
    z-index: 2;
}

.mm-pcard__badges .mm-label-text{
    font-weight: var(--mm-font-weight-heavy);
}

/* ----- Quick add ----- */
.mm-pcard .mm-btn.mm-pcard__add {
    position: absolute;
    right: var(--mm-space-4);
    bottom: var(--mm-space-4);
    z-index: 2;
    transform: scale(0);
}
/* apparition : survol de la card, focus clavier, ou ajout confirmé */
.mm-pcard:hover .mm-btn.mm-pcard__add,
.mm-pcard .mm-btn.mm-pcard__add:focus-visible,
.mm-pcard .mm-btn.mm-pcard__add.is-added {
    transform: scale(1);
}
.mm-pcard-sold-out .mm-btn.mm-pcard__add {
    --btn-bg: var(--mm-color-black-700, #595655);
    --btn-color: var(--mm-color-white, #ffffff);
}
.mm-pcard .mm-btn.mm-pcard__add[data-btn-animation="true"]:hover { transform: scale(1.05); }
.mm-pcard .mm-btn.mm-pcard__add[data-btn-animation="true"]:active {
    transform: scale(0.96);
    transition-duration: 200ms;
    transition-timing-function: var(--mm-curve-soft);
}

/* Sur mobile (pas de hover) : toujours visible */
@media (hover: none) {
    .mm-pcard .mm-btn.mm-pcard__add { transform: scale(1); }
}

/* ----- Infos ----- */
.mm-pcard__info {
	padding: var(--mm-space-5) var(--mm-space-5) var(--mm-space-8);
  justify-content: space-between;
  height: 100%;
}

.mm-pcard-title-link{
	text-decoration: none;
}

.mm-pcard__tags {
	display: flex; gap: var(--mm-space-2); flex-wrap: wrap;
}

.mm-pcard__tag {
    transition:
        transform var(--mm-duration-fast) var(--mm-curve-big),
        background-color var(--mm-duration-fast) var(--mm-curve-out);
}
.mm-pcard__tag:hover {
	transform: translateY(-2px); background: var(--mm-color-secondary-light, #fef7ff);
}

.mm-pcard__price-container{
	margin-top: auto;
}

.mm-pcard__price {
    align-items: baseline;
}

.mm-pcard.mm-pcard-compact .mm-btn.mm-pcard__add {
    transform: scale(1);
    right: 10px; /* 10 de la maquette (entre 8 et 12) */
    bottom: 10px;
}
.mm-pcard-compact .mm-pcard__info {
	padding: var(--mm-space-4, 16px) var(--mm-space-4, 16px) var(--mm-space-6, 24px);
}
.mm-pcard-compact .mm-pcard__title {
    font: 500 var(--mm-font-size-text, 16px) / 1.4 var(--mm-font);
    letter-spacing: -0.1px;
}
.mm-pcard-compact .mm-pcard__subtitle { margin: 0; }
.mm-pcard-compact .mm-pcard__price-label {
    font-size: var(--mm-font-size-text-xs, 12px);
    line-height: 1.1;
}

@media (width <= 768px) {
    .mm-pcard { border-radius: 12px; }
    .mm-pcard-compact-sm .mm-pcard__tags { display: none; }
    .mm-pcard.mm-pcard-compact-sm .mm-btn.mm-pcard__add {
        /* toujours visible : sans survol, une apparition au hover ne se déclenche
        jamais au doigt (même parti pris que la variante compacte) */
        transform: scale(1);
        right: 10px; /* 10 de la maquette (entre 8 et 12) */
        bottom: 10px;
        /* calibre compact de l'atome Bouton (mm-btn-icon-sm : 34 carré, r8) —
        réaffirmé ici parce que la classe se choisit au rendu, pas à la
        largeur ; à réaligner si l'atome bouge (standard §6) */
        width: 34px;
        height: 34px;
        border-radius: var(--mm-radius-md, 8px);
    }
    /* calibre compact de l'atome Notation (mm-rating-sm), même raison */
    .mm-pcard-compact-sm .mm-pcard__rating { font-size: var(--mm-font-size-text-xs, 12px); }
    .mm-pcard-compact-sm .mm-pcard__rating .mm-rating__light { font-size: var(--mm-font-size-text-xxs, 10.8px); }

    .mm-pcard-compact-sm .mm-pcard__info,
	.mm-pcard__info {
		padding: var(--mm-space-2);
		grid-gap: var(--mm-space-5);
	}
	.mm-pcard__titles{
		grid-gap: 2px;
	}
	/* ----- Badges ----- */
	.mm-pcard__badges,
    .mm-pcard-compact-sm .mm-pcard__badges {
		top: 10px;
		left: 10px;
	}
	/* ----- Quick add ----- */
	.mm-pcard .mm-btn.mm-pcard__add {
		right: var(--mm-space-2);
		bottom: var(--mm-space-2);
	}
    .mm-pcard-compact-sm .mm-pcard__title {
        font: 500 var(--mm-font-size-text, 16px) / 1.4 var(--mm-font);
        letter-spacing: -0.1px;
    }
    .mm-pcard-compact-sm .mm-pcard__subtitle {
		margin: 0;
	}
	.mm-pcard__price-current,
	.mm-pcard-title-link{
		font-size: var(--mm-font-size-text, 16px);
		font-weight: var(--mm-font-weight-medium, 500);
		line-height: 1.4;
		letter-spacing: -0.1px;
	}
	/* .mm-pcard-compact-sm .mm-pcard__price-current,
    .mm-pcard-compact-sm .mm-pcard-title-link {
		font-size: var(--mm-font-size-text, 16px);
		font-weight: var(--mm-font-weight-medium, 500);
		line-height: 1.4;
		letter-spacing: -0.1px;
	} */
    .mm-pcard-compact-sm .mm-pcard__price-label {
		font-size: var(--mm-font-size-text-xxs, 10.8px);
		font-weight: var(--mm-font-weight-regular, 400);
		line-height: 1.1;
		letter-spacing: -0.01em;
	}
	.mm-pcard__price-compare{
		font-size: var(--mm-font-size-text-xxs, 10.8px);
		font-weight: var(--mm-font-weight-regular, 400);
		line-height: 1.1;
		letter-spacing: -0.01em;
	}
	.mm-pcard-compact-sm .mm-pcard__price-compare {
		font-size: var(--mm-font-size-text-sm, 14px);
		font-weight: var(--mm-font-weight-regular, 400);
		line-height: 1.35;
		letter-spacing: -0.02em;
	}
}
/* END_SNIPPET:mm-product-card */

/* START_SNIPPET:mm-product-variant-picker (INDEX:182) */
/* Variant Card Styling */
	.mm-variant-card {
		border: 2px solid var(--black-200);
		border-radius: 12px;
		overflow: hidden;
		background: var(--white);
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		position: relative;
	}

	/* Selected state */
	.mm-product-variant-checkbox:checked + .mm-product-variant-label .mm-variant-card {
		border-color: var(--primary);
		background: linear-gradient(135deg, var(--white) 0%, var(--primary-lighter) 100%);
	}

	/* Unavailable state */
	.mm-variant-card.mm-unavailable {
		opacity: 0.6;
		cursor: not-allowed;
		background: var(--black-50);
		border-color: var(--black-100);
	}

	/* Hide input completely */
	.mm-product-variant-checkbox {
		pointer-events: none;
		width: 1px;
		height: 1px;
	}

	.mm-variant-label {
		padding: 16px 20px;
		min-height: 60px;
		transition: all 0.2s ease;
	}

	@media (width > 768px) {
		.mm-variant-card:hover {
			border-color: var(--primary);
		}
	}
/* END_SNIPPET:mm-product-variant-picker */

/* START_SNIPPET:mm-qtty-selector-product (INDEX:184) */
.mm-qtty-btn {
		width: 42px;
		height: 42px;
		background-color: var(--black-100);
		border: 1px solid var(--black-400);
		border-radius: var(--rounded) !important;
	}
	.mm-btn-minus {
		border-right: none;
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}
	.mm-btn-plus {
		border-left: none;
		border-top-left-radius: 0 !important;
		border-bottom-left-radius: 0 !important;
	}
	.mm-qtty-btn[disabled] {
		opacity: 1;
		background-color: var(--white);
	}
	.mm-qtty-btn[disabled] svg {
		opacity: .4;
		cursor: default;
		pointer-events: none;
	}
	.mm-input-qtty {
		width: 42px !important;
		height: 42px;
		padding: 0 !important;
		background-color: var(--white) !important;
		border: 1px solid var(--black-400) !important;
		font-size: 14px;
		margin: 0 !important;
		border-inline: none !important;
		border-radius: 0 !important;
	}
/* END_SNIPPET:mm-qtty-selector-product */

/* START_SNIPPET:mm-rating (INDEX:187) */
/* ==== MM / Notation (atome) ==============================================
   Pill de notation : avatars superposés + étoile du set + note + libellé.
   Par défaut fond blanc + ombre portée (hero) ; variante mm-rating-border :
   bordure rose à la place de l'ombre, pour les fonds déjà colorés (slider
   vidéo). L'entrée est orchestrée par la section hôte, jamais ici. */
.mm-rating {
  display: inline-flex;
  align-items: center;
  gap: var(--mm-space-2);
  padding: var(--mm-space-2) var(--mm-space-4) var(--mm-space-2) var(--mm-space-2);
  background: var(--mm-color-white, #ffffff);
  border-radius: var(--mm-radius-full);
  box-shadow: var(--mm-shadow-sm);
  font: 500 var(--mm-font-size-text-sm) / 1 var(--mm-font);
  color: var(--mm-color-black-900, #201c1b);
}
.mm-rating.mm-rating-border {
  box-shadow: none;
  border: 1px solid var(--mm-color-secondary, #fad7fe);
  background-color: #FEF7FF;
}
/* À plat : la notation sans l'habit de pill, posée dans une card
   (comparateur, carte produit, achat rapide, menu card) */
.mm-rating.mm-rating-flat {
  padding: 0;
  background: none;
  border-radius: 0;
  box-shadow: none;
}
/* Small : la notation compacte de la Carte produit V2 (Figma 11770-474245)
   — texte 12 / libellé 10.8, à combiner avec rating_star_size: '12px' */
.mm-rating.mm-rating-sm { font-size: var(--mm-font-size-text-xs, 12px); }
.mm-rating.mm-rating-sm .mm-rating__light {
  font-size: var(--mm-font-size-text-xxs, 10.8px);
  line-height: 0;
}

.mm-rating__avatars img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid var(--mm-color-white, #ffffff);
  object-fit: cover;
}
.mm-rating__avatars img + img { margin-left: -10px; }

/* le centrage géométrique de l'étoile (5 branches, masse visuelle basse) la
   fait paraître décalée sous la note : léger recentrage optique */
.mm-rating__star { color: var(--mm-color-ratings, #f79029); transform: translateY(-1px); }
/* groupe d'étoiles pleines (carte d'avis) : même écart que le reste de la pill */
.mm-rating__stars { display: inline-flex; align-items: center; gap: 2px; }
.mm-rating__light { color: var(--mm-color-ui-text-light, #8f8e8d); font-weight: 400; }

a.mm-rating {
  width: fit-content;
  text-decoration: none;
}
@media (hover: hover) {
  a.mm-rating .mm-rating__light {
    transition: color var(--mm-duration-fast, 180ms) var(--mm-curve-medium, cubic-bezier(0.34, 1.56, 0.64, 1));
  }
  a.mm-rating:hover .mm-rating__light { color: var(--mm-color-black-900, #201c1b); }
}

/* ---- Séparateurs et pastille : DEUX variantes, pas une ------------------
   Elles étaient confondues et la note d'une carte d'avis se retrouvait
   habillée en pastille alors que la maquette la veut à plat (relevé par
   Killian). Le filet vertical et l'habit de pastille sont deux décisions
   distinctes : l'en-tête de la section Avis prend les deux, la carte d'avis
   ne prend que le filet.

   Le filet est dessiné en ::before sur les enfants qui suivent le premier,
   plutôt qu'en éléments vides dans le markup : un séparateur est une affaire
   de style, le liquid n'a pas à en compter. Ses mesures sont ouvertes en
   variables — c'est par là qu'on l'ajuste, sans réécrire le sélecteur. */
.mm-rating.mm-rating-split {
  --mm-rating-sep-color: var(--mm-color-ui-border, #e9e8e8);
  --mm-rating-sep-height: 14px;
  --mm-rating-sep-gap: var(--mm-space-2, 8px);
  gap: var(--mm-rating-sep-gap);
}
.mm-rating.mm-rating-split > strong + strong::before,
.mm-rating.mm-rating-split > strong + .mm-rating__light::before,
.mm-rating.mm-rating-split > * + .mm-rating__badge::before {
  content: '';
  display: inline-block;
  width: 1px;
  height: var(--mm-rating-sep-height);
  margin-right: var(--mm-rating-sep-gap);
  vertical-align: -2px;
  background: var(--mm-rating-sep-color);
}
.mm-rating.mm-rating-split > strong { font-weight: 500; }

/* L'habit de pastille, lui, se demande à part : c'est celui de l'en-tête de
   la section Avis. Ses mesures sont ouvertes aussi. */
.mm-rating.mm-rating-pill {
  --mm-rating-pill-height: 48px;
  height: var(--mm-rating-pill-height);
  padding-inline: var(--mm-space-5, 20px);
  border: 1px solid var(--mm-color-ui-border, #e9e8e8);
  border-radius: 52px;
  background: var(--mm-color-white, #ffffff);
  color: var(--mm-color-primary, #3b0117);
}
.mm-rating__badge { display: inline-flex; align-items: center; }
.mm-rating__badge .mm-verif__logo { display: block; width: 85px; height: auto; }

/* sous le seuil, la pastille se resserre (32 de la maquette) */
@media (max-width: 749px) {
  .mm-rating.mm-rating-pill { --mm-rating-pill-height: 32px; padding-inline: var(--mm-space-3, 12px); }
  .mm-rating.mm-rating-pill.mm-rating-split { --mm-rating-sep-gap: var(--mm-space-1, 4px); }
  .mm-rating__badge .mm-verif__logo { width: 64px; }
}

/* Note lue sur l'API Avis Vérifiés (mm_skeepers_rating.js) : la place est réservée
   tant que la réponse n'est pas là (pas de saut de mise en page), puis la racine
   est retirée si le produit n'a pas d'avis. Valable pour toute racine data-skp-rating. */
[data-skp-rating]:not([data-skp-ready]) { visibility: hidden; }
[data-skp-rating][data-skp-empty] { display: none; }
/* END_SNIPPET:mm-rating */

/* START_SNIPPET:mm-section-promo-card (INDEX:194) */
.mm-section-promo__card {
        width: 360px;
        padding: var(--mm-space-6, 24px);
        border-radius: 20px;
    }

    .mm-section-promo__cta {
        width: 100%;
        padding: var(--mm-space-4, 16px) var(--mm-space-8, 32px) !important;
    }

    .mm-section-promo__size {
        display: flex;
        flex-direction: column;
        gap: var(--mm-space-2);

        &--static {
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
        }

        .mm-label .mm-label-text {
            text-transform: uppercase;
            font-weight: 800;
        }
    }

    .mm-section-promo__size .mm-dd {
        width: 100%;
    }

    .mm-section-promo__size .mm-dd__trigger {
        padding: var(--mm-space-3, 12px) var(--mm-space-4, 16px);
        font-size: var(--mm-font-size-text-sm, 14px);
        line-height: 1.35;
    }

    .mm-section-promo__size .mm-dd .mm-dd__panel:not(.is-sheet) {
        top: auto;
        bottom: calc(100% + 8px);
        transform-origin: bottom center;
        max-height: 270px;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .mm-section-promo__size .mm-dd .mm-dd__panel:not(.is-sheet)::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    .mm-section-promo__reassurance {
        margin: 0;
        justify-content: center;
    }

    @media (width <= 990px) {
        .mm-section-promo__card {
            width: 100%;
            padding: var(--margin-4, 16px);
        }
        .mm-section-promo__purchase {
            gap: 8px;
        }
        .mm-section-promo__products {
            padding-top: 4px;
        }
        .mm-section-promo__size-label {
            font-size: 16px;
        }
        .mm-section-promo__cta {
            padding: var(--mm-space-5, 20px) var(--mm-space-10, 48px) !important;
            .mm-btn__text {
                font-size: var(--mm-font-size-text, 16px); font-weight: var(--mm-font-weight-regular, 400); line-height: 1.4; letter-spacing: -0.1px;
            }
        }
    }
/* END_SNIPPET:mm-section-promo-card */

/* START_SNIPPET:mm-section-promo-content (INDEX:195) */
.mm-section-promo-content {
        .mm-label-text {
            font-weight: var(--mm-font-weight-heavy, 800);
        }
        .mm-label-icon path {
            fill: var(--mm-color-primary, #3b0117);
        }
    }
    
    @media (width <= 990px) {
        .mm-section-promo__content {
            width: 100%;
        }
        .mm-section-promo__description-wrapper {
            width: 66%;
        }
    }
/* END_SNIPPET:mm-section-promo-content */

/* START_SNIPPET:mm-section-promo-products (INDEX:198) */
.mm-section-promo__products {
    }
    .mm-section-promo__product {
        padding: 2px 2px var(--mm-space-2, 8px) 2px;
        border-radius: 10px;
        width: 120px;
    }
    .mm-section-promo__product:not([data-mm-reveal]) {
        transition: transform var(--mm-duration-medium, .38s) var(--mm-curve-medium, cubic-bezier(0.4, 0, 0.2, 1));
    }
    .mm-section-promo__product:hover {
        transform: translateY(-4px);
    }
    .mm-section-promo__product-img {
        width: 100%;
        aspect-ratio: 1 / 1;
        border-radius: 8px;
    }
    .mm-section-promo__gift-badge {
        position: absolute;
        right: 50%;
        top: 12px;
        transform: translateX(50%);
    }
    .mm-section-promo__check-badge {
        width: 25% !important;
        aspect-ratio: 1;
        height: auto !important;
        max-width: 24px;
        min-width: 16px;
        position: absolute;
        top: -10px;
        left: 50%;
        transform: translateX(-50%);
        background: var(--mm-color-secondary, #fad7fe);
        padding: 1px;
        border-radius: 100px;
        border: 1px solid var(--mm-color-white);
    }

    @media (width <= 990px) {
        .mm-section-promo__products {
            padding: 8px;
            border-radius: 16px;
            gap: 16px;
            background: var(--mm-color-black-50);
            max-width: 600px;
        }
        .mm-section-promo__products-items {
            gap: 16px;
        }
        .mm-section-promo__product {
            padding: 0;
            border-radius: 100px;
            background: initial;
            border: 1px solid var(--mm-color-black-100);
            flex: 1;
            width: 100%;
        }
        .mm-section-promo__product-img {
            border-radius: 50%;
        }
    }
    @media (width <= 350px) {
        .mm-section-promo__products-items {
            gap: 8px;
        }
    }
/* END_SNIPPET:mm-section-promo-products */

/* START_SNIPPET:mm-title-selector (INDEX:216) */
/* ==== MM / Titre (atome) — surlignages <mark> ============================
   Le snippet mm-title-selector convertit <mark> en <span class="mm-mark">.
   Empilement : PAS de z-index sur .mm-mark — chaque mot deviendrait son
   propre contexte d'empilement et le fond (::before) d'un mot suivant se
   peindrait DEVANT le texte des mots précédents dès que les boîtes se
   chevauchent (inset négatif + rotation + interligne). À la place, les
   ::before en z-index:-1 passent sous TOUT le texte du titre, et
   mm-title-marks (posée par le snippet) isole le titre pour qu'ils ne
   plongent pas sous le fond de la section. */
.mm-title-marks { isolation: isolate; }

.mm-mark {
  display: inline-block;
  position: relative;
  padding: var(--margin-4);
  line-height: 1.06;
  /* cadence + inclinaison du 1er mot ; cycle par ordre via nth-of-type —
     appliquée sur .mm-mark (pas ::before) pour que le texte tourne AVEC
     son fond, comme dans la maquette (bloc rigide fond+texte) */
  --mark-i: 0;
  --mark-tilt: -1.4deg;
  transform: rotate(var(--mark-tilt));
}
.mm-mark:nth-of-type(2) { --mark-i: 1; --mark-tilt: 1.4deg; }
.mm-mark:nth-of-type(3) { --mark-i: 2; --mark-tilt: -2deg; }
.mm-mark:nth-of-type(4) { --mark-i: 3; --mark-tilt: 1.6deg; }
.mm-mark:nth-of-type(5) { --mark-i: 4; --mark-tilt: -1.2deg; }
.mm-mark:nth-of-type(6) { --mark-i: 5; --mark-tilt: 1.8deg; }

.mm-mark::before {
  content: '';
  position: absolute;
  inset: -0.02em -0.06em;
  background: var(--mm-color-secondary, #fad7fe);
  border-radius: var(--mm-radius-md);
  z-index: -1;
  transform: scale(0);
  transition: transform .55s var(--mm-curve-big);
  transition-delay: calc(var(--mark-i) * 160ms + 250ms);
}

/* pop : .mm-in est posée par mm-motion.js sur le titre (data-mm-reveal,
   ajouté automatiquement par le snippet) ou sur un ancêtre déjà révélé */
.mm-in .mm-mark::before { transform: scale(1); }
/* END_SNIPPET:mm-title-selector */