/* ==========================================================================
   Réassurance (4 pictos) + atouts (bande défilante) — bas de l'espace client
   --------------------------------------------------------------------------
   Rendus par mcm_account_footer_blocks() (functions-dashboard.php), juste avant
   le <footer> de toutes les pages « Mon compte » (retour client du 17/09 : « comme
   le footer des fiches produit »).

   Reprise à l'identique des deux blocs de code des contenus (fiches produit :
   `.mcm-avantages-slider` dans une section Avia beige #f6ead8 ; accueil :
   `.mcm-marquee-slider`), qui restent tels quels pour l'instant. Le JS des
   pictos (rotation / clic) est le mu-plugin mcm-avantages-slider.php, qui
   s'applique à toute page contenant `.mcm-avantages-slider`.
   ========================================================================== */

.mcm-account-footer-blocks { clear: both; }

/* Sous la bande des atouts, le pied de page cyan enchaîne directement sur les pastilles
   « Boutique magique / Enseignant-école / Ressources gratuites » (10 px) : on lui rend de
   l'air (retour client du 17/09 : « plus de bleu au-dessus des boutons »). Scopé aux pages
   du compte, les seules où ces bandeaux précèdent le footer. */
body.woocommerce-account footer.container_wrap .menu-row { padding-top: 40px; }

/* ------- Réassurance : 4 pictos ronds + titre / texte du picto actif ------- */
.mcm-account-footer-blocks .mcm-reassurance { background: #f6ead8; }

.mcm-avantages-slider {
    background: transparent;
    padding: 45px 20px;
    text-align: center;
    font-family: inherit;
}
.mcm-pictos {
    display: flex;
    justify-content: center;
    gap: 35px;
    margin-bottom: 35px;
    flex-wrap: wrap;
}
.mcm-picto {
    border: none;
    background: #ffffff;
    width: 135px;
    height: 135px;
    border-radius: 50%;
    cursor: pointer;
    padding: 18px;
    transition: all 0.3s ease;
}
.mcm-picto img { width: 100%; height: 100%; object-fit: contain; }
.mcm-picto.active { outline: 2px solid #f5a400; transform: scale(1.0); }
.mcm-avantage-texte { overflow: hidden; }
/* `#top` : Enfold impose couleur et letter-spacing aux titres (.main_color h3). */
#top .mcm-avantage-texte h3 {
    color: #555555;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 20px;
}
.mcm-avantage-texte p { color: #707070; font-size: 16px; line-height: 1.4; margin: 0; }
.mcm-avantage-texte.slide { animation: mcmSlideText 0.45s ease; }
@keyframes mcmSlideText {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}
@media (max-width: 768px) {
    .mcm-pictos { gap: 22px; }
    .mcm-picto { width: 95px; height: 95px; }
    #top .mcm-avantage-texte h3 { font-size: 24px; }
    .mcm-avantage-texte p { font-size: 20px; }
}

/* ------- Atouts : bande blanche défilante (liste dupliquée → boucle infinie) ------- */
.mcm-marquee-slider {
    width: 100%;
    overflow: hidden;
    background: #ffffff;
    padding: 18px 0;
}
.mcm-marquee-track {
    display: flex;
    gap: 40px;
    width: max-content;
    animation: mcm-marquee 28s linear infinite;
}
.mcm-marquee-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: max-content;
    font-family: inherit;
    font-size: 20px;
    font-weight: 700;
    color: #5fc4e1;
    white-space: nowrap;
}
.mcm-marquee-item img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    border-radius: 50%;
    background: #ffffff;
}
@keyframes mcm-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.mcm-marquee-slider:hover .mcm-marquee-track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
    .mcm-marquee-track { animation: none; }
}
@media (max-width: 768px) {
    .mcm-marquee-item { font-size: 16px; }
    .mcm-marquee-item img { width: 42px; height: 42px; }
}