/*
 Theme Name:   iwego child
 Description:  Theme iwego
 Author:       Iwego
 Template:     iwego
 Version:      1.1.0
*/


:root {
    --transition : all 230ms ease-in-out;
    --font-principale : Winky Sans, sans-serif;
    --font-secondaire : Caveat Brush, sans-serif;
    --couleur-scotch : rgba(242, 236, 230, .6);
    --ombre-scotch : 0 1px 3px rgba(0, 0, 0, .4);
    --ombre-photo : 10px 12px 0 0 rgba(181, 165, 155, .15), 1px 1px 0 0 rgba(181, 165, 155, .25), 10px 12px 0 0 rgba(181, 165, 155, .1), 1px 1px 0 0 rgba(181, 165, 155, .25), 3px 3px 0 0 rgba(181, 165, 155, .4), 1px 1px 0 0 rgba(181, 165, 155, .4);
    --ombre-photo-light : 7px 8px 0 0 rgba(181, 165, 155, .10), 1px 1px 0 0 rgba(181, 165, 155, .2), 7px 8px 0 0 rgba(181, 165, 155, .1), 1px 1px 0 0 rgba(181, 165, 155, .2), 2px 2px 0 0 rgba(181, 165, 155, .3), 1px 1px 0 0 rgba(181, 165, 155, .3);
}


/************************************************/
/**                                            **/
/**              TARTE AU CITRON               **/
/**                                            **/
/************************************************/


.tarteaucitronAlertBigTop::after {
    content: '' !important;
    background: url(/wp-content/uploads/2026/10/cookie-menguys.png) !important;
    height: 70px !important;
    width: 100px !important;
    position: absolute !important;
    right: 1.1em !important;
    margin: 0 auto !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}
div#tarteaucitronRoot.tarteaucitronBeforeVisible:before{display:none;}




/************************************************/
/**                                            **/
/**                 GENERAL                    **/
/**                                            **/
/************************************************/

h1 {text-wrap: balance;}
h2 {text-transform: uppercase; text-align: center;}
h3 {letter-spacing: .08rem;}
a {display: inline-block;}
input, select, textarea {font-family: inherit;}
img {max-width: 100%; width: auto; height: auto;}
.no-underline {text-decoration: none;}
.img-contain {object-fit: contain; display: block; }
.img-cover {object-fit: cover; width: 100%; height: 100%;}
.large-container { margin-left: 2rem; margin-right: 2rem;}
.h2-underline {position: relative; padding-bottom: 1.5rem; max-width: fit-content; margin-left: auto; margin-right: auto;}
.h2-underline::after {content: ''; width: calc(100% - 2rem); height: .5rem; border-radius: .5rem; background-color: var(--couleur-secondaire); position: absolute; bottom: 0; left: 50%; transform: rotate(358.5deg) translateX(-50%); max-width: 15rem;}
.btn-picto {position: relative;}
.h1-no-bandeau {text-align: center; position: relative; padding-bottom: 1.8rem; margin-bottom: 2rem;}
.h1-no-bandeau::after {content: url('images/underline-02.svg'); position: absolute; width: 14rem; bottom: -0.8rem; left: 50%; transform: translateX(-50%);}

.slick-slider .slick-prev, .slick-slider .slick-next {border: none; cursor: pointer; padding: 0;  width: 4rem; height: 4rem; border-radius: 50%; transition: var(--transition);}
.slick-slider .slick-prev::before, .slick-slider .slick-next::before {display: none;}
.slick-slider .slick-prev img, .slick-slider .slick-next img {width: 100%; height: 100%;}
.slick-slider .slick-prev:hover, .slick-slider .slick-next:hover {opacity: 1;}
.slick-slider .slick-dots {bottom: -4rem;}
.slick-slider .slick-dots li button:before {outline: .3rem solid var(--couleur-principale); border-radius: 50%; color: transparent; width: 1.5rem; height: 1.5rem;}
.slick-slider .slick-dots li.slick-active button:before {color: transparent; background: var(--couleur-principale);}


@media (max-width: 768px) {
    .section-margin {margin-top: 6rem; margin-bottom: 6rem;}
}

@media (min-width: 768px) {
    .large-container {margin-left: 4rem; margin-right: 4rem;}
}

@media (min-width: 1025px) {
    .h2-underline::after {max-width: 100%;}
    .h1-no-bandeau {padding-bottom: 3rem; margin-block-start: .5em;}
    .h1-no-bandeau::after {width: 28rem;}

}

@media (min-width: 1200px) {
    .section-margin {margin-top: 9.5rem;  margin-bottom: 9.5rem; }
}

/************************************************/
/**                                            **/
/**                  HEADER                    **/
/**                                            **/
/************************************************/

/* --- Split nav : logo centré, menu de chaque côté --- */

#headermenu {position: sticky; z-index: 100;}
header {flex-direction: column; }
header .header-menu {position: relative; border-bottom: .2rem solid var(--couleur-secondaire); padding-top: 0; padding-bottom: 0; justify-content: center; align-items: stretch; width: 100%; background-color: #fff;  box-shadow: rgba(181, 165, 155, .1) 0px 1px 0; filter: drop-shadow(0px 5px 0px rgba(181, 165, 155, .1));}

header.header-no-breadcrumb.sticky .header-menu {border-width: .25rem;}
header .header-menu::after {content: url('images/entreprise_francaise.svg'); position: absolute; left: 0; width: 7rem; height: auto; top: .7rem; }
header nav a {text-transform: uppercase; color: var(--couleur-secondaire); text-decoration: none; font-weight: 600; position: relative; }
header nav .main-menu>.current-menu-item>a, header nav .main-menu>.current-menu-ancestor>a, header nav .main-menu>.active>a {color: var(--couleur-principale); transform: rotate(353deg); transform-origin: left;}
header nav .main-menu>.current-menu-item>a::after, header nav .main-menu>.current-menu-ancestor>a::after, header nav .main-menu>.active>a::after {content: ""; position: absolute; left: 2rem; bottom: -0.1rem;  width: calc(100% - 4rem); height: 2rem; background: url('images/underline-nav.svg') no-repeat center; background-size: 100% 100%; pointer-events: none; /*clip-path: inset(0 100% 0 0);*/}
header .logo-header {position: absolute;  margin-left: auto; height: calc(100% + 1.5rem); left: 50%; transform: translateX(-50%);}
header .logo-header img {margin-left: auto; margin-right: auto; transition: var(--transition); max-height: fit-content; max-width: fit-content; height: 100%; width: 100%;}
header .main-menu>li.menu-item>a {padding: 1rem;}
header .header-nav-left, .header-nav-right {display: none;}
header .header-nav-left, header .header-nav-right {flex: 1; }
header .header-nav-left { justify-content: flex-end; align-items: flex-end; }
header .header-nav-right {justify-content: flex-start; flex-direction: column;}
header .header-nav-left .main-menu, header .header-nav-right .main-menu {justify-content: inherit; column-gap: 1rem; margin-left: 0;}

header .header-top {justify-content: flex-end; padding: .5rem .5rem 0 0; margin-right: .5rem;}
header .header-top .header-cta-contact, header .header-top .language-switcher  {background-color: var(--couleur-secondaire); padding: .3rem 1rem; color: #fff; text-transform: uppercase; font-size: 1.4rem; transition: var(--transition);}
header .header-top .header-cta-contact.is-current {background-color: var(--couleur-principale); }
header .header-top .language-switcher li {display: flex;}
header .header-top .language-switcher a {color: #fff; text-decoration: none; font-size: 1.4rem;}


header.sticky .logo-header {width: 12rem;}
header.sticky .header-top {display: none;}


header .header-top .language-switcher li + li::before { content: '/'; margin: 0 0.25rem; color: #fff; font-size: 1.4rem;}

header .sub-menu {background-color: #fff; margin-left: 0; border-radius: 0 0 .5rem .5rem; min-width: 100%; padding-bottom: .8rem; box-shadow: rgba(137, 108, 74, 0.2) 5px 5px; top: calc(100% - .5rem);}
header .sub-menu a {text-transform: none; font-weight: 500;}
header .sub-menu .current-menu-item a {font-weight: 600; color: var(--couleur-principale);}

.breadcrumb-global {margin-top: 2rem; margin-bottom: 3rem; font-size: 1.4rem; column-gap: .5rem; flex-wrap: wrap;}
.breadcrumb-global a, .breadcrumb-global span {font-size: 1.4rem; font-weight: 400; text-decoration: none; display: flex; column-gap: .5rem;}
.breadcrumb-global .breadcrumb_last {color: var(--couleur-principale);}

.section-banniere .banniere-bg {background-image: var(--bg-mobile); background-color: var(--couleur-principale); width: 100%; padding: 2rem; min-height: 45vh; background-size: cover; justify-content: center; background-repeat: no-repeat; background-position: center; align-items: center; }
.section-banniere .banniere-bg .banniere-inner {position: relative; z-index: 1; padding: 3rem 0; margin-bottom: 3.5rem;}
.section-banniere .banniere-bg h1 {color: #fff; text-align: center; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); margin: 0; backdrop-filter: blur(1px);}
.section-banniere .banniere-underline {position: absolute;  display: block; overflow: visible; height: auto; width: 100%; left: 50%; bottom: -0.3em; width: 18rem; margin: .8rem auto 0; transform: rotate(355deg) translateX(-50%); filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.3));}
.section-banniere .banniere-underline.is-ready path,
.section-banniere .banniere-underline.is-ready polyline,
.section-banniere .banniere-underline.is-ready line {animation: banniere-draw 0.7s cubic-bezier(0.4, 0, 0.2, 1) 0.4s forwards;}



@keyframes banniere-draw {
    to {
        stroke-dashoffset: 0;
    }
}




.mobile-topbar {display: flex; position: fixed; width: 100vw; background-color: rgba(255, 255, 255, .7); top: 0; left: 0; right: 0; z-index: 99; justify-content: space-between; padding: 0 2rem; transition: var(--transition); will-change: transform; }
.mobile-topbar-logo {width: calc(50% + 6rem); justify-content: flex-end;}
.mobile-topbar-logo .header-logo {width: 12rem;}
.mobile-topbar-actions {flex: 1; justify-content: flex-end; align-items: center;}
.mobile-burger-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #fff; display: flex;
    align-items: center;
    justify-content: center;
}
.mobile-burger-icon {flex-direction: column; border-radius: .3rem; width: 2.5rem; height: 2.5rem; padding: .4rem; justify-content: center; row-gap: .3rem;}
.mobile-burger-icon span { display: block; height: .3rem; background-color: #fff; border-radius: .2rem; transition: var(--transition);}
.mobile-lang-select select {appearance: none; -webkit-appearance: none; background: var(--couleur-principale); border-radius: .3rem; border: none; font-size: 1.5rem;  font-weight: 700; text-transform: uppercase; color: #fff; cursor: pointer; padding: .4rem; outline: none; position: relative;}

@media (hover: hover) {
    header .logo-header:hover img {transform: translateY(-.4rem);}
    header .sub-menu li a:hover {font-weight: inherit; color: var(--couleur-principale);}
    header .header-top .header-cta-contact:hover, header .header-top .language-switcher:hover {background-color: var(--couleur-principale);}
}

@media (min-width: 1025px) {
    #headermenu {position: sticky;}
    header .header-nav-left, .header-nav-right {display: flex;}
	#mobile-topbar, #mobile-menu-drawer {display: none;}
    .section-banniere .banniere-bg {background-image: var(--bg-desktop); padding: 5rem 10rem; min-height: 45vh; align-items: center; justify-content: flex-start;}
    .section-banniere .banniere-bg .banniere-inner {max-width: 85rem; margin-bottom: 0;}
    .section-banniere .banniere-underline {width: 25rem;}
    .breadcrumb-global {margin-top: 3rem; margin-bottom: 3rem;}
    header nav a {font-size: 1.4rem;}
    header .logo-header {position: relative; width: 14rem; height: inherit; left: auto; transform: none;}
    header .logo-header img {position: absolute; height: calc(100% + 2rem); width: auto; top: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; }
    header .header-menu {position: relative; align-items: stretch; justify-content: space-between; gap: 2rem; border-bottom: .3rem solid var(--couleur-secondaire);}
    header.sticky .header-menu::after {width: 9rem;}
    header .header-menu::after {top: .4rem;}



}

@media (min-width: 1400px) {
	header .logo-header {width: 23rem;}
    .section-banniere .banniere-bg {padding: 5rem 15rem;}
    header .header-nav-right {gap: 1rem;}
    header .header-nav-left .main-menu, header .header-nav-right .main-menu {column-gap: 1.5rem;}
    header nav a {font-size: 1.7rem;}
    header .main-menu>li.menu-item>a {padding: 1.5rem;}
    header .header-menu::after {left: 0; width: 14rem; height: auto; top: 50%; transform: translateY(-50%); }
    header .header-top .header-cta-contact, header .header-top .language-switcher, header .header-top .language-switcher a, header .header-top .language-switcher li + li::before {font-size: 1.6rem;}
    header .header-top {margin-right: 2rem;}
    header nav .main-menu>.current-menu-item>a, header nav .main-menu>.current-menu-ancestor>a, header nav .main-menu>.active>a { font-size: 2rem; }
}


@media (min-width: 1800px) {
	header .header-menu::after {width: 15rem; }
	header .logo-header {width: 24rem;}

}






/************************************************/
/**                                            **/
/**                   PAGES                    **/
/**                                            **/
/************************************************/

.home-trouver-produits h2 {text-transform: uppercase; position: relative; max-width: fit-content; margin: 0 auto 2rem; padding-bottom: 1.5rem;}
.home-trouver-produits h3 {margin-top: 2rem; margin-bottom: 4rem;}
.home-trouver-produits h3 a {font-family: var(--font-secondaire); color: var(--couleur-principale); font-size: 3.8rem; letter-spacing: 0; line-height: .1em; transform: rotate(-3deg); text-decoration: none;}
.home-trouver-produits h3 a::before {content: url('images/marker.svg'); width: 4rem; display: inline-block; object-fit: contain; vertical-align: middle; margin-right: 1rem; transition: var(--transition);}

.section-qsn .btn-engagements, .section-qsn .btn-filieres {justify-content: center !important;}
.section-qsn .btn-engagements a, .section-qsn .btn-filieres a {background-color: transparent; color: var(--couleur-principale); font-family: var(--font-secondaire); font-size: 2.8rem; position: relative; padding: .5rem 0; margin-top: 1rem;}
.section-qsn .btn-engagements a::before, .btn-filieres a::before {content: ""; width: 5rem; aspect-ratio: 1 / 1; background-size: contain;  vertical-align: middle; margin-right: 1rem; transition: var(--transition); display: block; margin: auto;}
.section-qsn .btn-engagements a::before {background: url('/wp-content/uploads/2024/07/picto-avenir.svg') center / contain no-repeat; }
.section-qsn .btn-engagements a {transform: rotate(-3deg);}
.section-qsn .btn-filieres a::before {background: url('/wp-content/uploads/2021/03/picto-job.png') center / contain no-repeat;}
.section-qsn .col-qsn {flex-direction: column; margin-bottom: 0;}
.section-qsn .col-qsn img {max-height: 50rem; width: auto; margin: 0 auto;}
.section-qsn .img-shadow {position: relative;}
.section-qsn .img-shadow::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block;  margin: auto; height: 3.5rem;}
.section-qsn .img-shadow img {border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; box-shadow: var(--ombre-photo); padding: 1rem;}
/*.section-qsn .img-shadow img {border-radius: 2rem; box-shadow: rgba(137, 108, 74, 0.15) 10px 8px;}*/
.section-qsn .col-img {order: 2;}
.section-qsn h2 {margin-top: 0;}
.section-qsn .h2-font-secondaire {position: relative; z-index: 1; text-wrap: balance; text-transform: none; text-align: left; color: var(--couleur-principale);}
/*.section-qsn .h2-font-secondaire strong {position: relative; font-weight: inherit; z-index: 1;}*/
/*.section-qsn .h2-font-secondaire::after {content: ''; background-color: var(--couleur-secondaire); height: .5rem; width: 40%; position: absolute; bottom: -1rem; left: 0; border-radius: 3rem;  transform: rotate(-2deg); z-index: -1;}*/

.section-bons-moments h2 {position: relative; background-color: var(--couleur-secondaire); border-radius: 1rem; font-size: 2.2rem; padding: 1rem 1.5rem; color: #fff; max-width: fit-content; margin: 0 auto 7rem;}
.section-bons-moments h2 strong {position: absolute; background-color: var(--couleur-principale); padding: 1rem 1.5rem; border-radius: 1rem; font-weight: 600; font-size: 1.5em; bottom: -100%; left: 50%; transform: rotate(-4deg) translateX(-50%); transform-origin: left;}
.section-bons-moments h2::before {content: url(images/motif-01.svg); position: absolute; right: -3rem; top: -2rem;  width: 3rem;}
.section-bons-moments h3 {transition: var(--transition); max-width: fit-content;  margin: 5rem auto; position: relative;}
.section-bons-moments h3::after {content: url(images/fleche-tire-bouchon.svg); position: absolute; left: -1rem; top: -4rem; width: 6rem; transition: var(--transition);}
.section-bons-moments h3 a {position: relative; transform: rotate(356deg); margin: 0; font-size: 4.5rem; line-height: 1.1; font-family: var(--font-secondaire); font-weight: 400; text-decoration: none; padding: 1.5rem; letter-spacing: 0;}
.section-bons-moments h3 a::after {content: url(images/cuillere.svg); position: absolute; width: 14rem; bottom: -3.5rem; left: 50%; transform: translateX(-50%); transition: var(--transition);}


.section-demarche-certif {padding: 2rem 0; border-radius: 2rem;}
.section-demarche-certif h2 {position: relative; transform: rotate(356deg); margin: 5rem auto 0; font-size: 4rem;  font-family: var(--font-secondaire); font-weight: 400; width: max-content; }
.section-demarche-certif h2 em {position: absolute; top: -3.5rem; left: 0; font-size: .7em;  line-height: unset; font-style: normal; width: max-content;}
.section-demarche-certif .container-bloc-texte-image {max-width: 95rem; margin-left: auto; margin-right: auto; padding: .8rem 1.5rem;}
.section-demarche-certif .demarche-certif-columns {row-gap: 1.5rem; margin-bottom: 0;}
.section-demarche-certif .demarche-certif-columns .demarche-certif-img {order: 1;}
.section-demarche-certif .demarche-certif-columns .demarche-certif-img img {margin: 0 auto; max-width: 15rem; max-height: 15rem;}

.bloc-intro-engagements {margin-bottom: 3rem;}

.bloc-mentions-legales {max-width: 80rem; margin-bottom: 4rem;}
.bloc-mentions-legales h3 {text-transform: uppercase; font-weight: 500;}
.bloc-mentions-legales h3 strong {font-weight: 500;}

.section-magasins {margin-bottom: 6rem; border-radius: 3rem;}
.nous-trouver-italic {font-weight: 400; font-size: 1.5rem; max-width: 70rem; margin-left: auto; margin-right: auto; }

.bloc-intro-recettes {border-radius: 3rem; padding: 2rem; box-shadow: rgba(137, 108, 74, 0.4) 4px 4px; position: relative;}


.bloc-tableau table {background-color: var(--couleur-secondaire-light); border-radius: 2rem; overflow: hidden; border-width: 0; width: max-content !important;}
.bloc-tableau table tr:first-of-type {background-color: var(--couleur-secondaire);}
.bloc-tableau table td {border: .2rem solid #fff; font-weight: 400; vertical-align: top; padding: 1.5rem 2rem; width: 100%; width: max-content; max-width: 25rem;}
.bloc-tableau table tr td:first-of-type {font-weight: 500;}
.bloc-tableau table tr:first-of-type td {text-transform: uppercase; font-weight: 500;}

.btn-reglement a {background-color: var(--couleur-principale); font-size: 2rem; color: #fff;  box-shadow: #A82D23 3px 3px;  width: fit-content; text-transform: uppercase; padding: .7rem 1.5rem; border-radius: .6rem; margin: 0;}

@media (hover: hover) {
    .home-trouver-produits h3 a:hover {transform: rotate(0) scale3d(1.03, 1.03, 1.03);}
    .home-trouver-produits h3 a:hover::before {transform: scale(1.1) rotate(-10deg);}
    .section-qsn .btn-engagements a:hover {transform: rotate(0) scale(1.05);}
    .section-qsn .btn-filieres a:hover {transform: rotate(-3deg) scale(1.05);}
    .section-qsn .btn-engagements a:hover::before, .section-qsn .btn-filieres a:hover::before {transform: rotate(-15deg)}
    .section-bons-moments h3:hover {transform: scale3d(1.05, 1.05, 1.05);}
    .section-bons-moments h3:hover a::after {transform: translateX(-50%) rotate(-6deg); }
    .section-bons-moments h3:hover::after {transform: rotate(-10deg) scale(1.05); top: -2rem;}
    .btn-reglement a:hover {transform: rotate(-5deg);}
}


@media (min-width: 1025px) {
    .section-qsn .col-qsn {flex-direction: row; }
    .home-trouver-produits h3 {margin-top: 2rem;}
    .home-trouver-produits h3 a {font-size: 5.5rem; line-height: 1em;}
    .section-qsn .col-img {order: initial;}
    .section-qsn .col-qsn img {max-height: 100%; width: 100%; margin: 0;}
    .section-bons-moments h2 {font-size: 4rem;}
    .section-bons-moments h3 a {font-size: 8.5rem;}
    .section-qsn .img-shadow.img-right-rotate {transform: rotate(4deg);}
    .section-demarche-certif {padding: 5rem 5rem 3rem;}
    .section-demarche-certif h2 em {top: -5.5rem;}
    /* Marge basse 1rem -> 3rem : le titre incliné (rotate) chevauchait le
       logo RSE quand il est plus long (version EN « …approach is certified »). */
    .section-demarche-certif h2 { font-size: 7rem; margin: 6rem auto 3rem; }
    /* Traits rouges accrochés à la petite ligne (<em>) et non plus à tout le
       titre : en EN la 2e ligne est bien plus longue que la 1re et les traits
       se retrouvaient loin du texte. Position identique au rendu FR. */
    .section-demarche-certif h2 em::after {content: url(images/motif-01.svg); position: absolute; right: -4rem; top: -2.5rem; width: 4rem; }
    .section-demarche-certif .demarche-certif-columns .demarche-certif-img {width: fit-content; min-width: 20rem; flex: none !important; order: initial;}
    .section-demarche-certif .demarche-certif-columns .demarche-certif-img img {max-width: 17rem; max-height: 17rem;}
    .bloc-intro-engagements {max-width: 75rem; margin-left: auto; margin-right: auto; margin-bottom: 6rem;}
    .section-magasins {margin-bottom: 8rem;}
    .home-trouver-produits h2 {margin: 0 auto 3rem;}
    .bloc-intro-recettes {max-width: 75rem; margin-left: auto; margin-right: auto; padding: 3rem 5rem;}
    .bloc-intro-recettes::after {content: url(images/motif-01.svg); position: absolute; right: -6rem; top: -4rem; width: 6rem;}
    .bloc-tableau table {margin-left: auto; margin-right: auto;}
    .section-demarche-certif .container-bloc-texte-image {padding: 0 2rem;}
    .section-qsn .btn-engagements, .section-qsn .btn-filieres {justify-content: flex-start !important;}
    .section-qsn .btn-engagements a::before, .btn-filieres a::before {display: inline-block;  width: 6rem; }


}

@media (min-width: 1400px) {
    .section-bons-moments h3::after {left: -4rem; top: -3rem; width: 12rem;}
    .section-bons-moments h2::before { right: -5rem; top: -4rem;  width: 6rem; }
    .section-bons-moments h3 a::after {width: 18rem; bottom: -5rem;}
    .section-qsn .col-qsn {column-gap: 6rem;}

}

@media (min-width: 1800px) {
    .section-qsn .col-qsn {column-gap: 7rem;}

}

/************************************************/
/**                                            **/
/**             ARCHIVE PRODUITS               **/
/**                                            **/
/************************************************/

.section-grille-categories {margin-bottom: 8rem;}
.section-grille-categories  .grille-cat-grid {display: grid; grid-template-columns: 1fr;  gap: 2.5rem;}
.grille-cat-item {  border-radius: 2rem; transition: var(--transition); margin: 1rem;
    --bg-dark: color-mix(in srgb, var(--bg) 85%, black 20%);
    --ombre: color-mix(in srgb, var(--bg) 10%, var(--bg-dark) 100%);
    --ombre-60: color-mix(in srgb, var(--ombre) 60%, transparent);
}

.section-grille-categories .grille-cat-item .grille-cat-link {color: #fff; height: 100%; padding: 2rem 1rem; column-gap: .5rem; flex-direction:column;}
.grille-cat-item .grille-cat-img-wrap {justify-content: center; align-items: center; padding: 1rem; position: relative; width: fit-content; margin: 0 auto .5rem;}
.grille-cat-item .grille-cat-img {width: fit-content;  display: block; filter: drop-shadow(10px 10px 0 var(--ombre)); transition: var(--transition); max-height: 13rem;}


.grille-cat-item .motif-cat {position: absolute; max-width: 6rem; max-height: 6rem; transition: var(--transition); display: block;}

/******** Beurre de cacahuetes, biscuits souffles ********/
.grille-cat-item .motif-cat.motif-beurre {width: 3rem;}
.grille-cat-item.beurres-de-cacahuete .motif-cat.motif-beurre {right: 1rem; bottom: 1rem;}
.grille-cat-item.crackys .motif-cat.motif-beurre {top: .5rem; transform: rotate(252deg); right: 2rem;}

/******** Popcorn, cacahuetes, confiseries ********/
.grille-cat-item .motif-cat.motif-cacahuetes {height: 4.5rem;}
.grille-cat-item.cacahuetes .motif-cat.motif-cacahuetes {top: 50%; right: 0;}
.grille-cat-item.popcorns .motif-cat.motif-cacahuetes {right: 1rem; transform: rotate(13deg); bottom: 1rem;}
.grille-cat-item.confiseries .motif-cat.motif-cacahuetes {right: 1.5rem; transform: rotate(291deg); top: 0;}

/******** Mélanges gourmands, cacahuetes enrobees ********/
.grille-cat-item .motif-cat.motif-melange {max-height: 6.5rem;}
.grille-cat-item.cacahuetes-enrobees .motif-cat.motif-melange {transform: scaleY(-1) rotate(343deg); left: 1rem; top: -1.5rem;}
.grille-cat-item.melanges-gourmands .motif-cat.motif-melange {left: 0; transform: rotate(61deg); bottom: 5rem; left: -2rem;}

/******** Olives, graines aperitives ********/
.grille-cat-item .motif-cat.motif-graines {max-width: 5.5rem;}
.grille-cat-item.olives .motif-cat.motif-graines {top: 50%; transform: rotate(-12deg); right: -3.5rem;}
.grille-cat-item.graines-aperitives .motif-cat.motif-graines {left: -2.5rem; transform: rotate(82deg); bottom: 3.2rem;}


.post-type-archive-produit main {padding-bottom: 2rem;}
.btn-new-container {position: sticky; top: 80vh; left: 100%; margin: 2rem 0 2rem 2rem; z-index: 10; }
.btn-new {background-color: var(--couleur-principale); color: #fff; font-family: var(--font-secondaire); text-transform: uppercase; border: .3rem solid #fff; border-right: none; padding: .8rem 2rem .8rem .8rem; transform: rotate(4deg) translateX(1rem); transform-origin: right; position: absolute; top: 0; right: 0; }


.grille-cat-contenu {flex: 1; flex-direction: column; justify-content: center; gap: 0.6rem; }
.section-grille-categories .grille-cat-grid h3 {margin: 0; text-transform: uppercase; color: #fff; font-weight: 600; line-height: 1.1; text-align: center;}
.section-grille-categories .grille-cat-grid .grille-cat-desc {color: #fff; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 400; margin-bottom: .8rem; text-align: center;}
.grille-cat-desc p { margin: 0; }
.grille-cat-item .grille-cat-btn {display: inline-block; font-size: 1.6rem; margin: auto auto 0; padding: 0.5rem 1rem; background: var(--couleur-principale); color: #fff; text-transform: uppercase; letter-spacing: 0.06em; border-radius: .4rem; transition: var(--transition); width: fit-content; }

@media (hover: hover) {
    .grille-cat-grid .grille-cat-item:hover {transform: translateY(-5px);}
    .grille-cat-grid .grille-cat-item:nth-child(3n + 1):hover { box-shadow: var(--ombre) -8px 8px;}
    .grille-cat-grid .grille-cat-item:nth-child(3n + 2):hover {box-shadow: var(--ombre) 0px 8px; }
    .grille-cat-grid .grille-cat-item:nth-child(3n):hover {box-shadow: var(--ombre) 8px 8px; }
    .grille-cat-grid .grille-cat-item:hover .grille-cat-btn {background-color: var(--ombre);  transform: translateY(-.4rem);}
    .grille-cat-item:hover .grille-cat-img {filter: drop-shadow(13px 13px 0 var(--ombre));}
    .grille-cat-item:nth-child(odd):hover .grille-cat-img { transform: rotate(6deg) scale(1.03); }
    .grille-cat-item:nth-child(even):hover .grille-cat-img { transform: rotate(-6deg) scale(1.03); }

    .grille-cat-item.beurres-de-cacahuete:hover .motif-cat.motif-beurre {bottom: 0;}
    .grille-cat-item.crackys:hover .motif-cat.motif-beurre {top: 0; right: 2.5rem; transform: rotate(226deg);}
    .grille-cat-item.cacahuetes:hover .motif-cat.motif-cacahuetes {right: -0.5rem;  top: 55%;}
    .grille-cat-item.confiseries:hover .motif-cat.motif-cacahuetes {top: -1rem; transform: rotate(300deg);}
    .grille-cat-item.popcorns:hover .motif-cat.motif-cacahuetes {bottom: .5rem; right: .5rem; transform: rotate(20deg);}
    .grille-cat-item.melanges-gourmands:hover .motif-cat.motif-melange {bottom: 6rem; transform: rotate(73deg); left: -1rem;}
    .grille-cat-item.cacahuetes-enrobees:hover .motif-cat.motif-melange {left: -1rem; top: -0.5rem;  transform: scaleY(-1) rotate(372deg);}
    .grille-cat-item.olives:hover .motif-cat.motif-graines {right: -3rem; transform: rotate(12deg); }
    .grille-cat-item.graines-aperitives:hover .motif-cat.motif-graines {transform: rotate(97deg); left: -2rem; bottom: 4rem;  }
    .btn-new:hover {transform: rotate(4deg) translateX(1rem) scale(1.05);}

}
@media (min-width: 768px) {
    .grille-cat-item {margin: 0;}
    .section-grille-categories .grille-cat-grid { grid-template-columns: repeat(2, 1fr); }
    .section-grille-categories .grille-cat-grid .grille-cat-desc {font-size: 1.6rem;}
    .section-grille-categories .grille-cat-item .grille-cat-link {padding: 2rem;}

}

@media (min-width: 1025px) {
    .section-grille-categories .grille-cat-item .grille-cat-link {padding: 2rem 3rem;}
    .btn-new-container {top: 90vh; }
    .btn-new {font-size: 2rem; }

}

@media (min-width: 1400px) {
    .grille-cat-item .grille-cat-img-wrap {flex: 0 0 38%; padding-left: 0; margin: 0;}
    .section-grille-categories {margin-top: 5rem;}
    .section-grille-categories .grille-cat-grid {grid-template-columns: repeat(3, 1fr); gap: 2.5rem;}
    .section-grille-categories .grille-cat-item .grille-cat-link {flex-direction: row;}
    .grille-cat-item .grille-cat-btn {margin: auto 0 0;}
    .section-grille-categories .grille-cat-grid h3, .section-grille-categories .grille-cat-grid .grille-cat-desc {text-align: left;}
    .grille-cat-item .motif-cat {position: absolute; max-width: 6rem; max-height: 6rem; transition: var(--transition); display: block;}

    /******** Beurre de cacahuetes, biscuits souffles ********/
    .grille-cat-item .motif-cat.motif-beurre {width: 3rem;}
    .grille-cat-item.beurres-de-cacahuete .motif-cat.motif-beurre {right: 1rem; bottom: 1rem;}
    .grille-cat-item.crackys .motif-cat.motif-beurre {top: .5rem; transform: rotate(252deg); right: 2rem;}

    .grille-cat-item.beurres-de-cacahuete:hover .motif-cat.motif-beurre {bottom: 0;}
    .grille-cat-item.crackys:hover .motif-cat.motif-beurre {top: 0; right: 2.5rem; transform: rotate(226deg);}

    /******** Popcorn, cacahuetes, confiseries ********/
    .grille-cat-item .motif-cat.motif-cacahuetes {height: 4.5rem;}
    .grille-cat-item.cacahuetes .motif-cat.motif-cacahuetes {top: 50%; right: 0;}
    .grille-cat-item.popcorns .motif-cat.motif-cacahuetes {right: 1rem; transform: rotate(13deg); bottom: 1rem;}
    .grille-cat-item.confiseries .motif-cat.motif-cacahuetes {right: 1.5rem; transform: rotate(291deg); top: 0;}

    .grille-cat-item.cacahuetes:hover .motif-cat.motif-cacahuetes {right: -0.5rem;  top: 55%;}
    .grille-cat-item.confiseries:hover .motif-cat.motif-cacahuetes {top: -1rem; transform: rotate(300deg);}
    .grille-cat-item.popcorns:hover .motif-cat.motif-cacahuetes {bottom: .5rem; right: .5rem; transform: rotate(20deg);}

    /******** Mélanges gourmands, cacahuetes enrobees ********/
    .grille-cat-item .motif-cat.motif-melange {max-height: 6.5rem;}
    .grille-cat-item.cacahuetes-enrobees .motif-cat.motif-melange {transform: scaleY(-1) rotate(343deg); left: 1rem; top: -1.5rem;}
    .grille-cat-item.melanges-gourmands .motif-cat.motif-melange {left: 0; transform: rotate(61deg); bottom: 5rem; left: -2rem;}

    .grille-cat-item.melanges-gourmands:hover .motif-cat.motif-melange {bottom: 6rem; transform: rotate(73deg); left: -1rem;}
    .grille-cat-item.cacahuetes-enrobees:hover .motif-cat.motif-melange {left: -1rem; top: -0.5rem;  transform: scaleY(-1) rotate(372deg);}

    /******** Olives, graines aperitives ********/
    .grille-cat-item .motif-cat.motif-graines {max-width: 5.5rem;}
    .grille-cat-item.olives .motif-cat.motif-graines {top: 50%; transform: rotate(-12deg); right: -3.5rem;}
    .grille-cat-item.graines-aperitives .motif-cat.motif-graines {left: -2.5rem; transform: rotate(82deg); bottom: 3.2rem;}

    .grille-cat-item.olives:hover .motif-cat.motif-graines {right: -3rem; transform: rotate(12deg); }
    .grille-cat-item.graines-aperitives:hover .motif-cat.motif-graines {transform: rotate(97deg); left: -2rem; bottom: 4rem;  }

}

@media (min-width: 1800px) {

    .section-grille-categories .grille-cat-grid h3 {font-size: 2.8rem;}

}


/************************************************/
/**                                            **/
/**              GAMMES PRODUITS               **/
/**                                            **/
/************************************************/


.bloc-banniere {
    position: relative;
    min-height: 380px;
    display: flex;
    align-items: center;
    overflow: hidden;
}





.banniere-last-line {
    display: inline-block;
    position: relative;
}


.section-produits-gamme {display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.5rem; }
.section-produits-gamme .carte-produit {border-radius: 2rem;  overflow: hidden; transition: var(--transition); margin: 1rem;
    --bg-dark: color-mix(in srgb, var(--bg) 85%, black 20%);
    --ombre: color-mix(in srgb, var(--bg) 10%, var(--bg-dark) 100%);
}

.section-produits-gamme .carte-produit-lien { align-items: stretch; min-height: 210px; color: #fff; height: 100%; padding: 2rem; column-gap: 1.5rem; flex-direction: column;}
.section-produits-gamme .carte-produit-img-zone {position: relative; align-items: flex-end; justify-content: center; overflow: visible; margin-bottom: .8rem;}
.section-produits-gamme .carte-produit-img {width: 100%; max-height: 210px; object-position: bottom center; display: block; filter: drop-shadow(10px 10px 0 var(--ombre)); transition: var(--transition); position: relative; z-index: 1;}
.section-produits-gamme .carte-produit-contenu {flex: 1; flex-direction: column; justify-content: center; }
.section-produits-gamme .carte-produit-contenu p {margin: 0; font-size: 1.6rem; color: #fff;}
.section-produits-gamme .carte-produit-titre {margin: 0; line-height: 1.1; text-transform: uppercase; color: #fff; font-weight: 600; text-align: center; margin-bottom: .8rem;}
.section-produits-gamme .carte-produit-btn {display: inline-block; padding: 0.5rem 1rem; margin: .5rem auto 0; align-self: flex-start; color: #fff; background-color: var(--ombre); text-transform: uppercase; border-radius: .4rem; transition: var(--transition); }
.section-produits-gamme .carte-produit .carte-produit-illustration {display: none;}

.section-gamme-articles h2 {text-align: left; margin: 0 0 1.5rem; text-transform: none;}
.section-gamme-articles .gamme-articles-liste {flex-wrap: wrap; gap: 3rem;}
.section-gamme-articles .gamme-articles-liste .gamme-article {width: 100%;}
.section-gamme-articles .gamme-articles-liste .gamme-article h3 {color: var(--couleur-principale); font-size: 1.8rem; font-weight: 400; margin: 0; letter-spacing: 0; display: inline-block; position: relative; text-transform: uppercase;}
.section-gamme-articles .gamme-articles-liste .gamme-article h3::after {content: "\f111"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: .8rem; color: var(--couleur-principale); position: absolute; left: -1.5rem;}
.section-gamme-articles .gamme-articles-liste .gamme-article p { font-weight: 400; font-size: 1.6rem; margin-top: .5rem; display: inline; }

@media (hover: hover) {
    .section-produits-gamme .carte-produit:hover .carte-produit-btn {transform: translateY(-.3rem) scale(1.05); background-color: #fff; color: var(--couleur-principale);}
    .section-produits-gamme .carte-produit:hover {  transform: translateY(-5px);}
    .section-produits-gamme .carte-produit:nth-child(2n + 1):hover { box-shadow: var(--ombre) -8px 8px;}
    .section-produits-gamme .carte-produit:nth-child(2n):hover {box-shadow: var(--ombre) 8px 8px; }
    .section-produits-gamme .carte-produit:nth-child(2n):hover .carte-produit-img {transform: scale(1.05) rotate(5deg);}
    .section-produits-gamme .carte-produit:nth-child(2n + 1):hover .carte-produit-img {transform: scale(1.05) rotate(-5deg);}
    .section-produits-gamme .carte-produit:hover .carte-produit-img {filter: drop-shadow(15px 15px 0 var(--ombre));}
    /*.section-produits-gamme .carte-produit.peanut-100:hover .carte-produit-illustration {top: 0;}
    .section-produits-gamme .carte-produit[class*="creamy"]:hover .carte-produit-illustration {right: calc(var(--illus-hmargin, 0px) - .5rem); top: -1.5rem;}
    .section-produits-gamme .carte-produit[class*="crunchy"]:hover .carte-produit-illustration {bottom: -2rem; right: calc(var(--illus-hmargin, 0px) - 1.5rem);}
    .section-produits-gamme .carte-produit[class*="proteines"]:hover .carte-produit-illustration {bottom: -1.5rem;}
    .section-produits-gamme .carte-produit.peanut-choco:hover .carte-produit-illustration {transform: translateY(-50%); right: calc(var(--illus-hmargin, 0px) - .5rem);}*/
    .section-gamme-articles .gamme-articles-liste .gamme-article:hover { transform: scale(1.03); }





}


@media (min-width: 768px) {
    .section-produits-gamme .carte-produit-titre {text-align: left;}
    .section-produits-gamme .carte-produit-btn {margin: 1.5rem 0 0;}
    .section-produits-gamme .carte-produit {margin: 0;}
}

@media (min-width: 1025px) {
    .section-gamme-articles {margin-top: 10rem;}
    .descriptif-categorie {max-width: 90rem; margin-left: auto; margin-right: auto;}
    .section-gamme-articles .gamme-articles-liste {gap: 4rem 6rem;}
    .section-gamme-articles .gamme-articles-liste .gamme-article {width: 50%;}
    .section-produits-gamme .carte-produit-titre {font-size: 2.6rem;}
}

@media (min-width: 1400px) {
    .section-produits-gamme .carte-produit-lien { flex-direction: row; padding: 2rem 3rem 2rem 1.5rem; column-gap: 3rem; }
    .section-produits-gamme .carte-produit-img-zone {flex: 0 0 38%; margin-bottom: 0;}
    .section-produits-gamme .carte-produit .carte-produit-illustration {display: block; position: absolute; max-width: 6rem; max-height: 6rem; transition: transform 230ms ease-in-out, right 230ms ease-in-out, top 230ms ease-in-out, bottom 230ms ease-in-out, opacity 230ms ease-in-out; z-index: 1; opacity: 0;}
    /*.section-produits-gamme .carte-produit[class*="crunchy"] .carte-produit-illustration {right: -1rem; bottom: -1rem;}*/
    /*.section-produits-gamme .carte-produit[class*="creamy"] .carte-produit-illustration {right: -1rem; top: -1rem; width: 4rem;}*/
    /*.section-produits-gamme .carte-produit.peanut-100 .carte-produit-illustration {right: -1rem; top: .5rem; width: 4rem;}
    .section-produits-gamme .carte-produit.peanut-choco .carte-produit-illustration {top: 50%; transform: translateY(-50%); right: calc(var(--illus-hmargin, 0px) - 1rem);}
.section-produits-gamme .carte-produit[class*="proteines"] .carte-produit-illustration {right: -1rem; bottom: -1rem; width: 3.5rem;}*/

    .section-produits-gamme .carte-produit img[src$="produit-1.svg"], .section-produits-gamme .carte-produit img[src$="produit-4.svg"] {right: calc(var(--illus-hmargin, 0px) - 5.5rem); bottom: -1rem; opacity: 1;}
    .section-produits-gamme .carte-produit img[src$="produit-2.svg"] {right: calc(var(--illus-hmargin, 0px) - 3rem); top: 0; width: 3rem; transform: rotate(15deg); opacity: 1;}
    .section-produits-gamme .carte-produit img[src$="produit-3.svg"] {right: calc(var(--illus-hmargin, 0px) - 3.5rem); top: 0; width: 3.5rem; opacity: 1;}
    .section-produits-gamme .carte-produit img[src$="produit-5.svg"] {top: 50%; transform: translateY(-50%); right: calc(var(--illus-hmargin, 0px) - 1rem); opacity: 1;}
    .section-produits-gamme .carte-produit img[src$="produit-6.svg"] {right: calc(var(--illus-hmargin, 0px) - 2rem); bottom: -1rem; width: 2.8rem; opacity: 1;}

    .section-produits-gamme .carte-produit:hover img[src$="produit-1.svg"], .section-produits-gamme .carte-produit:hover img[src$="produit-4.svg"] {right: calc(var(--illus-hmargin, 0px) - 5rem);}
    .section-produits-gamme .carte-produit:hover img[src$="produit-5.svg"] {top: calc(50% + 1rem);}
    .section-produits-gamme .carte-produit:hover img[src$="produit-3.svg"] {right: calc(var(--illus-hmargin, 0px) - 4.5rem);}
    .section-produits-gamme .carte-produit:hover img[src$="produit-2.svg"] {right: calc(var(--illus-hmargin, 0px) - 4rem);}
    .section-produits-gamme .carte-produit:hover img[src$="produit-6.svg"] {right: calc(var(--illus-hmargin, 0px) - 3rem);}




}

/************************************************/
/**                                            **/
/**                SINGLE GAMME                **/
/**                                            **/
/************************************************/

.single-info-gamme .section-info-gamme-contenu {margin-top: 3rem;}
.single-info-gamme .section-info-gamme .info-gamme-columns {row-gap: 1rem; flex-direction: column; column-gap: 5rem; justify-content: center; margin-bottom: 0;}
.single-info-gamme .section-info-gamme .col-img {position: relative; transform: rotate(4deg); width: 100%; max-height: 30rem; max-width: 55rem; padding: 0 2rem; margin: 0 auto 2rem; order: -1;}
.single-info-gamme .section-info-gamme .col-img img {border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; box-shadow: var(--ombre-photo); padding: 1rem;}
.single-info-gamme .section-info-gamme .col-img::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto; height: 3.5rem;}
.single-info-gamme .section-info-gamme h2 {text-transform: none; margin-top: 0; text-align: left;}
.single-info-gamme .section-info-gamme .col-text {flex: none;}

.single-info-gamme .section-gamme-recettes {padding-top: 5rem;}
.single-info-gamme .section-gamme-recettes h2 {position: relative; margin: 0 auto 4rem; font-size: 3.3rem; font-family: var(--font-secondaire); font-weight: 400; width: fit-content;}
.single-info-gamme .section-gamme-recettes h2 em {position: absolute; top: -3.5rem; left: 50%; font-size: .7em; line-height: 1; font-style: normal; transform: translateX(-50%); text-wrap: nowrap;}
.single-info-gamme .section-gamme-recettes .gamme-recettes {column-gap: 5rem;}
.single-info-gamme .section-gamme-recettes .gamme-recette-item .recette-img {aspect-ratio: 4 / 3; border-color: rgba(181, 165, 155, .25); background-color: #fff; border-width: .15rem 0 0 .15rem; margin: 0 1.5rem; border-style: solid; padding: 1rem; box-shadow: var(--ombre-photo-light); transition: var(--transition);}
.single-info-gamme .section-gamme-recettes .gamme-recette-item h3 {color: var(--couleur-principale); font-size: 2.3rem; font-family: var(--font-secondaire); font-weight: 400; margin-top: 2.5rem; margin-bottom: 0;  transition: var(--transition); text-align: center; background-color: transparent;}

.single-info-gamme .section-info-gamme-text {border-radius: 3rem; box-shadow: rgba(137, 108, 74, 0.4) 4px 4px; position: relative; padding: 2rem 1.5rem;}
.single-info-gamme .section-info-gamme-text h2 {text-transform: none; font-family: var(--font-secondaire); max-width: 70rem; margin: 0 auto 4rem;}

.single-info-gamme .section-ig-columns {gap: 4rem;}
.single-info-gamme .section-ig-columns .ig-col {flex-basis: auto !important; width: calc(33% - 1.5rem); min-height: 32rem; flex-direction: column; position: relative;}
.single-info-gamme .section-ig-columns .ig-col-text {padding: 3rem; justify-content: center; }
.single-info-gamme .section-ig-columns .ig-col-text img {height: 7rem;}
.single-info-gamme .section-ig-columns .ig-col-img {border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; box-shadow: var(--ombre-photo-light); padding: 1rem;}
.single-info-gamme .section-ig-columns .ig-col-img figure, .single-info-gamme .section-ig-columns .ig-col-img img {height: 100%; margin: 0;}

.single-info-gamme .section-ig-columns .ig-col::before { content: ""; position: absolute; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block;  margin: auto; height: 3.5rem;}
.single-info-gamme .section-ig-columns .ig-col-img::before { top: -1.5rem; width: 12rem; transform: translateX(-50%); left: 50%;}
/*.single-info-gamme .section-ig-columns .ig-col:first-of-type::before {left: -3rem;  top: 0;  transform: rotate(-35deg); width: 10rem; }
.single-info-gamme .section-ig-columns .ig-col:nth-child(3)::before {right: -4rem; top: 1rem;  transform: rotate(45deg); width: 12rem;}*/





@media (hover: hover) {
    .single-info-gamme .section-gamme-recettes .gamme-recette-item:hover, .single-info-gamme .section-gamme-recettes .gamme-recette-item:nth-child(even):hover { transform: rotate(0) scale(1.03); }
    .single-info-gamme .section-gamme-recettes .gamme-recette-item:hover .recette-img {box-shadow: var(--ombre-photo);}
}

@media (min-width: 768px) {
.single-info-gamme .section-info-gamme .info-gamme-columns {row-gap: 4rem;}
}
@media (min-width: 1025px) {
    .single-info-gamme .section-gamme-recettes .gamme-recette-item {margin: 0; width: calc(33.3% - 2.5rem);}
    .single-info-gamme .section-gamme-recettes h2 {font-size: 6rem; margin: 0 auto 4.5rem;}
    .single-info-gamme .section-info-gamme .col-img  {flex: 1; width: auto; margin: 0; padding: 0; max-height: 60rem; order: initial; }
    .single-info-gamme .section-info-gamme .info-gamme-columns {flex-direction: row;}
    .single-info-gamme .section-info-gamme .info-gamme-columns:nth-child(odd) {flex-direction: row-reverse;}
    .single-info-gamme .section-info-gamme-text::after {content: url(images/motif-01.svg); position: absolute; left: -6rem; top: -4rem; width: 6rem; transform: scaleX(-1);}
    .single-info-gamme .section-info-gamme-text {max-width: 90rem; margin-left: auto; margin-right: auto; padding: 0;}
    .single-info-gamme .section-info-gamme .img-sticky {position: sticky; top: 20rem;}
    .single-info-gamme .section-info-gamme-contenu {margin-top: 6.5rem;}



}

@media (min-width: 1400px) {
    .single-info-gamme .section-info-gamme .info-gamme-columns {column-gap: 10rem;}

}



/************************************************/
/**                                            **/
/**               SINGLE PRODUIT               **/
/**                                            **/
/************************************************/


/* ── Breadcrumb ── */
.single-produit .breadcrumb-global { margin-bottom: 2rem; column-gap: .5rem; flex-wrap: wrap;}


.single-produit .produit-header {display: grid; grid-template-columns: 1fr; gap: 2rem; margin-top: 3rem;}
.single-produit .produit-info {flex-direction: column; gap: 0.9rem; margin-top: 2rem;}

.single-produit h1 {margin: 0; text-transform: uppercase; color: var(--couleur-fond); font-family: var(--font-principale); text-align: left; font-size: 3.2rem; font-weight: 600; }
.single-produit .produit-categorie {display: inline-block; text-transform: uppercase; color: var(--couleur-fond); font-weight: 700; width: fit-content; }
.single-produit .sous-titre {margin: 0; font-size: 2rem;  text-transform: uppercase;}

.produit-description { font-size: 0.9rem; line-height: 1.65; color: #333; }

.single-produit .produit-label-ingredients {display: inline-block; color: #fff; padding: .5rem 1rem; border-radius: .3rem; max-width: fit-content; }
.single-produit .produit-ingredients-texte p {font-weight: 400; font-size: 1.6rem;}
.single-produit .produit-ingredients-texte strong {font-weight: 600;}

.single-produit .produit-caracteristiques { flex-wrap: wrap; gap: 1rem;}
.single-produit .produit-caracteristique {align-items: center; justify-content: center; background: var(--couleur-secondaire); color: #fff; font-weight: 400; padding: .5rem 1rem;  border-radius: .3rem; font-size: 1.6rem; flex-direction: column; line-height: 1em;}
.single-produit .produit-caracteristique span {display: block; font-size: 2.4rem; font-weight: 500; line-height: .8em;}
.single-produit .produit-caracteristique.mais-francais {position: relative; order: 1;}
.single-produit .produit-caracteristique.mais-francais img {position: absolute; width: 3.5rem; right: -3rem;}

.single-produit .saz_next_widget {margin-top: 1rem;}
.single-produit .saz_next_widget .MuiContainer-root {padding: 0 !important;}
.single-produit .saz_next_widget .MuiContainer-root>.MuiBox-root {margin: 0 !important; box-shadow: rgba(150, 141, 131, .25) 3px 3px; border: .1rem solid rgba(150, 141, 131, .15);}

.single-produit .produit-col-centre { flex-direction: column; gap: 1.5rem; order: -1;}

.single-produit .produit-visuel {position: relative; background: var(--couleur-fond); border-radius: 3rem; align-items: center; justify-content: center; overflow: visible; padding: 5rem 2rem;}
.single-produit .produit-visuel .produit-motif-tr, .single-produit .produit-visuel .produit-motif-bl {display: none;}
.single-produit .produit-visuel img.produit-photo { max-height: 20rem; filter: drop-shadow(15px 15px 0 rgba(0, 0, 0, 0.3)); position: relative; z-index: 1; transform: rotate(-8deg);}

.single-produit .produit-visuel .motif-produit-tr, .single-produit .produit-visuel .motif-produit-bl {position: absolute;  max-width: 9.5rem; max-height: 9.5rem;}
.single-produit .produit-visuel .motif-produit-tr {right: -2rem; top: -1.5rem; /*animation: 1500ms infinite linear alternate produit_anim;*/}
.single-produit .produit-visuel .motif-produit-bl {left: -2rem; bottom: -1.5rem;  /*animation: 1500ms infinite linear alternate produit_anim;*/}

/*
@keyframes motif_tr1 {
    25% {transform: rotate(-35deg) translateX(0);}
    28% {transform: rotate(-35deg) translateX(.4rem);}
    31% {transform: rotate(-35deg) translateX(-0.2rem);}
    34% {transform: rotate(-35deg) translateX(.6rem);}
    37% {transform: rotate(-35deg) translateX(0);}
}

@keyframes motif_tr2 {
    27% {transform: rotate(22deg) translateX(0);}
    30% {transform: rotate(22deg) translateX(.6rem);}
    33% {transform: rotate(22deg) translateX(-0.2rem);}
    36% {transform: rotate(22deg) translateX(.5rem);}
    39% {transform: rotate(22deg) translateX(0);}
}

@keyframes motif_bl1 {
    25% {transform: translateX(0);}
    28% {transform: translateX(.8rem);}
    31% {transform: translateX(-0.2rem);}
    34% {transform: translateX(.5rem);}
    37% {transform: translateX(0);}
}

@keyframes motif_bl2 {
    27% {transform: rotate(-25deg) translateX(0);}
    30% {transform: rotate(-25deg) translateX(.6rem);}
    33% {transform: rotate(-25deg) translateX(-0.2rem);}
    36% {transform: rotate(-25deg) translateX(.5rem);}
    39% {transform: rotate(-25deg) translateX(0);}
}

@keyframes produit_anim {
    0% {margin-top: 0; margin-bottom: 0;}
    50% {margin-top: -1rem; margin-bottom: -1rem;}
    100% {margin-top: 0; margin-bottom: 0;}
}

.produit-visuel img.produit-photo-anim {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 2;
    pointer-events: none;
}
*/

.single-produit .produit-icones {gap: 2rem; justify-content: space-evenly; margin-top: 4rem;}
/* Ces éléments sont des <button> (ils ouvrent une modale) : on neutralise le
   style natif du navigateur pour conserver le rendu d'origine. */
.single-produit .produit-icone-item,
.produit-modal .modal-header.closemodal {appearance: none; background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; text-align: inherit;}
.single-produit .produit-icone-item:focus-visible,
.produit-modal .modal-header.closemodal:focus-visible {outline: 2px solid var(--couleur-secondaire); outline-offset: 4px;}

.single-produit .produit-icone-item {flex-direction: column; align-items: center; text-align: center; cursor: pointer; row-gap: 1rem; transition: var(--transition); flex: 1;}
.single-produit .produit-icone-item img {max-height: 3rem; transition: var(--transition);}
.single-produit .produit-icone-item span {text-transform: uppercase; font-size: 1.3rem; color: var(--couleur-secondaire);}


.single-produit .produit-temoignage-bulle {display: none; position: relative; background: var(--couleur-secondaire); border-radius: 3rem; padding: 2.5rem 2.5rem 2rem 4rem; margin-top: 2rem; }
.single-produit .produit-temoignage-bulle::before {content: url('images/guillemets.svg'); position: absolute; width: 2rem;}
.single-produit .produit-temoignage-bulle::before {top: 2rem; left: 1.2rem; }
/*.produit-temoignage-bulle p:last-of-type::after {bottom: -0.5rem; right: -3rem; transform: scaleX(-1);}*/
.single-produit .produit-temoignage-bulle::after {content: ''; position: absolute; bottom: calc(100% - .2rem); right: 4rem; border: 2rem solid transparent; border-bottom-color: var(--couleur-secondaire);}
.single-produit .produit-temoignage-bulle p {margin: 0; color: #fff; font-size: 1.6rem; line-height: 1.3; font-weight: 400; text-align: left !important; display: inline-block;}
.single-produit .produit-temoignage-bulle p:last-of-type {position: relative; display: inline;}
.single-produit .produit-temoignage-bulle strong, .single-produit .produit-temoignage-bulle b { font-weight: 600; position: relative; }
.single-produit .produit-temoignage-bulle .guillemet-fin {width: 2rem; transform: scaleX(-1); display: inline; margin-left: .5rem;}
.single-produit .produit-temoignage-bulle-mobile {display: block; margin-top: 0; margin-bottom: 2rem; margin-top: 3rem;}

.single-produit .produit-recettes {gap: 5rem; justify-content: center;}
.single-produit .produit-recettes .recette-item {flex: 1; max-width: 50rem; margin: 1rem;}
.single-produit .produit-recettes .recette-item img {max-height: 30rem; aspect-ratio: 4 / 3; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; background-color: #fff; padding: 1rem; box-shadow: var(--ombre-photo-light);  transition: var(--transition);}
.single-produit .produit-recettes .recette-item h3 {font-family: var(--font-secondaire); font-weight: 400;  text-align: center; margin-top: 2rem;}

.single-produit .section-en-voir-plus {margin-top: 5rem; margin-bottom: 3rem; }
.single-produit .btn-loupe {color: var(--couleur-principale); font-weight: 600; margin: 0 auto; text-transform: uppercase; max-width: fit-content; text-align: center; position: relative;}
.single-produit .btn-loupe::after {content: '';  width: calc(100% - 7rem); height: .4rem; border-radius: .5rem; background-color: var(--couleur-principale); position: absolute; bottom: 0; left: 6rem; transform: rotate(358.5deg);}
.single-produit .btn-loupe::before {content: url(images/loupe-2.svg); width: 5rem;  display: inline-block; object-fit: contain; vertical-align: middle; margin-right: .8rem; transition: var(--transition);}
.produit-similaires-slider { margin: 0 -0.5rem; }
.single-produit .produit-similaires {margin-top: 7rem;}
.single-produit .produit-similaires h2 {margin-bottom: 0;}
.single-produit .produit-similaires-slider .slick-track {padding: 2rem 0;}
.single-produit .produit-similaires-slider .produit-similaire-item { padding: 0 0.5rem; margin: 0 1rem; transition: var(--transition);}
.single-produit .produit-similaires-slider .produit-similaire-item a {flex-direction: column; justify-content: center; align-items: center;}
.single-produit .produit-similaires-slider .produit-similaire-visuel {width: 100%; min-width: 0; min-height: 0; align-items: center; border-radius: 3rem; padding: 1.5rem; transition: var(--transition); aspect-ratio: 1/1; justify-content: center;
    --bg-dark: color-mix(in srgb, var(--bg-produit-similaire) 85%, black 20%);
    --ombre-produit-similaire: color-mix(in srgb, var(--bg-produit-similaire) 10%, var(--bg-dark) 100%);}
.single-produit .produit-similaires-slider .produit-similaire-item img {filter: drop-shadow(15px 15px 0 rgba(0, 0, 0, 0.2)); width: 100%; height: 100%; object-fit: scale-down; transition: var(--transition);}
.single-produit .produit-similaires-slider .produit-similaire-item:nth-child(odd) img {filter: drop-shadow(-15px 15px 0 rgba(0, 0, 0, 0.2));}



.produit-similaire-item { text-align: center; }
.single-produit .produit-similaire-item h3 {background-color: var(--couleur-principale); border-radius: .8rem; padding: .4rem 1.5rem; font-weight: 500; font-size: 1.8rem; margin-top: 2.5rem; text-transform: uppercase; color: #fff; width: fit-content;  transition: var(--transition);}

.single-produit .bloc-accordeon, .tax-categorie-produit .bloc-accordeon {margin: 2.5rem auto 0;}
.single .produit-faq .accordeon-section, .tax-categorie-produit .produit-faq .accordeon-section {border-bottom: .1rem solid var(--couleur-texte); padding: 1rem 0;}
.single .produit-faq .accordeon-toggle, .tax-categorie-produit .produit-faq .accordeon-toggle {color: var(--couleur-texte); font-size: 1.8rem; font-weight: 500; align-items: center; justify-content: space-between; column-gap: 2rem; cursor: pointer; transition: var(--transition);}
.single .produit-faq .accordeon-toggle::after, .tax-categorie-produit .produit-faq .accordeon-toggle::after {content: "\2b"; font-family: "Font Awesome 6 Free"; font-weight: 900; transition: var(--transition);}
.single .produit-faq .accordeon-toggle.accordeon-open, .tax-categorie-produit .produit-faq .accordeon-toggle.accordeon-open { color: var(--couleur-principale);}
.single .produit-faq .accordeon-toggle.accordeon-open::after, .tax-categorie-produit .produit-faq .accordeon-toggle.accordeon-open::after {transform: rotate(45deg);}
.single .produit-faq .accordeon-content, .tax-categorie-produit .produit-faq .accordeon-content {display: none; overflow: hidden;}
.single .produit-faq .accordeon-content p, .tax-categorie-produit .produit-faq .accordeon-content p {font-weight: 400;}
.single .produit-faq .accordeon-content p:first-of-type, .tax-categorie-produit .produit-faq .accordeon-content p:first-of-type {margin-top: 0;}

.produit-similaires-slider .slick-prev, .produit-similaires-slider .slick-next {display: none !important; z-index: 1; width: 36px; height: 36px; opacity: 0; top: calc(11.5rem + 1.8rem); transform: none;}
.produit-similaires-slider .slick-prev { left: -5rem; }
.produit-similaires-slider .slick-next { right: -5rem; }



/* ── Infos nutritionnelles (dans la modale) ── */
#tableaunutrition { width: 100%; border-collapse: collapse;  }
#tableaunutrition thead {background: var(--couleur-principale); color: #fff;}
#tableaunutrition th, #tableaunutrition td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #eee; }
#tableaunutrition .firstcol { font-weight: 600; }
#tableaunutrition tr.alt { background: #f5f5f5; }
#tableaunutrition thead th { font-weight: 700; border-bottom: 2px solid var(--couleur-principale); text-align: left; }
#infonutri .italic {font-weight: 400; font-size: 1.5rem; font-style: italic;}

#infonutri .nutriscore {justify-content: space-between; margin-top: 4rem;}
#infonutri .nutriscore a {font-size: 1.5rem; font-weight: 400;}
#infonutri .nutriscore img {height: 7rem; margin: 0 auto;}

.single-produit .produit-modal .modal-dialog {max-width: 90rem; min-height: 100vh; box-shadow: 10px 4px 0 rgba(72, 58, 49, .35);}
.single-produit .produit-modal {position: fixed; inset: 0; z-index: 1050; overflow-y: auto; transform: translateX(-100%); transition: all 350ms ease-in-out; }
.single-produit .produit-modal.show { transform: translateX(0); }
.single-produit .produit-modal .modal-content { height: 100vh; padding: 2rem; background-color: #fff; margin: 0; width: 100%; overflow: auto; scrollbar-width: none;}

.single-produit .produit-modal h2.modale-titre {position: relative; transform: rotate(356deg); color: var(--couleur-principale); margin: 0 0 5rem; font-size: 3.5rem; font-family: var(--font-secondaire); font-weight: 400;}
.single-produit .produit-modal .modale-contenu {margin-top: 6rem;}
.single-produit .produit-modal .modale-contenu h2 {text-align: left; font-size: 2.8rem; margin-top: 5rem;}


.produit-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: rgba(0,0,0,0.55);
}

body.produit-modal-open { overflow: hidden; }





.produit-modal .modal-header.closemodal {display: flex; align-items: center; gap: 0.5rem; cursor: pointer; justify-content: flex-end; width: fit-content; margin: 0 0 3rem auto; transition: var(--transition);}
.produit-modal .modal-header.closemodal img.return { width: 28px; }

.produit-modal .modal-body { padding: 1.5rem 0; }



@media (hover: hover) {
    .single-produit .produit-icone-item:hover {transform: scale(1.03);}
    .single-produit .produit-icone-item:hover img {transform: rotate(-6deg);}
    .single-produit .produit-icone-item:nth-child(even):hover img {transform: rotate(5deg);}
    .single-produit .produit-similaires-slider .produit-similaire-item:hover  {transform: scale(1.03);}
    .single-produit .produit-similaires-slider .produit-similaire-item:nth-child(odd):hover .produit-similaire-visuel {box-shadow: var(--ombre-produit-similaire) -8px 8px;}
    .single-produit .produit-similaires-slider .produit-similaire-item:nth-child(even):hover .produit-similaire-visuel {box-shadow: var(--ombre-produit-similaire) 8px 8px;}
    .single-produit .produit-similaires-slider .produit-similaire-item:hover img {filter: drop-shadow(20px 20px 0 rgba(0, 0, 0, 0.3)); transform: rotate(5deg);}
    .single-produit .produit-similaires-slider .produit-similaire-item:hover:nth-child(odd) img {filter: drop-shadow(-20px 20px 0 rgba(0, 0, 0, 0.3)); transform: rotate(-5deg);}
    .single-produit .produit-similaires-slider .produit-similaire-item:hover h3 {transform: rotate(-5deg);}
    .produit-similaires-slider:hover .slick-prev, .produit-similaires-slider:hover .slick-next {opacity: 1;}
    .single-produit .btn-loupe:hover {transform: scale(1.03);}
    .single-produit .btn-loupe:hover::before {transform: scale(1.1) rotate(10deg);}
    .single-produit .produit-recettes .recette-item:hover {transform: rotate(2deg) scale(1.03);}
    .single-produit .produit-recettes .recette-item:nth-child(odd):hover {transform: rotate(-1deg) scale(1.03);}
    .single-produit .produit-recettes .recette-item:hover img {box-shadow: var(--ombre-photo);}
    .produit-modal .modal-header.closemodal:hover {transform: scale(1.03);}
}



@media (min-width: 1025px) {
    .single-produit .btn-loupe {font-size: 2.8rem;}
    .single-produit .produit-header {grid-template-columns: 60% 1fr; margin-top: 5.5rem;}
    .single-produit .produit-icone-item {flex: none;}
    .single-produit .produit-info {margin-right: 5rem; margin-top: 0; }
    .single-produit .produit-visuel .produit-motif-bl {display: block; position: absolute; left: -8rem; bottom: -2rem; transform-origin: right; transform: rotate(-20deg);}
    .single-produit .produit-visuel .produit-motif-bl span {height: .6rem; display: block; border-radius: 99px; margin-bottom: 1.5rem; transform-origin: right;}
    .single-produit .produit-visuel .produit-motif-bl span:first-of-type {margin-left: auto; width: 3.5rem;}
    .single-produit .produit-visuel .produit-motif-bl span:last-of-type {width: 5rem; transform: rotate(-25deg);}
    .single-produit .produit-icone-item img {max-height: 4rem;}
    .single-produit h1 {font-size: 5rem;}
    .single-produit .sous-titre {font-size: 2.8rem;}
    .single-produit .produit-visuel img.produit-photo { max-height: 36rem; filter: drop-shadow(15px 15px 0 rgba(0, 0, 0, 0.3));}
    .single .produit-faq .accordeon-toggle, .tax-categorie-produit .produit-faq .accordeon-toggle {font-size: 2rem;}
    .single .bloc-accordeon, .tax-categorie-produit .bloc-accordeon {max-width: 75rem; margin: 5rem auto 0;}
    .single-produit .produit-icones {grid-column-end: span 2;}
    .single-produit .section-bons-moments {margin-bottom: 8rem;}
    .single-produit .produit-recettes .recette-item {margin: 0;}
    .single-produit .produit-recettes .recette-item h3 {font-size: 2.6rem;}
    .single-produit .produit-modal .modal-content {padding: 4rem 8rem;}
    .single-produit .produit-modal h2.modale-titre {font-size: 5rem;}
    .single-produit .produit-col-centre {order: initial;}
    .single-produit .produit-temoignage-bulle {display: block;}
    .single-produit .produit-temoignage-bulle-mobile {display: none;}
    .single-produit .produit-similaires {margin-top: 10rem;}
    .single-produit .produit-similaires h2 {text-align: left; margin-bottom: 1rem;}
    .single-produit .produit-similaires-slider .slick-track {margin-left: 0;}
    .produit-similaires-slider .slick-prev, .produit-similaires-slider .slick-next {display: inline-block !important;}
    .single-produit .produit-visuel {padding: 4rem 1rem;}
    .single-produit .produit-similaire-item h3 {font-size: 2rem;}
    .single-produit .saz_next_widget {margin-top: 3rem;}
}

@media (min-width: 1400px) {
    .single-produit .produit-info {margin-right: 10rem; }
    .single-produit .produit-header {grid-template-columns: 50% 1fr 15rem;}
    .single-produit .produit-icones {flex-direction: column; align-items: center; justify-content: flex-start; width: 15rem; padding-top: 8rem; gap: 2.5rem; margin-top: 0; grid-column-end: auto;}
    .single-produit .produit-visuel .produit-motif-tr {display: block; position: absolute;}
    .single-produit .produit-visuel .produit-motif-tr {right: -8.5rem; top: -1rem; transform: rotate(-30deg); transform-origin: left;}
    .single-produit .produit-visuel .produit-motif-tr span {height: .6rem; display: block; border-radius: 99px; margin-bottom: 1rem; transform-origin: left;}
    .single-produit .produit-visuel .produit-motif-tr span:first-of-type {transform: rotate(-35deg); width: 3.5rem; animation: 5s infinite ease-out alternate motif_tr1 ;}
    .single-produit .produit-visuel .produit-motif-tr span:nth-child(2) {transform: translateX(1rem); width: 5rem; }
    .single-produit .produit-visuel .produit-motif-tr span:last-of-type {transform: rotate(22deg); width: 4.5rem; animation: 5s infinite ease-out alternate motif_tr2 ;}
    .single-produit .produit-visuel .produit-motif-bl span:first-of-type {animation: 5s 250ms infinite ease-out alternate motif_bl1 ;}
    .single-produit .produit-visuel .produit-motif-bl span:last-of-type {animation: 5s 250ms infinite ease-out alternate motif_bl2 ;}

}






/************************************************/
/**                                            **/
/**             SINGLE ENGAGEMENT              **/
/**                                            **/
/************************************************/

.single-engagement .single-engagement-entete {margin-bottom: 7rem;}
.single-engagement .single-engagement-entete .engagement-num {color: var(--couleur-principale); text-align: center; font-family: var(--font-secondaire); letter-spacing: 0; font-size: 2.8rem; margin: 0; transform: rotate(-2deg);}
.single-engagement .single-engagement-entete img {height: 8rem; margin: .5rem auto;}
.single-engagement .single-engagement-entete h1 {margin-top: 0;}

.single-engagement .single-engagement-intro {flex-wrap: wrap; gap: 2rem 5rem;}
.single-engagement .single-engagement-intro .intro {width: 100%;}
.single-engagement .single-engagement-intro img {width: 100%;}

.single-engagement .single-engagement-contenu .engagement-item {row-gap: 3.5rem; flex-wrap: wrap; column-gap: 5rem; justify-content: center;}
.single-engagement .single-engagement-contenu .engagement-item .engagement-text {width: 100%;}
.single-engagement .single-engagement-contenu .engagement-item h2 {text-transform: none; margin-top: 0; }
.single-engagement .single-engagement-contenu .engagement-item .engagement-image {position: relative; transform: rotate(4deg);  width: 100%; max-height: 30rem; max-width: 55rem; margin: 0 2rem;}
.single-engagement .single-engagement-contenu .engagement-item:nth-child(even) .engagement-image { transform: rotate(-5deg);}
.single-engagement .single-engagement-contenu .engagement-item .engagement-image img { border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; box-shadow: var(--ombre-photo); padding: 1rem;}
.single-engagement .single-engagement-contenu .engagement-item .engagement-image::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem;  background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto;  height: 3.5rem;}

.single-engagement .section-engagements-complementaires h2 {font-family: var(--font-secondaire); color: var(--couleur-texte); font-weight: 400; margin: 0 auto 4rem; position: relative;  width: fit-content; padding-bottom: .8rem;}
.single-engagement .section-engagements-complementaires h2::after {content: ''; position: absolute; background-color: var(--couleur-principale); border-radius: 3rem; height: .4rem; width: calc(100% - 8rem); bottom: 0; left: 4rem; transform: rotate(-2deg); transform-origin: right;}
.single-engagement .section-engagements-complementaires .liste-engagements {gap: 3rem;}
.single-engagement .section-engagements-complementaires .liste-engagements .engagement {background-color: var(--couleur-secondaire-light); border-radius: 2rem; padding: 2rem 1.5rem; gap: 1.5rem; flex: 1; display: flex; justify-content: start; align-items: center;}
.single-engagement .section-engagements-complementaires .liste-engagements .engagement img {max-height: 6rem; max-width: 6rem;}
.single-engagement .section-engagements-complementaires .liste-engagements .engagement h3 {font-size: 1.8rem; text-transform: uppercase; margin: 0 auto .5rem; }


@media (hover: hover) {
    .single-engagement .section-engagements-complementaires .liste-engagements .engagement:hover {box-shadow: rgba(137, 108, 74, 0.4) 0px 6px; transform: translateY(-.5rem) scale(1.03);}
    .single-engagement .section-engagements-complementaires .liste-engagements .engagement:last-of-type:hover {box-shadow: rgba(137, 108, 74, 0.4) 6px 6px;}
    .single-engagement .section-engagements-complementaires .liste-engagements .engagement:first-of-type:hover {box-shadow: rgba(137, 108, 74, 0.4) -6px 6px;}

}

@media (min-width: 1025px) {
    .single-engagement .single-engagement-contenu .engagement-item .engagement-image {flex: 1;  width: auto;  margin: 0; max-height: 60rem;}
    .single-engagement .single-engagement-contenu .engagement-item .engagement-text {width: 65%;}
    .single-engagement .single-engagement-intro .intro {max-width: 80rem; margin-left: auto; margin-right: auto; flex: 1;}
    .single-engagement .single-engagement-intro img {width: 45%;}
    .single-engagement .single-engagement-contenu .engagement-item:nth-child(odd) {flex-direction: row-reverse;}
    .single-engagement .single-engagement-entete .engagement-num { font-size: 4rem;}
    .single-engagement .single-engagement-entete h1 {max-width: 80rem; margin-left: auto; margin-right: auto;}
    .single-engagement .single-engagement-contenu .engagement-item h2 {text-align: left;}
    .single-engagement .section-engagements-complementaires .liste-engagements .engagement h3 {font-size: 1.9rem;}
}

@media (min-width: 1400px) {
    .single-engagement .single-engagement-contenu .engagement-item {column-gap: 10rem; }
    .single-engagement .single-engagement-contenu .engagement-item .engagement-text {flex: 1;  width: auto;}
    .single-engagement .single-engagement-intro {column-gap: 10rem;}
    .single-engagement .section-engagements-complementaires h2 {margin: 0 auto 6rem; }

}


/************************************************/
/**                                            **/
/**             SINGLE RECETTE                 **/
/**                                            **/
/************************************************/


.single-recette .recette-main {flex-direction: column; margin-top: 5rem;}
.single-recette h1 {color: var(--couleur-principale); font-size: 3.8rem; margin-bottom: 0;}
.single-recette .recette-main .recette-detail .recette-intro {margin-bottom: 4rem;}
.single-recette .recette-main .recette-detail {flex-direction: column;}
.single-recette .recette-main .recette-detail .recette-etapes h3 {margin: 0; background: var(--couleur-principale); color: #fff; font-weight: 600; border-radius: .3rem; width: fit-content; padding: .5rem 1rem; text-transform: uppercase;}
.single-recette .recette-main .recette-detail .recette-etapes a {color: var(--couleur-secondaire); text-decoration: none;}
.single-recette .recette-main .recette-detail .recette-etapes .recette-etape {margin: 3.5rem 0;}
.single-recette .recette-main .recette-detail .recette-etapes .recette-etape p {display: inline;}
.single-recette .recette-main .recette-detail .recette-etapes .etape {color: var(--couleur-secondaire); font-weight: 600; letter-spacing: .05rem; display: inline-block; margin-right: .4rem;}
.single-recette .recette-main .recette-detail .recette-ingredients {margin-bottom: 4.5rem;}
.single-recette .recette-main .recette-detail .recette-ingredients ul {display: block; margin: 2.5rem 0 0;}
.single-recette .recette-main .recette-detail .recette-ingredients li { margin-left: 2rem; }
.single-recette .recette-main .recette-detail .recette-ingredients li.li-section {margin-left: 0; list-style: none; margin-top: 2rem;}
.single-recette .recette-main .recette-detail .recette-ingredients li p {margin: .8rem 0;}
.single-recette .recette-main .recette-detail .recette-ingredients li::marker {color: var(--couleur-principale);}
.single-recette .recette-main .recette-detail .recette-quantite {font-weight: 400; font-size: 1.6rem; margin-top: .6rem; color: var(--couleur-principale);}
.single-recette .recette-main .recette-col-right {flex-direction: column; gap: 4rem;  order: -1; margin: 0 1rem;}
.single-recette .recette-main .recette-visuel {position: relative;  transform: rotate(-4deg); background-color: #fff;}
.single-recette .recette-main .recette-visuel::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto; height: 3.5rem;}
.single-recette .recette-main .recette-visuel img { max-height: 26rem; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; padding: 1rem;  box-shadow: var(--ombre-photo);}
.single-recette .recette-main .recette-petit-plus {display: none; position: relative; max-height: fit-content; background: var(--couleur-secondaire); border-radius: 3rem; padding: 2.5rem 4.5rem 2rem; margin-top: 2rem; height: fit-content; }
.single-recette .recette-main .recette-petit-plus.petit-plus-mobile {display: block; max-width: 60rem; margin: 2rem auto;}
.single-recette .recette-main .recette-petit-plus p {position: relative; color: #fff; display: inline;}
.single-recette .recette-main .recette-petit-plus p::before, .single-recette .recette-main .recette-petit-plus p::after { content: url(images/guillemets.svg); position: absolute; width: 2rem;}
.single-recette .recette-main .recette-petit-plus p::before {top: 0; left: -3rem;}
.single-recette .recette-main .recette-petit-plus p::after {transform: scaleX(-1); bottom: 0; right: -3rem;}
.single-recette .recette-main .recette-partage {flex-wrap: wrap; gap: 1rem;}
.single-recette .recette-main .recette-partage p {width: 100%; margin-bottom: 0;}
.single-recette .recette-main .recette-partage a {font-size: 2.5rem; align-items: center; justify-content: center; width: 3.5rem;  height: 3.5rem; padding: .4rem;  border-radius: .3rem; background-color: var(--couleur-secondaire); color: #fff; transition: var(--transition);}
.single-recette .recette-main .recette-timing {gap: 2rem; margin-bottom: 4rem; margin-top: 2rem;}
.single-recette .recette-main .recette-timing .timing {background-color: var(--couleur-secondaire-light); border-radius: 2rem; padding: 1.5rem; flex: 1; flex-direction: column; align-items: center; justify-content: center; row-gap: 1rem;}
.single-recette .recette-main .recette-timing .timing img {height: 5rem;}
.single-recette .recette-main .recette-timing .timing span {font-size: 1.6rem; max-width: 12rem; text-align: center;}
.single-recette .recettes-similaires h2 {width: 100%; text-align: left; margin: 0 0 3rem;}
.single-recette .recettes-similaires .recettes-similaires-liste {column-gap: 5rem;}
.single-recette .recettes-similaires .recette-similaire {flex-direction: column; margin: 1rem; }
.single-recette .recettes-similaires .recette-similaire-img {aspect-ratio: 4 / 3; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem;border-style: solid; padding: 1rem; box-shadow: var(--ombre-photo-light);  background-image: url('images/cuillere.svg'); background-repeat: no-repeat; background-size: 15rem; background-position: center; transition: var(--transition);}
.single-recette .recettes-similaires .recette-similaire-img img {aspect-ratio: 4 / 3;}
.single-recette .recettes-similaires .recette-similaire h3 {color: var(--couleur-principale); font-size: 2.3rem; font-family: var(--font-secondaire); font-weight: 400; margin-top: 2.5rem; margin-bottom: 0; transition: var(--transition); text-align: center;}

.single-recette .recette-liens {flex-direction: column; gap: .8rem; margin-bottom: 2rem;}
.single-recette .recette-liens .btn-recette-liens {color: var(--couleur-secondaire); background-color: var(--couleur-secondaire-light); padding: .5rem 1.5rem; width: fit-content; border-radius: .3rem; }


@media (hover: hover) {
    .single-recette .recette-main .recette-partage a:hover {transform: scale(1.08) translateY(-.3rem); background-color: var(--couleur-principale); outline: none;}
    .single-recette .recettes-similaires .recette-similaire:hover h3 {transform: scale(1.05);}
    .single-recette .recettes-similaires .recette-similaire:hover .recette-similaire-img {box-shadow: var(--ombre-photo);}
    .single-recette .recettes-similaires .recette-similaire:hover {transform: rotate(4deg) scale(1.03); }
    .single-recette .recettes-similaires .recette-similaire:nth-child(even):hover {transform: rotate(-5deg) scale(1.03);}
    .single-recette .recette-liens .btn-recette-liens:hover {box-shadow: rgba(137, 108, 74, 0.4) 6px 6px; transform: translateY(-0.5rem) scale(1.03); }

}
@media (min-width: 1025px) {
    .single-recette .recette-main {margin-top: 6rem; gap: 5rem 7rem; flex-direction: row; }
    .single-recette .recette-main .recette-timing .timing {aspect-ratio: 1 / 1; flex: none; min-width: 13rem; max-width: 20rem;}
    .single-recette .recette-main .recette-petit-plus::after {content: ''; position: absolute;  bottom: calc(100% - .2rem); right: 4rem; border: 2rem solid transparent; border-bottom-color: var(--couleur-secondaire);}
    .single-recette .recettes-similaires .recette-similaire {margin: 0; width: calc(33.3% - 2.5rem); }
    .single-recette .recettes-similaires h2 {margin: 0 0 6rem;}
    .single-recette .recette-main .recette-detail {width: 50%; }
    .single-recette .recette-main .recette-col-right {flex: 1; order: initial; position: sticky; top: 15rem; height: fit-content; margin: 0; }
    .single-recette .recette-main .recette-petit-plus {width: calc(100% - 4rem); margin-left: auto; display: block; }
    .single-recette .recette-main .recette-petit-plus.petit-plus-mobile {display: none;}
    .single-recette h1 {font-size: 5rem; margin-top: 1rem; }
    .single-recette .recette-main .recette-detail .recette-ingredients {margin-bottom: 5rem;}
    .single-recette .recette-main .recette-detail .recette-etapes h3 {font-size: 2.5rem;}
    .single-recette .recette-main .recette-visuel img { max-height: 50rem;}
    .single-recette .recettes-similaires .recette-similaire-img {margin: 0 1.5rem;  }

}
@media (min-width: 1400px) {
    .single-recette .recette-main { margin-top: 8rem;}
    .single-recette .recettes-similaires .recette-similaire-img {height: 25rem;  }

}




/************************************************/
/**                                            **/
/**             ARCHIVE RECETTES               **/
/**                                            **/
/************************************************/

.archive .section-recettes-intro {flex-direction: column; margin-bottom: 1rem;}
.archive .section-recettes-intro h1 {margin-top: 0;}
.archive .section-recettes-intro h3 {order: -1; color: var(--couleur-principale); text-align: center;  font-family: var(--font-secondaire); letter-spacing: 0; font-size: 2.8rem;  margin: 0; transform: rotate(-2deg);}
.section-liste-recettes {flex-wrap: wrap;  gap: 3rem; margin-bottom: 4rem;}
.section-liste-recettes .recette-carte {flex-direction: column; width: 100%;}
.section-liste-recettes .recette-carte h3 {color: var(--couleur-principale); font-size: 2.5rem; font-family: var(--font-secondaire);  font-weight: 400;  margin: 2.5rem 0 0; letter-spacing: 0;}
.section-liste-recettes .recette-carte .recette-carte-img {height: 26rem; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; background-color: #fff; padding: 1rem; box-shadow: var(--ombre-photo-light); transition: var(--transition);}
.section-liste-recettes .recette-carte .recette-carte-temps {font-weight: 400; font-size: 1.6rem; margin-top: .5rem;}
.section-liste-recettes .recette-carte .recette-carte-detail {padding: 0 1rem;}
.section-liste-recettes .recettes-liste {flex-wrap: wrap; gap: 3rem;}
.recettes-container .recettes-filtres {column-gap: 2.5rem; justify-content: center; margin: 0 0 3rem; flex-direction: column; row-gap: 1rem;}
.recettes-container .recettes-filtres .liste-filtres {display: none;  margin-top: 1rem; flex-wrap: wrap;}
.recettes-container .recettes-filtres .filtre-item {background-color: var(--couleur-secondaire-light); color: var(--couleur-secondaire); border-radius: 99px;  padding: .6rem 1rem; font-size: 1.6rem; margin: .5rem 0; border-radius: .6rem;}
.recettes-container .recettes-filtres .filtre-item.is-active {background-color: var(--couleur-secondaire); color: #fff;}
.recettes-container .recettes-filtres .btn-liste-filtres {position: relative; display: flex; background-color: var(--couleur-principale); color: #fff; padding: 1rem 1.5rem; border-radius: .6rem; margin: 0 auto; transform: rotate(-3deg);}

@media (hover: hover) {
    .section-liste-recettes .recette-carte:hover {transform: scale(1.03);}
    .section-liste-recettes .recette-carte:hover .recette-carte-img {box-shadow: var(--ombre-photo); transform: rotate(-3deg);}
    .section-liste-recettes .recette-carte:nth-child(odd):hover .recette-carte-img { transform: rotate(2deg);}
    .recettes-container .recettes-filtres .filtre-item:not(.is-active):hover {box-shadow: rgba(137, 108, 74, 0.4) 4px 4px; transform: scale(1.03); }

}

@media (min-width: 768px) {
    .section-liste-recettes .recette-carte {width: calc(50% - 1.5rem);}
}

@media (min-width: 1025px) {
    .section-liste-recettes {gap: 4rem 6rem; margin-bottom: 6rem;}
    .section-liste-recettes .recette-carte { width: calc(33.333% - 4rem);}
    .recettes-container .recettes-filtres {flex-direction: row;  margin: 0 0 6rem; }
    .recettes-container .recettes-filtres .liste-filtres {flex-direction: row; display: flex;  column-gap: 2rem;}
    .recettes-container .recettes-filtres .filtre-item {padding: .8rem 1.5rem; margin: 0; font-size: 1.7rem;}
    .recettes-container .recettes-filtres .filtre-item.is-active {background-color: var(--couleur-principale);}
    .recettes-container .recettes-filtres .btn-liste-filtres {display: none;}
    .section-recettes-intro h3 {font-size: 4rem;}
    .section-liste-recettes .recettes-liste {gap: 4rem 6rem;}
    .archive .section-recettes-intro {margin-bottom: 3rem;}
    .archive .section-recettes-intro h3 {font-size: 4.4rem;}

}




/************************************************/
/**                                            **/
/**              SINGLE FILIERE                **/
/**                                            **/
/************************************************/


.single-filiere .filiere-intro {position: relative; flex-wrap: wrap; column-gap: 3rem; background-color: var(--couleur-secondaire-light); padding: 1rem 2rem; border-radius: 3rem; align-items: center; margin-top: 3rem; }
.single-filiere .filiere-intro .filiere-intro-texte, .single-filiere .filiere-intro .filiere-intro-img {width: 100%;}


.single-filiere .section-filiere-contenu .filiere-contenu {flex-wrap: wrap;  column-gap: 5rem; justify-content: center;}
.single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-texte {width: 100%;}
.single-filiere .section-filiere-contenu .filiere-contenu h2 {text-transform: none; margin-top: 0; margin-bottom: 1rem; text-align: left;}
.single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-img {position: relative; transform: rotate(4deg); width: 100%; max-height: 30rem; max-width: 55rem; margin: 0 1rem 3rem;}
.single-filiere .section-filiere-contenu .filiere-contenu:nth-child(even) .filiere-contenu-img {transform: rotate(-5deg); }
.single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-img::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto; height: 3.5rem;}
.single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-img img {border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; box-shadow: var(--ombre-photo); padding: 1rem;}

.single-filiere .section-filiere-produits .filiere-produits-liste .slick-track {display: flex; padding: 2rem 0; justify-content: center;}
.single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit {align-items: center; display: flex; flex-direction: column; margin: 1rem; max-width: 30rem;}
.single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit h3 { margin: 0; text-transform: uppercase; font-size: 1.7rem; font-weight: 600; max-width: 20rem;  text-align: center; transition: var(--transition);}
.single-filiere .section-filiere-produits .filiere-produits-liste .produit-infos {margin-top: 1.5rem; }
.single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit .produit-img {align-items: flex-end; justify-content: center; width: 100%; padding: 1.5rem; transition: var(--transition); border-radius: 3rem;}
.single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit .produit-img img {display: block;  max-width: 100%; height: auto; max-height: 17rem; filter: drop-shadow(8px 4px 0 rgba(0, 0, 0, 0.2)); transition: var(--transition); will-change: filter, transform;}
.single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit .produit-description {display: none;}
.single-filiere .section-filiere-produits .filiere-produits-liste button {display: none !important;}
.single-filiere .section-filiere-produits .filiere-produits-intro h2 {position: relative; transform: rotate(356deg); margin: 0 auto 3rem; font-size: 3.3rem; font-family: var(--font-secondaire); font-weight: 400; width: fit-content;}
.single-filiere .section-filiere-produits .filiere-produits-intro h2 em {position: absolute; top: -3.5rem; left: 50%;  font-size: .7em;  line-height: unset; font-style: normal;  transform: translateX(-50%); text-wrap: nowrap;}
.single-filiere .section-filiere-produits .filiere-produits-intro h2::after {content: url(images/motif-01.svg); position: absolute; right: -2rem; top: -2rem;  width: 2rem;}

.single .section-sources h3 {margin-bottom: 0; color: var(--couleur-texte);}
.single .section-sources p {margin-top: .5rem;}
.single .section-sources a, .single .section-sources p {font-weight: 400; font-size: 1.6rem; text-decoration: none;}
.single .section-sources sup + a, .single .section-sources sup + p {display: inline;}
.single .section-sources sup + a {word-break: break-all;}

.single-filiere .section-filiere-avis {position: relative;}
.single-filiere .section-filiere-avis .avis-slide {background-color: var(--couleur-secondaire-light); border-radius: 2rem; padding: 2rem 2.5rem 2rem 4rem; box-shadow: rgba(137, 108, 74, 0.4) 6px 6px; margin: 0 3rem 3rem 0;}
.single-filiere .section-filiere-avis::after {content: ''; position: absolute; bottom: calc(100% - .2rem); right: 4rem; border: 2rem solid transparent; border-bottom-color: var(--couleur-secondaire-light);}
.single-filiere .section-filiere-avis .avis-slide p:first-of-type {margin-top: 0;}
.single-filiere .section-filiere-avis .avis-slide .avis, .single-filiere .section-filiere-avis .avis-slide .client {position: relative; width: fit-content; }
.single-filiere .section-filiere-avis .avis-slide .avis::after, .single-filiere .section-filiere-avis .avis-slide .client::after {content: url(images/guillemets.svg); position: absolute; width: 2rem;}
.single-filiere .section-filiere-avis .avis-slide .avis::after {left: -3rem; top: 0;}
.single-filiere .section-filiere-avis .avis-slide .client::after {right: -3rem; bottom: 0; transform: scaleX(-1);}


@media (hover: hover) {
    .single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit:hover {transform: translateY(-0.5rem);}
    .single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit:hover .produit-img { transform: rotate(6deg) scale(1.03);}
    .single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit:hover .produit-img img {filter: drop-shadow(11px 8px 0 rgba(0, 0, 0, 0.3)); }
    .single-filiere .section-filiere-produits .filiere-produits-liste .filiere-produit:hover h3 {color: var(--couleur-principale);}
    .single-filiere .section-filiere-produits .filiere-produits-liste:hover button {opacity: 1;}

}

@media (min-width: 1025px) {
    .single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-texte {width: 65%;}
    .single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-img {flex: 1; width: auto; margin: 0; height: 50rem; max-height: 100%; position: sticky; top: calc(50% - 25rem); }
    .single-filiere .section-filiere-contenu .filiere-contenu:nth-child(odd) {flex-direction: row-reverse; }
    .single-filiere .section-filiere-produits .filiere-produits-intro {max-width: 75rem; margin: 10rem auto 6rem}
    .single-filiere .section-filiere-produits .filiere-produits-intro h2 {font-size: 7rem; margin: 0 auto 6rem;}
    .single-filiere .section-filiere-produits .filiere-produits-intro h2 em {top: -5.5rem;}
    .single-filiere .section-filiere-produits .filiere-produits-intro h2::after {right: -6rem; top: -3rem; width: 6rem;}
    .single-filiere .filiere-intro .filiere-intro-texte {width: 55%;}
    .single-filiere .filiere-intro .filiere-intro-img {flex: 1; width: auto;}
    .single-filiere .filiere-intro {padding: 3rem; margin: 7rem auto 0; max-width: 90rem;}
    .single-filiere .filiere-intro::after, .single-filiere .filiere-intro::before {content: url(images/motif-01.svg); position: absolute; width: 6rem;}
    .single-filiere .filiere-intro::after {right: -5rem; top: -4.5rem;}
    .single-filiere .filiere-intro::before {left: -5.5rem; bottom: -3.5rem; transform: scale(-1) rotate(10deg);}
    .single-filiere .section-filiere-avis {width: 65rem;}
    .single-filiere .section-filiere-avis .avis-slide {padding: 5rem 6rem; box-shadow: rgba(137, 108, 74, 0.4) 6px 6px; margin: 0 3rem 3rem 0;}
    .single-filiere .section-filiere-produits .filiere-produits-liste {margin-top: 8rem;}



}

@media (min-width: 1400px) {
    .single-filiere .section-filiere-contenu .filiere-contenu {column-gap: 10rem; }
    .single-filiere .section-filiere-contenu .filiere-contenu .filiere-contenu-texte { flex: 1; width: auto;}
    .single-filiere .section-filiere-produits .filiere-produits-intro {margin: 20rem auto 6rem}
    .single-filiere .filiere-intro {column-gap: 6rem; padding: 1rem 6rem;  margin: 5.5rem auto 0;}
    .single-filiere .section-filiere-produits .filiere-produits-liste button {display: block !important; opacity: 0; z-index: 1; background-color: rgba(255, 255, 255, .7);}

}



/************************************************/
/**                                            **/
/**                    BLOG                    **/
/**                                            **/
/************************************************/

.archive .section-blog-liste {margin-bottom: 5rem;}
.archive .section-blog-liste .blog-container .blog-filtres {column-gap: 2.5rem; justify-content: center; margin: 3rem 0; flex-direction: column; row-gap: 1rem;}
.archive .section-blog-liste .blog-container .blog-filtres .liste-filtres { display: none; margin-top: 1rem; justify-content: center; }
.archive .section-blog-liste .blog-container .blog-filtres .filtre-item {background-color: var(--couleur-secondaire-light); color: var(--couleur-secondaire); border-radius: .6rem; padding: .6rem 1rem; font-size: 1.6rem; margin: .5rem 0;}
.archive .section-blog-liste .blog-container .blog-filtres .filtre-item.is-active {background-color: var(--couleur-secondaire); color: #fff;}
.section-blog-liste .blog-container .btn-liste-filtres {position: relative; display: flex; background-color: var(--couleur-principale); color: #fff;  padding: 1rem 1.5rem; border-radius: .6rem;  margin: 0 auto; transform: rotate(-3deg);}

.archive .section-blog-liste .blog-container .blog-liste {flex-wrap: wrap;  gap: 3rem;}
.archive .section-blog-liste .blog-container .blog-article {width: 100%;}
.archive .section-blog-liste .blog-container .blog-article .blog-article-thumb {aspect-ratio: 4 / 3; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; background-color: #fff; padding: 1rem; box-shadow: var(--ombre-photo-light); transition: var(--transition);}
.archive .section-blog-liste .blog-container .blog-article .blog-article-detail {padding: 0 1rem; transition: var(--transition);}
.archive .section-blog-liste .blog-container .blog-article h3 {color: var(--couleur-principale); font-size: 2.5rem; font-family: var(--font-secondaire); font-weight: 400;  margin: 2.5rem 0 0; letter-spacing: 0;}
.archive .section-blog-liste .blog-container .blog-article .blog-article-extrait {font-weight: 400; font-size: 1.6rem; margin-top: .5rem;}

.single-blogs p strong, .single-blogs a strong  {font-weight: 600;}
.single-blogs .single-blog-entete {flex-direction: column;}
.single-blogs .single-blog-entete h1 {margin-top: 0; margin-bottom: 1.5rem;}
.single-blogs .single-blog-entete .etiquettes {justify-content: center; gap: 1rem; margin: 1rem 0;}
.single-blogs .single-blog-entete span.etiquette-cat {order: -1; background-color: var(--couleur-principale); text-align: center; color: #fff; border-radius: .4rem; padding: .4rem 1rem; font-family: var(--font-secondaire); letter-spacing: 0; font-size: 2.2rem; margin: 0; width: fit-content; transform: rotate(-2deg); transform-origin: left;}
.single-blogs .single-blog-entete .date-publication-article {text-align: center; margin: 0 auto; width: fit-content; font-size: 1.5rem; font-weight: 400;}
.single-blogs .single-blog-intro {margin-top: 6rem;  max-width: 90rem; margin-left: auto; margin-right: auto; }
.single-blogs .single-blog-intro .blog-intro-img {position: relative; transform: rotate(-2deg); margin-bottom: 3rem; }
.single-blogs .single-blog-intro .blog-intro-img::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto;  height: 3.5rem;}
.single-blogs .single-blog-intro .blog-intro-img img {max-height: 50rem; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; padding: 1rem; box-shadow: var(--ombre-photo);}
.single-blogs .single-blog-intro .blog-intro-detail h2 {text-transform: none; color: var(--couleur-principale);}
.single-blogs .single-blog-supplement .supplement-content {gap: 4rem 6rem; margin-top: 6rem; margin-bottom: 6rem; align-items: center; flex-direction: column;}
.single-blogs .single-blog-supplement .supplement-img {flex: 0 0 auto; width: 100%; margin: 0 auto; align-items: center; justify-content: center; position: relative; padding: 0 .5rem;}
.single-blogs .single-blog-supplement .supplement-img::before {content: ""; position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); width: 12rem; background: var(--couleur-scotch); box-shadow: var(--ombre-scotch); display: block; margin: auto; height: 3.5rem;}
.single-blogs .single-blog-supplement .supplement-img img {border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; border-style: solid; padding: 1rem; box-shadow: 10px 12px 0 0 rgba(181, 165, 155, .15), 1px 1px 0 0 rgba(181, 165, 155, .25), 10px 12px 0 0 rgba(181, 165, 155, .1), 1px 1px 0 0 rgba(181, 165, 155, .25), 3px 3px 0 0 rgba(181, 165, 155, .4), 1px 1px 0 0 rgba(181, 165, 155, .4);}
.single-blogs .single-blog-supplement .supplement-text {flex: 1;}
.single-blogs .single-blog-supplement .supplement-text h2 {text-align: left; text-transform: none; color: var(--couleur-secondaire);}
.single-blogs .single-blog-supplement .supplement-content:first-of-type .supplement-text h2 {color: var(--couleur-principale);}
.single-blogs .single-blog-supplement a, .single-blogs .single-blog-intro a {color: var(--couleur-secondaire); text-decoration: none;}

.single-blogs .single-blog-autre .blog-autres-articles { column-gap: 5rem;}
.single-blogs .single-blog-autre .blog-autres-articles .autre-article { flex-direction: column;  margin: 1rem;}
.single-blogs .single-blog-autre .blog-autres-articles .autre-article h3 { color: var(--couleur-principale); font-size: 2.3rem; font-family: var(--font-secondaire); font-weight: 400; margin-top: 2.5rem; margin-bottom: 0; transition: var(--transition); text-align: center; background-color: transparent;}
.single-blogs .single-blog-autre .blog-autres-articles .autre-article-img  {aspect-ratio: 4 / 3; border-color: rgba(181, 165, 155, .25); border-width: .15rem 0 0 .15rem; margin: 0 1.5rem; border-style: solid; padding: 1rem; box-shadow: var(--ombre-photo-light);  transition: var(--transition);}
.single-blogs .single-blog-autre h2 {width: 100%; text-align: left; margin: 0 0 3rem;}

.single-blogs .single-blog-social h3 {margin-bottom: .8rem; color: var(--couleur-cta-texte);}
.single-blogs .single-blog-social .liste-social {column-gap: 1rem;}
.single-blogs .single-blog-social .liste-social .social {align-items: center; justify-content: center; width: 3rem;  height: 3rem; padding: .4rem; border-radius: .3rem; background-color: var(--couleur-secondaire); color: #fff; transition: var(--transition);}
.single-blogs .single-blog-social .liste-social .social i {color: #fff; font-size: 1.8rem;}
.single-blogs .single-blog-social.sidebar-social {display: none; width: fit-content; position: sticky; top: 88vh; left: 100%; transform: translateX(calc(100% + 2rem)); }
.single-blogs .single-blog-social.sidebar-social span {display: inline-block; position: relative; margin-bottom: .8rem; font-family: var(--font-secondaire); font-size: 2.2rem;}
.single-blogs .single-blog-social.sidebar-social span::after {content: url('images/fleche-courbe.svg'); position: absolute; width: 1.8rem; top: calc(100% - 1.5rem); right: -3rem; transform: rotate(348deg);  transform-origin: left; filter: drop-shadow(3px 3px 0 rgba(181, 165, 155, .4));}
.single-blogs .single-blog-social.sidebar-social a {filter: drop-shadow(3px 3px 0 rgba(181, 165, 155, .4));}

@media (hover: hover) {
    .archive .section-blog-liste .blog-container .blog-article:hover {transform: scale(1.03);}
    .archive .section-blog-liste .blog-container .blog-article:hover .blog-article-thumb {transform: rotate(-3deg);}
    .archive .section-blog-liste .blog-container .blog-article:nth-child(odd):hover .blog-article-thumb {transform: rotate(2deg);}
    .archive .section-blog-liste .blog-container .blog-article:hover .blog-article-thumb {box-shadow: var(--ombre-photo);}
    .archive .section-blog-liste .blog-container .blog-article:hover .blog-article-detail {transform: scale(1.05);}
    .archive .section-blog-liste .blog-container .blog-filtres .filtre-item:not(.is-active):hover {box-shadow: rgba(137, 108, 74, 0.4) 4px 4px; transform: scale(1.03);}
    .single-blogs .single-blog-social .liste-social .social:hover {transform: scale(1.15) translateY(-.2rem);}
    .single-blogs .single-blog-autre .blog-autres-articles .autre-article:hover { margin: 0; width: calc(33.3% - 2.5rem); transform: rotate(4deg) scale(1.03);}
    .single-blogs .single-blog-autre .blog-autres-articles .autre-article:nth-child(even):hover {transform: rotate(-5deg) scale(1.03); }
}

@media (min-width: 768px) {
    .archive .section-blog-liste .blog-container .blog-article {width: calc(50% - 1.5rem); }
    .single-blogs .single-blog-supplement .supplement-img {flex: 0 0 38%; max-width: none; margin: 0; padding: 0;}

}

@media (min-width: 1025px) {
    .archive .section-blog-liste {margin-top: 10rem; margin-bottom: 10rem;}
    .archive .section-blog-liste .blog-container .blog-filtres .liste-filtres {display: flex; column-gap: 2rem; margin-top: 0;}
    .archive .section-blog-liste .blog-container .blog-filtres .filtre-item {padding: .8rem 1.5rem; margin: 0; font-size: 1.7rem;}
    .archive .section-blog-liste .blog-container .blog-liste {gap: 4rem 6rem;}
    .archive .section-blog-liste .blog-container .blog-article {width: calc(33.333% - 4rem);}
    .archive .section-blog-liste .blog-container .blog-filtres .filtre-item.is-active {background-color: var(--couleur-principale); }
    .archive .section-blog-liste .blog-container .btn-liste-filtres {display: none;}
    .single-blogs .single-blog-supplement .supplement-content {flex-direction: row;}
    .single-blogs .single-blog-supplement .supplement-content:nth-child(even) {flex-direction: row-reverse;}
    .single-blogs .single-blog-autre .blog-autres-articles .autre-article { margin: 0; width: calc(33.3% - 2.5rem);}
    .single-blogs .single-blog-autre h2 { margin: 0 0 6rem; }
    .single-blogs .single-blog-social h3, .single .section-sources h3 {font-size: 2.5rem; }
    .single-blogs .single-blog-intro .blog-intro-img {margin-bottom: 7rem; }

}

@media (min-width: 1400px) {
    .archive .section-blog-liste .blog-container .blog-filtres {margin: 6rem 0;}
    .single-blogs .single-blog-supplement .supplement-content {column-gap: 10rem;}
    .single-blogs .single-blog-social.sidebar-social {display: block;}
    .single-blogs .single-blog-social {display: none;}

}
@media (min-width: 1600px) {
    .single-blogs .single-blog-social.sidebar-social {transform: translateX(calc(100% + 10rem)); }
}
@media (min-width: 1800px) {
    .single-blogs .single-blog-social.sidebar-social {transform: translateX(20rem); }
}
/************************************************/
/**                                            **/
/**                  FOOTER                    **/
/**                                            **/
/************************************************/

footer {padding: 0;}
.footer-menguys {color: #fff;}
.footer-main {background-color: var(--couleur-secondaire); align-items: center; flex-wrap: wrap; padding: 2rem; gap: 3rem 5rem; }
.footer-phrase p,
.footer-phrase a {
    color: #fff;
    text-decoration: none;
}

.footer-reseaux {align-items: center; gap: 1.5rem; flex-wrap: wrap; width: 100%; justify-content: center;}
.footer-reseau {align-items: center; justify-content: center; width: 2.8rem; height: 2.8rem; background-color: #fff; transition: var(--transition); border-radius: .3rem;}
.footer-reseau svg {width: 1.9rem; height: 1.9rem; fill: var(--couleur-secondaire); display: block;}


.footer-bottom {position: relative; flex-direction: column; padding: 0 2rem;}
.footer-prevention {flex: 1; justify-content: center;}
.footer-prevention p, .footer-prevention a {font-size: 1.5rem; font-weight: 400; color: var(--couleur-secondaire); text-align: center;}
.footer-maj {font-size: 1.2rem; font-weight: 400; text-align: center; color: var(--couleur-secondaire);}
.footer-copyright-menu ul {display: flex; flex-wrap: wrap; gap: .8rem 3rem; flex-direction: column; }

.footer-copyright-menu ul li a {color: #fff;  transition: var(--transition); text-decoration: none; text-transform: uppercase; letter-spacing: .05rem; font-size: 1.7rem;}



@media (hover: hover) {
    .footer-copyright-menu ul li a:hover {transform: translateY(-.3rem);}
    .footer-reseau:hover,
    .footer-reseau:focus {color: var(--couleur-principale, #c0392b);  transform: scale(1.15) translateY(-.4rem); outline: none;
}

}
@media (min-width: 768px) {
    .footer-copyright-menu ul {flex-direction: row;}
    .footer-main {justify-content: center;}
}

@media (min-width: 1025px) {
    .footer-bottom {flex-direction: row; padding: 0;}
    .footer-bottom-inner {position: absolute; right: 4rem; top: 50%; transform: translateY(-50%); }
    .footer-reseaux {width: auto; justify-content: flex-start;}


}

@media (min-width: 1400px) {
        .footer-bottom-inner {right: 2rem;}
}



/************************************************/
/**                                            **/
/**                 NAV MOBILE                 **/
/**                                            **/
/************************************************/



#mobile-top-bar {z-index: 100; align-items: center; gap: .5rem; margin-left: auto;}
.mobile-top-btn {display: flex; align-items: center; justify-content: center; flex: 0 0 auto; height: 100%; background: none; border: none; cursor: pointer;  text-decoration: none; color: var(--couleur-principale); padding: 1rem 0;}
#mobile-top-bar .mobile-top-btn svg { width: 2.2rem; height: 2rem; fill: #fff;  display: block;}
#mobile-top-bar .mobile-burger-icon { flex-direction: column;  border-radius: .4rem;  width: 3rem; height: 3rem; padding: .6rem; justify-content: center; row-gap: .35rem;}
#mobile-top-bar .mobile-burger-icon span {display: block;  height: .25rem; background-color: var(--couleur-principale); border-radius: .2rem; transition: var(--transition);  transform-origin: center;}

#mobile-top-bar .mobile-burger-icon.is-open span:nth-child(1) { transform: translateY(.6rem) rotate(45deg); }
#mobile-top-bar .mobile-burger-icon.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
#mobile-top-bar .mobile-burger-icon.is-open span:nth-child(3) { transform: translateY(-.6rem) rotate(-45deg); }
#mobile-top-bar .mobile-lang-select select {appearance: none;  -webkit-appearance: none; border: none;  font-size: 1.9rem; font-weight: 400; text-transform: uppercase; color: #fff; cursor: pointer; padding: .5rem .8rem; outline: none;}
.mobile-menu-drawer {position: fixed; top: 0; left: 0; padding-bottom: 7rem; padding-top: 10rem; width: 100%; height: 100%;  background-color: #fff; z-index: 99; flex-direction: column; overflow-y: auto;  transform: translateX(-100%);  transition: transform .3s ease;}
.mobile-menu-drawer.is-open { transform: translateX(0); }

/* Logo dans le drawer */
.mobile-menu-logo {text-align: center; margin-bottom: 3rem;}
.mobile-menu-logo img {width: 14rem;  height: auto; display: block;  margin: 0 auto;}

/* Menu principal mobile */
.mobile-main-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-main-menu > li {position: relative; border-bottom: 1px solid rgba(190, 159, 86, .15);}
.mobile-main-menu > li > a { display: block; padding: 1.6rem 5rem 1.6rem 2rem; font-size: 1.65rem; font-weight: 600; text-transform: uppercase;  letter-spacing: .05rem; color: var(--couleur-secondaire); text-decoration: none;}
.mobile-main-menu > li.current-menu-item > a, .mobile-main-menu > li.current-menu-ancestor > a { color: var(--couleur-principale);}

/* Bouton toggle sous-menu */
.mobile-submenu-toggle {position: absolute; right: 1rem; top: 1rem; background: none; border: none;  width: 3.2rem; height: 3.2rem; display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--couleur-secondaire); transition: var(--transition); flex-shrink: 0;}
.mobile-submenu-toggle svg {width: 1.5rem; height: 1.5rem; fill: var(--couleur-secondaire); transition: transform .25s ease; transform: rotate(-90deg);}

.mobile-submenu-toggle.is-open svg { transform: rotate(0deg); }
.mobile-submenu-toggle.is-open { border-color: var(--couleur-principale); color: var(--couleur-principale); }

/* Sous-menus */
.mobile-main-menu .sub-menu {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    background: rgba(0,0,0,.03);
}

.mobile-main-menu .sub-menu li { border-top: 1px solid rgba(0,0,0,.05); }
.mobile-main-menu .sub-menu li a { display: block; padding: 1.3rem 2rem 1.3rem 3rem; font-size: 1.5rem; font-weight: 500; color: var(--couleur-secondaire); text-decoration: none; text-transform: uppercase;}
.mobile-main-menu .sub-menu li.current-menu-item a { color: var(--couleur-principale); }

/* Réseaux sociaux dans le drawer */
.mobile-menu-social {
    padding: 2rem;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: auto;
    border-top: 1px solid rgba(0,0,0,.07);
}

.mobile-social-link {align-items: center; justify-content: center; width: 3.8rem; height: 3.8rem;  background: var(--couleur-principale); border-radius: .4rem;  text-decoration: none; transition: var(--transition);}

.mobile-social-link svg {
    width: 1.8rem;
    height: 1.8rem;
    fill: #fff;
    display: block;
}

.mobile-menu-overlay {position: fixed; inset: 0; background: rgba(0,0,0,.45);  z-index: 98; opacity: 0;  pointer-events: none;  transition: opacity .3s;}

.mobile-menu-overlay.is-active { opacity: 1; pointer-events: auto; }

body.mobile-menu-open { overflow: hidden; }


.mobile-menu-drawer .language-switcher {list-style: none; margin: 1.6rem 2rem; }
.mobile-menu-drawer .language-switcher a {text-transform: uppercase; color: var(--couleur-secondaire); text-decoration: none; }
.mobile-menu-drawer .language-switcher li + li::before {content: '/'; margin: 0 .5rem; color: var(--couleur-secondaire); font-size: 1.7rem;}

@media (min-width: 1025px) {
    #mobile-top-bar,
    #mobile-menu-drawer,
    #mobile-menu-overlay { display: none; }
}

/* ==========================================================================
   ACCESSIBILITÉ — lien d'évitement + indicateur de focus clavier
   N'a aucun effet visuel tant que l'élément n'est pas focus au clavier :
   ne modifie donc pas le rendu visuel du site.
   ========================================================================== */
.skip-link {
    position: absolute;
    top: -999px;
    left: 0;
    z-index: 10000;
    padding: 1rem 1.6rem;
    background: #fff;
    color: #000;
    font-size: 1.4rem;
    text-decoration: none;
    border-radius: 0 0 .4rem 0;
}
.skip-link:focus {
    top: 0;
}

/* Indicateur de focus visible au clavier uniquement (souris/tactile inchangés) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--couleur-principale, #c0392b);
    outline-offset: 2px;
}

/* ==========================================================================
   ANIMATIONS D'APPARITION AU SCROLL
   Piloté par includes/js/animations.js (IntersectionObserver) qui ajoute
   la classe .is-visible. Désactivé automatiquement si prefers-reduced-motion.
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
    .reveal-on-scroll {
        opacity: 0;
        transform: translateY(1.6rem);
        transition: opacity .6s ease-out, transform .6s ease-out, all 250ms ease-in-out;
        will-change: opacity, transform;
    }
    .reveal-on-scroll.reveal-fade {
        transform: none;
    }
    .reveal-on-scroll.reveal-scale {
        transform: scale(.96);
    }
    .reveal-on-scroll.is-visible {
        opacity: 1;
        transform: none;
    }
    /* Petit décalage en cascade pour les grilles/listes de cartes */
    .reveal-on-scroll.reveal-stagger:nth-child(2)  { transition-delay: .06s; }
    .reveal-on-scroll.reveal-stagger:nth-child(3)  { transition-delay: .12s; }
    .reveal-on-scroll.reveal-stagger:nth-child(4)  { transition-delay: .18s; }
    .reveal-on-scroll.reveal-stagger:nth-child(5)  { transition-delay: .24s; }
    .reveal-on-scroll.reveal-stagger:nth-child(6)  { transition-delay: .3s; }
    .reveal-on-scroll.reveal-stagger:nth-child(n+7) { transition-delay: .36s; }
}

/* prefers-reduced-motion géré nativement : hors de la media query ci-dessus,
   .reveal-on-scroll n'a aucun style particulier, donc le contenu est visible
   immédiatement, sans transition ni décalage. */



   #asl-storelocator.asl-p-cont.asl-bg-0 .addr-sec .p-area:nth-child(2){display: none;}

   /************************************************/
/**                                            **/
/**        MENTION « GÉNÉRÉ PAR IA »           **/
/**                                            **/
/************************************************/
/*
 * La mention est un <span class="mention-ia"> inséré par functions.php sur le
 * HTML final : juste après un <img> marqué IA, ou en premier enfant d'un
 * élément dont l'image de fond est marquée IA. Le libellé est donc traduit
 * côté PHP (Polylang), rien n'est écrit en dur ici.
 *
 * Le conteneur passe en position: relative via :where() — spécificité nulle,
 * donc un position: absolute déjà défini par le thème (ex. .banniere-bg) reste
 * prioritaire.
 *
 * Taille : le client demandait « 0.8 mm ». En CSS, 1mm = 3,7795px fixes (ce
 * n'est pas un millimètre physique), donc 0.8mm = 3px — illisible à l'écran.
 * La valeur par défaut est 10px en graisse 300, qui rend le même effet de
 * mention discrète. Pour ajuster, surcharger la variable :
 *     :root { --mention-ia-taille: 11px; }
 */
:root {
    --mention-ia-taille: 10px;
    --mention-ia-couleur: #fff;
}

:where(:has(> .mention-ia)) {position: relative;}

.mention-ia {
    position: absolute;
    right: 1.5rem;
    bottom: 1.35rem;
    z-index: 2;
    margin: 0;
    padding: 0;
    font-size: var(--mention-ia-taille);
    font-weight: 300;
    font-style: normal;
    line-height: 1;
    letter-spacing: .02em;
    text-transform: none;
    white-space: nowrap;
    color: var(--mention-ia-couleur);
    /* Lisible sur un visuel clair comme sur un visuel sombre, sans pastille */
    text-shadow: 0 0 3px rgba(0, 0, 0, .6), 0 0 1px rgba(0, 0, 0, .8);
    pointer-events: none;
}

/* Bannières : image desktop et mobile distinctes (bascule à 1025px, cf. .section-banniere) */
.mention-ia--desktop {display: none;}
@media (min-width: 1025px) {
    .mention-ia--desktop {display: block;}
    .mention-ia--mobile {display: none;}
}

/* Le carrousel produit place l'image dans un carré coloré : on décale la
   mention pour qu'elle reste dans le padding du bloc et non sur l'arrondi. */
.single-produit .produit-similaires-slider .produit-similaire-visuel > .mention-ia {
    right: 1.5rem;
    bottom: 1rem;
}

/* La pastille « Nos nouveautés » déborde volontairement à droite
   (translateX) : sans ce clip, une barre de défilement horizontale
   apparaissait sur /produits/. `clip` (et non `hidden`) ne casse pas
   les éléments en position: sticky. */
body {overflow-x: clip;}