Pofo child css

/*
Theme Name: Pofo Child
Theme URI: http://wpdemos.themezaa.com/pofo
Template: pofo
Author: ThemeZaa
Author URI: http://www.themezaa.com
Description: Child theme for Pofo theme
Tags: one-column,two-columns,three-columns,left-sidebar,right-sidebar,grid-layout,custom-background,custom-colors,custom-header,custom-menu,editor-style,featured-images,post-formats,sticky-post,theme-options,threaded-comments,translation-ready,blog,e-commerce,photography,portfolio
Version: 1.1.20261002
Updated: 2025-04-26 09:10:31
*/

/* ==========================================================================
   RAVELLO — WOOCOMMERCE
   ========================================================================== */

/* Free Shipping Bar — ne bloque pas les clics */
#wfspb-top-bar {
    pointer-events: none !important;
}

#wfspb-top-bar a,
#wfspb-top-bar #wfspb-close {
    pointer-events: auto !important;
}

/* Masquer UGS, catégorie et étiquette */
.woocommerce div.product .product_meta .sku_wrapper,
.woocommerce div.product .product_meta .posted_in,
.woocommerce div.product .product_meta .tagged_as {
    display: none !important;
}

/* Masquer le prix principal sur fiche produit */
.woocommerce div.product .summary > p.price,
.woocommerce div.product .summary > span.price {
    display: none !important;
}

/* Espacement titre produit */
.product_title.entry-title {
    margin-top: 6px !important;
}

.woocommerce div.product .product_title {
    margin-bottom: 42px !important;
}

/* Sélecteur variation */
.woocommerce div.product form.cart .variations {
    margin-top: 18px !important;
}

.woocommerce div.product form.cart .variations label {
    display: block;
    margin-bottom: 10px !important;
    color: #412420;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.2px;
}

.woocommerce div.product form.cart .variations select {
    background: #f8f6f1;
    border: none !important;
    border-radius: 18px;
    padding: 0 22px;
    min-height: 58px;
    width: 100%;
    font-size: 16px;
    color: #412420;
    box-shadow: none !important;
    appearance: none;
    -webkit-appearance: none;
}

/* Quantité */
.woocommerce .quantity .qty {
    background: #f8f6f1;
    border: none !important;
    border-radius: 18px;
    height: 58px;
    width: 78px;
    text-align: center;
    color: #412420;
    font-size: 16px;
    font-weight: 500;
    box-shadow: none !important;
    appearance: none;
    -webkit-appearance: none;
}

/* Bouton fiche produit */
.woocommerce div.product form.cart .single_add_to_cart_button {
    background: #f8f6f1 !important;
    border: none !important;
    border-radius: 18px !important;
    height: 58px !important;
    padding: 0 34px !important;
    color: #412420 !important;
    font-size: 0 !important;
    font-weight: 600;
    letter-spacing: 0.4px;
    box-shadow: none !important;
    transition: all 0.2s ease;
}

.woocommerce div.product form.cart .single_add_to_cart_button::before {
    content: "Choisir ce format";
    font-size: 14px;
}

.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce .quantity .qty:hover,
.woocommerce div.product form.cart .variations select:hover {
    background: #f2eee2 !important;
}

/* Mix and Match — espace entre l'aide quantité cartons et les contrôles */
.woocommerce div.product form.cart .woocommerce-mix-and-match-add-to-cart .quantity {
    margin-top: 16px;
}

/* Produits liés */
.related.products > h2 {
    margin-top: 55px !important;
    margin-bottom: 42px !important;
    color: #412420;
    font-weight: 600;
    font-size: 0 !important;
}

.related.products > h2::before {
    content: "À goûter également";
    font-size: 28px;
}

.related.products .woocommerce-loop-product__title,
.related.products .price {
    display: none !important;
}

.related.products .button {
    font-size: 0 !important;
}

.related.products .button::before {
    content: "Découvrir";
    font-size: 12px;
}

/* ==========================================================================
   BOUTONS BOUTIQUE + HOME — produits simples uniquement
   ========================================================================== */

.woocommerce ul.products li.product:not(.post-29476):not(.post-29457):not(.post-32289):not(.post-32307) > a.button {
    font-size: 0 !important;
}

.woocommerce ul.products li.product:not(.post-29476):not(.post-29457):not(.post-32289):not(.post-32307) > a.button::before {
    content: "Voir cette pâte";
    font-size: 12px;
}

/* ==========================================================================
   BOUTONS BOUTIQUE + HOME — cartons à composer uniquement
   ========================================================================== */

.woocommerce ul.products li.product.post-29476 > a.button,
.woocommerce ul.products li.product.post-29457 > a.button,
.woocommerce ul.products li.product.post-32289 > a.button,
.woocommerce ul.products li.product.post-32307 > a.button {
    font-size: 0 !important;
}

.woocommerce ul.products li.product.post-29476 > a.button::before,
.woocommerce ul.products li.product.post-29457 > a.button::before,
.woocommerce ul.products li.product.post-32289 > a.button::before,
.woocommerce ul.products li.product.post-32307 > a.button::before {
    content: "Composer mon carton";
    font-size: 12px;
}

/* Prix au kg — pâtes fraîches */
.price-unit {
    font-size: 0.75em;
    font-weight: 400;
    opacity: 0.75;
    margin-left: 2px;
}
/* ==========================================================================
   RAVELLO — Message quantité cartons à composer
   ========================================================================== */

.ravello-carton-quantity-notice {
    margin: 25px 0 0 0;
}

.ravello-carton-quantity-title {
    font-size: 15px;
    color: #3f3d36;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 8px;
}

.ravello-carton-quantity-text {
    font-size: 13.5px;
    color: #3f3d36;
    font-weight: 400;
    line-height: 1.7;
    margin-bottom: 25px;
}

/* Accueil et « À goûter également » : mêmes cartes natives photo / nom / prix / bouton.
 * Les colonnes de l'accueil restent à trois, les recommandations à quatre sur desktop.
 * Aucun sélecteur ne touche la galerie, la recette prototype ou les formulaires d'achat.
 */
body.home .woocommerce {
    --ravello-card-columns: 3;
    --ravello-home-card-price-padding-top: 4px;
    --ravello-home-card-button-margin-top: 16px;
}

body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products {
    --ravello-card-columns: 4;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products {
    display: grid;
    grid-template-columns: repeat(var(--ravello-card-columns), minmax(0, 1fr));
    gap: 40px 3.8%;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Les clearfix Pofo/WooCommerce ne doivent pas devenir des cellules de la grille. */
:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products::before,
:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products::after {
    content: none;
    display: none;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product {
    display: flex;
    flex-direction: column;
    align-items: center;
    float: none;
    clear: none !important;
    min-width: 0;
    width: 100% !important;
    margin: 0 !important;
    text-align: center;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product > .woocommerce-LoopProduct-link {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    width: 100%;
    margin: 0;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product > .woocommerce-LoopProduct-link img {
    display: block;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 5 / 4;
    object-fit: contain;
    margin: 0 0 25px;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product .woocommerce-loop-product__title {
    display: block !important;
    min-height: 40px;
    margin: 0;
    padding: 0;
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product .price {
    display: block !important;
    min-height: 20px;
    margin: auto 0 0;
    padding-top: var(--ravello-home-card-price-padding-top, 6px);
    font-size: 13px;
    line-height: 20px;
    text-align: center;
}

/* Accueil uniquement : ligne de prix lisible, sans modifier les Mix & Match ni les autres grilles WooCommerce. */
body.home .woocommerce > ul.products > li.product:not(.product-type-mix-and-match) > .woocommerce-LoopProduct-link .price {
    font-size: 14px !important;
    font-weight: 500 !important;
}

body.home .woocommerce > ul.products > li.product:not(.product-type-mix-and-match) > .woocommerce-LoopProduct-link .price .woocommerce-Price-amount {
    font-weight: 600;
}

body.home .woocommerce > ul.products > li.product:not(.product-type-mix-and-match) > .woocommerce-LoopProduct-link .price .price-unit {
    font-size: 0.86em;
    font-weight: 500;
    opacity: 0.85;
}

/* Accueil uniquement : harmonise toute la ligne de prix des Mix & Match. */
body.home .woocommerce > ul.products > li.product.product-type-mix-and-match > .woocommerce-LoopProduct-link .price {
    font-weight: 600 !important;
}

:is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product > a.button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    min-height: 36px;
    margin: var(--ravello-home-card-button-margin-top, 20px) 0 0 !important;
    white-space: normal;
    line-height: 1.25;
}

@media (min-width: 768px) and (max-width: 1023px) {
    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) {
        --ravello-card-columns: 2;
    }
}

@media (max-width: 767px) {
    body.home .woocommerce {
        --ravello-card-columns: 1;
        --ravello-home-card-button-margin-top: 10px;
    }

    body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products {
        --ravello-card-columns: 2;
    }

    body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products > h2 {
        margin-top: 36px !important;
        margin-bottom: 24px !important;
    }

    body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products > h2::before {
        font-size: clamp(22px, 6vw, 28px);
    }

    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products {
        gap: 24px 14px;
    }

    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product .woocommerce-loop-product__title {
        min-height: 36px;
        font-size: 14px;
        line-height: 18px;
    }

    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product .price {
        min-height: 42px;
        line-height: 18px;
    }

    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product > .woocommerce-LoopProduct-link img {
        margin-bottom: 18px;
    }

    :is(body.home .woocommerce, body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products) > ul.products > li.product > a.button {
        min-height: 48px;
        margin: var(--ravello-home-card-button-margin-top, 12px) 0 0 !important;
        padding: 8px 16px;
    }

    body.single-product .product:is(.product_cat-pates-seches, .product_cat-pates-fraiches, .product_cat-pate-fraiche) > .related.products > ul.products > li.product > a.button {
        width: 100%;
    }
}

/* Only Mix & Match 4/8/10 pages: native semantic heading and two other formats. */
body.ravello-mnm-related-formats .related.products > h2 {
    font-size: 28px !important;
}
body.ravello-mnm-related-formats .related.products > h2::before {
    content: none;
}
body.single-product.ravello-mnm-related-formats .product > .related.products > ul.products {
    --ravello-card-columns: 2;
    max-width: 800px;
    margin-inline: auto;
}
@media (max-width: 767px) {
    body.ravello-mnm-related-formats .related.products > h2 {
        font-size: clamp(22px, 6vw, 28px) !important;
    }
}

/* Accueil : la septième pâte traditionnelle complète la colonne centrale sur desktop. */
@media (min-width: 1024px) {
    body.home .woocommerce > ul.products > li.product.post-29527 {
        grid-column: 2;
    }
}

/* Accueil uniquement : respiration éditoriale avant les trois formats Mix & Match. */
body.home .ravello-mix-match-intro {
    position: relative;
    left: 50%;
    width: 100vw;
    margin: 56px 0 64px !important;
    margin-left: -50vw !important;
    padding: 0 !important;
    background: #f2eee2;
}

body.home .ravello-mix-match-intro__inner {
    max-width: 820px;
    margin: 0 auto;
    padding: 52px 30px 48px;
    text-align: center;
    color: #412420;
}

body.home .ravello-mix-match-intro__eyebrow {
    margin: 0 0 12px;
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 2.2px;
    line-height: 1.4;
    text-transform: uppercase;
}

body.home .ravello-mix-match-intro__title {
    margin: 0 0 13px;
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(34px, 4vw, 46px);
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1.12;
}

body.home .ravello-mix-match-intro__copy {
    max-width: 570px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.65;
}

body.home .ravello-mix-match-intro__benefits {
    display: flex;
    justify-content: center;
    gap: 12px 42px;
    margin: 29px 0 0;
    padding: 0;
    list-style: none;
}

body.home .ravello-mix-match-intro__benefit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .25px;
    line-height: 1.4;
}

body.home .ravello-mix-match-intro__icon {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.25;
}

@media (max-width: 767px) {
    body.home .ravello-mix-match-intro {
        margin: 38px 0 44px !important;
    }

    body.home .ravello-mix-match-intro__inner {
        padding: 39px 24px 36px;
    }

    body.home .ravello-mix-match-intro__copy {
        font-size: 15px;
        line-height: 1.55;
    }

    body.home .ravello-mix-match-intro__benefits {
        align-items: flex-start;
        flex-direction: column;
        gap: 13px;
        margin-top: 25px;
    }

    body.home .ravello-mix-match-intro__benefit {
        justify-content: flex-start;
    }
}
/* Accueil uniquement : le bandeau et les trois formats forment un seul chapitre. */
body.home .ravello-mix-match-intro {
    margin: 56px 0 0 !important;
}

body.home .ravello-mix-match-intro + .woocommerce {
    position: relative;
    left: 50%;
    box-sizing: border-box;
    width: 100vw;
    margin: 0 0 64px !important;
    margin-left: -50vw !important;
    padding: 0 30px 64px;
    background: #f2eee2;
}

body.home .ravello-mix-match-intro + .woocommerce > ul.products {
    max-width: 1140px;
    margin: 0 auto;
}

@media (max-width: 767px) {
    body.home .ravello-mix-match-intro,
    body.home .ravello-mix-match-intro + .woocommerce {
        left: auto;
        box-sizing: border-box;
        width: 100vw;
        max-width: none;
        margin-left: calc(50% - 50vw) !important;
    }

    body.home .ravello-mix-match-intro {
        margin: 38px 0 0 !important;
    }

    body.home .ravello-mix-match-intro + .woocommerce {
        margin-bottom: 44px !important;
        padding: 0 15px 44px;
    }

    body.home .ravello-mix-match-intro__inner {
        box-sizing: border-box;
        width: 100%;
        max-width: none;
    }

    body.home .ravello-mix-match-intro__benefits {
        width: 100%;
    }
}
/* Accueil uniquement : le retour WPBakery ne doit pas rompre le chapitre Mix & Match. */
body.home .ravello-mix-match-intro + br {
    display: none;
}

body.home .ravello-mix-match-intro + br + .woocommerce {
    position: relative;
    left: 50%;
    box-sizing: border-box;
    width: 100vw;
    margin: 0 0 64px !important;
    margin-left: -50vw !important;
    padding: 0 30px 64px;
    background: #f2eee2;
}

body.home .ravello-mix-match-intro + br + .woocommerce > ul.products {
    max-width: 1140px;
    margin: 0 auto;
}

@media (max-width: 767px) {
    body.home .ravello-mix-match-intro + br + .woocommerce {
        left: auto;
        box-sizing: border-box;
        width: 100vw;
        max-width: none;
        margin-left: calc(50% - 50vw) !important;
        margin-bottom: 44px !important;
        padding: 0 15px 44px;
    }
}
/* Accueil uniquement : les trois formats gardent la largeur de contenu sur desktop. */
body.home .ravello-mix-match-intro + br + .woocommerce > ul.products {
    margin-inline: auto !important;
}

/* Accueil uniquement : préserver le full-bleed desktop après la règle de marge. */
body.home .ravello-mix-match-intro { margin-left: -50vw !important; }

@media (min-width: 768px) { body.home .ravello-mix-match-intro { margin-left: -50vw !important; } }
@media (max-width: 767px) { body.home .ravello-mix-match-intro { margin-left: calc(50% - 50vw) !important; } }
/* Homepage Mix & Match section from commit 33e7993. */
body.home .ravello-mix-match-section{box-sizing:border-box;width:100vw;margin:56px 0 64px calc(50% - 50vw)!important;padding:0 30px 64px;background:#f2eee2}body.home .ravello-mix-match-section .ravello-mix-match-intro{position:static;width:auto;margin:0!important;padding:0;background:transparent}body.home .ravello-mix-match-section__products>.woocommerce>ul.products{max-width:1140px;margin-inline:auto!important}body.home .ravello-mix-match-section li.post-29457 img{content:url("assets/images/ravello-carton-4-homepage.webp")}body.home .ravello-mix-match-section li.post-29476 img{content:url("assets/images/ravello-carton-8-homepage.webp")}body.home .ravello-mix-match-section li.post-32289 img{content:url("assets/images/ravello-carton-10-homepage.webp")}@media(max-width:767px){body.home .ravello-mix-match-section{width:100vw;max-width:none;margin:38px 0 44px calc(50% - 50vw)!important;padding:0 15px 44px}}
body.home .ravello-mix-match-section { margin-bottom: 0 !important; }
body.home .ravello-mix-match-section + .vc_empty_space { display: none; }
@media (max-width: 767px) { body.home .ravello-mix-match-section { margin-bottom: 0 !important; } }
body.home .ravello-mix-match-section { padding-bottom: 32px; }
@media (max-width: 767px) { body.home .ravello-mix-match-section { padding-bottom: 28px; } }

body.home .vc_row:has(.ravello-mix-match-section) { padding-bottom: 0; }

body.home .vc_row:has(.ravello-mix-match-section) { padding-bottom: 0 !important; }

body.home .vc_row.vc_custom_1710338514227 { padding-bottom: 0 !important; }

body.home .ravello-mix-match-section li.post-29457 img{content:url("assets/images/ravello-carton-4-homepage.webp?v=2")} body.home .ravello-mix-match-section li.post-29476 img{content:url("assets/images/ravello-carton-8-homepage.webp?v=2")} body.home .ravello-mix-match-section li.post-32289 img{content:url("assets/images/ravello-carton-10-homepage.webp?v=2")}

/* Accueil uniquement : les CTA des trois cartons se distinguent du fond du chapitre. */
body.home .ravello-mix-match-section .ravello-mix-match-section__products > .woocommerce > ul.products > li:is(.post-29457, .post-29476, .post-32289) > a.button {
    background: #f8f6f1 !important;
    color: #412420 !important;
}

body.home .ravello-mix-match-section .ravello-mix-match-section__products > .woocommerce > ul.products > li:is(.post-29457, .post-29476, .post-32289) > a.button:hover,
body.home .ravello-mix-match-section .ravello-mix-match-section__products > .woocommerce > ul.products > li:is(.post-29457, .post-29476, .post-32289) > a.button:focus {
    background-color: #412420 !important;
    color: #f2eee2 !important;
}

body.home .ravello-mix-match-section .ravello-mix-match-section__products > .woocommerce > ul.products > li:is(.post-29457, .post-29476, .post-32289) > a.button:hover::before,
body.home .ravello-mix-match-section .ravello-mix-match-section__products > .woocommerce > ul.products > li:is(.post-29457, .post-29476, .post-32289) > a.button:focus::before {
    color: #f2eee2 !important;
}

/* Preserve existing buttons outside the three Mix & Match recommendation sections. */
body.single-product:where(:not(.postid-29457, .postid-29476, .postid-32289)) .related.products li.post-32289>a.button{font-size:12px!important} body.single-product:where(:not(.postid-29457, .postid-29476, .postid-32289)) .related.products li.post-32289>a.button::before{content:none}
body.single-product:where(:not(.postid-29457, .postid-29476, .postid-32289)) .product>.related.products>ul.products>li.post-32289>a.button{font-size:0!important} body.single-product:where(:not(.postid-29457, .postid-29476, .postid-32289)) .product>.related.products>ul.products>li.post-32289>a.button::before{content:"Composer mon carton"!important;font-size:12px!important}
body.single-product:where(:not(.postid-29457, .postid-29476, .postid-32289)) .product>.related.products>ul.products>li:is(.post-29457,.post-29476,.post-32289)>a.button{width:100%}

/* Recommandations Mix & Match : même gabarit compact que « Voir cette pâte ».
 * Les cartes natives alignent déjà les boutons en bas de ligne via leur lien flex.
 * La largeur suit le libellé et le padding, jamais la largeur de la colonne.
 */
body.single-product:is(.postid-29457, .postid-29476, .postid-32289) .product > .related.products > ul.products > li.product > a.button {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0;
    max-width: 100%;
    height: auto;
    min-height: 36px !important;
    margin: 20px 0 0 !important;
    padding: 12px 24px;
    border-radius: 10px;
    font-size: 0 !important;
    font-weight: 700;
    line-height: 1.25;
}

body.single-product:is(.postid-29457, .postid-29476, .postid-32289) .product > .related.products > ul.products > li.product > a.button::before {
    content: "Voir cette pâte" !important;
    font-size: 12px !important;
    font-weight: inherit;
}

body.single-product:is(.postid-29457, .postid-29476, .postid-32289) .product > .related.products > ul.products > li.product-type-mix-and-match > a.button::before {
    content: "Composer mon carton" !important;
}
@media (max-width: 767px) {
    body.single-product:is(.postid-29457, .postid-29476, .postid-32289) .product > .related.products > ul.products > li.product > a.button {
        min-height: 48px !important;
        margin-top: 12px !important;
        padding: 8px 16px;
    }

}

/* Accueil mobile uniquement : composition éditoriale du chapitre Mix & Match. */
@media (max-width: 767px) {
    body.home .ravello-mix-match-section {
        margin: 48px 0 0 calc(50% - 50vw) !important;
        padding: 0 15px 28px;
    }

    body.home .ravello-mix-match-section .ravello-mix-match-intro__inner {
        padding: 42px 24px 28px;
    }

    body.home .ravello-mix-match-section .ravello-mix-match-intro__copy {
        max-width: 300px;
    }

    body.home .ravello-mix-match-section .ravello-mix-match-intro__benefits {
        width: fit-content;
        max-width: 100%;
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        margin: 24px auto 0;
        padding: 0;
        list-style: none;
        text-align: left;
    }

    body.home .ravello-mix-match-section .ravello-mix-match-intro__benefit {
        justify-content: flex-start;
        list-style: none;
        text-align: left;
    }
}

@media (max-width: 767px) {
    .woocommerce-cart .woocommerce .woocommerce-cart-form table.shop_table.cart {
        width: 100%;
    }
}